react-atom-trigger 2.0.9 → 2.0.11

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.
Files changed (3) hide show
  1. package/lib/index.js +1 -1
  2. package/lib/index.umd.js +1 -1
  3. package/package.json +1 -1
package/lib/index.js CHANGED
@@ -1 +1 @@
1
- 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};
1
+ import e from"react";const t={invalidChildCount:`[react-atom-trigger] Child mode expects exactly one top-level React element. Observation is disabled for this render.`,invalidChildElement:`[react-atom-trigger] Child mode expects a React element child. Observation is disabled for this render.`,unsupportedChildRef:`[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.`,fragmentChild:`[react-atom-trigger] Child mode does not support React.Fragment. Wrap the content in a single DOM element. Observation is disabled for this render.`,nonDomChildRef:`[react-atom-trigger] Child mode requires the child ref to resolve to a DOM element. Observation is disabled for this render.`,childModeClassName:"[react-atom-trigger] `className` only applies to the internal sentinel. In child mode, style the child element directly.",conflictingOnceModes:"[react-atom-trigger] `once` and `oncePerDirection` were both provided. `once` takes precedence.",invalidRoot:"[react-atom-trigger] `root` must be a real DOM element when provided. Observation is paused until it is.",invalidRootRef:"[react-atom-trigger] `rootRef.current` must resolve to a real DOM element. Observation is paused until it does."};function n(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 r(e){return!!(e&&typeof e==`object`&&`window`in e&&e.window===e)}function i(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function a(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 o(e){if(!e)return;let t=a(e.props);return t===void 0?a(e):t}function s(n,r,i){return n?r===1?i?i.type===e.Fragment?t.fragmentChild:null:t.invalidChildElement:t.invalidChildCount:null}function c({originalChildRef:t,hasObservedChild:r,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(i(t,e),e===null){u();return}if(n(e)){l.current=e,c(t=>t===e?t:e);return}u()},[u,t]);return e.useEffect(()=>{if(typeof window>`u`||!(r&&!a&&!s&&o))return;let e=window.setTimeout(()=>{l.current},16);return()=>{window.clearTimeout(e)}},[r,a,s,o]),{childNode:s,attachObservedChildRef:d}}function l(e){return Array.isArray(e)&&e.length===4&&e.every(e=>typeof e==`number`&&Number.isFinite(e))}function u(e){return typeof e==`string`?e:l(e)?e.map(e=>`${Object.is(e,-0)?0:e}px`).join(` `):`0px`}function d(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 f(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:d(i,n),right:d(a,t),bottom:d(o,n),left:d(s,t)}}function p(e,t){let n=f(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 m(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 h(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 g(e,t){let n=e.width*e.height;return n<=0?0:t.width*t.height/n}function _(e){return Math.min(1,Math.max(0,e))}function v(e){return Array.isArray(e)?_(e.find(e=>typeof e==`number`&&Number.isFinite(e))??0):e==null||typeof e!=`number`||!Number.isFinite(e)?0:_(e)}function y(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 b(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 x(e,t,n,r){return!(n&&t.entered+t.left>0||r&&(e===`enter`&&t.entered>0||e===`leave`&&t.left>0))}function S(e){return e.once?e.counts.entered+e.counts.left>0:e.oncePerDirection?e.counts.entered>0&&e.counts.left>0:!1}function C(e){e.previousTriggerActive=void 0,e.previousRect=null}function w(e,t,n,r){let i=m(e.node.getBoundingClientRect()),a=p(t,e.rootMargin),o=h(i,a),s=g(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`:y(e.previousRect,i);e.previousRect=i,e.previousTriggerActive=u;let f=Date.now(),_={target:e.node,rootBounds:a,boundingClientRect:i,intersectionRect:o,isIntersecting:c,intersectionRatio:s,source:`geometry`},v=l===void 0;if(v&&(!e.fireOnInitialVisible||!u)||l===u)return;let C=u?`enter`:`leave`;if(!x(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:v,entry:_,counts:w,movementDirection:d,position:b(_),timestamp:f};e.onEvent?.(T),C===`enter`?e.onEnter?.(T):e.onLeave?.(T),S(e)&&e.unsubscribe?.()}const T=new WeakMap;function E(){return new DOMRect(0,0,window.innerWidth,window.innerHeight)}function D(e){return e===window||r(e)}function O(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=D(e)?E():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)w(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),D(e)||t.resizeObserver.observe(e)),typeof IntersectionObserver<`u`&&(t.intersectionObserver=new IntersectionObserver(()=>{r(`geometry-change`)},{root:D(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 k(e){let t=T.get(e);if(t)return t;let n=O(e);return T.set(e,n),n}function A(e,t){let n=k(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.unsubscribe=void 0,n.registrations.size===0&&(n.cleanup(),T.delete(e)))};return t.unsubscribe=a,a}function j(e,t){return{...e,...t,previousTriggerActive:void 0,previousRect:null,counts:{entered:0,left:0}}}function M(e){e.unsubscribe?.(),e.unsubscribe=null,e.subscription=null}function N(e,t){return{registration:j(e,t),subscription:null,unsubscribe:null}}function P(e,t){e.registration.onEnter=t.onEnter,e.registration.onLeave=t.onLeave,e.registration.onEvent=t.onEvent}function F(e,t){let n=e.registration;if(!t.node){C(n),M(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){M(e),Object.assign(n,r),C(n);return}let i={...r,target:t.target};if(e.subscription!==null&&e.subscription.node===i.node&&e.subscription.target===i.target&&e.subscription.rootMargin===i.rootMargin&&e.subscription.threshold===i.threshold&&e.subscription.once===i.once&&e.subscription.oncePerDirection===i.oncePerDirection&&e.subscription.fireOnInitialVisible===i.fireOnInitialVisible){Object.assign(n,r);return}C(n),M(e),Object.assign(n,r),e.unsubscribe=A(t.target,n),e.subscription=i}function I(e){M(e)}function L(e){e.kind===`rootRef`?t.invalidRootRef:t.invalidRoot;let{target:r}=e;return r==null?null:n(r)?r:null}function R(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 z(e){switch(e.kind){case`rootRef`:case`root`:return L(e);case`viewport`:return typeof window>`u`?null:window}}const B={display:`table`},V=({onEnter:t,onLeave:n,onEvent:r,children:i,once:a=!1,oncePerDirection:l=!1,fireOnInitialVisible:d=!1,disabled:f=!1,threshold:p=0,root:m,rootRef:h,rootMargin:g=`0px`,className:_})=>{let y=e.useRef(null),b=e.useRef(null),x=R(h),S=u(g),C=v(p),w=i!=null,T=e.Children.count(i),E=T===1&&e.isValidElement(i)?i:null,D=s(w,T,E),O=D||!E?null:E,{childNode:k,attachObservedChildRef:A}=c({originalChildRef:o(O),hasObservedChild:w,invalidChildWarning:D,shouldWarnAboutMissingDomRef:O!==null});return e.useEffect(()=>{},[_,w]),e.useEffect(()=>{},[D]),e.useEffect(()=>{},[a,l]),e.useEffect(()=>{let e=b.current;e&&P(e,{onEnter:t,onLeave:n,onEvent:r})},[t,n,r]),e.useEffect(()=>{if(typeof window>`u`)return;let e=w?k:y.current,i=z(h===void 0?m===void 0?{kind:`viewport`}:{kind:`root`,target:m}:{kind:`rootRef`,target:x});if(!e){b.current&&F(b.current,{disabled:!1,node:null,target:i,rootMargin:S,threshold:C,once:a,oncePerDirection:l,fireOnInitialVisible:d});return}b.current||(b.current=N({node:e,rootMargin:S,threshold:C,once:a,oncePerDirection:l,fireOnInitialVisible:d},{onEnter:t,onLeave:n,onEvent:r})),F(b.current,{disabled:f,node:e,target:i,rootMargin:S,threshold:C,once:a,oncePerDirection:l,fireOnInitialVisible:d})},[f,S,C,a,l,d,k,m,h,x,w]),e.useEffect(()=>()=>{b.current&&(I(b.current),b.current=null)},[]),w?O?e.cloneElement(O,{ref:A}):e.createElement(e.Fragment,null,i):e.createElement(`div`,{ref:y,style:B,className:_})};function H(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 U(e,t,n){return n(e.current,t)?e.current:(e.current=t,t)}const 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`&&!r(e)&&`current`in e)}function Y(e){return J(e)?e.current:e||(typeof window>`u`?null:window)}function X(e){return e===window||r(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 ee(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 te(t){let n=t?.enabled!==!1,r=t?.passive,i=t?.throttleMs??16,a=e.useRef(q()),o=e.useCallback(()=>typeof window>`u`?G:n?U(a,q(),$):a.current,[n]);return H(e.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 ne(t){let n=t?.target,r=J(n),i=t?.enabled!==!1,a=t?.passive,o=t?.throttleMs??16,s=e.useRef(ee(n)),[c,l]=e.useState(()=>r?Y(n):null);(typeof window>`u`?e.useEffect:e.useLayoutEffect)(()=>{if(!r)return;let e=Y(n);l(t=>t===e?t:e)});let u=r?c:Y(n),d=e.useCallback(()=>i?u?U(s,Z(u),Q):U(s,W,Q):s.current,[i,u]);return H(e.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)}export{V as AtomTrigger,ne as useScrollPosition,te as useViewportSize};
package/lib/index.umd.js CHANGED
@@ -1 +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);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});
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={invalidChildCount:`[react-atom-trigger] Child mode expects exactly one top-level React element. Observation is disabled for this render.`,invalidChildElement:`[react-atom-trigger] Child mode expects a React element child. Observation is disabled for this render.`,unsupportedChildRef:`[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.`,fragmentChild:`[react-atom-trigger] Child mode does not support React.Fragment. Wrap the content in a single DOM element. Observation is disabled for this render.`,nonDomChildRef:`[react-atom-trigger] Child mode requires the child ref to resolve to a DOM element. Observation is disabled for this render.`,childModeClassName:"[react-atom-trigger] `className` only applies to the internal sentinel. In child mode, style the child element directly.",conflictingOnceModes:"[react-atom-trigger] `once` and `oncePerDirection` were both provided. `once` takes precedence.",invalidRoot:"[react-atom-trigger] `root` must be a real DOM element when provided. Observation is paused until it is.",invalidRootRef:"[react-atom-trigger] `rootRef.current` must resolve to a real DOM element. Observation is paused until it does."};function u(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 d(e){return!!(e&&typeof e==`object`&&`window`in e&&e.window===e)}function f(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function p(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 m(e){if(!e)return;let t=p(e.props);return t===void 0?p(e):t}function h(e,n,r){return e?n===1?r?r.type===t.default.Fragment?l.fragmentChild:null:l.invalidChildElement:l.invalidChildCount:null}function g({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(f(e,t),t===null){c();return}if(u(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:l}}function _(e){return Array.isArray(e)&&e.length===4&&e.every(e=>typeof e==`number`&&Number.isFinite(e))}function v(e){return typeof e==`string`?e:_(e)?e.map(e=>`${Object.is(e,-0)?0:e}px`).join(` `):`0px`}function y(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 b(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:y(i,n),right:y(a,t),bottom:y(o,n),left:y(s,t)}}function x(e,t){let n=b(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 S(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 C(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 w(e,t){let n=e.width*e.height;return n<=0?0:t.width*t.height/n}function T(e){return Math.min(1,Math.max(0,e))}function ee(e){return Array.isArray(e)?T(e.find(e=>typeof e==`number`&&Number.isFinite(e))??0):e==null||typeof e!=`number`||!Number.isFinite(e)?0:T(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 te(e,t,n,r){let i=S(e.node.getBoundingClientRect()),a=x(t,e.rootMargin),o=C(i,a),s=w(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.unsubscribe?.()}let j=new WeakMap;function M(){return new DOMRect(0,0,window.innerWidth,window.innerHeight)}function N(e){return e===window||d(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)te(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 ne(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.unsubscribe=void 0,n.registrations.size===0&&(n.cleanup(),j.delete(e)))};return t.unsubscribe=a,a}function re(e,t){return{...e,...t,previousTriggerActive:void 0,previousRect:null,counts:{entered:0,left:0}}}function I(e){e.unsubscribe?.(),e.unsubscribe=null,e.subscription=null}function ie(e,t){return{registration:re(e,t),subscription:null,unsubscribe:null}}function ae(e,t){e.registration.onEnter=t.onEnter,e.registration.onLeave=t.onLeave,e.registration.onEvent=t.onEvent}function L(e,t){let n=e.registration;if(!t.node){A(n),I(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){I(e),Object.assign(n,r),A(n);return}let i={...r,target:t.target};if(e.subscription!==null&&e.subscription.node===i.node&&e.subscription.target===i.target&&e.subscription.rootMargin===i.rootMargin&&e.subscription.threshold===i.threshold&&e.subscription.once===i.once&&e.subscription.oncePerDirection===i.oncePerDirection&&e.subscription.fireOnInitialVisible===i.fireOnInitialVisible){Object.assign(n,r);return}A(n),I(e),Object.assign(n,r),e.unsubscribe=ne(t.target,n),e.subscription=i}function oe(e){I(e)}function se(e){e.kind===`rootRef`?l.invalidRootRef:l.invalidRoot;let{target:t}=e;return t==null?null:u(t)?t:null}function R(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 z(e){switch(e.kind){case`rootRef`:case`root`:return se(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:p})=>{let _=t.default.useRef(null),y=t.default.useRef(null),b=R(d),x=v(f),S=ee(l),C=i!=null,w=t.default.Children.count(i),T=w===1&&t.default.isValidElement(i)?i:null,E=h(C,w,T),D=E||!T?null:T,{childNode:O,attachObservedChildRef:k}=g({originalChildRef:m(D),hasObservedChild:C,invalidChildWarning:E,shouldWarnAboutMissingDomRef:D!==null});return t.default.useEffect(()=>{},[p,C]),t.default.useEffect(()=>{},[E]),t.default.useEffect(()=>{},[a,o]),t.default.useEffect(()=>{let t=y.current;t&&ae(t,{onEnter:e,onLeave:n,onEvent:r})},[e,n,r]),t.default.useEffect(()=>{if(typeof window>`u`)return;let t=C?O:_.current,i=z(d===void 0?u===void 0?{kind:`viewport`}:{kind:`root`,target:u}:{kind:`rootRef`,target:b});if(!t){y.current&&L(y.current,{disabled:!1,node:null,target:i,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s});return}y.current||(y.current=ie({node:t,rootMargin:x,threshold:S,once:a,oncePerDirection:o,fireOnInitialVisible:s},{onEnter:e,onLeave:n,onEvent:r})),L(y.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(()=>()=>{y.current&&(oe(y.current),y.current=null)},[]),C?D?t.default.cloneElement(D,{ref:k}):t.default.createElement(t.default.Fragment,null,i):t.default.createElement(`div`,{ref:_,style:B,className:p})};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`&&!d(e)&&`current`in e)}function Y(e){return J(e)?e.current:e||(typeof window>`u`?null:window)}function ce(e){return e===window||d(e)}function X(e){if(ce(e))return{x:e.scrollX,y:e.scrollY};let t=e;return{x:t.scrollLeft,y:t.scrollTop}}function le(e){let t=Y(e);return t?X(t):W}function Z(e,t){return e.x===t.x&&e.y===t.y}function Q(e,t){return e.width===t.width&&e.height===t.height}function $(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(),Q):a.current,[n]);return H(t.default.useCallback(e=>{if(typeof window>`u`||!n)return()=>{};let t=K(()=>{let t=q();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 ue(e){let n=e?.target,r=J(n),i=e?.enabled!==!1,a=e?.passive,o=e?.throttleMs??16,s=t.default.useRef(le(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,X(u),Z):U(s,W,Z):s.current,[i,u]);return H(t.default.useCallback(e=>{if(!i||!u)return()=>{};let t=K(()=>{let t=X(u);Z(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=ue,e.useViewportSize=$});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-atom-trigger",
3
- "version": "2.0.9",
3
+ "version": "2.0.11",
4
4
  "description": "Geometry-based scroll trigger for React with precise enter/leave control. A modern alternative to react-waypoint.",
5
5
  "keywords": [
6
6
  "intersection",