@gem-sdk/core 1.14.0-dev.570 → 1.14.0-dev.573
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/Render.liquid.js +2 -2
- package/dist/cjs/helpers/animations.js +1 -1
- package/dist/cjs/hooks/animation/useAnimationPreview.js +1 -1
- package/dist/cjs/hooks/animation/useAnimationTarget.js +1 -1
- package/dist/cjs/hooks/animation/useApplyAnimation.js +1 -1
- package/dist/esm/components/Render.liquid.js +2 -2
- package/dist/esm/helpers/animations.js +1 -1
- package/dist/esm/hooks/animation/useAnimationPreview.js +1 -1
- package/dist/esm/hooks/animation/useAnimationTarget.js +1 -1
- package/dist/esm/hooks/animation/useApplyAnimation.js +1 -1
- package/package.json +1 -1
|
@@ -16,8 +16,8 @@
|
|
|
16
16
|
${render.RenderIf(convert.isLocalEnv,'<script src="{{ \'gp-animation.js\' | asset_url }}" defer="defer"></script>',`<script src="${convert.baseAssetURL}/assets/gp-animation.js" defer="defer"></script>`)}
|
|
17
17
|
<gp-animation
|
|
18
18
|
gp-data='${JSON.stringify({config:d,tag:n})}'
|
|
19
|
-
style="${{...s
|
|
19
|
+
style="${{...s}}"
|
|
20
20
|
>
|
|
21
|
-
<div style="${{...s}}">${t}</div>
|
|
21
|
+
<div style="${{...s,opacity:0}}">${t}</div>
|
|
22
22
|
</gp-animation>
|
|
23
23
|
`},RenderChildren=e=>{let t=Render(e);for(let r in t.extraFiles)Object.prototype.hasOwnProperty.call(t.extraFiles,r)&&(e.customProps.extraFiles[r]=t.extraFiles[r]);let r=new TextEncoder,n=t?.liquid?r.encode(t.liquid).length:0;if(Math.ceil(n/1024)>=180){let r=`gp-section-snippet-${e.uid}`;return e.customProps.extraFiles[r]=t.liquid,`{% render '${r}', product: product, variant: variant, product_form_id: product_form_id, productSelectedVariant: productSelectedVariant %}`}return t.liquid},WrapRenderChildren=({uid:e,customProps:t},r)=>{let n="";if(r?.length)for(let d=0;d<r.length;d++){let i=r[d];if(i){let r=n+i,s=new TextEncoder,a=r?s.encode(r).length:0;if(Math.ceil(a/1024)>=180){let r=`gp-section-snippet-${e+d}`;t.extraFiles[r]=i,n+=`{% render '${r}', product: product, variant: variant, product_form_id: product_form_id, productSelectedVariant: productSelectedVariant %}`}else n+=i}}return n};exports.RenderChildren=RenderChildren,exports.WrapRenderChildren=WrapRenderChildren,exports.default=Render;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";const EASING={ease:"cubic-bezier(0.46,0.03,0.52,0.96)","ease-in":"cubic-bezier(0.55,0.08,0.68,0.53)","ease-out":"cubic-bezier(0.46,0.03,0.52,0.96)",linear:"linear"},animations=()=>{let
|
|
1
|
+
"use strict";const EASING={ease:"cubic-bezier(0.46,0.03,0.52,0.96)","ease-in":"cubic-bezier(0.55,0.08,0.68,0.53)","ease-out":"cubic-bezier(0.46,0.03,0.52,0.96)",linear:"linear"},animations=()=>{let t=t=>{let r=JSON.parse(JSON.stringify(t)),e=["delay","speed","scale","intensity"];return e.forEach(t=>{if(!r?.[t])return;if("scale"===t){if(!r?.zoomDirection)throw TypeError("zoomDirection not found on zoom preset");let[e,a]=r?.scale?.in??[1,1],[n,i]=r?.scale?.out??[1,1];r[t]={in:[Number(e)/100,Number(a)/100],out:[Number(n)/100,Number(i)/100]};return}let e=Number(r?.[t]);if("delay"===t?r[t]=1e3*e:r[t]=e,!isFinite(e))throw TypeError(`${t} must be a number`)}),r},r=(r,e)=>{let n=t(e),{direction:i,distance:o}=n,l=["left","right"].includes(i??"")?"X":"Y",m=["left","down"].includes(i??"")?"-":"",f=[{opacity:0,transform:`translate${l}(${m}${o??100}px)`},{opacity:1,transform:`translate${l}(0)`}];return s(r,f,{...a(n,500)})},e=(r,e)=>{let n=t(e),i=[{opacity:0},{opacity:1}];return s(r,i,{...a(n,500)})},a=(t,r)=>{let e=t=>t?1.5/t*1e3:r,{loop:a,delay:n,speed:i,easing:o}=t??{},s=e(i),l=n??0,m=a?s+l:s;return{iterations:a?1/0:1,duration:m,delay:l,easing:EASING[o??"linear"]}},n=(r,e)=>{let n=t(e),{scale:i,zoomDirection:o,isFade:l}=n,[m,f]=i.in,[u,c]=i.out,p=[{transform:`scale(${m}, ${m})`,opacity:l?0:1},{transform:`scale(${f??1.2}, ${f??1.2})`,opacity:1}],d=[{transform:`scale(${u}, ${u})`,opacity:l?0:1},{transform:`scale(${c??.8}, ${c??.8})`,opacity:1}],y="in"===o?p:d;return s(r,y,{...a(n,700)})},i=(t,r,e)=>{if(!r)return t;let a=r/e,n=[...t].pop();return[...t,{...n,offset:1-a}]},o=(r,e)=>{let n=t(e),{intensity:i}=n??{},o=[{transform:"translate3d(0, 0, 0)"}],l=[{transform:"translate3d(4px, 0, 0)"},{transform:"translate3d(-4px, 0, 0)"},{transform:"translate3d(4px, 0, 0)"}],m=[];Array.from(Array(i??1).keys()).forEach(()=>{m=[...m,...l]});let f=[{transform:"translate3d(-1px, 0, 0)"},{transform:"translate3d(2px, 0, 0)"},{transform:"translate3d(-4px, 0, 0)"},...m,{transform:"translate3d(-4px, 0, 0)"},{transform:"translate3d(2px, 0, 0)"},{transform:"translate3d(-1px, 0, 0)"}];return s(r,i?f:o,{...a(n??{},820)})},s=(t,r,e)=>{let a=new KeyframeEffect(t,e.iterations&&1===e.iterations?r:i(r,e?.delay??0,e?.duration??0),{...e});return new Animation(a,document.timeline)};return{zoom:n,shake:o,fade:e,slide:r}};exports.animations=animations;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var react=require("react")
|
|
1
|
+
"use strict";var react=require("react");const useAnimationPreview=({props:e,playAnimation:i,cancelAnimation:r,setAnimationOnFinish:t,setToolbarActive:a})=>{let u=react.useCallback(u=>{let{uid:n,isCancel:s}=u.detail;if(e.uid===n){if(r(),s){a(!0);return}i(),a(!1),t(()=>{a(!0)})}},[e.uid,r,i,a,t]);return{previewAnimation:u}};exports.useAnimationPreview=useAnimationPreview;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var react=require("react"),useAnimationConfig=require("./useAnimationConfig.js");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=t=>{let{isEnabledAnimation:e}=useAnimationConfig.useAnimationConfig(t),r=t.tag,a=t.uid,
|
|
1
|
+
"use strict";var react=require("react"),useAnimationConfig=require("./useAnimationConfig.js");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=t=>{let{isEnabledAnimation:e}=useAnimationConfig.useAnimationConfig(t),r=t.tag,a=t.uid,u=react.useRef(null),o=react.useRef([]),T=t=>{if(o.current)for(let e of o.current)t?(e.toolbar?.setAttribute(TOOLBAR_ACTIVE_ATTRIBUTE,"true"),e.outline?.setAttribute(OUTLINE_ACTIVE_ATTRIBUTE,"true"),e.spacing?.setAttribute(SPACING_ACTIVE_ATTRIBUTE,"true"),e.addSectionTop?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true"),e.addSectionBottom?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true")):(e.toolbar?.removeAttribute(TOOLBAR_ACTIVE_ATTRIBUTE),e.outline?.removeAttribute(OUTLINE_ACTIVE_ATTRIBUTE),e.spacing?.removeAttribute(SPACING_ACTIVE_ATTRIBUTE),e.addSectionTop?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE),e.addSectionBottom?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE))},i=t=>{let e=t.querySelector("[data-toolbar-add-top]"),r=t.querySelector("[data-toolbar-add-bottom]"),a=Array.from(t.children),u=a.find(t=>null!==t.getAttribute("data-toolbar")),o=a.find(t=>null!==t.getAttribute("data-outline"));return{sectionToolbar:u,sectionOutline:o,sectionAddTop:e,sectionAddBottom:r}},A=react.useCallback(t=>t.reduce((t,e)=>{let a=null,u=null,o=e,T=e.querySelector("[data-toolbar][data-toolbar-active]"),A=e.querySelector("[data-outline][data-outline-active]"),n=Array.from(o.children),c=n.find(t=>null!==t.getAttribute("data-spacing"));switch(r){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":o=e.querySelector("button");break;case"ProductProperties":o=e.querySelector("input");break;case"Section":{o=e;let{sectionOutline:t,sectionToolbar:r,sectionAddTop:n,sectionAddBottom:c}=i(o);A=t,T=r,a=n,u=c;break}default:o=e}let l={target:o,toolbar:T,outline:A,spacing:c,addSectionTop:a,addSectionBottom:u};return t.push(l),t},[]),[r]),n=react.useCallback(()=>{if(!e)return;u.current||(u.current=document.querySelectorAll(`[data-uid="${a}"]`));let t=Array.from(u.current);if(!t.length)return;let r=A(t);o.current=r},[a,A,e]);return react.useEffect(()=>{n()},[e,n]),{targetObjects:o,setToolbarActive:T,initListOfTargets:n}};exports.useAnimationTarget=useAnimationTarget;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var react=require("react"),useAnimations=require("../useAnimations.js"),useAnimationTarget=require("./useAnimationTarget.js"),useAnimationConfig=require("./useAnimationConfig.js"),useAnimationActions=require("./useAnimationActions.js"),useAnimationPreview=require("./useAnimationPreview.js"),animations=require("../../types/animations.js");const useApplyAnimation=({props:e})=>{let{uid:i}=e,n=useAnimations.useAnimations(),{initListOfTargets:t,targetObjects:a}=useAnimationTarget.useAnimationTarget(e),{isEnabledAnimation:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var react=require("react"),useAnimations=require("../useAnimations.js"),useAnimationTarget=require("./useAnimationTarget.js"),useAnimationConfig=require("./useAnimationConfig.js"),useAnimationActions=require("./useAnimationActions.js"),useAnimationPreview=require("./useAnimationPreview.js"),animations=require("../../types/animations.js");const useApplyAnimation=({props:e})=>{let{uid:i}=e,n=useAnimations.useAnimations(),{initListOfTargets:t,targetObjects:a,setToolbarActive:s}=useAnimationTarget.useAnimationTarget(e),{isEnabledAnimation:r,getAnimationConfig:o}=useAnimationConfig.useAnimationConfig(e),{setAnimation:u,cancelAnimation:m,playAnimation:A,setAnimationOnFinish:c}=useAnimationActions.useAnimationActions(),{previewAnimation:p}=useAnimationPreview.useAnimationPreview({props:e,playAnimation:A,cancelAnimation:m,setAnimationOnFinish:c,setToolbarActive:s}),v=react.useCallback(({target:e,setting:i,type:t})=>n[t](e,i),[n]),w=react.useCallback(()=>{let{type:e,setting:i}=o();if(!e||e===animations.AnimationType.None||!a.current.length){m();return}let n=a.current.map(n=>v({type:e,setting:i,target:n.target}));m(),u(n)},[o,a,m,u,v]);react.useEffect(()=>(r?(t(),w()):m(),()=>{m()}),[i,w,m,r,t]),react.useEffect(()=>(window.addEventListener("preview-animation",p),()=>{window.removeEventListener("preview-animation",p)}),[p]),react.useEffect(()=>(window.addEventListener("init-animation-target",t),()=>{window.removeEventListener("init-animation-target",t)}),[t])};exports.default=useApplyAnimation;
|
|
@@ -16,8 +16,8 @@ import"react";import"react/jsx-runtime";import"zustand";import"swr";import"@gem-
|
|
|
16
16
|
${e(r,'<script src="{{ \'gp-animation.js\' | asset_url }}" defer="defer"></script>',`<script src="${n}/assets/gp-animation.js" defer="defer"></script>`)}
|
|
17
17
|
<gp-animation
|
|
18
18
|
gp-data='${JSON.stringify({config:l,tag:a})}'
|
|
19
|
-
style="${{...c
|
|
19
|
+
style="${{...c}}"
|
|
20
20
|
>
|
|
21
|
-
<div style="${{...c}}">${s}</div>
|
|
21
|
+
<div style="${{...c,opacity:0}}">${s}</div>
|
|
22
22
|
</gp-animation>
|
|
23
23
|
`},RenderChildren=e=>{let t=Render(e);for(let n in t.extraFiles)Object.prototype.hasOwnProperty.call(t.extraFiles,n)&&(e.customProps.extraFiles[n]=t.extraFiles[n]);let n=new TextEncoder,r=t?.liquid?n.encode(t.liquid).length:0;if(Math.ceil(r/1024)>=180){let n=`gp-section-snippet-${e.uid}`;return e.customProps.extraFiles[n]=t.liquid,`{% render '${n}', product: product, variant: variant, product_form_id: product_form_id, productSelectedVariant: productSelectedVariant %}`}return t.liquid},WrapRenderChildren=({uid:e,customProps:t},n)=>{let r="";if(n?.length)for(let i=0;i<n.length;i++){let s=n[i];if(s){let n=r+s,d=new TextEncoder,a=n?d.encode(n).length:0;if(Math.ceil(a/1024)>=180){let n=`gp-section-snippet-${e+i}`;t.extraFiles[n]=s,r+=`{% render '${n}', product: product, variant: variant, product_form_id: product_form_id, productSelectedVariant: productSelectedVariant %}`}else r+=s}}return r};export{RenderChildren,WrapRenderChildren,Render as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
let EASING={ease:"cubic-bezier(0.46,0.03,0.52,0.96)","ease-in":"cubic-bezier(0.55,0.08,0.68,0.53)","ease-out":"cubic-bezier(0.46,0.03,0.52,0.96)",linear:"linear"},animations=()=>{let r=r=>{let t=JSON.parse(JSON.stringify(r)),e=["delay","speed","scale","intensity"];return e.forEach(r=>{if(!t?.[r])return;if("scale"===r){if(!t?.zoomDirection)throw TypeError("zoomDirection not found on zoom preset");let[e,a]=t?.scale?.in??[1,1],[n,o]=t?.scale?.out??[1,1];t[r]={in:[Number(e)/100,Number(a)/100],out:[Number(n)/100,Number(o)/100]};return}let e=Number(t?.[r]);if("delay"===r?t[r]=1e3*e:t[r]=e,!isFinite(e))throw TypeError(`${r} must be a number`)}),t},t=(t,e)=>{let n=r(e),{direction:o,distance:i}=n,l=["left","right"].includes(o??"")?"X":"Y",f=["left","down"].includes(o??"")?"-":"",m=[{opacity:0,transform:`translate${l}(${f}${i??100}px)`},{opacity:1,transform:`translate${l}(0)`}];return s(t,m,{...a(n,500)})},e=(t,e)=>{let n=r(e),o=[{opacity:0},{opacity:1}];return s(t,o,{...a(n,500)})},a=(r,t)=>{let e=r=>r?1.5/r*1e3:t,{loop:a,delay:n,speed:o,easing:i}=r??{},s=e(o),l=n??0,f=s+l;return{iterations:a?1/0:1,duration:f,delay:l,easing:EASING[i??"linear"]}},n=(t,e)=>{let n=r(e),{scale:o,zoomDirection:i,isFade:l}=n,[f,m]=o.in,[u,c]=o.out,p=[{transform:`scale(${f}, ${f})`,opacity:l?0:1},{transform:`scale(${m??1.2}, ${m??1.2})`,opacity:1}],d=[{transform:`scale(${u}, ${u})`,opacity:l?0:1},{transform:`scale(${c??.8}, ${c??.8})`,opacity:1}],y="in"===i?p:d;return s(t,y,{...a(n,700)})},o=(r,t,e)=>{if(!t)return r;let a=t/e,n=[...r].pop();return[...r,{...n,offset:1-a}]},i=(t,e)=>{let n=r(e),{intensity:o}=n??{},i=[{transform:"translate3d(0, 0, 0)"}],l=[{transform:"translate3d(4px, 0, 0)"},{transform:"translate3d(-4px, 0, 0)"},{transform:"translate3d(4px, 0, 0)"}],f=[];Array.from(Array(o??1).keys()).forEach(()=>{f=[...f,...l]});let m=[{transform:"translate3d(-1px, 0, 0)"},{transform:"translate3d(2px, 0, 0)"},{transform:"translate3d(-4px, 0, 0)"},...f,{transform:"translate3d(-4px, 0, 0)"},{transform:"translate3d(2px, 0, 0)"},{transform:"translate3d(-1px, 0, 0)"}];return s(t,o?m:i,{...a(n??{},820)})},s=(r,t,e)=>{let a=new KeyframeEffect(r,o(t,e?.delay??0,e?.duration??0),{...e});return new Animation(a,document.timeline)};return{zoom:n,shake:i,fade:e,slide:t}};export{animations};
|
|
1
|
+
let EASING={ease:"cubic-bezier(0.46,0.03,0.52,0.96)","ease-in":"cubic-bezier(0.55,0.08,0.68,0.53)","ease-out":"cubic-bezier(0.46,0.03,0.52,0.96)",linear:"linear"},animations=()=>{let r=r=>{let t=JSON.parse(JSON.stringify(r)),e=["delay","speed","scale","intensity"];return e.forEach(r=>{if(!t?.[r])return;if("scale"===r){if(!t?.zoomDirection)throw TypeError("zoomDirection not found on zoom preset");let[e,a]=t?.scale?.in??[1,1],[n,o]=t?.scale?.out??[1,1];t[r]={in:[Number(e)/100,Number(a)/100],out:[Number(n)/100,Number(o)/100]};return}let e=Number(t?.[r]);if("delay"===r?t[r]=1e3*e:t[r]=e,!isFinite(e))throw TypeError(`${r} must be a number`)}),t},t=(t,e)=>{let n=r(e),{direction:o,distance:i}=n,l=["left","right"].includes(o??"")?"X":"Y",f=["left","down"].includes(o??"")?"-":"",m=[{opacity:0,transform:`translate${l}(${f}${i??100}px)`},{opacity:1,transform:`translate${l}(0)`}];return s(t,m,{...a(n,500)})},e=(t,e)=>{let n=r(e),o=[{opacity:0},{opacity:1}];return s(t,o,{...a(n,500)})},a=(r,t)=>{let e=r=>r?1.5/r*1e3:t,{loop:a,delay:n,speed:o,easing:i}=r??{},s=e(o),l=n??0,f=a?s+l:s;return{iterations:a?1/0:1,duration:f,delay:l,easing:EASING[i??"linear"]}},n=(t,e)=>{let n=r(e),{scale:o,zoomDirection:i,isFade:l}=n,[f,m]=o.in,[u,c]=o.out,p=[{transform:`scale(${f}, ${f})`,opacity:l?0:1},{transform:`scale(${m??1.2}, ${m??1.2})`,opacity:1}],d=[{transform:`scale(${u}, ${u})`,opacity:l?0:1},{transform:`scale(${c??.8}, ${c??.8})`,opacity:1}],y="in"===i?p:d;return s(t,y,{...a(n,700)})},o=(r,t,e)=>{if(!t)return r;let a=t/e,n=[...r].pop();return[...r,{...n,offset:1-a}]},i=(t,e)=>{let n=r(e),{intensity:o}=n??{},i=[{transform:"translate3d(0, 0, 0)"}],l=[{transform:"translate3d(4px, 0, 0)"},{transform:"translate3d(-4px, 0, 0)"},{transform:"translate3d(4px, 0, 0)"}],f=[];Array.from(Array(o??1).keys()).forEach(()=>{f=[...f,...l]});let m=[{transform:"translate3d(-1px, 0, 0)"},{transform:"translate3d(2px, 0, 0)"},{transform:"translate3d(-4px, 0, 0)"},...f,{transform:"translate3d(-4px, 0, 0)"},{transform:"translate3d(2px, 0, 0)"},{transform:"translate3d(-1px, 0, 0)"}];return s(t,o?m:i,{...a(n??{},820)})},s=(r,t,e)=>{let a=new KeyframeEffect(r,e.iterations&&1===e.iterations?t:o(t,e?.delay??0,e?.duration??0),{...e});return new Animation(a,document.timeline)};return{zoom:n,shake:i,fade:e,slide:t}};export{animations};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useCallback as e}from"react";
|
|
1
|
+
import{useCallback as e}from"react";let useAnimationPreview=({props:i,playAnimation:t,cancelAnimation:r,setAnimationOnFinish:n,setToolbarActive:u})=>{let o=e(e=>{let{uid:o,isCancel:a}=e.detail;if(i.uid===o){if(r(),a){u(!0);return}t(),u(!1),n(()=>{u(!0)})}},[i.uid,r,t,u,n]);return{previewAnimation:o}};export{useAnimationPreview};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useRef as t,useCallback as e,useEffect as r}from"react";import{useAnimationConfig as T}from"./useAnimationConfig.js";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=
|
|
1
|
+
import{useRef as t,useCallback as e,useEffect as r}from"react";import{useAnimationConfig as T}from"./useAnimationConfig.js";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=a=>{let{isEnabledAnimation:o}=T(a),u=a.tag,A=a.uid,i=t(null),n=t([]),l=t=>{if(n.current)for(let e of n.current)t?(e.toolbar?.setAttribute(TOOLBAR_ACTIVE_ATTRIBUTE,"true"),e.outline?.setAttribute(OUTLINE_ACTIVE_ATTRIBUTE,"true"),e.spacing?.setAttribute(SPACING_ACTIVE_ATTRIBUTE,"true"),e.addSectionTop?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true"),e.addSectionBottom?.setAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE,"true")):(e.toolbar?.removeAttribute(TOOLBAR_ACTIVE_ATTRIBUTE),e.outline?.removeAttribute(OUTLINE_ACTIVE_ATTRIBUTE),e.spacing?.removeAttribute(SPACING_ACTIVE_ATTRIBUTE),e.addSectionTop?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE),e.addSectionBottom?.removeAttribute(TOOLBAR_ADD_SECTION_ACTIVE_ATTRIBUTE))},c=t=>{let e=t.querySelector("[data-toolbar-add-top]"),r=t.querySelector("[data-toolbar-add-bottom]"),T=Array.from(t.children),a=T.find(t=>null!==t.getAttribute("data-toolbar")),o=T.find(t=>null!==t.getAttribute("data-outline"));return{sectionToolbar:a,sectionOutline:o,sectionAddTop:e,sectionAddBottom:r}},d=e(t=>t.reduce((t,e)=>{let r=null,T=null,a=e,o=e.querySelector("[data-toolbar][data-toolbar-active]"),A=e.querySelector("[data-outline][data-outline-active]"),i=Array.from(a.children),n=i.find(t=>null!==t.getAttribute("data-spacing"));switch(u){case"Button":case"SubmitButton":case"ProductButton":case"DynamicCheckout":a=e.querySelector("button");break;case"ProductProperties":a=e.querySelector("input");break;case"Section":{a=e;let{sectionOutline:t,sectionToolbar:u,sectionAddTop:i,sectionAddBottom:n}=c(a);A=t,o=u,r=i,T=n;break}default:a=e}let l={target:a,toolbar:o,outline:A,spacing:n,addSectionTop:r,addSectionBottom:T};return t.push(l),t},[]),[u]),I=e(()=>{if(!o)return;i.current||(i.current=document.querySelectorAll(`[data-uid="${A}"]`));let t=Array.from(i.current);if(!t.length)return;let e=d(t);n.current=e},[A,d,o]);return r(()=>{I()},[o,I]),{targetObjects:n,setToolbarActive:l,initListOfTargets:I}};export{useAnimationTarget};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useCallback as t,useEffect as i}from"react";import{useAnimations as e}from"../useAnimations.js";import{useAnimationTarget as n}from"./useAnimationTarget.js";import{useAnimationConfig as o}from"./useAnimationConfig.js";import{useAnimationActions as r}from"./useAnimationActions.js";import{useAnimationPreview as m}from"./useAnimationPreview.js";import{AnimationType as a}from"../../types/animations.js";let useApplyAnimation=({props:s})=>{let{uid:p}=s,u=e(),{initListOfTargets:
|
|
1
|
+
import{useCallback as t,useEffect as i}from"react";import{useAnimations as e}from"../useAnimations.js";import{useAnimationTarget as n}from"./useAnimationTarget.js";import{useAnimationConfig as o}from"./useAnimationConfig.js";import{useAnimationActions as r}from"./useAnimationActions.js";import{useAnimationPreview as m}from"./useAnimationPreview.js";import{AnimationType as a}from"../../types/animations.js";let useApplyAnimation=({props:s})=>{let{uid:p}=s,u=e(),{initListOfTargets:w,targetObjects:d,setToolbarActive:f}=n(s),{isEnabledAnimation:A,getAnimationConfig:v}=o(s),{setAnimation:l,cancelAnimation:g,playAnimation:j,setAnimationOnFinish:c}=r(),{previewAnimation:E}=m({props:s,playAnimation:j,cancelAnimation:g,setAnimationOnFinish:c,setToolbarActive:f}),L=t(({target:t,setting:i,type:e})=>u[e](t,i),[u]),y=t(()=>{let{type:t,setting:i}=v();if(!t||t===a.None||!d.current.length){g();return}let e=d.current.map(e=>L({type:t,setting:i,target:e.target}));g(),l(e)},[v,d,g,l,L]);i(()=>(A?(w(),y()):g(),()=>{g()}),[p,y,g,A,w]),i(()=>(window.addEventListener("preview-animation",E),()=>{window.removeEventListener("preview-animation",E)}),[E]),i(()=>(window.addEventListener("init-animation-target",w),()=>{window.removeEventListener("init-animation-target",w)}),[w])};export{useApplyAnimation as default};
|