@gem-sdk/core 1.14.0-dev.734 → 1.14.0-dev.735
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var react=require("react"),animations=require("./animations.js");const TAGS_SELECTOR={Button:".gp-button-base",ProductButton:".gp-button-base",Sticky:"gp-sticky",Dialog:"div[role=dialog]",Icon:"div div",ProductTag:"div div div"},useLivePageAnimation=(e,r,t)=>{let n=animations.animations(),[c,u]=react.useState(!1),a=react.useRef(void 0),i=react.useRef(void 0),o=react.useRef(null),l=react.useRef("none"),s=react.useRef("none"),
|
|
1
|
+
"use strict";var react=require("react"),animations=require("./animations.js");const TAGS_SELECTOR={Button:".gp-button-base",ProductButton:".gp-button-base",Sticky:"gp-sticky",Dialog:"div[role=dialog]",Icon:"div div",ProductTag:"div div div",Product:"product-form form div"},useLivePageAnimation=(e,r,t)=>{let n=animations.animations(),[c,u]=react.useState(!1),a=react.useRef(void 0),i=react.useRef(void 0),o=react.useRef(null),l=react.useRef("none"),s=react.useRef("none"),d=react.useRef(null),b=react.useRef(null),p=react.useRef(null),m=react.useRef("animation-wrapper-"),f=react.useCallback(e=>{d.current&&(d.current.playbackRate=e??1,d.current.play())},[d]),v=react.useCallback(e=>{b.current&&(b.current.playbackRate=e??1,b.current.play())},[b]),g=react.useCallback(()=>{e.current&&(e.current.style.opacity="1"),o.current&&(o.current.style.opacity="1")},[e]),k=react.useCallback(()=>{e.current&&(e.current.style.opacity="1"),o.current&&(o.current.style.opacity="0")},[e]),C=react.useCallback(e=>{e&&e.stopPropagation(),"shake"!==l.current&&k(),d.current&&(b.current?.cancel(),f(),d.current.finished.then(()=>{o.current&&g()}),o.current&&a?.current?.unobserve(o.current))},[k,f,g]),y=react.useCallback(()=>{g(),d.current&&d.current.cancel()},[g,d]),R=react.useCallback(e=>{e&&e.stopPropagation(),b.current&&(y(),v())},[b,y,v]),h=react.useCallback(()=>{if(b.current){if("zoom"===s.current){if(v(-1),!c)return;b.current.finished.then(()=>{clearTimeout(i.current),i.current=setTimeout(()=>{C()},100)});return}b.current.cancel(),c&&C()}},[v,c,C]),E=react.useCallback(()=>{if("desktop"===p.current);else if("tablet"===p.current)return r?.tablet??r?.desktop;else if("mobile"===p.current)return r?.mobile??r?.tablet??r?.desktop;return r?.desktop},[r?.desktop,r?.mobile,r?.tablet]),L=(e,r)=>e?.triggerConfig?.[r]?.animation??"none",S=react.useCallback(e=>{if("none"===l.current)return;let r=e?.triggerConfig?.appear?.setting?.[l.current];u(r.loop),d.current=n?.[l.current]?.(o.current,r)},[n]),P=react.useCallback(e=>{if("none"===s.current)return;let r=e?.triggerConfig?.hover?.setting?.[s.current];b.current=n?.[s.current]?.(o.current,r)},[n]),T=react.useCallback(()=>{d.current&&(d.current=null,o.current&&a.current?.unobserve(o.current)),b&&(b.current=null,o.current&&(o.current.removeEventListener("mouseenter",R),o.current.removeEventListener("mouseleave",h)))},[h,R]),A=react.useCallback(e=>{if(T(),o.current){if(!e?.enabled){g();return}l.current=L(e,"appear"),s.current=L(e,"hover"),"none"===l.current&&g(),"none"!==s.current&&"desktop"===p.current&&(P(e),o.current.addEventListener("mouseenter",R),o.current.addEventListener("mouseleave",h)),"none"!==l.current?(S(e),a.current=new IntersectionObserver(e=>{e.forEach(e=>{e.intersectionRatio>.1&&C()})},{root:null,rootMargin:"0px",threshold:[.1]}),a.current.observe(o.current)):g()}},[h,S,P,C,R,g,T]),w=react.useCallback(()=>{let e=document.querySelector("html");if(!o.current||!e)return;let r=new ResizeObserver(([e])=>{let r;let t=e?.target.getBoundingClientRect().width??0;r=t>=1024?"desktop":t>=768?"tablet":"mobile",p.current!==r&&(p.current=r,A(E()))});return r.observe(e),()=>r.disconnect()},[E,A]);return react.useEffect(()=>{setTimeout(()=>{if(r&&e.current)return m.current=`animation-wrapper-${Math.random().toString(36).substr(2,5)}`,e.current.setAttribute("data-animationid",m.current),o.current=document.querySelector(`[data-animationid='${m.current}'] ${TAGS_SELECTOR?.[t]??""}`),w()},100)},[w,r,t,e]),{initAnimation:A}};exports.useLivePageAnimation=useLivePageAnimation;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{useState as
|
|
1
|
+
import{useState as r,useRef as e,useCallback as t,useEffect as n}from"react";import{animations as u}from"./animations.js";let TAGS_SELECTOR={Button:".gp-button-base",ProductButton:".gp-button-base",Sticky:"gp-sticky",Dialog:"div[role=dialog]",Icon:"div div",ProductTag:"div div div",Product:"product-form form div"},useLivePageAnimation=(c,o,i)=>{let a=u(),[l,s]=r(!1),d=e(void 0),p=e(void 0),m=e(null),v=e("none"),g=e("none"),b=e(null),f=e(null),y=e(null),h=e("animation-wrapper-"),k=t(r=>{b.current&&(b.current.playbackRate=r??1,b.current.play())},[b]),E=t(r=>{f.current&&(f.current.playbackRate=r??1,f.current.play())},[f]),L=t(()=>{c.current&&(c.current.style.opacity="1"),m.current&&(m.current.style.opacity="1")},[c]),S=t(()=>{c.current&&(c.current.style.opacity="1"),m.current&&(m.current.style.opacity="0")},[c]),T=t(r=>{r&&r.stopPropagation(),"shake"!==v.current&&S(),b.current&&(f.current?.cancel(),k(),b.current.finished.then(()=>{m.current&&L()}),m.current&&d?.current?.unobserve(m.current))},[S,k,L]),P=t(()=>{L(),b.current&&b.current.cancel()},[L,b]),R=t(r=>{r&&r.stopPropagation(),f.current&&(P(),E())},[f,P,E]),C=t(()=>{if(f.current){if("zoom"===g.current){if(E(-1),!l)return;f.current.finished.then(()=>{clearTimeout(p.current),p.current=setTimeout(()=>{T()},100)});return}f.current.cancel(),l&&T()}},[E,l,T]),w=t(()=>{if("desktop"===y.current);else if("tablet"===y.current)return o?.tablet??o?.desktop;else if("mobile"===y.current)return o?.mobile??o?.tablet??o?.desktop;return o?.desktop},[o?.desktop,o?.mobile,o?.tablet]),A=(r,e)=>r?.triggerConfig?.[e]?.animation??"none",O=t(r=>{if("none"===v.current)return;let e=r?.triggerConfig?.appear?.setting?.[v.current];s(e.loop),b.current=a?.[v.current]?.(m.current,e)},[a]),B=t(r=>{if("none"===g.current)return;let e=r?.triggerConfig?.hover?.setting?.[g.current];f.current=a?.[g.current]?.(m.current,e)},[a]),$=t(()=>{b.current&&(b.current=null,m.current&&d.current?.unobserve(m.current)),f&&(f.current=null,m.current&&(m.current.removeEventListener("mouseenter",R),m.current.removeEventListener("mouseleave",C)))},[C,R]),q=t(r=>{if($(),m.current){if(!r?.enabled){L();return}v.current=A(r,"appear"),g.current=A(r,"hover"),"none"===v.current&&L(),"none"!==g.current&&"desktop"===y.current&&(B(r),m.current.addEventListener("mouseenter",R),m.current.addEventListener("mouseleave",C)),"none"!==v.current?(O(r),d.current=new IntersectionObserver(r=>{r.forEach(r=>{r.intersectionRatio>.1&&T()})},{root:null,rootMargin:"0px",threshold:[.1]}),d.current.observe(m.current)):L()}},[C,O,B,T,R,L,$]),x=t(()=>{let r=document.querySelector("html");if(!m.current||!r)return;let e=new ResizeObserver(([r])=>{let e;let t=r?.target.getBoundingClientRect().width??0;e=t>=1024?"desktop":t>=768?"tablet":"mobile",y.current!==e&&(y.current=e,q(w()))});return e.observe(r),()=>e.disconnect()},[w,q]);return n(()=>{setTimeout(()=>{if(o&&c.current)return h.current=`animation-wrapper-${Math.random().toString(36).substr(2,5)}`,c.current.setAttribute("data-animationid",h.current),m.current=document.querySelector(`[data-animationid='${h.current}'] ${TAGS_SELECTOR?.[i]??""}`),x()},100)},[x,o,i,c]),{initAnimation:q}};export{useLivePageAnimation};
|