@gem-sdk/core 1.14.0-dev.539 → 1.14.0-dev.541

package/dist/cjs/components/resize/Spacing.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),react=require("react");require("zustand");var BuilderPreviewContext=require("../../contexts/BuilderPreviewContext.js");function Spacing(e){let t=BuilderPreviewContext.useBuilderPreviewStore(e=>e.isThemeSectionEditor),r=react.useRef(null),n=react.useRef(null),i=react.useRef(null),u=react.useRef(!1),o=react.useRef(0),a=react.useRef(0),s=e=>{let t=e.clientY,r=Math.ceil(t-o.current),n=a.current||0,i=n+r>=0?`${n+r}px`:"0px";return{newValue:i}},c=e=>{if(r.current&&n.current){let{newValue:t}=s(e);n.current.style.height=t,r.current.style.top=t;let i=r.current.closest("[data-toolbar-wrap]");i&&(i.style.marginBottom=t)}},l=()=>{m()},d=()=>{i.current&&clearTimeout(i.current),i.current=setTimeout(()=>{u.current=!0;let e=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!0}});window.dispatchEvent(e),document.addEventListener("mousemove",c),document.addEventListener("mouseup",l)},100)},m=()=>{i.current&&clearTimeout(i.current),u.current=!1;let t=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!1}});if(window.dispatchEvent(t),r.current){let t=getComputedStyle(r.current),n=t.top,i=new CustomEvent("editor:toolbar:change-margin-bottom",{bubbles:!0,detail:{componentUid:e.uid,marginBottom:n}});window.dispatchEvent(i)}let n=r.current?.closest("[data-toolbar-wrap]");n&&(n.style.marginBottom=""),document.removeEventListener("mousemove",c),document.removeEventListener("mouseup",l)};return jsxRuntime.jsx(jsxRuntime.Fragment,{children:"Section"!==e.tag&&jsxRuntime.jsx("div",{"data-spacing":!0,"data-spacing-theme-section":t,className:"absolute w-full bottom-0",children:jsxRuntime.jsxs("div",{"data-spacing-margin-bottom":!0,children:[jsxRuntime.jsx("div",{"data-spacing-margin-bottom-bg":!0,ref:n,children:jsxRuntime.jsx("div",{"data-spacing-margin-bottom-value":!0})}),jsxRuntime.jsx("div",{ref:r,"data-spacing-margin-bottom-drag":!0,onMouseDown:e=>{if(r.current){let t=getComputedStyle(r.current);o.current=e.clientY,a.current=parseFloat(t.top),d()}},onMouseUp:()=>{m()},role:"presentation"})]})})})}require("swr"),require("@gem-sdk/adapter-shopify"),require("swr/mutation"),require("vanilla-lazyload"),require("../../hooks/useCartUI.js"),require("react-transition-group"),require("@gem-sdk/core"),require("../../helpers/convert.js"),exports.default=Spacing;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),react=require("react");require("zustand");var BuilderPreviewContext=require("../../contexts/BuilderPreviewContext.js");function Spacing(e){let t=BuilderPreviewContext.useBuilderPreviewStore(e=>e.isThemeSectionEditor),r=react.useRef(null),n=react.useRef(null),i=react.useRef(null),a=react.useRef(!1),o=react.useRef(0),u=react.useRef(0),s=e=>{let t=e.clientY,r=Math.ceil(t-o.current),n=u.current||0,i=n+r>=0?`${n+r}px`:"0px";return{newValue:i}},c=e=>{if(r.current&&n.current){let{newValue:t}=s(e);n.current.style.height=t,r.current.style.top=t;let i=r.current.closest("[data-toolbar-wrap]");i&&(i.style.marginBottom=t)}},l=()=>{m()},d=()=>{i.current&&clearTimeout(i.current),i.current=setTimeout(()=>{a.current=!0;let e=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!0}});window.dispatchEvent(e),document.addEventListener("mousemove",c),document.addEventListener("mouseup",l)},100)},m=()=>{i.current&&clearTimeout(i.current),a.current=!1;let t=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!1}});if(window.dispatchEvent(t),r.current){let t=getComputedStyle(r.current),n=t.top,i=new CustomEvent("editor:toolbar:change-margin-bottom",{bubbles:!0,detail:{componentUid:e.uid,marginBottom:n}});window.dispatchEvent(i)}let n=r.current?.closest("[data-toolbar-wrap]");n&&(n.style.marginBottom=""),document.removeEventListener("mousemove",c),document.removeEventListener("mouseup",l)},p=(e,t)=>{let r=e.children.length;if(r)for(let n=0;n<r;n++){let r=e.children[n];if(r){let e=r.getAttribute(t);if(e)return r}}},g=react.useCallback(e=>{if(a.current)return;let t=e.detail,i=r.current?.closest("[data-toolbar-wrap]"),o=i&&p(i,"data-toolbar"),u=o&&o.getAttribute("data-toolbar-active");if(u&&t?.marginBottom){let e=isNaN(parseInt(t?.marginBottom))?0:Math.max(parseInt(t?.marginBottom),0),i=`${e}px`;r.current&&n.current&&(n.current.style.height=i,r.current.style.top=i)}},[]);return react.useEffect(()=>(window.addEventListener("editor:toolbar:update-margin-bottom",g),()=>{window.removeEventListener("editor:toolbar:update-margin-bottom",g)}),[g]),jsxRuntime.jsx(jsxRuntime.Fragment,{children:"Section"!==e.tag&&jsxRuntime.jsx("div",{"data-spacing":!0,"data-spacing-theme-section":t,className:"absolute w-full bottom-0",children:jsxRuntime.jsxs("div",{"data-spacing-margin-bottom":!0,children:[jsxRuntime.jsx("div",{"data-spacing-margin-bottom-bg":!0,ref:n,children:jsxRuntime.jsx("div",{"data-spacing-margin-bottom-value":!0})}),jsxRuntime.jsx("div",{ref:r,"data-spacing-margin-bottom-drag":!0,onMouseDown:e=>{if(r.current){let t=getComputedStyle(r.current);o.current=e.clientY,u.current=parseFloat(t.top),d()}},onMouseUp:()=>{m()},role:"presentation"})]})})})}require("swr"),require("@gem-sdk/adapter-shopify"),require("swr/mutation"),require("vanilla-lazyload"),require("../../hooks/useCartUI.js"),require("react-transition-group"),require("@gem-sdk/core"),require("../../helpers/convert.js"),exports.default=Spacing;

package/dist/cjs/hooks/animation/useAnimationTarget.js

@@ -1 +1 @@
-"use strict";var react=require("react");const useAnimationTarget=({componentUid:e,componentTag:t})=>{let r=react.useRef(null),a=react.useRef(null),u=react.useRef(null),c=react.useRef(null),n=react.useRef(null),l=react.useRef(null),o=react.useMemo(()=>[{element:a.current,attribute:"data-toolbar-active"},{element:u.current,attribute:"data-outline-active"},{element:c.current,attribute:"data-spacing"},{element:n.current,attribute:"data-toolbar-add-active"},{element:l.current,attribute:"data-toolbar-add-active"}],[]),i=react.useCallback(e=>{o.forEach(({element:t,attribute:r})=>{e?t?.setAttribute(r,"true"):t?.removeAttribute(r)})},[o]);return react.useEffect(()=>{let o=document.querySelector(`[data-uid="${e}"]`);if(o)switch(a.current=o.querySelector("[data-toolbar]"),u.current=o.querySelector("[data-outline]"),c.current=o.querySelector("[data-spacing]"),t){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":r.current=o.querySelector("button");break;case"ProductProperties":r.current=o.querySelector("input");break;case"Section":{r.current=o;let[e]=Array.from(r.current.children).filter(e=>null!==e.getAttribute("data-toolbar")),[t]=Array.from(r.current.children).filter(e=>null!==e.getAttribute("data-outline"));a.current=e,u.current=t,n.current=r.current.querySelector("[data-toolbar-add-top]"),l.current=r.current.querySelector("[data-toolbar-add-bottom]");break}default:r.current=o}},[e,t]),{setToolbarActive:i,target:r.current}};exports.useAnimationTarget=useAnimationTarget;
+"use strict";var react=require("react");const SPACING_ACTIVE_ATTRIBUTE="data-spacing",TOOLBAR_ACTIVE_ATTRIBUTE="data-toolbar-active",OUTLINE_ACTIVE_ATTRIBUTE="data-outline-active",TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE="data-toolbar-add-active",useAnimationTarget=({componentUid:t,componentTag:e})=>{let r=react.useRef(null),u=react.useRef(null),T=react.useRef(null),a=react.useRef(null),c=react.useRef(null),A=react.useRef(null),n=react.useCallback(t=>{t?(u.current?.setAttribute(TOOLBAR_ACTIVE_ATTRIBUTE,"true"),T.current?.setAttribute(OUTLINE_ACTIVE_ATTRIBUTE,"true"),a.current?.setAttribute(SPACING_ACTIVE_ATTRIBUTE,"true"),c.current?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true"),A.current?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true")):(u.current?.removeAttribute(TOOLBAR_ACTIVE_ATTRIBUTE),T.current?.removeAttribute(OUTLINE_ACTIVE_ATTRIBUTE),a.current?.removeAttribute(SPACING_ACTIVE_ATTRIBUTE),c.current?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE),A.current?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE))},[]);return react.useEffect(()=>{let n=document.querySelector(`[data-uid="${t}"]`);if(n)switch(u.current=n.querySelector("[data-toolbar]"),T.current=n.querySelector("[data-outline]"),a.current=n.querySelector("[data-spacing]"),e){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":r.current=n.querySelector("button");break;case"ProductProperties":r.current=n.querySelector("input");break;case"Section":{r.current=n;let[t]=Array.from(r.current.children).filter(t=>null!==t.getAttribute("data-toolbar")),[e]=Array.from(r.current.children).filter(t=>null!==t.getAttribute("data-outline"));u.current=t,T.current=e,c.current=r.current.querySelector("[data-toolbar-add-top]"),A.current=r.current.querySelector("[data-toolbar-add-bottom]");break}default:r.current=n}},[t,e]),{setToolbarActive:n,target:r.current}};exports.useAnimationTarget=useAnimationTarget;

package/dist/esm/components/resize/Spacing.js

@@ -1 +1 @@
-import{jsx as t,Fragment as e,jsxs as r}from"react/jsx-runtime";import{useRef as o}from"react";import"zustand";import{useBuilderPreviewStore as n}from"../../contexts/BuilderPreviewContext.js";import"swr";import"@gem-sdk/adapter-shopify";import"swr/mutation";import"vanilla-lazyload";import"../../hooks/useCartUI.js";import"react-transition-group";import"@gem-sdk/core";import"../../helpers/convert.js";function Spacing(i){let a=n(t=>t.isThemeSectionEditor),u=o(null),c=o(null),s=o(null),l=o(!1),m=o(0),d=o(0),p=t=>{let e=t.clientY,r=Math.ceil(e-m.current),o=d.current||0,n=o+r>=0?`${o+r}px`:"0px";return{newValue:n}},g=t=>{if(u.current&&c.current){let{newValue:e}=p(t);c.current.style.height=e,u.current.style.top=e;let r=u.current.closest("[data-toolbar-wrap]");r&&(r.style.marginBottom=e)}},v=()=>{h()},b=()=>{s.current&&clearTimeout(s.current),s.current=setTimeout(()=>{l.current=!0;let t=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!0}});window.dispatchEvent(t),document.addEventListener("mousemove",g),document.addEventListener("mouseup",v)},100)},h=()=>{s.current&&clearTimeout(s.current),l.current=!1;let t=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!1}});if(window.dispatchEvent(t),u.current){let t=getComputedStyle(u.current),e=t.top,r=new CustomEvent("editor:toolbar:change-margin-bottom",{bubbles:!0,detail:{componentUid:i.uid,marginBottom:e}});window.dispatchEvent(r)}let e=u.current?.closest("[data-toolbar-wrap]");e&&(e.style.marginBottom=""),document.removeEventListener("mousemove",g),document.removeEventListener("mouseup",v)};return t(e,{children:"Section"!==i.tag&&t("div",{"data-spacing":!0,"data-spacing-theme-section":a,className:"absolute w-full bottom-0",children:r("div",{"data-spacing-margin-bottom":!0,children:[t("div",{"data-spacing-margin-bottom-bg":!0,ref:c,children:t("div",{"data-spacing-margin-bottom-value":!0})}),t("div",{ref:u,"data-spacing-margin-bottom-drag":!0,onMouseDown:t=>{if(u.current){let e=getComputedStyle(u.current);m.current=t.clientY,d.current=parseFloat(e.top),b()}},onMouseUp:()=>{h()},role:"presentation"})]})})})}export{Spacing as default};
+import{jsx as t,Fragment as e,jsxs as r}from"react/jsx-runtime";import{useRef as o,useCallback as n,useEffect as i}from"react";import"zustand";import{useBuilderPreviewStore as a}from"../../contexts/BuilderPreviewContext.js";import"swr";import"@gem-sdk/adapter-shopify";import"swr/mutation";import"vanilla-lazyload";import"../../hooks/useCartUI.js";import"react-transition-group";import"@gem-sdk/core";import"../../helpers/convert.js";function Spacing(l){let u=a(t=>t.isThemeSectionEditor),c=o(null),m=o(null),s=o(null),d=o(!1),p=o(0),g=o(0),b=t=>{let e=t.clientY,r=Math.ceil(e-p.current),o=g.current||0,n=o+r>=0?`${o+r}px`:"0px";return{newValue:n}},v=t=>{if(c.current&&m.current){let{newValue:e}=b(t);m.current.style.height=e,c.current.style.top=e;let r=c.current.closest("[data-toolbar-wrap]");r&&(r.style.marginBottom=e)}},h=()=>{f()},w=()=>{s.current&&clearTimeout(s.current),s.current=setTimeout(()=>{d.current=!0;let t=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!0}});window.dispatchEvent(t),document.addEventListener("mousemove",v),document.addEventListener("mouseup",h)},100)},f=()=>{s.current&&clearTimeout(s.current),d.current=!1;let t=new CustomEvent("editor:toolbar:resize-spacing",{bubbles:!0,detail:{value:!1}});if(window.dispatchEvent(t),c.current){let t=getComputedStyle(c.current),e=t.top,r=new CustomEvent("editor:toolbar:change-margin-bottom",{bubbles:!0,detail:{componentUid:l.uid,marginBottom:e}});window.dispatchEvent(r)}let e=c.current?.closest("[data-toolbar-wrap]");e&&(e.style.marginBottom=""),document.removeEventListener("mousemove",v),document.removeEventListener("mouseup",h)},E=(t,e)=>{let r=t.children.length;if(r)for(let o=0;o<r;o++){let r=t.children[o];if(r){let t=r.getAttribute(e);if(t)return r}}},y=n(t=>{if(d.current)return;let e=t.detail,r=c.current?.closest("[data-toolbar-wrap]"),o=r&&E(r,"data-toolbar"),n=o&&o.getAttribute("data-toolbar-active");if(n&&e?.marginBottom){let t=isNaN(parseInt(e?.marginBottom))?0:Math.max(parseInt(e?.marginBottom),0),r=`${t}px`;c.current&&m.current&&(m.current.style.height=r,c.current.style.top=r)}},[]);return i(()=>(window.addEventListener("editor:toolbar:update-margin-bottom",y),()=>{window.removeEventListener("editor:toolbar:update-margin-bottom",y)}),[y]),t(e,{children:"Section"!==l.tag&&t("div",{"data-spacing":!0,"data-spacing-theme-section":u,className:"absolute w-full bottom-0",children:r("div",{"data-spacing-margin-bottom":!0,children:[t("div",{"data-spacing-margin-bottom-bg":!0,ref:m,children:t("div",{"data-spacing-margin-bottom-value":!0})}),t("div",{ref:c,"data-spacing-margin-bottom-drag":!0,onMouseDown:t=>{if(c.current){let e=getComputedStyle(c.current);p.current=t.clientY,g.current=parseFloat(e.top),w()}},onMouseUp:()=>{f()},role:"presentation"})]})})})}export{Spacing as default};

package/dist/esm/hooks/animation/useAnimationTarget.js

@@ -1 +1 @@
-import{useRef as t,useMemo as e,useCallback as r,useEffect as a}from"react";let useAnimationTarget=({componentUid:u,componentTag:n})=>{let c=t(null),l=t(null),o=t(null),i=t(null),d=t(null),b=t(null),m=e(()=>[{element:l.current,attribute:"data-toolbar-active"},{element:o.current,attribute:"data-outline-active"},{element:i.current,attribute:"data-spacing"},{element:d.current,attribute:"data-toolbar-add-active"},{element:b.current,attribute:"data-toolbar-add-active"}],[]),s=r(t=>{m.forEach(({element:e,attribute:r})=>{t?e?.setAttribute(r,"true"):e?.removeAttribute(r)})},[m]);return a(()=>{let t=document.querySelector(`[data-uid="${u}"]`);if(t)switch(l.current=t.querySelector("[data-toolbar]"),o.current=t.querySelector("[data-outline]"),i.current=t.querySelector("[data-spacing]"),n){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":c.current=t.querySelector("button");break;case"ProductProperties":c.current=t.querySelector("input");break;case"Section":{c.current=t;let[e]=Array.from(c.current.children).filter(t=>null!==t.getAttribute("data-toolbar")),[r]=Array.from(c.current.children).filter(t=>null!==t.getAttribute("data-outline"));l.current=e,o.current=r,d.current=c.current.querySelector("[data-toolbar-add-top]"),b.current=c.current.querySelector("[data-toolbar-add-bottom]");break}default:c.current=t}},[u,n]),{setToolbarActive:s,target:c.current}};export{useAnimationTarget};
+import{useRef as t,useCallback as r,useEffect as e}from"react";let SPACING_ACTIVE_ATTRIBUTE="data-spacing",TOOLBAR_ACTIVE_ATTRIBUTE="data-toolbar-active",OUTLINE_ACTIVE_ATTRIBUTE="data-outline-active",TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE="data-toolbar-add-active",useAnimationTarget=({componentUid:u,componentTag:T})=>{let A=t(null),a=t(null),c=t(null),n=t(null),o=t(null),l=t(null),I=r(t=>{t?(a.current?.setAttribute(TOOLBAR_ACTIVE_ATTRIBUTE,"true"),c.current?.setAttribute(OUTLINE_ACTIVE_ATTRIBUTE,"true"),n.current?.setAttribute(SPACING_ACTIVE_ATTRIBUTE,"true"),o.current?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true"),l.current?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true")):(a.current?.removeAttribute(TOOLBAR_ACTIVE_ATTRIBUTE),c.current?.removeAttribute(OUTLINE_ACTIVE_ATTRIBUTE),n.current?.removeAttribute(SPACING_ACTIVE_ATTRIBUTE),o.current?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE),l.current?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE))},[]);return e(()=>{let t=document.querySelector(`[data-uid="${u}"]`);if(t)switch(a.current=t.querySelector("[data-toolbar]"),c.current=t.querySelector("[data-outline]"),n.current=t.querySelector("[data-spacing]"),T){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":A.current=t.querySelector("button");break;case"ProductProperties":A.current=t.querySelector("input");break;case"Section":{A.current=t;let[r]=Array.from(A.current.children).filter(t=>null!==t.getAttribute("data-toolbar")),[e]=Array.from(A.current.children).filter(t=>null!==t.getAttribute("data-outline"));a.current=r,c.current=e,o.current=A.current.querySelector("[data-toolbar-add-top]"),l.current=A.current.querySelector("[data-toolbar-add-bottom]");break}default:A.current=t}},[u,T]),{setToolbarActive:I,target:A.current}};export{useAnimationTarget};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/core",
-  "version": "1.14.0-dev.539",
+  "version": "1.14.0-dev.541",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",