react-atom-trigger 2.0.6 → 2.0.8

package/README.md

@@ -327,5 +327,3 @@ pnpm build:sb
 Output:
 
 `storybook-static/`
-
-This directory is used for deployment to `storybook.atomtrigger.dev`.

package/lib/index.js

@@ -1 +1 @@
-import e from"react";const t=new Set;function n(){if(typeof process>`u`||!process.env)return null;let e=`production`;return e===`development`||e===`production`?e:null}function r(e){return(Object.prototype.hasOwnProperty.call(e??{},`nodeEnv`)?e?.nodeEnv??null:n())===`development`}function i(e){r()&&(t.has(e)||(t.add(e),typeof console<`u`&&console.warn&&console.warn(e)))}function a(e){return!!(e&&typeof e==`object`&&`nodeType`in e&&e.nodeType===1&&`getBoundingClientRect`in e&&typeof e.getBoundingClientRect==`function`&&`addEventListener`in e&&typeof e.addEventListener==`function`&&`removeEventListener`in e&&typeof e.removeEventListener==`function`)}function o(e){return!!(e&&typeof e==`object`&&`window`in e&&e.window===e)}function s(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function c(e){if(!e||typeof e!=`object`&&typeof e!=`function`)return;let t=Object.getOwnPropertyDescriptor(e,`ref`);if(!(!t||!(`value`in t)))return t.value}function l(e){if(!e)return;let t=c(e.props);return t===void 0?c(e):t}function u(t,n,r){return t?n===1?r?r.type===e.Fragment?`[react-atom-trigger] Child mode does not support React.Fragment. Wrap the content in a single DOM element. Observation is disabled for this render.`:null:`[react-atom-trigger] Child mode expects a React element child. Observation is disabled for this render.`:`[react-atom-trigger] Child mode expects exactly one top-level React element. Observation is disabled for this render.`:null}function d({originalChildRef:t,hasObservedChild:n,invalidChildWarning:r,shouldWarnAboutMissingDomRef:o}){let[c,l]=e.useState(null),u=e.useRef(null),d=e.useCallback(()=>{u.current=null,l(e=>e===null?e:null)},[]),f=e.useCallback(e=>{if(s(t,e),e===null){d();return}if(a(e)){u.current=e,l(t=>t===e?t:e);return}d(),i(`[react-atom-trigger] Child mode requires the child ref to resolve to a DOM element. Observation is disabled for this render.`)},[d,t]);return e.useEffect(()=>{if(typeof window>`u`||!(n&&!r&&!c&&o))return;let e=window.setTimeout(()=>{u.current||i(`[react-atom-trigger] Child mode expects a DOM element or a component that forwards its ref to a DOM element. Observation is disabled for this render.`)},16);return()=>{window.clearTimeout(e)}},[n,r,c,o]),{childNode:c,attachObservedChildRef:f}}function f(e){return Array.isArray(e)&&e.length===4&&e.every(e=>typeof e==`number`&&Number.isFinite(e))}function p(e){return typeof e==`string`?e:f(e)?e.map(e=>`${Object.is(e,-0)?0:e}px`).join(` `):(e==null||i(`[react-atom-trigger] Invalid rootMargin array ${JSON.stringify(e)}. Use exactly four finite numbers: [top, right, bottom, left]. Falling back to 0px.`),`0px`)}function m(e,t){let n=e.trim();if(!n||/^[+-]?0(?:\.0+)?$/.test(n))return 0;let r=n.match(/^([+-]?(?:\d+\.?\d*|\.\d+))(px|%)$/);if(!r)return i(`[react-atom-trigger] Invalid rootMargin token "${n}". Use px, % or 0. Falling back to 0px.`),0;let[,a,o]=r,s=Number.parseFloat(a);return o===`%`?s/100*t:s}function h(e,t,n){let r=e.trim().split(/\s+/).filter(Boolean);if(r.length>4)return i(`[react-atom-trigger] Invalid rootMargin "${e}". Use 1 to 4 values in IntersectionObserver order. Falling back to 0px.`),{top:0,right:0,bottom:0,left:0};let[a=`0px`,o=a,s=a,c=o]=r;return{top:m(a,n),right:m(o,t),bottom:m(s,n),left:m(c,t)}}function g(e,t){let n=h(t,e.width,e.height);return new DOMRect(e.left-n.left,e.top-n.top,e.width+n.left+n.right,e.height+n.top+n.bottom)}function _(e){let t=e.width>0?e.width:1,n=e.height>0?e.height:1;return t===e.width&&n===e.height?e:new DOMRect(e.left,e.top,t,n)}function v(e,t){let n=Math.max(e.left,t.left),r=Math.max(e.top,t.top),i=Math.min(e.right,t.right),a=Math.min(e.bottom,t.bottom);return i<=n||a<=r?new DOMRect(0,0,0,0):new DOMRect(n,r,i-n,a-r)}function y(e,t){let n=e.width*e.height;return n<=0?0:t.width*t.height/n}function b(e){return Math.min(1,Math.max(0,e))}function x(e){return Array.isArray(e)?(i("[react-atom-trigger] `threshold` expects a single number in v2. Using the first finite numeric entry."),b(e.find(e=>typeof e==`number`&&Number.isFinite(e))??0)):e==null?0:typeof e!=`number`||!Number.isFinite(e)?(i("[react-atom-trigger] `threshold` must be a finite number between 0 and 1. Falling back to 0."),0):((e<0||e>1)&&i("[react-atom-trigger] `threshold` should be between 0 and 1. Values are clamped."),b(e))}function S(e,t){if(!e)return`unknown`;let n=t.left-e.left,r=t.top-e.top;return n===0&&r===0?`stationary`:Math.abs(r)>=Math.abs(n)?r<0?`up`:`down`:n<0?`left`:`right`}function C(e){if(e.isIntersecting)return`inside`;let t=e.boundingClientRect,n=e.rootBounds?.top??0,r=e.rootBounds?.bottom??window.innerHeight,i=e.rootBounds?.left??0,a=e.rootBounds?.right??window.innerWidth;return t.bottom<=n?`above`:t.top>=r?`below`:t.right<=i?`left`:t.left>=a?`right`:`outside`}function w(e,t,n,r){return!(n&&t.entered+t.left>0||r&&(e===`enter`&&t.entered>0||e===`leave`&&t.left>0))}function T(e){return e.once?e.counts.entered+e.counts.left>0:e.oncePerDirection?e.counts.entered>0&&e.counts.left>0:!1}function E(e){e.previousTriggerActive=void 0,e.previousRect=null}function D(e,t,n,r){let i=_(e.node.getBoundingClientRect()),a=g(t,e.rootMargin),o=v(i,a),s=y(i,o),c=s>0,l=e.previousTriggerActive,u=l===!0||e.threshold===0?c:s>=e.threshold,d=e.previousRect&&(n===`root-change`||r)?`stationary`:S(e.previousRect,i);e.previousRect=i,e.previousTriggerActive=u;let f=Date.now(),p={target:e.node,rootBounds:a,boundingClientRect:i,intersectionRect:o,isIntersecting:c,intersectionRatio:s,source:`geometry`},m=l===void 0;if(m&&(!e.fireOnInitialVisible||!u)||l===u)return;let h=u?`enter`:`leave`;if(!w(h,e.counts,e.once,e.oncePerDirection))return;let b=h===`enter`?{...e.counts,entered:e.counts.entered+1}:{...e.counts,left:e.counts.left+1};e.counts=b;let x={type:h,isInitial:m,entry:p,counts:b,movementDirection:d,position:C(p),timestamp:f};e.onEvent?.(x),h===`enter`?e.onEnter?.(x):e.onLeave?.(x),T(e)&&e.dispose?.()}const O=new WeakMap;function k(){return new DOMRect(0,0,window.innerWidth,window.innerHeight)}function A(e){return e===window||o(e)}function j(e){let t={registrations:new Set,rafId:0,pendingSampleCause:null,previousBaseRootBounds:null,resizeObserver:null,intersectionObserver:null,queueSample:()=>{},cleanup:()=>{}},n=()=>{if(t.rafId=0,t.registrations.size===0){t.pendingSampleCause=null;return}let n=t.pendingSampleCause??`geometry-change`;t.pendingSampleCause=null;let r=A(e)?k():e.getBoundingClientRect(),i=t.previousBaseRootBounds!==null&&(t.previousBaseRootBounds.top!==r.top||t.previousBaseRootBounds.left!==r.left||t.previousBaseRootBounds.width!==r.width||t.previousBaseRootBounds.height!==r.height);for(let e of t.registrations)D(e,r,n,i);t.previousBaseRootBounds=new DOMRect(r.left,r.top,r.width,r.height)},r=(e=`geometry-change`)=>{if((t.pendingSampleCause===null||t.pendingSampleCause===`geometry-change`&&e!==`geometry-change`||t.pendingSampleCause===`root-change`&&e===`scroll`)&&(t.pendingSampleCause=e),t.rafId!==0)return;t.rafId=-1;let r=window.requestAnimationFrame(()=>{t.rafId=0,n()});t.rafId===-1&&(t.rafId=r)},i=()=>{r(`scroll`)},a=()=>{r(`root-change`)};return e.addEventListener(`scroll`,i,{passive:!0}),window.addEventListener(`resize`,a),typeof ResizeObserver<`u`&&(t.resizeObserver=new ResizeObserver(a),A(e)||t.resizeObserver.observe(e)),typeof IntersectionObserver<`u`&&(t.intersectionObserver=new IntersectionObserver(()=>{r(`geometry-change`)},{root:A(e)?null:e,rootMargin:`200% 200% 200% 200%`,threshold:0})),t.queueSample=r,t.cleanup=()=>{t.rafId!==0&&(cancelAnimationFrame(t.rafId),t.rafId=0),e.removeEventListener(`scroll`,i),window.removeEventListener(`resize`,a),t.resizeObserver?.disconnect(),t.intersectionObserver?.disconnect(),t.pendingSampleCause=null,t.previousBaseRootBounds=null},t}function ee(e){let t=O.get(e);if(t)return t;let n=j(e);return O.set(e,n),n}function te(e,t){let n=ee(e),r=!1,i=t.node;n.registrations.add(t),n.resizeObserver?.observe(i),n.intersectionObserver?.observe(i),n.queueSample();let a=()=>{r||(r=!0,n.registrations.delete(t),n.resizeObserver?.unobserve(i),n.intersectionObserver?.unobserve(i),t.dispose=void 0,n.registrations.size===0&&(n.cleanup(),O.delete(e)))};return t.dispose=a,a}function ne(e,t){return{...e,...t,previousTriggerActive:void 0,previousRect:null,counts:{entered:0,left:0}}}function M(e,t){e.node=t.node,e.rootMargin=t.rootMargin,e.threshold=t.threshold,e.once=t.once,e.oncePerDirection=t.oncePerDirection,e.fireOnInitialVisible=t.fireOnInitialVisible}function re(e,t){e.onEnter=t.onEnter,e.onLeave=t.onLeave,e.onEvent=t.onEvent}function N(e){e.dispose?.(),e.dispose=null,e.binding=null}function ie(e){return{node:e.node,rootMargin:e.rootMargin,threshold:e.threshold,once:e.once,oncePerDirection:e.oncePerDirection,fireOnInitialVisible:e.fireOnInitialVisible}}function ae(e,t){return!!(e&&e.node===t.node&&e.target===t.target&&e.rootMargin===t.rootMargin&&e.threshold===t.threshold&&e.once===t.once&&e.oncePerDirection===t.oncePerDirection&&e.fireOnInitialVisible===t.fireOnInitialVisible)}function P(e,t){return{registration:ne(e,t),binding:null,dispose:null}}function F(e,t){re(e.registration,t)}function I(e,t){let n=e.registration;if(!t.node){E(n),N(e);return}let r=ie({node:t.node,rootMargin:t.rootMargin,threshold:t.threshold,once:t.once,oncePerDirection:t.oncePerDirection,fireOnInitialVisible:t.fireOnInitialVisible});if(t.disabled||!t.target){N(e),M(n,r),E(n);return}let i={...r,target:t.target};if(ae(e.binding,i)){M(n,r);return}E(n),N(e),M(n,r),e.dispose=te(t.target,n),e.binding=i}function L(e){N(e)}function R(e){let t=e.kind===`rootRef`?"[react-atom-trigger] `rootRef.current` must resolve to a real DOM element. Observation is paused until it does.":"[react-atom-trigger] `root` must be a real DOM element when provided. Observation is paused until it is.",{target:n}=e;return n==null?null:a(n)?n:(i(t),null)}function z(t){let n=t!==void 0,[r,i]=e.useState(()=>n?t.current:null);return e.useEffect(()=>{if(!n)return;let e=t.current;i(t=>t===e?t:e)}),n?r:void 0}function B(e){switch(e.kind){case`rootRef`:case`root`:return R(e);case`viewport`:return typeof window>`u`?null:window}}const V={display:`table`},oe=({onEnter:t,onLeave:n,onEvent:r,children:a,once:o=!1,oncePerDirection:s=!1,fireOnInitialVisible:c=!1,disabled:f=!1,threshold:m=0,root:h,rootRef:g,rootMargin:_=`0px`,className:v})=>{let y=e.useRef(null),b=e.useRef(null),S=z(g),C=p(_),w=x(m),T=a!=null,E=e.Children.count(a),D=E===1&&e.isValidElement(a)?a:null,O=u(T,E,D),k=O||!D?null:D,{childNode:A,attachObservedChildRef:j}=d({originalChildRef:l(k),hasObservedChild:T,invalidChildWarning:O,shouldWarnAboutMissingDomRef:k!==null});return e.useEffect(()=>{T&&v&&i("[react-atom-trigger] `className` only applies to the internal sentinel. In child mode, style the child element directly.")},[v,T]),e.useEffect(()=>{O&&i(O)},[O]),e.useEffect(()=>{o&&s&&i("[react-atom-trigger] `once` and `oncePerDirection` were both provided. `once` takes precedence.")},[o,s]),e.useEffect(()=>{let e=b.current;e&&F(e,{onEnter:t,onLeave:n,onEvent:r})},[t,n,r]),e.useEffect(()=>{if(typeof window>`u`)return;let e=T?A:y.current,i=B(g===void 0?h===void 0?{kind:`viewport`}:{kind:`root`,target:h}:{kind:`rootRef`,target:S});if(!e){b.current&&I(b.current,{disabled:!1,node:null,target:i,rootMargin:C,threshold:w,once:o,oncePerDirection:s,fireOnInitialVisible:c});return}b.current||(b.current=P({node:e,rootMargin:C,threshold:w,once:o,oncePerDirection:s,fireOnInitialVisible:c},{onEnter:t,onLeave:n,onEvent:r})),I(b.current,{disabled:f,node:e,target:i,rootMargin:C,threshold:w,once:o,oncePerDirection:s,fireOnInitialVisible:c})},[f,C,w,o,s,c,A,h,g,S,T]),e.useEffect(()=>()=>{b.current&&(L(b.current),b.current=null)},[]),T?k?e.cloneElement(k,{ref:j}):e.createElement(e.Fragment,null,a):e.createElement(`div`,{ref:y,style:V,className:v})},H=e.useSyncExternalStore,se=typeof window>`u`?e.useEffect:e.useLayoutEffect;function U(t,n,r){if(H)return H(t,n,r);let[i,a]=e.useState(()=>r()),o=e.useRef(i);return se(()=>{let e=()=>{let e=n();Object.is(o.current,e)||(o.current=e,a(e))};return e(),t(e)},[t,n]),i}function W(e,t,n){return n(e.current,t)?e.current:(e.current=t,t)}const G={x:0,y:0},K={width:0,height:0},ce=typeof window>`u`?e.useEffect:e.useLayoutEffect;function q(e,t){let n=null,r=null,i=()=>{n&&(clearTimeout(n),n=null),r=Date.now(),e()};return{schedule:()=>{if(t<=0){i();return}let e=Date.now();if(r===null||e-r>=t){i();return}n||(n=setTimeout(()=>{i()},t-(e-r)))},cancel:()=>{n&&(clearTimeout(n),n=null)}}}function J(){return typeof window>`u`?K:{width:window.innerWidth,height:window.innerHeight}}function Y(e){return!!(e&&typeof e==`object`&&!o(e)&&`current`in e)}function X(e){return Y(e)?e.current:e||(typeof window>`u`?null:window)}function le(e){return e===window||o(e)}function Z(e){if(le(e))return{x:e.scrollX,y:e.scrollY};let t=e;return{x:t.scrollLeft,y:t.scrollTop}}function ue(e){let t=X(e);return t?Z(t):G}function Q(e,t){return e.x===t.x&&e.y===t.y}function $(e,t){return e.width===t.width&&e.height===t.height}function de(t){let n=t?.enabled!==!1,r=t?.passive,i=t?.throttleMs??16,a=e.useRef(J()),o=e.useCallback(()=>typeof window>`u`?K:n?W(a,J(),$):a.current,[n]);return U(e.useCallback(e=>{if(typeof window>`u`||!n)return()=>{};let t=q(()=>{let t=J();$(a.current,t)||(a.current=t,e())},i);return window.addEventListener(`resize`,t.schedule,{passive:r}),()=>{t.cancel(),window.removeEventListener(`resize`,t.schedule)}},[n,r,i]),o,()=>K)}function fe(t){let n=t?.target,r=Y(n),i=t?.enabled!==!1,a=t?.passive,o=t?.throttleMs??16,s=e.useRef(ue(n)),[c,l]=e.useState(()=>r?X(n):null);ce(()=>{if(!r)return;let e=X(n);l(t=>t===e?t:e)});let u=r?c:X(n),d=e.useCallback(()=>i?u?W(s,Z(u),Q):W(s,G,Q):s.current,[i,u]);return U(e.useCallback(e=>{if(!i||!u)return()=>{};let t=q(()=>{let t=Z(u);Q(s.current,t)||(s.current=t,e())},o);return u.addEventListener(`scroll`,t.schedule,{passive:a}),()=>{t.cancel(),u.removeEventListener(`scroll`,t.schedule)}},[i,a,u,o]),d,()=>G)}export{oe as AtomTrigger,fe as useScrollPosition,de as useViewportSize};
+import e from"react";function t(e){return!!(e&&typeof e==`object`&&`nodeType`in e&&e.nodeType===1&&`getBoundingClientRect`in e&&typeof e.getBoundingClientRect==`function`&&`addEventListener`in e&&typeof e.addEventListener==`function`&&`removeEventListener`in e&&typeof e.removeEventListener==`function`)}function n(e){return!!(e&&typeof e==`object`&&`window`in e&&e.window===e)}function r(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function i(e){if(!e||typeof e!=`object`&&typeof e!=`function`)return;let t=Object.getOwnPropertyDescriptor(e,`ref`);if(!(!t||!(`value`in t)))return t.value}function a(e){if(!e)return;let t=i(e.props);return t===void 0?i(e):t}function o(t,n,r){return t?n===1?r?r.type===e.Fragment?`fragmentChild`:null:`invalidChildElement`:`invalidChildCount`:null}function s({originalChildRef:n,hasObservedChild:i,invalidChildWarning:a,shouldWarnAboutMissingDomRef:o}){let[s,c]=e.useState(null),l=e.useRef(null),u=e.useCallback(()=>{l.current=null,c(e=>e===null?e:null)},[]),d=e.useCallback(e=>{if(r(n,e),e===null){u();return}if(t(e)){l.current=e,c(t=>t===e?t:e);return}u()},[u,n]);return e.useEffect(()=>{if(typeof window>`u`||!(i&&!a&&!s&&o))return;let e=window.setTimeout(()=>{l.current},16);return()=>{window.clearTimeout(e)}},[i,a,s,o]),{childNode:s,attachObservedChildRef:d}}function c(e){return Array.isArray(e)&&e.length===4&&e.every(e=>typeof e==`number`&&Number.isFinite(e))}function l(e){return typeof e==`string`?e:c(e)?e.map(e=>`${Object.is(e,-0)?0:e}px`).join(` `):`0px`}function u(e,t){let n=e.trim();if(/^[+-]?0(?:\.0+)?$/.test(n))return 0;let r=n.match(/^([+-]?(?:\d+\.?\d*|\.\d+))(px|%)$/);if(!r)return 0;let[,i,a]=r,o=Number.parseFloat(i);return a===`%`?o/100*t:o}function d(e,t,n){let r=e.trim().split(/\s+/).filter(Boolean);if(r.length>4)return{top:0,right:0,bottom:0,left:0};let[i=`0px`,a=i,o=i,s=a]=r;return{top:u(i,n),right:u(a,t),bottom:u(o,n),left:u(s,t)}}function f(e,t){let n=d(t,e.width,e.height);return new DOMRect(e.left-n.left,e.top-n.top,e.width+n.left+n.right,e.height+n.top+n.bottom)}function p(e){let t=e.width>0?e.width:1,n=e.height>0?e.height:1;return t===e.width&&n===e.height?e:new DOMRect(e.left,e.top,t,n)}function m(e,t){let n=Math.max(e.left,t.left),r=Math.max(e.top,t.top),i=Math.min(e.right,t.right),a=Math.min(e.bottom,t.bottom);return i<=n||a<=r?new DOMRect(0,0,0,0):new DOMRect(n,r,i-n,a-r)}function h(e,t){let n=e.width*e.height;return n<=0?0:t.width*t.height/n}function g(e){return Math.min(1,Math.max(0,e))}function _(e){return Array.isArray(e)?g(e.find(e=>typeof e==`number`&&Number.isFinite(e))??0):e==null||typeof e!=`number`||!Number.isFinite(e)?0:g(e)}function v(e,t){if(!e)return`unknown`;let n=t.left-e.left,r=t.top-e.top;return n===0&&r===0?`stationary`:Math.abs(r)>=Math.abs(n)?r<0?`up`:`down`:n<0?`left`:`right`}function y(e){if(e.isIntersecting)return`inside`;let t=e.boundingClientRect,n=e.rootBounds?.top??0,r=e.rootBounds?.bottom??window.innerHeight,i=e.rootBounds?.left??0,a=e.rootBounds?.right??window.innerWidth;return t.bottom<=n?`above`:t.top>=r?`below`:t.right<=i?`left`:t.left>=a?`right`:`outside`}function b(e,t,n,r){return!(n&&t.entered+t.left>0||r&&(e===`enter`&&t.entered>0||e===`leave`&&t.left>0))}function x(e){return e.once?e.counts.entered+e.counts.left>0:e.oncePerDirection?e.counts.entered>0&&e.counts.left>0:!1}function S(e){e.previousTriggerActive=void 0,e.previousRect=null}function C(e,t,n,r){let i=p(e.node.getBoundingClientRect()),a=f(t,e.rootMargin),o=m(i,a),s=h(i,o),c=s>0,l=e.previousTriggerActive,u=l===!0||e.threshold===0?c:s>=e.threshold,d=e.previousRect&&(n===`root-change`||r)?`stationary`:v(e.previousRect,i);e.previousRect=i,e.previousTriggerActive=u;let g=Date.now(),_={target:e.node,rootBounds:a,boundingClientRect:i,intersectionRect:o,isIntersecting:c,intersectionRatio:s,source:`geometry`},S=l===void 0;if(S&&(!e.fireOnInitialVisible||!u)||l===u)return;let C=u?`enter`:`leave`;if(!b(C,e.counts,e.once,e.oncePerDirection))return;let w=C===`enter`?{...e.counts,entered:e.counts.entered+1}:{...e.counts,left:e.counts.left+1};e.counts=w;let T={type:C,isInitial:S,entry:_,counts:w,movementDirection:d,position:y(_),timestamp:g};e.onEvent?.(T),C===`enter`?e.onEnter?.(T):e.onLeave?.(T),x(e)&&e.dispose?.()}const w=new WeakMap;function T(){return new DOMRect(0,0,window.innerWidth,window.innerHeight)}function E(e){return e===window||n(e)}function D(e){let t={registrations:new Set,rafId:0,pendingSampleCause:null,previousBaseRootBounds:null,resizeObserver:null,intersectionObserver:null,queueSample:()=>{},cleanup:()=>{}},n=()=>{if(t.rafId=0,t.registrations.size===0){t.pendingSampleCause=null;return}let n=t.pendingSampleCause??`geometry-change`;t.pendingSampleCause=null;let r=E(e)?T():e.getBoundingClientRect(),i=t.previousBaseRootBounds!==null&&(t.previousBaseRootBounds.top!==r.top||t.previousBaseRootBounds.left!==r.left||t.previousBaseRootBounds.width!==r.width||t.previousBaseRootBounds.height!==r.height);for(let e of t.registrations)C(e,r,n,i);t.previousBaseRootBounds=new DOMRect(r.left,r.top,r.width,r.height)},r=(e=`geometry-change`)=>{(t.pendingSampleCause===null||t.pendingSampleCause===`geometry-change`&&e!==`geometry-change`||t.pendingSampleCause===`root-change`&&e===`scroll`)&&(t.pendingSampleCause=e),t.rafId===0&&(t.rafId=window.requestAnimationFrame(()=>{t.rafId=0,n()}))},i=()=>{r(`scroll`)},a=()=>{r(`root-change`)};return e.addEventListener(`scroll`,i,{passive:!0}),window.addEventListener(`resize`,a),typeof ResizeObserver<`u`&&(t.resizeObserver=new ResizeObserver(a),E(e)||t.resizeObserver.observe(e)),typeof IntersectionObserver<`u`&&(t.intersectionObserver=new IntersectionObserver(()=>{r(`geometry-change`)},{root:E(e)?null:e,rootMargin:`200% 200% 200% 200%`,threshold:0})),t.queueSample=r,t.cleanup=()=>{t.rafId!==0&&(cancelAnimationFrame(t.rafId),t.rafId=0),e.removeEventListener(`scroll`,i),window.removeEventListener(`resize`,a),t.resizeObserver?.disconnect(),t.intersectionObserver?.disconnect(),t.pendingSampleCause=null,t.previousBaseRootBounds=null},t}function O(e){let t=w.get(e);if(t)return t;let n=D(e);return w.set(e,n),n}function k(e,t){let n=O(e),r=!1,i=t.node;n.registrations.add(t),n.resizeObserver?.observe(i),n.intersectionObserver?.observe(i),n.queueSample();let a=()=>{r||(r=!0,n.registrations.delete(t),n.resizeObserver?.unobserve(i),n.intersectionObserver?.unobserve(i),t.dispose=void 0,n.registrations.size===0&&(n.cleanup(),w.delete(e)))};return t.dispose=a,a}function A(e,t){return{...e,...t,previousTriggerActive:void 0,previousRect:null,counts:{entered:0,left:0}}}function j(e){e.dispose?.(),e.dispose=null,e.binding=null}function M(e,t){return{registration:A(e,t),binding:null,dispose:null}}function N(e,t){e.registration.onEnter=t.onEnter,e.registration.onLeave=t.onLeave,e.registration.onEvent=t.onEvent}function P(e,t){let n=e.registration;if(!t.node){S(n),j(e);return}let r={node:t.node,rootMargin:t.rootMargin,threshold:t.threshold,once:t.once,oncePerDirection:t.oncePerDirection,fireOnInitialVisible:t.fireOnInitialVisible};if(t.disabled||!t.target){j(e),Object.assign(n,r),S(n);return}let i={...r,target:t.target};if(e.binding!==null&&e.binding.node===i.node&&e.binding.target===i.target&&e.binding.rootMargin===i.rootMargin&&e.binding.threshold===i.threshold&&e.binding.once===i.once&&e.binding.oncePerDirection===i.oncePerDirection&&e.binding.fireOnInitialVisible===i.fireOnInitialVisible){Object.assign(n,r);return}S(n),j(e),Object.assign(n,r),e.dispose=k(t.target,n),e.binding=i}function F(e){j(e)}function I(e){e.kind;let{target:n}=e;return n==null?null:t(n)?n:null}function L(t){let n=t!==void 0,[r,i]=e.useState(()=>n?t.current:null);return e.useEffect(()=>{if(!n)return;let e=t.current;i(t=>t===e?t:e)}),n?r:void 0}function R(e){switch(e.kind){case`rootRef`:case`root`:return I(e);case`viewport`:return typeof window>`u`?null:window}}const z={display:`table`},B=({onEnter:t,onLeave:n,onEvent:r,children:i,once:c=!1,oncePerDirection:u=!1,fireOnInitialVisible:d=!1,disabled:f=!1,threshold:p=0,root:m,rootRef:h,rootMargin:g=`0px`,className:v})=>{let y=e.useRef(null),b=e.useRef(null),x=L(h),S=l(g),C=_(p),w=i!=null,T=e.Children.count(i),E=T===1&&e.isValidElement(i)?i:null,D=o(w,T,E),O=D||!E?null:E,{childNode:k,attachObservedChildRef:A}=s({originalChildRef:a(O),hasObservedChild:w,invalidChildWarning:D,shouldWarnAboutMissingDomRef:O!==null});return e.useEffect(()=>{},[v,w]),e.useEffect(()=>{},[D]),e.useEffect(()=>{},[c,u]),e.useEffect(()=>{let e=b.current;e&&N(e,{onEnter:t,onLeave:n,onEvent:r})},[t,n,r]),e.useEffect(()=>{if(typeof window>`u`)return;let e=w?k:y.current,i=R(h===void 0?m===void 0?{kind:`viewport`}:{kind:`root`,target:m}:{kind:`rootRef`,target:x});if(!e){b.current&&P(b.current,{disabled:!1,node:null,target:i,rootMargin:S,threshold:C,once:c,oncePerDirection:u,fireOnInitialVisible:d});return}b.current||(b.current=M({node:e,rootMargin:S,threshold:C,once:c,oncePerDirection:u,fireOnInitialVisible:d},{onEnter:t,onLeave:n,onEvent:r})),P(b.current,{disabled:f,node:e,target:i,rootMargin:S,threshold:C,once:c,oncePerDirection:u,fireOnInitialVisible:d})},[f,S,C,c,u,d,k,m,h,x,w]),e.useEffect(()=>()=>{b.current&&(F(b.current),b.current=null)},[]),w?O?e.cloneElement(O,{ref:A}):e.createElement(e.Fragment,null,i):e.createElement(`div`,{ref:y,style:z,className:v})};function V(t,n,r){let i=e.useSyncExternalStore;if(i)return i(t,n,r);let[a,o]=e.useState(()=>r()),s=e.useRef(a);return(typeof window>`u`?e.useEffect:e.useLayoutEffect)(()=>{let e=()=>{let e=n();Object.is(s.current,e)||(s.current=e,o(e))};return e(),t(e)},[t,n]),a}function H(e,t,n){return n(e.current,t)?e.current:(e.current=t,t)}const U={x:0,y:0},W={width:0,height:0};function G(e,t){let n=null,r=null,i=()=>{n&&(clearTimeout(n),n=null),r=Date.now(),e()};return{schedule:()=>{if(t<=0){i();return}let e=Date.now();if(r===null||e-r>=t){i();return}n||(n=setTimeout(()=>{i()},t-(e-r)))},cancel:()=>{n&&(clearTimeout(n),n=null)}}}function K(){return typeof window>`u`?W:{width:window.innerWidth,height:window.innerHeight}}function q(e){return!!(e&&typeof e==`object`&&!n(e)&&`current`in e)}function J(e){return q(e)?e.current:e||(typeof window>`u`?null:window)}function Y(e){return e===window||n(e)}function X(e){if(Y(e))return{x:e.scrollX,y:e.scrollY};let t=e;return{x:t.scrollLeft,y:t.scrollTop}}function Z(e){let t=J(e);return t?X(t):U}function Q(e,t){return e.x===t.x&&e.y===t.y}function $(e,t){return e.width===t.width&&e.height===t.height}function ee(t){let n=t?.enabled!==!1,r=t?.passive,i=t?.throttleMs??16,a=e.useRef(K()),o=e.useCallback(()=>typeof window>`u`?W:n?H(a,K(),$):a.current,[n]);return V(e.useCallback(e=>{if(typeof window>`u`||!n)return()=>{};let t=G(()=>{let t=K();$(a.current,t)||(a.current=t,e())},i);return window.addEventListener(`resize`,t.schedule,{passive:r}),()=>{t.cancel(),window.removeEventListener(`resize`,t.schedule)}},[n,r,i]),o,()=>W)}function te(t){let n=t?.target,r=q(n),i=t?.enabled!==!1,a=t?.passive,o=t?.throttleMs??16,s=e.useRef(Z(n)),[c,l]=e.useState(()=>r?J(n):null);(typeof window>`u`?e.useEffect:e.useLayoutEffect)(()=>{if(!r)return;let e=J(n);l(t=>t===e?t:e)});let u=r?c:J(n),d=e.useCallback(()=>i?u?H(s,X(u),Q):H(s,U,Q):s.current,[i,u]);return V(e.useCallback(e=>{if(!i||!u)return()=>{};let t=G(()=>{let t=X(u);Q(s.current,t)||(s.current=t,e())},o);return u.addEventListener(`scroll`,t.schedule,{passive:a}),()=>{t.cancel(),u.removeEventListener(`scroll`,t.schedule)}},[i,a,u,o]),d,()=>U)}export{B as AtomTrigger,te as useScrollPosition,ee as useViewportSize};

package/lib/index.umd.js

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`)):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.reactAtomTrigger={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),c(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,e)))(t);let l=new Set;function u(){if(typeof process>`u`||!process.env)return null;let e=`production`;return e===`development`||e===`production`?e:null}function d(e){return(Object.prototype.hasOwnProperty.call(e??{},`nodeEnv`)?e?.nodeEnv??null:u())===`development`}function f(e){d()&&(l.has(e)||(l.add(e),typeof console<`u`&&console.warn&&console.warn(e)))}function p(e){return!!(e&&typeof e==`object`&&`nodeType`in e&&e.nodeType===1&&`getBoundingClientRect`in e&&typeof e.getBoundingClientRect==`function`&&`addEventListener`in e&&typeof e.addEventListener==`function`&&`removeEventListener`in e&&typeof e.removeEventListener==`function`)}function m(e){return!!(e&&typeof e==`object`&&`window`in e&&e.window===e)}function h(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function g(e){if(!e||typeof e!=`object`&&typeof e!=`function`)return;let t=Object.getOwnPropertyDescriptor(e,`ref`);if(!(!t||!(`value`in t)))return t.value}function _(e){if(!e)return;let t=g(e.props);return t===void 0?g(e):t}function v(e,n,r){return e?n===1?r?r.type===t.default.Fragment?`[react-atom-trigger] Child mode does not support React.Fragment. Wrap the content in a single DOM element. Observation is disabled for this render.`:null:`[react-atom-trigger] Child mode expects a React element child. Observation is disabled for this render.`:`[react-atom-trigger] Child mode expects exactly one top-level React element. Observation is disabled for this render.`:null}function y({originalChildRef:e,hasObservedChild:n,invalidChildWarning:r,shouldWarnAboutMissingDomRef:i}){let[a,o]=t.default.useState(null),s=t.default.useRef(null),c=t.default.useCallback(()=>{s.current=null,o(e=>e===null?e:null)},[]),l=t.default.useCallback(t=>{if(h(e,t),t===null){c();return}if(p(t)){s.current=t,o(e=>e===t?e:t);return}c(),f(`[react-atom-trigger] Child mode requires the child ref to resolve to a DOM element. Observation is disabled for this render.`)},[c,e]);return t.default.useEffect(()=>{if(typeof window>`u`||!(n&&!r&&!a&&i))return;let e=window.setTimeout(()=>{s.current||f(`[react-atom-trigger] Child mode expects a DOM element or a component that forwards its ref to a DOM element. Observation is disabled for this render.`)},16);return()=>{window.clearTimeout(e)}},[n,r,a,i]),{childNode:a,attachObservedChildRef:l}}function b(e){return Array.isArray(e)&&e.length===4&&e.every(e=>typeof e==`number`&&Number.isFinite(e))}function ee(e){return typeof e==`string`?e:b(e)?e.map(e=>`${Object.is(e,-0)?0:e}px`).join(` `):(e==null||f(`[react-atom-trigger] Invalid rootMargin array ${JSON.stringify(e)}. Use exactly four finite numbers: [top, right, bottom, left]. Falling back to 0px.`),`0px`)}function x(e,t){let n=e.trim();if(!n||/^[+-]?0(?:\.0+)?$/.test(n))return 0;let r=n.match(/^([+-]?(?:\d+\.?\d*|\.\d+))(px|%)$/);if(!r)return f(`[react-atom-trigger] Invalid rootMargin token "${n}". Use px, % or 0. Falling back to 0px.`),0;let[,i,a]=r,o=Number.parseFloat(i);return a===`%`?o/100*t:o}function S(e,t,n){let r=e.trim().split(/\s+/).filter(Boolean);if(r.length>4)return f(`[react-atom-trigger] Invalid rootMargin "${e}". Use 1 to 4 values in IntersectionObserver order. Falling back to 0px.`),{top:0,right:0,bottom:0,left:0};let[i=`0px`,a=i,o=i,s=a]=r;return{top:x(i,n),right:x(a,t),bottom:x(o,n),left:x(s,t)}}function C(e,t){let n=S(t,e.width,e.height);return new DOMRect(e.left-n.left,e.top-n.top,e.width+n.left+n.right,e.height+n.top+n.bottom)}function w(e){let t=e.width>0?e.width:1,n=e.height>0?e.height:1;return t===e.width&&n===e.height?e:new DOMRect(e.left,e.top,t,n)}function T(e,t){let n=Math.max(e.left,t.left),r=Math.max(e.top,t.top),i=Math.min(e.right,t.right),a=Math.min(e.bottom,t.bottom);return i<=n||a<=r?new DOMRect(0,0,0,0):new DOMRect(n,r,i-n,a-r)}function E(e,t){let n=e.width*e.height;return n<=0?0:t.width*t.height/n}function D(e){return Math.min(1,Math.max(0,e))}function te(e){return Array.isArray(e)?(f("[react-atom-trigger] `threshold` expects a single number in v2. Using the first finite numeric entry."),D(e.find(e=>typeof e==`number`&&Number.isFinite(e))??0)):e==null?0:typeof e!=`number`||!Number.isFinite(e)?(f("[react-atom-trigger] `threshold` must be a finite number between 0 and 1. Falling back to 0."),0):((e<0||e>1)&&f("[react-atom-trigger] `threshold` should be between 0 and 1. Values are clamped."),D(e))}function O(e,t){if(!e)return`unknown`;let n=t.left-e.left,r=t.top-e.top;return n===0&&r===0?`stationary`:Math.abs(r)>=Math.abs(n)?r<0?`up`:`down`:n<0?`left`:`right`}function k(e){if(e.isIntersecting)return`inside`;let t=e.boundingClientRect,n=e.rootBounds?.top??0,r=e.rootBounds?.bottom??window.innerHeight,i=e.rootBounds?.left??0,a=e.rootBounds?.right??window.innerWidth;return t.bottom<=n?`above`:t.top>=r?`below`:t.right<=i?`left`:t.left>=a?`right`:`outside`}function A(e,t,n,r){return!(n&&t.entered+t.left>0||r&&(e===`enter`&&t.entered>0||e===`leave`&&t.left>0))}function ne(e){return e.once?e.counts.entered+e.counts.left>0:e.oncePerDirection?e.counts.entered>0&&e.counts.left>0:!1}function j(e){e.previousTriggerActive=void 0,e.previousRect=null}function re(e,t,n,r){let i=w(e.node.getBoundingClientRect()),a=C(t,e.rootMargin),o=T(i,a),s=E(i,o),c=s>0,l=e.previousTriggerActive,u=l===!0||e.threshold===0?c:s>=e.threshold,d=e.previousRect&&(n===`root-change`||r)?`stationary`:O(e.previousRect,i);e.previousRect=i,e.previousTriggerActive=u;let f=Date.now(),p={target:e.node,rootBounds:a,boundingClientRect:i,intersectionRect:o,isIntersecting:c,intersectionRatio:s,source:`geometry`},m=l===void 0;if(m&&(!e.fireOnInitialVisible||!u)||l===u)return;let h=u?`enter`:`leave`;if(!A(h,e.counts,e.once,e.oncePerDirection))return;let g=h===`enter`?{...e.counts,entered:e.counts.entered+1}:{...e.counts,left:e.counts.left+1};e.counts=g;let _={type:h,isInitial:m,entry:p,counts:g,movementDirection:d,position:k(p),timestamp:f};e.onEvent?.(_),h===`enter`?e.onEnter?.(_):e.onLeave?.(_),ne(e)&&e.dispose?.()}let M=new WeakMap;function ie(){return new DOMRect(0,0,window.innerWidth,window.innerHeight)}function N(e){return e===window||m(e)}function ae(e){let t={registrations:new Set,rafId:0,pendingSampleCause:null,previousBaseRootBounds:null,resizeObserver:null,intersectionObserver:null,queueSample:()=>{},cleanup:()=>{}},n=()=>{if(t.rafId=0,t.registrations.size===0){t.pendingSampleCause=null;return}let n=t.pendingSampleCause??`geometry-change`;t.pendingSampleCause=null;let r=N(e)?ie():e.getBoundingClientRect(),i=t.previousBaseRootBounds!==null&&(t.previousBaseRootBounds.top!==r.top||t.previousBaseRootBounds.left!==r.left||t.previousBaseRootBounds.width!==r.width||t.previousBaseRootBounds.height!==r.height);for(let e of t.registrations)re(e,r,n,i);t.previousBaseRootBounds=new DOMRect(r.left,r.top,r.width,r.height)},r=(e=`geometry-change`)=>{if((t.pendingSampleCause===null||t.pendingSampleCause===`geometry-change`&&e!==`geometry-change`||t.pendingSampleCause===`root-change`&&e===`scroll`)&&(t.pendingSampleCause=e),t.rafId!==0)return;t.rafId=-1;let r=window.requestAnimationFrame(()=>{t.rafId=0,n()});t.rafId===-1&&(t.rafId=r)},i=()=>{r(`scroll`)},a=()=>{r(`root-change`)};return e.addEventListener(`scroll`,i,{passive:!0}),window.addEventListener(`resize`,a),typeof ResizeObserver<`u`&&(t.resizeObserver=new ResizeObserver(a),N(e)||t.resizeObserver.observe(e)),typeof IntersectionObserver<`u`&&(t.intersectionObserver=new IntersectionObserver(()=>{r(`geometry-change`)},{root:N(e)?null:e,rootMargin:`200% 200% 200% 200%`,threshold:0})),t.queueSample=r,t.cleanup=()=>{t.rafId!==0&&(cancelAnimationFrame(t.rafId),t.rafId=0),e.removeEventListener(`scroll`,i),window.removeEventListener(`resize`,a),t.resizeObserver?.disconnect(),t.intersectionObserver?.disconnect(),t.pendingSampleCause=null,t.previousBaseRootBounds=null},t}function oe(e){let t=M.get(e);if(t)return t;let n=ae(e);return M.set(e,n),n}function se(e,t){let n=oe(e),r=!1,i=t.node;n.registrations.add(t),n.resizeObserver?.observe(i),n.intersectionObserver?.observe(i),n.queueSample();let a=()=>{r||(r=!0,n.registrations.delete(t),n.resizeObserver?.unobserve(i),n.intersectionObserver?.unobserve(i),t.dispose=void 0,n.registrations.size===0&&(n.cleanup(),M.delete(e)))};return t.dispose=a,a}function ce(e,t){return{...e,...t,previousTriggerActive:void 0,previousRect:null,counts:{entered:0,left:0}}}function P(e,t){e.node=t.node,e.rootMargin=t.rootMargin,e.threshold=t.threshold,e.once=t.once,e.oncePerDirection=t.oncePerDirection,e.fireOnInitialVisible=t.fireOnInitialVisible}function le(e,t){e.onEnter=t.onEnter,e.onLeave=t.onLeave,e.onEvent=t.onEvent}function F(e){e.dispose?.(),e.dispose=null,e.binding=null}function ue(e){return{node:e.node,rootMargin:e.rootMargin,threshold:e.threshold,once:e.once,oncePerDirection:e.oncePerDirection,fireOnInitialVisible:e.fireOnInitialVisible}}function de(e,t){return!!(e&&e.node===t.node&&e.target===t.target&&e.rootMargin===t.rootMargin&&e.threshold===t.threshold&&e.once===t.once&&e.oncePerDirection===t.oncePerDirection&&e.fireOnInitialVisible===t.fireOnInitialVisible)}function I(e,t){return{registration:ce(e,t),binding:null,dispose:null}}function L(e,t){le(e.registration,t)}function R(e,t){let n=e.registration;if(!t.node){j(n),F(e);return}let r=ue({node:t.node,rootMargin:t.rootMargin,threshold:t.threshold,once:t.once,oncePerDirection:t.oncePerDirection,fireOnInitialVisible:t.fireOnInitialVisible});if(t.disabled||!t.target){F(e),P(n,r),j(n);return}let i={...r,target:t.target};if(de(e.binding,i)){P(n,r);return}j(n),F(e),P(n,r),e.dispose=se(t.target,n),e.binding=i}function z(e){F(e)}function B(e){let t=e.kind===`rootRef`?"[react-atom-trigger] `rootRef.current` must resolve to a real DOM element. Observation is paused until it does.":"[react-atom-trigger] `root` must be a real DOM element when provided. Observation is paused until it is.",{target:n}=e;return n==null?null:p(n)?n:(f(t),null)}function V(e){let n=e!==void 0,[r,i]=t.default.useState(()=>n?e.current:null);return t.default.useEffect(()=>{if(!n)return;let t=e.current;i(e=>e===t?e:t)}),n?r:void 0}function fe(e){switch(e.kind){case`rootRef`:case`root`:return B(e);case`viewport`:return typeof window>`u`?null:window}}let pe={display:`table`},me=({onEnter:e,onLeave:n,onEvent:r,children:i,once:a=!1,oncePerDirection:o=!1,fireOnInitialVisible:s=!1,disabled:c=!1,threshold:l=0,root:u,rootRef:d,rootMargin:p=`0px`,className:m})=>{let h=t.default.useRef(null),g=t.default.useRef(null),b=V(d),x=ee(p),S=te(l),C=i!=null,w=t.default.Children.count(i),T=w===1&&t.default.isValidElement(i)?i:null,E=v(C,w,T),D=E||!T?null:T,{childNode:O,attachObservedChildRef:k}=y({originalChildRef:_(D),hasObservedChild:C,invalidChildWarning:E,shouldWarnAboutMissingDomRef:D!==null});return t.default.useEffect(()=>{C&&m&&f("[react-atom-trigger] `className` only applies to the internal sentinel. In child mode, style the child element directly.")},[m,C]),t.default.useEffect(()=>{E&&f(E)},[E]),t.default.useEffect(()=>{a&&o&&f("[react-atom-trigger] `once` and `oncePerDirection` were both provided. `once` takes precedence.")},[a,o]),t.default.useEffect(()=>{let t=g.current;t&&L(t,{onEnter:e,onLeave:n,onEvent:r})},[e,n,r]),t.default.useEffect(()=>{if(typeof window>`u`)return;let t=C?O:h.current,i=fe(d===void 0?u===void 0?{kind:`viewport`}:{kind:`root`,target:u}:{kind:`rootRef`,target:b});if(!t){g.current&&R(g.current,{disabled:!1,node:null,target:i,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s});return}g.current||(g.current=I({node:t,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s},{onEnter:e,onLeave:n,onEvent:r})),R(g.current,{disabled:c,node:t,target:i,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s})},[c,x,S,a,o,s,O,u,d,b,C]),t.default.useEffect(()=>()=>{g.current&&(z(g.current),g.current=null)},[]),C?D?t.default.cloneElement(D,{ref:k}):t.default.createElement(t.default.Fragment,null,i):t.default.createElement(`div`,{ref:h,style:pe,className:m})},H=t.default.useSyncExternalStore,he=typeof window>`u`?t.default.useEffect:t.default.useLayoutEffect;function U(e,n,r){if(H)return H(e,n,r);let[i,a]=t.default.useState(()=>r()),o=t.default.useRef(i);return he(()=>{let t=()=>{let e=n();Object.is(o.current,e)||(o.current=e,a(e))};return t(),e(t)},[e,n]),i}function W(e,t,n){return n(e.current,t)?e.current:(e.current=t,t)}let G={x:0,y:0},K={width:0,height:0},ge=typeof window>`u`?t.default.useEffect:t.default.useLayoutEffect;function q(e,t){let n=null,r=null,i=()=>{n&&(clearTimeout(n),n=null),r=Date.now(),e()};return{schedule:()=>{if(t<=0){i();return}let e=Date.now();if(r===null||e-r>=t){i();return}n||(n=setTimeout(()=>{i()},t-(e-r)))},cancel:()=>{n&&(clearTimeout(n),n=null)}}}function J(){return typeof window>`u`?K:{width:window.innerWidth,height:window.innerHeight}}function Y(e){return!!(e&&typeof e==`object`&&!m(e)&&`current`in e)}function X(e){return Y(e)?e.current:e||(typeof window>`u`?null:window)}function _e(e){return e===window||m(e)}function Z(e){if(_e(e))return{x:e.scrollX,y:e.scrollY};let t=e;return{x:t.scrollLeft,y:t.scrollTop}}function ve(e){let t=X(e);return t?Z(t):G}function Q(e,t){return e.x===t.x&&e.y===t.y}function $(e,t){return e.width===t.width&&e.height===t.height}function ye(e){let n=e?.enabled!==!1,r=e?.passive,i=e?.throttleMs??16,a=t.default.useRef(J()),o=t.default.useCallback(()=>typeof window>`u`?K:n?W(a,J(),$):a.current,[n]);return U(t.default.useCallback(e=>{if(typeof window>`u`||!n)return()=>{};let t=q(()=>{let t=J();$(a.current,t)||(a.current=t,e())},i);return window.addEventListener(`resize`,t.schedule,{passive:r}),()=>{t.cancel(),window.removeEventListener(`resize`,t.schedule)}},[n,r,i]),o,()=>K)}function be(e){let n=e?.target,r=Y(n),i=e?.enabled!==!1,a=e?.passive,o=e?.throttleMs??16,s=t.default.useRef(ve(n)),[c,l]=t.default.useState(()=>r?X(n):null);ge(()=>{if(!r)return;let e=X(n);l(t=>t===e?t:e)});let u=r?c:X(n),d=t.default.useCallback(()=>i?u?W(s,Z(u),Q):W(s,G,Q):s.current,[i,u]);return U(t.default.useCallback(e=>{if(!i||!u)return()=>{};let t=q(()=>{let t=Z(u);Q(s.current,t)||(s.current=t,e())},o);return u.addEventListener(`scroll`,t.schedule,{passive:a}),()=>{t.cancel(),u.removeEventListener(`scroll`,t.schedule)}},[i,a,u,o]),d,()=>G)}e.AtomTrigger=me,e.useScrollPosition=be,e.useViewportSize=ye});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`react`)):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.reactAtomTrigger={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e};t=((e,t,i)=>(i=e==null?{}:n(o(e)),c(t||!e||!e.__esModule?r(i,`default`,{value:e,enumerable:!0}):i,e)))(t);function l(e){return!!(e&&typeof e==`object`&&`nodeType`in e&&e.nodeType===1&&`getBoundingClientRect`in e&&typeof e.getBoundingClientRect==`function`&&`addEventListener`in e&&typeof e.addEventListener==`function`&&`removeEventListener`in e&&typeof e.removeEventListener==`function`)}function u(e){return!!(e&&typeof e==`object`&&`window`in e&&e.window===e)}function d(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function f(e){if(!e||typeof e!=`object`&&typeof e!=`function`)return;let t=Object.getOwnPropertyDescriptor(e,`ref`);if(!(!t||!(`value`in t)))return t.value}function p(e){if(!e)return;let t=f(e.props);return t===void 0?f(e):t}function m(e,n,r){return e?n===1?r?r.type===t.default.Fragment?`fragmentChild`:null:`invalidChildElement`:`invalidChildCount`:null}function h({originalChildRef:e,hasObservedChild:n,invalidChildWarning:r,shouldWarnAboutMissingDomRef:i}){let[a,o]=t.default.useState(null),s=t.default.useRef(null),c=t.default.useCallback(()=>{s.current=null,o(e=>e===null?e:null)},[]),u=t.default.useCallback(t=>{if(d(e,t),t===null){c();return}if(l(t)){s.current=t,o(e=>e===t?e:t);return}c()},[c,e]);return t.default.useEffect(()=>{if(typeof window>`u`||!(n&&!r&&!a&&i))return;let e=window.setTimeout(()=>{s.current},16);return()=>{window.clearTimeout(e)}},[n,r,a,i]),{childNode:a,attachObservedChildRef:u}}function g(e){return Array.isArray(e)&&e.length===4&&e.every(e=>typeof e==`number`&&Number.isFinite(e))}function _(e){return typeof e==`string`?e:g(e)?e.map(e=>`${Object.is(e,-0)?0:e}px`).join(` `):`0px`}function v(e,t){let n=e.trim();if(/^[+-]?0(?:\.0+)?$/.test(n))return 0;let r=n.match(/^([+-]?(?:\d+\.?\d*|\.\d+))(px|%)$/);if(!r)return 0;let[,i,a]=r,o=Number.parseFloat(i);return a===`%`?o/100*t:o}function y(e,t,n){let r=e.trim().split(/\s+/).filter(Boolean);if(r.length>4)return{top:0,right:0,bottom:0,left:0};let[i=`0px`,a=i,o=i,s=a]=r;return{top:v(i,n),right:v(a,t),bottom:v(o,n),left:v(s,t)}}function b(e,t){let n=y(t,e.width,e.height);return new DOMRect(e.left-n.left,e.top-n.top,e.width+n.left+n.right,e.height+n.top+n.bottom)}function x(e){let t=e.width>0?e.width:1,n=e.height>0?e.height:1;return t===e.width&&n===e.height?e:new DOMRect(e.left,e.top,t,n)}function S(e,t){let n=Math.max(e.left,t.left),r=Math.max(e.top,t.top),i=Math.min(e.right,t.right),a=Math.min(e.bottom,t.bottom);return i<=n||a<=r?new DOMRect(0,0,0,0):new DOMRect(n,r,i-n,a-r)}function C(e,t){let n=e.width*e.height;return n<=0?0:t.width*t.height/n}function w(e){return Math.min(1,Math.max(0,e))}function T(e){return Array.isArray(e)?w(e.find(e=>typeof e==`number`&&Number.isFinite(e))??0):e==null||typeof e!=`number`||!Number.isFinite(e)?0:w(e)}function E(e,t){if(!e)return`unknown`;let n=t.left-e.left,r=t.top-e.top;return n===0&&r===0?`stationary`:Math.abs(r)>=Math.abs(n)?r<0?`up`:`down`:n<0?`left`:`right`}function D(e){if(e.isIntersecting)return`inside`;let t=e.boundingClientRect,n=e.rootBounds?.top??0,r=e.rootBounds?.bottom??window.innerHeight,i=e.rootBounds?.left??0,a=e.rootBounds?.right??window.innerWidth;return t.bottom<=n?`above`:t.top>=r?`below`:t.right<=i?`left`:t.left>=a?`right`:`outside`}function O(e,t,n,r){return!(n&&t.entered+t.left>0||r&&(e===`enter`&&t.entered>0||e===`leave`&&t.left>0))}function k(e){return e.once?e.counts.entered+e.counts.left>0:e.oncePerDirection?e.counts.entered>0&&e.counts.left>0:!1}function A(e){e.previousTriggerActive=void 0,e.previousRect=null}function ee(e,t,n,r){let i=x(e.node.getBoundingClientRect()),a=b(t,e.rootMargin),o=S(i,a),s=C(i,o),c=s>0,l=e.previousTriggerActive,u=l===!0||e.threshold===0?c:s>=e.threshold,d=e.previousRect&&(n===`root-change`||r)?`stationary`:E(e.previousRect,i);e.previousRect=i,e.previousTriggerActive=u;let f=Date.now(),p={target:e.node,rootBounds:a,boundingClientRect:i,intersectionRect:o,isIntersecting:c,intersectionRatio:s,source:`geometry`},m=l===void 0;if(m&&(!e.fireOnInitialVisible||!u)||l===u)return;let h=u?`enter`:`leave`;if(!O(h,e.counts,e.once,e.oncePerDirection))return;let g=h===`enter`?{...e.counts,entered:e.counts.entered+1}:{...e.counts,left:e.counts.left+1};e.counts=g;let _={type:h,isInitial:m,entry:p,counts:g,movementDirection:d,position:D(p),timestamp:f};e.onEvent?.(_),h===`enter`?e.onEnter?.(_):e.onLeave?.(_),k(e)&&e.dispose?.()}let j=new WeakMap;function M(){return new DOMRect(0,0,window.innerWidth,window.innerHeight)}function N(e){return e===window||u(e)}function P(e){let t={registrations:new Set,rafId:0,pendingSampleCause:null,previousBaseRootBounds:null,resizeObserver:null,intersectionObserver:null,queueSample:()=>{},cleanup:()=>{}},n=()=>{if(t.rafId=0,t.registrations.size===0){t.pendingSampleCause=null;return}let n=t.pendingSampleCause??`geometry-change`;t.pendingSampleCause=null;let r=N(e)?M():e.getBoundingClientRect(),i=t.previousBaseRootBounds!==null&&(t.previousBaseRootBounds.top!==r.top||t.previousBaseRootBounds.left!==r.left||t.previousBaseRootBounds.width!==r.width||t.previousBaseRootBounds.height!==r.height);for(let e of t.registrations)ee(e,r,n,i);t.previousBaseRootBounds=new DOMRect(r.left,r.top,r.width,r.height)},r=(e=`geometry-change`)=>{(t.pendingSampleCause===null||t.pendingSampleCause===`geometry-change`&&e!==`geometry-change`||t.pendingSampleCause===`root-change`&&e===`scroll`)&&(t.pendingSampleCause=e),t.rafId===0&&(t.rafId=window.requestAnimationFrame(()=>{t.rafId=0,n()}))},i=()=>{r(`scroll`)},a=()=>{r(`root-change`)};return e.addEventListener(`scroll`,i,{passive:!0}),window.addEventListener(`resize`,a),typeof ResizeObserver<`u`&&(t.resizeObserver=new ResizeObserver(a),N(e)||t.resizeObserver.observe(e)),typeof IntersectionObserver<`u`&&(t.intersectionObserver=new IntersectionObserver(()=>{r(`geometry-change`)},{root:N(e)?null:e,rootMargin:`200% 200% 200% 200%`,threshold:0})),t.queueSample=r,t.cleanup=()=>{t.rafId!==0&&(cancelAnimationFrame(t.rafId),t.rafId=0),e.removeEventListener(`scroll`,i),window.removeEventListener(`resize`,a),t.resizeObserver?.disconnect(),t.intersectionObserver?.disconnect(),t.pendingSampleCause=null,t.previousBaseRootBounds=null},t}function F(e){let t=j.get(e);if(t)return t;let n=P(e);return j.set(e,n),n}function I(e,t){let n=F(e),r=!1,i=t.node;n.registrations.add(t),n.resizeObserver?.observe(i),n.intersectionObserver?.observe(i),n.queueSample();let a=()=>{r||(r=!0,n.registrations.delete(t),n.resizeObserver?.unobserve(i),n.intersectionObserver?.unobserve(i),t.dispose=void 0,n.registrations.size===0&&(n.cleanup(),j.delete(e)))};return t.dispose=a,a}function L(e,t){return{...e,...t,previousTriggerActive:void 0,previousRect:null,counts:{entered:0,left:0}}}function R(e){e.dispose?.(),e.dispose=null,e.binding=null}function te(e,t){return{registration:L(e,t),binding:null,dispose:null}}function ne(e,t){e.registration.onEnter=t.onEnter,e.registration.onLeave=t.onLeave,e.registration.onEvent=t.onEvent}function z(e,t){let n=e.registration;if(!t.node){A(n),R(e);return}let r={node:t.node,rootMargin:t.rootMargin,threshold:t.threshold,once:t.once,oncePerDirection:t.oncePerDirection,fireOnInitialVisible:t.fireOnInitialVisible};if(t.disabled||!t.target){R(e),Object.assign(n,r),A(n);return}let i={...r,target:t.target};if(e.binding!==null&&e.binding.node===i.node&&e.binding.target===i.target&&e.binding.rootMargin===i.rootMargin&&e.binding.threshold===i.threshold&&e.binding.once===i.once&&e.binding.oncePerDirection===i.oncePerDirection&&e.binding.fireOnInitialVisible===i.fireOnInitialVisible){Object.assign(n,r);return}A(n),R(e),Object.assign(n,r),e.dispose=I(t.target,n),e.binding=i}function re(e){R(e)}function ie(e){e.kind;let{target:t}=e;return t==null?null:l(t)?t:null}function ae(e){let n=e!==void 0,[r,i]=t.default.useState(()=>n?e.current:null);return t.default.useEffect(()=>{if(!n)return;let t=e.current;i(e=>e===t?e:t)}),n?r:void 0}function oe(e){switch(e.kind){case`rootRef`:case`root`:return ie(e);case`viewport`:return typeof window>`u`?null:window}}let B={display:`table`},V=({onEnter:e,onLeave:n,onEvent:r,children:i,once:a=!1,oncePerDirection:o=!1,fireOnInitialVisible:s=!1,disabled:c=!1,threshold:l=0,root:u,rootRef:d,rootMargin:f=`0px`,className:g})=>{let v=t.default.useRef(null),y=t.default.useRef(null),b=ae(d),x=_(f),S=T(l),C=i!=null,w=t.default.Children.count(i),E=w===1&&t.default.isValidElement(i)?i:null,D=m(C,w,E),O=D||!E?null:E,{childNode:k,attachObservedChildRef:A}=h({originalChildRef:p(O),hasObservedChild:C,invalidChildWarning:D,shouldWarnAboutMissingDomRef:O!==null});return t.default.useEffect(()=>{},[g,C]),t.default.useEffect(()=>{},[D]),t.default.useEffect(()=>{},[a,o]),t.default.useEffect(()=>{let t=y.current;t&&ne(t,{onEnter:e,onLeave:n,onEvent:r})},[e,n,r]),t.default.useEffect(()=>{if(typeof window>`u`)return;let t=C?k:v.current,i=oe(d===void 0?u===void 0?{kind:`viewport`}:{kind:`root`,target:u}:{kind:`rootRef`,target:b});if(!t){y.current&&z(y.current,{disabled:!1,node:null,target:i,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s});return}y.current||(y.current=te({node:t,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s},{onEnter:e,onLeave:n,onEvent:r})),z(y.current,{disabled:c,node:t,target:i,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s})},[c,x,S,a,o,s,k,u,d,b,C]),t.default.useEffect(()=>()=>{y.current&&(re(y.current),y.current=null)},[]),C?O?t.default.cloneElement(O,{ref:A}):t.default.createElement(t.default.Fragment,null,i):t.default.createElement(`div`,{ref:v,style:B,className:g})};function H(e,n,r){let i=t.default.useSyncExternalStore;if(i)return i(e,n,r);let[a,o]=t.default.useState(()=>r()),s=t.default.useRef(a);return(typeof window>`u`?t.default.useEffect:t.default.useLayoutEffect)(()=>{let t=()=>{let e=n();Object.is(s.current,e)||(s.current=e,o(e))};return t(),e(t)},[e,n]),a}function U(e,t,n){return n(e.current,t)?e.current:(e.current=t,t)}let W={x:0,y:0},G={width:0,height:0};function K(e,t){let n=null,r=null,i=()=>{n&&(clearTimeout(n),n=null),r=Date.now(),e()};return{schedule:()=>{if(t<=0){i();return}let e=Date.now();if(r===null||e-r>=t){i();return}n||(n=setTimeout(()=>{i()},t-(e-r)))},cancel:()=>{n&&(clearTimeout(n),n=null)}}}function q(){return typeof window>`u`?G:{width:window.innerWidth,height:window.innerHeight}}function J(e){return!!(e&&typeof e==`object`&&!u(e)&&`current`in e)}function Y(e){return J(e)?e.current:e||(typeof window>`u`?null:window)}function X(e){return e===window||u(e)}function Z(e){if(X(e))return{x:e.scrollX,y:e.scrollY};let t=e;return{x:t.scrollLeft,y:t.scrollTop}}function se(e){let t=Y(e);return t?Z(t):W}function Q(e,t){return e.x===t.x&&e.y===t.y}function $(e,t){return e.width===t.width&&e.height===t.height}function ce(e){let n=e?.enabled!==!1,r=e?.passive,i=e?.throttleMs??16,a=t.default.useRef(q()),o=t.default.useCallback(()=>typeof window>`u`?G:n?U(a,q(),$):a.current,[n]);return H(t.default.useCallback(e=>{if(typeof window>`u`||!n)return()=>{};let t=K(()=>{let t=q();$(a.current,t)||(a.current=t,e())},i);return window.addEventListener(`resize`,t.schedule,{passive:r}),()=>{t.cancel(),window.removeEventListener(`resize`,t.schedule)}},[n,r,i]),o,()=>G)}function le(e){let n=e?.target,r=J(n),i=e?.enabled!==!1,a=e?.passive,o=e?.throttleMs??16,s=t.default.useRef(se(n)),[c,l]=t.default.useState(()=>r?Y(n):null);(typeof window>`u`?t.default.useEffect:t.default.useLayoutEffect)(()=>{if(!r)return;let e=Y(n);l(t=>t===e?t:e)});let u=r?c:Y(n),d=t.default.useCallback(()=>i?u?U(s,Z(u),Q):U(s,W,Q):s.current,[i,u]);return H(t.default.useCallback(e=>{if(!i||!u)return()=>{};let t=K(()=>{let t=Z(u);Q(s.current,t)||(s.current=t,e())},o);return u.addEventListener(`scroll`,t.schedule,{passive:a}),()=>{t.cancel(),u.removeEventListener(`scroll`,t.schedule)}},[i,a,u,o]),d,()=>W)}e.AtomTrigger=V,e.useScrollPosition=le,e.useViewportSize=ce});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-atom-trigger",
-  "version": "2.0.6",
+  "version": "2.0.8",
   "description": "Geometry-based scroll trigger for React with precise enter/leave control. A modern alternative to react-waypoint.",
   "keywords": [
     "intersection",
@@ -26,6 +26,7 @@
     "MIGRATION.md"
   ],
   "type": "module",
+  "sideEffects": false,
   "main": "./lib/index.js",
   "module": "./lib/index.js",
   "types": "./lib/index.d.ts",