@koine/react 2.0.0-beta.132 → 2.0.0-beta.134

package/useIsomorphicLayoutEffect.cjs.js

@@ -5,9 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var react = require('react');
 var utils = require('@koine/utils');
 
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useIsomorphicLayoutEffect.ts)
- */let useIsomorphicLayoutEffect=utils.isBrowser?react.useLayoutEffect:react.useEffect;
+let useIsomorphicLayoutEffect=utils.isBrowser?react.useLayoutEffect:react.useEffect;
 
 exports.default = useIsomorphicLayoutEffect;
 exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;

package/useIsomorphicLayoutEffect.d.ts

@@ -1,3 +1,6 @@
 import { useLayoutEffect } from "react";
+/**
+ * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useIsomorphicLayoutEffect.ts)
+ */
 export declare let useIsomorphicLayoutEffect: typeof useLayoutEffect;
 export default useIsomorphicLayoutEffect;

package/useIsomorphicLayoutEffect.esm.js

@@ -1,8 +1,6 @@
 import { useLayoutEffect, useEffect } from 'react';
 import { isBrowser } from '@koine/utils';
 
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useIsomorphicLayoutEffect.ts)
- */let useIsomorphicLayoutEffect=isBrowser?useLayoutEffect:useEffect;
+let useIsomorphicLayoutEffect=isBrowser?useLayoutEffect:useEffect;
 
 export { useIsomorphicLayoutEffect as default, useIsomorphicLayoutEffect };

package/useKeyUp.cjs.js

@@ -5,12 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var react = require('react');
 var dom = require('@koine/dom');
 
-let useKeyUp=(o,r=[])=>{react.useEffect(()=>dom.on(window,"keyup",e=>{// const { key } = event;
-    // be sure we do not intercept keys combinations maybe used for other
-    // actions like native browser navigation shortcuts
-    // @see https://stackoverflow.com/a/37559790/1938970
-    e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),// eslint-disable-next-line react-hooks/exhaustive-deps
-[o,...r]);};
+let useKeyUp=(o,r=[])=>{react.useEffect(()=>dom.on(window,"keyup",e=>{e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),[o,...r]);};
 
 exports.default = useKeyUp;
 exports.useKeyUp = useKeyUp;

package/useKeyUp.esm.js

@@ -1,11 +1,6 @@
 import { useEffect } from 'react';
 import { on } from '@koine/dom';
 
-let useKeyUp=(o,r=[])=>{useEffect(()=>on(window,"keyup",e=>{// const { key } = event;
-    // be sure we do not intercept keys combinations maybe used for other
-    // actions like native browser navigation shortcuts
-    // @see https://stackoverflow.com/a/37559790/1938970
-    e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),// eslint-disable-next-line react-hooks/exhaustive-deps
-[o,...r]);};
+let useKeyUp=(o,r=[])=>{useEffect(()=>on(window,"keyup",e=>{e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),[o,...r]);};
 
 export { useKeyUp as default, useKeyUp };

package/useMeasure.cjs.js

@@ -6,39 +6,7 @@ var react = require('react');
 var utils = require('@koine/utils');
 var dom = require('@koine/dom');
 
-let e;let m=e=>{let t=[];if(!e||e===document.body)return t;let{overflow:r,overflowX:n,overflowY:u}=window.getComputedStyle(e);return [r,n,u].some(e=>"auto"===e||"scroll"===e)&&t.push(e),[...t,...m(e.parentElement)]},p=["x","y","top","bottom","left","right","width","height"],d=(e,t)=>p.every(r=>e[r]===t[r]);// offsetSize?: boolean;
-/**
- * Use measure hook
- *
- * @borrows [pmndrs/react-use-measure](https://github.com/pmndrs/react-use-measure)
- */let useMeasure=p=>{let{scroll:h=!1}=/* offsetSize = false */p||{},[a,b]=react.useState({left:0,top:0,width:0,height:0,bottom:0,right:0,x:0,y:0}),// keep all state in a ref
-g=react.useRef([// element
-null,// scrollContainers
-null,// resizeObserver
-null,// lastBounds
-a]),// make sure to update state only as long as the component is truly mounted
-v=react.useRef(!1);react.useEffect(()=>(v.current=!0,()=>void(v.current=!1)),[]);// memoize handlers, so event-listeners know when they should update
-let[w,,/* resizeChange */y]=react.useMemo(()=>{let e=(...e)=>{let[t,,,r]=g.current;if(!t)return;let n=t.getBoundingClientRect();// if (element instanceof HTMLElement && offsetSize) {
-//   size.height = element.offsetHeight;
-//   size.width = element.offsetWidth;
-// }
-Object.freeze(n),v.current&&!d(r,n)&&(g.current[3]=n,b(n));},t=utils.debounce(e);return [e,t,t]},[b]);/* , offsetSize */// cleanup current scroll-listeners / observers
-function x(){let[,e,t]=g.current;e&&(e.forEach(e=>dom.off(e,"scroll",y)),g.current[1]=null),t&&(t.disconnect(),g.current[2]=null);}// add scroll-listeners / observers
-function z(){let[t,r]=g.current;t&&!e&&ResizeObserver&&(e=new ResizeObserver(y),g.current[2]=e,e.observe(t),h&&r&&r.forEach(e=>dom.on(e,"scroll",y,{capture:!0,passive:!0})));}return(// add general event listeners
-// useOnWindowScroll(forceRefresh, Boolean(scroll));
-// useOnWindowResize(() => {
-//   debugger;
-//   forceRefresh();
-// });
-react.useEffect(()=>h?dom.listenScrollDebounced(0,w,100):utils.noop,[h,w]),react.useEffect(()=>// const listener = listenResizeDebounced(onWindowResize);
-    // return listener;
-    dom.listenResizeDebounced(0,w,100),[w]),// respond to changes that are relevant for the listeners
-react.useEffect(()=>{x(),z();},// eslint-disable-next-line react-hooks/exhaustive-deps
-[h]),/* , scrollChange, resizeChange */react.useEffect(()=>(// operate on mount, @kuus on the original version there is no call on mount?
-    w(),// remove all listeners when the components unmounts
-    x),// eslint-disable-next-line react-hooks/exhaustive-deps
-[]),[// the ref we expose to the user
-e=>{e&&e!==g.current[0]&&(x(),g.current[0]=e,g.current[1]=m(e),z());},a,w])};
+let e;let m=e=>{let t=[];if(!e||e===document.body)return t;let{overflow:r,overflowX:n,overflowY:u}=window.getComputedStyle(e);return [r,n,u].some(e=>"auto"===e||"scroll"===e)&&t.push(e),[...t,...m(e.parentElement)]},p=["x","y","top","bottom","left","right","width","height"],d=(e,t)=>p.every(r=>e[r]===t[r]);let useMeasure=p=>{let{scroll:h=!1}=p||{},[a,b]=react.useState({left:0,top:0,width:0,height:0,bottom:0,right:0,x:0,y:0}),g=react.useRef([null,null,null,a]),v=react.useRef(!1);react.useEffect(()=>(v.current=!0,()=>void(v.current=!1)),[]);let[w,,y]=react.useMemo(()=>{let e=(...e)=>{let[t,,,r]=g.current;if(!t)return;let n=t.getBoundingClientRect();Object.freeze(n),v.current&&!d(r,n)&&(g.current[3]=n,b(n));},t=utils.debounce(e);return [e,t,t]},[b]);function x(){let[,e,t]=g.current;e&&(e.forEach(e=>dom.off(e,"scroll",y)),g.current[1]=null),t&&(t.disconnect(),g.current[2]=null);}function z(){let[t,r]=g.current;t&&!e&&ResizeObserver&&(e=new ResizeObserver(y),g.current[2]=e,e.observe(t),h&&r&&r.forEach(e=>dom.on(e,"scroll",y,{capture:!0,passive:!0})));}return react.useEffect(()=>h?dom.listenScrollDebounced(0,w,100):utils.noop,[h,w]),react.useEffect(()=>dom.listenResizeDebounced(0,w,100),[w]),react.useEffect(()=>{x(),z();},[h]),react.useEffect(()=>(w(),x),[]),[e=>{e&&e!==g.current[0]&&(x(),g.current[0]=e,g.current[1]=m(e),z());},a,w]};
 
 exports.default = useMeasure;
 exports.useMeasure = useMeasure;

package/useMeasure.d.ts

@@ -18,5 +18,10 @@ export type UseMeasureReturn = [
     RectReadOnly,
     () => void
 ];
+/**
+ * Use measure hook
+ *
+ * @borrows [pmndrs/react-use-measure](https://github.com/pmndrs/react-use-measure)
+ */
 export declare let useMeasure: (options?: UseMeasureOptions) => UseMeasureReturn;
 export default useMeasure;

package/useMeasure.esm.js

@@ -2,38 +2,6 @@ import { useState, useRef, useEffect, useMemo } from 'react';
 import { debounce, noop } from '@koine/utils';
 import { listenScrollDebounced, listenResizeDebounced, off, on } from '@koine/dom';
 
-let e;let m=e=>{let t=[];if(!e||e===document.body)return t;let{overflow:r,overflowX:n,overflowY:u}=window.getComputedStyle(e);return [r,n,u].some(e=>"auto"===e||"scroll"===e)&&t.push(e),[...t,...m(e.parentElement)]},p=["x","y","top","bottom","left","right","width","height"],d=(e,t)=>p.every(r=>e[r]===t[r]);// offsetSize?: boolean;
-/**
- * Use measure hook
- *
- * @borrows [pmndrs/react-use-measure](https://github.com/pmndrs/react-use-measure)
- */let useMeasure=p=>{let{scroll:h=!1}=/* offsetSize = false */p||{},[a,b]=useState({left:0,top:0,width:0,height:0,bottom:0,right:0,x:0,y:0}),// keep all state in a ref
-g=useRef([// element
-null,// scrollContainers
-null,// resizeObserver
-null,// lastBounds
-a]),// make sure to update state only as long as the component is truly mounted
-v=useRef(!1);useEffect(()=>(v.current=!0,()=>void(v.current=!1)),[]);// memoize handlers, so event-listeners know when they should update
-let[w,,/* resizeChange */y]=useMemo(()=>{let e=(...e)=>{let[t,,,r]=g.current;if(!t)return;let n=t.getBoundingClientRect();// if (element instanceof HTMLElement && offsetSize) {
-//   size.height = element.offsetHeight;
-//   size.width = element.offsetWidth;
-// }
-Object.freeze(n),v.current&&!d(r,n)&&(g.current[3]=n,b(n));},t=debounce(e);return [e,t,t]},[b]);/* , offsetSize */// cleanup current scroll-listeners / observers
-function x(){let[,e,t]=g.current;e&&(e.forEach(e=>off(e,"scroll",y)),g.current[1]=null),t&&(t.disconnect(),g.current[2]=null);}// add scroll-listeners / observers
-function z(){let[t,r]=g.current;t&&!e&&ResizeObserver&&(e=new ResizeObserver(y),g.current[2]=e,e.observe(t),h&&r&&r.forEach(e=>on(e,"scroll",y,{capture:!0,passive:!0})));}return(// add general event listeners
-// useOnWindowScroll(forceRefresh, Boolean(scroll));
-// useOnWindowResize(() => {
-//   debugger;
-//   forceRefresh();
-// });
-useEffect(()=>h?listenScrollDebounced(0,w,100):noop,[h,w]),useEffect(()=>// const listener = listenResizeDebounced(onWindowResize);
-    // return listener;
-    listenResizeDebounced(0,w,100),[w]),// respond to changes that are relevant for the listeners
-useEffect(()=>{x(),z();},// eslint-disable-next-line react-hooks/exhaustive-deps
-[h]),/* , scrollChange, resizeChange */useEffect(()=>(// operate on mount, @kuus on the original version there is no call on mount?
-    w(),// remove all listeners when the components unmounts
-    x),// eslint-disable-next-line react-hooks/exhaustive-deps
-[]),[// the ref we expose to the user
-e=>{e&&e!==g.current[0]&&(x(),g.current[0]=e,g.current[1]=m(e),z());},a,w])};
+let e;let m=e=>{let t=[];if(!e||e===document.body)return t;let{overflow:r,overflowX:n,overflowY:u}=window.getComputedStyle(e);return [r,n,u].some(e=>"auto"===e||"scroll"===e)&&t.push(e),[...t,...m(e.parentElement)]},p=["x","y","top","bottom","left","right","width","height"],d=(e,t)=>p.every(r=>e[r]===t[r]);let useMeasure=p=>{let{scroll:h=!1}=p||{},[a,b]=useState({left:0,top:0,width:0,height:0,bottom:0,right:0,x:0,y:0}),g=useRef([null,null,null,a]),v=useRef(!1);useEffect(()=>(v.current=!0,()=>void(v.current=!1)),[]);let[w,,y]=useMemo(()=>{let e=(...e)=>{let[t,,,r]=g.current;if(!t)return;let n=t.getBoundingClientRect();Object.freeze(n),v.current&&!d(r,n)&&(g.current[3]=n,b(n));},t=debounce(e);return [e,t,t]},[b]);function x(){let[,e,t]=g.current;e&&(e.forEach(e=>off(e,"scroll",y)),g.current[1]=null),t&&(t.disconnect(),g.current[2]=null);}function z(){let[t,r]=g.current;t&&!e&&ResizeObserver&&(e=new ResizeObserver(y),g.current[2]=e,e.observe(t),h&&r&&r.forEach(e=>on(e,"scroll",y,{capture:!0,passive:!0})));}return useEffect(()=>h?listenScrollDebounced(0,w,100):noop,[h,w]),useEffect(()=>listenResizeDebounced(0,w,100),[w]),useEffect(()=>{x(),z();},[h]),useEffect(()=>(w(),x),[]),[e=>{e&&e!==g.current[0]&&(x(),g.current[0]=e,g.current[1]=m(e),z());},a,w]};
 
 export { useMeasure as default, useMeasure };

package/useMountedState.cjs.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var react = require('react');
 
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
- */let useMountedState=()=>{let u=react.useRef(!1),n=react.useCallback(()=>u.current,[]);return react.useEffect(()=>(u.current=!0,()=>{u.current=!1;}),[]),n};
+let useMountedState=()=>{let u=react.useRef(!1),n=react.useCallback(()=>u.current,[]);return react.useEffect(()=>(u.current=!0,()=>{u.current=!1;}),[]),n};
 
 exports.default = useMountedState;
 exports.useMountedState = useMountedState;

package/useMountedState.d.ts

@@ -1,2 +1,5 @@
+/**
+ * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
+ */
 export declare let useMountedState: () => (() => boolean);
 export default useMountedState;

package/useMountedState.esm.js

@@ -1,7 +1,5 @@
 import { useRef, useCallback, useEffect } from 'react';
 
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMountedState.ts)
- */let useMountedState=()=>{let u=useRef(!1),n=useCallback(()=>u.current,[]);return useEffect(()=>(u.current=!0,()=>{u.current=!1;}),[]),n};
+let useMountedState=()=>{let u=useRef(!1),n=useCallback(()=>u.current,[]);return useEffect(()=>(u.current=!0,()=>{u.current=!1;}),[]),n};
 
 export { useMountedState as default, useMountedState };

package/useNavigateAway.cjs.js

@@ -5,53 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var react = require('react');
 var dom = require('@koine/dom');
 
-//   string | boolean,
-//   (() => unknown) | undefined,
-//   (() => unknown) | undefined,
-// ];
-// type UseNavigateAwayPagehideHandler = (event: PageTransitionEvent) => unknown;
-/**
- * @resources
- *
- * About browser's specs see:
- * - https://developer.mozilla.org/en-US/docs/Web/API/Window/pagehide_event
- * - https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html#//apple_ref/doc/uid/TP40006511-SW5
- * - https://stackoverflow.com/questions/58009424/pagehide-event-on-google-chrome
- *
- * About react see:
- * - https://github.com/jacobbuck/react-beforeunload
- * - https://github.com/dioscarey/react-beforeunload-component
- *
- * About next.js see:
- * - https://github.com/vercel/next.js/issues/2476
- * - https://github.com/vercel/next.js/issues/2694
- *
- * For the callback technique see:
- * - https://stackoverflow.com/a/11835394/1938970
- */let useNavigateAway=a=>{let o=react.useRef();// const pagehideHandlerRef = useRef<UseNavigateAwayPagehideHandler | undefined>();
-react.useEffect(()=>{o.current=e=>{let t=a(e);return(// Handle legacy `event.returnValue` property
-// https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
-(t&&e.preventDefault(),"string"==typeof t)?e.returnValue=t:// Chrome doesn't support `event.preventDefault()` on `BeforeUnloadEvent`,
-// instead it requires `event.returnValue` to be set
-// https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload#browser_compatibility
-e.defaultPrevented?e.returnValue="":void 0)};},// pagehideHandlerRef.current = (event) => {
-//   const returnValue = handler?.(event);
-//   if (event.persisted) {
-//     // If the event's persisted property is `true` the page is about
-//     // to enter the Back-Forward Cache, which is also in the frozen state.
-//   } else {
-//     // If the event's persisted property is not `true` the page is
-//     // about to be unloaded.
-//   }
-// };
-[a]),react.useEffect(()=>dom.on(window,"beforeunload",e=>o.current?.(e)),// const listenerPagehide = on(window, "pagehide", (event) =>
-//   pagehideHandlerRef.current?.(event)
-// );
-// return () => {
-//   listenerBeforeunload();
-//   // listenerPagehide();
-// };
-[]);};
+let useNavigateAway=a=>{let o=react.useRef();react.useEffect(()=>{o.current=e=>{let t=a(e);return (t&&e.preventDefault(),"string"==typeof t)?e.returnValue=t:e.defaultPrevented?e.returnValue="":void 0};},[a]),react.useEffect(()=>dom.on(window,"beforeunload",e=>o.current?.(e)),[]);};
 
 exports.default = useNavigateAway;
 exports.useNavigateAway = useNavigateAway;

package/useNavigateAway.d.ts

@@ -1,3 +1,32 @@
+/**
+ * @return A custom error message (most browser will ignore it), or just a
+ * boolean to signal whether we want to prompt the user
+ *
+ * We might instead return an array with the above as first element and two
+ * callbacks, but the callback technique is too cumbersome and unreliable
+ * probably:
+ * 2) A callback on confirmed leaving
+ * 3) A callback on cancel, user stays on page
+ */
 export type UseNavigateAwayHandler = (event: BeforeUnloadEvent) => string | boolean;
+/**
+ * @resources
+ *
+ * About browser's specs see:
+ * - https://developer.mozilla.org/en-US/docs/Web/API/Window/pagehide_event
+ * - https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html#//apple_ref/doc/uid/TP40006511-SW5
+ * - https://stackoverflow.com/questions/58009424/pagehide-event-on-google-chrome
+ *
+ * About react see:
+ * - https://github.com/jacobbuck/react-beforeunload
+ * - https://github.com/dioscarey/react-beforeunload-component
+ *
+ * About next.js see:
+ * - https://github.com/vercel/next.js/issues/2476
+ * - https://github.com/vercel/next.js/issues/2694
+ *
+ * For the callback technique see:
+ * - https://stackoverflow.com/a/11835394/1938970
+ */
 export declare let useNavigateAway: (handler: UseNavigateAwayHandler) => void;
 export default useNavigateAway;

package/useNavigateAway.esm.js

@@ -1,52 +1,6 @@
 import { useRef, useEffect } from 'react';
 import { on } from '@koine/dom';
 
-//   string | boolean,
-//   (() => unknown) | undefined,
-//   (() => unknown) | undefined,
-// ];
-// type UseNavigateAwayPagehideHandler = (event: PageTransitionEvent) => unknown;
-/**
- * @resources
- *
- * About browser's specs see:
- * - https://developer.mozilla.org/en-US/docs/Web/API/Window/pagehide_event
- * - https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html#//apple_ref/doc/uid/TP40006511-SW5
- * - https://stackoverflow.com/questions/58009424/pagehide-event-on-google-chrome
- *
- * About react see:
- * - https://github.com/jacobbuck/react-beforeunload
- * - https://github.com/dioscarey/react-beforeunload-component
- *
- * About next.js see:
- * - https://github.com/vercel/next.js/issues/2476
- * - https://github.com/vercel/next.js/issues/2694
- *
- * For the callback technique see:
- * - https://stackoverflow.com/a/11835394/1938970
- */let useNavigateAway=a=>{let o=useRef();// const pagehideHandlerRef = useRef<UseNavigateAwayPagehideHandler | undefined>();
-useEffect(()=>{o.current=e=>{let t=a(e);return(// Handle legacy `event.returnValue` property
-// https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
-(t&&e.preventDefault(),"string"==typeof t)?e.returnValue=t:// Chrome doesn't support `event.preventDefault()` on `BeforeUnloadEvent`,
-// instead it requires `event.returnValue` to be set
-// https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload#browser_compatibility
-e.defaultPrevented?e.returnValue="":void 0)};},// pagehideHandlerRef.current = (event) => {
-//   const returnValue = handler?.(event);
-//   if (event.persisted) {
-//     // If the event's persisted property is `true` the page is about
-//     // to enter the Back-Forward Cache, which is also in the frozen state.
-//   } else {
-//     // If the event's persisted property is not `true` the page is
-//     // about to be unloaded.
-//   }
-// };
-[a]),useEffect(()=>on(window,"beforeunload",e=>o.current?.(e)),// const listenerPagehide = on(window, "pagehide", (event) =>
-//   pagehideHandlerRef.current?.(event)
-// );
-// return () => {
-//   listenerBeforeunload();
-//   // listenerPagehide();
-// };
-[]);};
+let useNavigateAway=a=>{let o=useRef();useEffect(()=>{o.current=e=>{let t=a(e);return (t&&e.preventDefault(),"string"==typeof t)?e.returnValue=t:e.defaultPrevented?e.returnValue="":void 0};},[a]),useEffect(()=>on(window,"beforeunload",e=>o.current?.(e)),[]);};
 
 export { useNavigateAway as default, useNavigateAway };

package/usePrevious.d.ts

@@ -1,2 +1,5 @@
+/**
+ * @borrows [samselikoff/animated-carousel](https://github.com/samselikoff/2022-06-02-animated-carousel/blob/main/pages/final.jsx)
+ */
 export declare let usePrevious: <T extends unknown>(state: T, defaulValue: T) => T;
 export default usePrevious;

package/useReveal.d.ts

@@ -1,7 +1,28 @@
 export type UseRevealOptions = {
+    /**
+     * @default "left"
+     */
     direction?: "left" | "right";
+    /**
+     * A number that represents the offset to start the animations, giving `-1`
+     * means that the animation will start when the scroll position is at
+     * 100% higher than the given element. Giving `2` the animation will starts
+     * when the scroll reached two times the height of the given element below
+     * the top edge of the element itself
+     *
+     * @default -2
+     */
     offsetStartY?: number;
+    /**
+     * When 0 it defaults to the same as the offsetStartY
+     * @default 0
+     */
     offsetEndY?: number;
+    /**
+     * A value from `0` to `1` representing a proportion of the element width
+     * or "all" to make it completely out of the viewport
+     * @default "all"
+     * */
     offsetStartX?: number | "all";
 };
 export declare let useReveal: <T extends HTMLElement = HTMLDivElement>({ direction, offsetStartY, offsetEndY, offsetStartX, }: UseRevealOptions) => {

package/useScrollPosition.cjs.js

@@ -7,13 +7,7 @@ var utils = require('@koine/utils');
 var dom = require('@koine/dom');
 var useIsomorphicLayoutEffect = require('./useIsomorphicLayoutEffect.cjs.js');
 
-let l={x:0,y:0},n=t=>t?.getBoundingClientRect(),u=(t,e)=>{if(!utils.isBrowser)return l;if(!e)return {x:window.scrollX,y:window.scrollY};let o=n(t?.current||document.body),u=n(e.current);return o?u?{x:(u.x||0)-(o.x||0),y:(u.y||0)-(o.y||0)}:{x:o.left,y:o.top}:l};/**
- * @borrows [@n8tb1t/use-scroll-position@2.0.3](https://github.com/n8tb1t/use-scroll-position) by `n8tb1t <n8tb1t@gmail.com>`
- *
- * We've just:
- * - reused internal helper functions
- * - compacted object arguments in functions as plain argument list to improve compression
- */let useScrollPosition=(l,n=[],i,c,m)=>{let f=react.useRef(u(null,c)),s=null,d=()=>{let t=u(i,c);l(t,f.current),f.current=t,s=null;};useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(()=>{if(!utils.isBrowser)return;let t=dom.listenScroll(()=>{m?null===s&&(s=window.setTimeout(d,m)):d();},c?.current);return ()=>{t(),s&&clearTimeout(s);}},n);};
+let l={x:0,y:0},n=t=>t?.getBoundingClientRect(),u=(t,e)=>{if(!utils.isBrowser)return l;if(!e)return {x:window.scrollX,y:window.scrollY};let o=n(t?.current||document.body),u=n(e.current);return o?u?{x:(u.x||0)-(o.x||0),y:(u.y||0)-(o.y||0)}:{x:o.left,y:o.top}:l};let useScrollPosition=(l,n=[],i,c,m)=>{let f=react.useRef(u(null,c)),s=null,d=()=>{let t=u(i,c);l(t,f.current),f.current=t,s=null;};useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(()=>{if(!utils.isBrowser)return;let t=dom.listenScroll(()=>{m?null===s&&(s=window.setTimeout(d,m)):d();},c?.current);return ()=>{t(),s&&clearTimeout(s);}},n);};
 
 exports.default = useScrollPosition;
 exports.useScrollPosition = useScrollPosition;

package/useScrollPosition.d.ts

@@ -3,5 +3,12 @@ type Position = {
     y: number;
 };
 type ElementRef = React.MutableRefObject<HTMLElement | undefined>;
+/**
+ * @borrows [@n8tb1t/use-scroll-position@2.0.3](https://github.com/n8tb1t/use-scroll-position) by `n8tb1t <n8tb1t@gmail.com>`
+ *
+ * We've just:
+ * - reused internal helper functions
+ * - compacted object arguments in functions as plain argument list to improve compression
+ */
 export declare let useScrollPosition: (effect: (currentPosition: Position, prevPosition: Position) => void, deps?: React.DependencyList, element?: ElementRef, boundingElement?: ElementRef, wait?: number) => void;
 export default useScrollPosition;

package/useScrollPosition.esm.js

@@ -3,12 +3,6 @@ import { isBrowser } from '@koine/utils';
 import { listenScroll } from '@koine/dom';
 import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect.esm.js';
 
-let l={x:0,y:0},n=t=>t?.getBoundingClientRect(),u=(t,e)=>{if(!isBrowser)return l;if(!e)return {x:window.scrollX,y:window.scrollY};let o=n(t?.current||document.body),u=n(e.current);return o?u?{x:(u.x||0)-(o.x||0),y:(u.y||0)-(o.y||0)}:{x:o.left,y:o.top}:l};/**
- * @borrows [@n8tb1t/use-scroll-position@2.0.3](https://github.com/n8tb1t/use-scroll-position) by `n8tb1t <n8tb1t@gmail.com>`
- *
- * We've just:
- * - reused internal helper functions
- * - compacted object arguments in functions as plain argument list to improve compression
- */let useScrollPosition=(l,n=[],i,c,m)=>{let f=useRef(u(null,c)),s=null,d=()=>{let t=u(i,c);l(t,f.current),f.current=t,s=null;};useIsomorphicLayoutEffect(()=>{if(!isBrowser)return;let t=listenScroll(()=>{m?null===s&&(s=window.setTimeout(d,m)):d();},c?.current);return ()=>{t(),s&&clearTimeout(s);}},n);};
+let l={x:0,y:0},n=t=>t?.getBoundingClientRect(),u=(t,e)=>{if(!isBrowser)return l;if(!e)return {x:window.scrollX,y:window.scrollY};let o=n(t?.current||document.body),u=n(e.current);return o?u?{x:(u.x||0)-(o.x||0),y:(u.y||0)-(o.y||0)}:{x:o.left,y:o.top}:l};let useScrollPosition=(l,n=[],i,c,m)=>{let f=useRef(u(null,c)),s=null,d=()=>{let t=u(i,c);l(t,f.current),f.current=t,s=null;};useIsomorphicLayoutEffect(()=>{if(!isBrowser)return;let t=listenScroll(()=>{m?null===s&&(s=window.setTimeout(d,m)):d();},c?.current);return ()=>{t(),s&&clearTimeout(s);}},n);};
 
 export { useScrollPosition as default, useScrollPosition };

package/useScrollThreshold.cjs.js

@@ -6,10 +6,7 @@ var react = require('react');
 var utils = require('@koine/utils');
 var dom = require('@koine/dom');
 
-let useScrollThreshold=(i,m)=>{let[u,f]=react.useState(!1),n=react.useCallback(()=>{if(i){let r=window.scrollY,// * -1;
-e=r<i,o=r>i;// console.log("useScrollThreshold setIsBelow", isBelow, posY, threshold);
-f(o),m&&m(e,o);}},[i,m]);return react.useEffect(()=>{if(i){// const listener = listenScrollThrottled(0, handler, 50);
-let r=dom.listenScroll(n);return n(),r}return utils.noop},[i,n]),u};
+let useScrollThreshold=(i,m)=>{let[u,f]=react.useState(!1),n=react.useCallback(()=>{if(i){let r=window.scrollY,e=r<i,o=r>i;f(o),m&&m(e,o);}},[i,m]);return react.useEffect(()=>{if(i){let r=dom.listenScroll(n);return n(),r}return utils.noop},[i,n]),u};
 
 exports.default = useScrollThreshold;
 exports.useScrollThreshold = useScrollThreshold;

package/useScrollThreshold.esm.js

@@ -2,9 +2,6 @@ import { useState, useCallback, useEffect } from 'react';
 import { noop } from '@koine/utils';
 import { listenScroll } from '@koine/dom';
 
-let useScrollThreshold=(i,m)=>{let[u,f]=useState(!1),n=useCallback(()=>{if(i){let r=window.scrollY,// * -1;
-e=r<i,o=r>i;// console.log("useScrollThreshold setIsBelow", isBelow, posY, threshold);
-f(o),m&&m(e,o);}},[i,m]);return useEffect(()=>{if(i){// const listener = listenScrollThrottled(0, handler, 50);
-let r=listenScroll(n);return n(),r}return noop},[i,n]),u};
+let useScrollThreshold=(i,m)=>{let[u,f]=useState(!1),n=useCallback(()=>{if(i){let r=window.scrollY,e=r<i,o=r>i;f(o),m&&m(e,o);}},[i,m]);return useEffect(()=>{if(i){let r=listenScroll(n);return n(),r}return noop},[i,n]),u};
 
 export { useScrollThreshold as default, useScrollThreshold };

package/useScrollTo.cjs.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var utils = require('@koine/utils');
 
-let useScrollTo=(o="",t=0)=>{// FIXME: is the useHeader still needed?
-// const [, , headerHeight] = useHeader();
-if(!utils.isBrowser)return;let l=document.getElementById(o),r=0;if(l&&l.offsetParent)do r+=l.offsetTop;while(l=l.offsetParent)r-=t,r-=/* headerHeight || */0,window.scroll(0,r);};
+let useScrollTo=(o="",t=0)=>{if(!utils.isBrowser)return;let l=document.getElementById(o),r=0;if(l&&l.offsetParent)do r+=l.offsetTop;while(l=l.offsetParent)r-=t,r-=0,window.scroll(0,r);};
 
 exports.default = useScrollTo;
 exports.useScrollTo = useScrollTo;

package/useScrollTo.esm.js

@@ -1,7 +1,5 @@
 import { isBrowser } from '@koine/utils';
 
-let useScrollTo=(o="",t=0)=>{// FIXME: is the useHeader still needed?
-// const [, , headerHeight] = useHeader();
-if(!isBrowser)return;let l=document.getElementById(o),r=0;if(l&&l.offsetParent)do r+=l.offsetTop;while(l=l.offsetParent)r-=t,r-=/* headerHeight || */0,window.scroll(0,r);};
+let useScrollTo=(o="",t=0)=>{if(!isBrowser)return;let l=document.getElementById(o),r=0;if(l&&l.offsetParent)do r+=l.offsetTop;while(l=l.offsetParent)r-=t,r-=0,window.scroll(0,r);};
 
 export { useScrollTo as default, useScrollTo };

package/useSmoothScroll.cjs.js

@@ -7,12 +7,7 @@ var utils = require('@koine/utils');
 var dom = require('@koine/dom');
 var useFixedOffset = require('./useFixedOffset.cjs.js');
 
-/**
- *
- * @param disregardAutomaticFixedOffset When the `to` scroll argument is a DOM
- * selector we will keep into account the _fixedOffset_ despite this option.
- * @returns
- */let useSmoothScroll=m=>{let i=useFixedOffset.useFixedOffset();return react.useCallback((e,l,f,u,n)=>{let c;let p=!1;if(utils.isNumber(e))c=e;else if(e){let t=document.getElementById(e);t&&(c=dom.getOffsetTopSlim(t)-i.current,p=!0);}utils.isNumber(c)&&dom.scrollTo(c=c+(l||0)+(m||p?0:i.current),f,u,n);},[m,i])};
+let useSmoothScroll=m=>{let i=useFixedOffset.useFixedOffset();return react.useCallback((e,l,f,u,n)=>{let c;let p=!1;if(utils.isNumber(e))c=e;else if(e){let t=document.getElementById(e);t&&(c=dom.getOffsetTopSlim(t)-i.current,p=!0);}utils.isNumber(c)&&dom.scrollTo(c=c+(l||0)+(m||p?0:i.current),f,u,n);},[m,i])};
 
 exports.default = useSmoothScroll;
 exports.useSmoothScroll = useSmoothScroll;

package/useSmoothScroll.d.ts

@@ -1,2 +1,8 @@
+/**
+ *
+ * @param disregardAutomaticFixedOffset When the `to` scroll argument is a DOM
+ * selector we will keep into account the _fixedOffset_ despite this option.
+ * @returns
+ */
 export declare let useSmoothScroll: (disregardAutomaticFixedOffset?: boolean) => (to?: number | string, customOffset?: number, callback?: () => void, fallbackTimeout?: number, behavior?: ScrollBehavior) => void;
 export default useSmoothScroll;

package/useSmoothScroll.esm.js

@@ -3,11 +3,6 @@ import { isNumber } from '@koine/utils';
 import { getOffsetTopSlim, scrollTo } from '@koine/dom';
 import { useFixedOffset } from './useFixedOffset.esm.js';
 
-/**
- *
- * @param disregardAutomaticFixedOffset When the `to` scroll argument is a DOM
- * selector we will keep into account the _fixedOffset_ despite this option.
- * @returns
- */let useSmoothScroll=m=>{let i=useFixedOffset();return useCallback((e,l,f,u,n)=>{let c;let p=!1;if(isNumber(e))c=e;else if(e){let t=document.getElementById(e);t&&(c=getOffsetTopSlim(t)-i.current,p=!0);}isNumber(c)&&scrollTo(c=c+(l||0)+(m||p?0:i.current),f,u,n);},[m,i])};
+let useSmoothScroll=m=>{let i=useFixedOffset();return useCallback((e,l,f,u,n)=>{let c;let p=!1;if(isNumber(e))c=e;else if(e){let t=document.getElementById(e);t&&(c=getOffsetTopSlim(t)-i.current,p=!0);}isNumber(c)&&scrollTo(c=c+(l||0)+(m||p?0:i.current),f,u,n);},[m,i])};
 
 export { useSmoothScroll as default, useSmoothScroll };

package/useSpinDelay.cjs.js

@@ -4,18 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var react = require('react');
 
-/**
- * Wraps your booleans only returning true after the `delay`, and for a minimum
- * time of `minDuration`. This way you're sure that you don't show unnecessary
- * or very short living spinners.
- *
- * @borrows [smeijer/spin-delay](https://github.com/smeijer/spin-delay)
- *
- * - Smaller footprint and options object as argument
- *
- * @param delay [500]
- * @param minDuration [200]
- */let useSpinDelay=(u,c=500,i=200)=>{let[n,o]=react.useState(0),l=react.useRef();return react.useEffect(()=>{u&&0===n&&(clearTimeout(l.current),l.current=setTimeout(()=>{if(!u)return o(0);l.current=setTimeout(()=>{o(3);},i),o(2);},c),o(1)),u||2===n||(clearTimeout(l.current),o(0));},[u,n,c,i]),react.useEffect(()=>()=>clearTimeout(l.current),[]),2===n||3===n};
+let useSpinDelay=(u,c=500,i=200)=>{let[n,o]=react.useState(0),l=react.useRef();return react.useEffect(()=>{u&&0===n&&(clearTimeout(l.current),l.current=setTimeout(()=>{if(!u)return o(0);l.current=setTimeout(()=>{o(3);},i),o(2);},c),o(1)),u||2===n||(clearTimeout(l.current),o(0));},[u,n,c,i]),react.useEffect(()=>()=>clearTimeout(l.current),[]),2===n||3===n};
 
 exports.default = useSpinDelay;
 exports.useSpinDelay = useSpinDelay;

package/useSpinDelay.d.ts

@@ -1,2 +1,14 @@
+/**
+ * Wraps your booleans only returning true after the `delay`, and for a minimum
+ * time of `minDuration`. This way you're sure that you don't show unnecessary
+ * or very short living spinners.
+ *
+ * @borrows [smeijer/spin-delay](https://github.com/smeijer/spin-delay)
+ *
+ * - Smaller footprint and options object as argument
+ *
+ * @param delay [500]
+ * @param minDuration [200]
+ */
 export declare let useSpinDelay: (loading: boolean, delay?: number, minDuration?: number) => boolean;
 export default useSpinDelay;

package/useSpinDelay.esm.js

@@ -1,16 +1,5 @@
 import { useState, useRef, useEffect } from 'react';
 
-/**
- * Wraps your booleans only returning true after the `delay`, and for a minimum
- * time of `minDuration`. This way you're sure that you don't show unnecessary
- * or very short living spinners.
- *
- * @borrows [smeijer/spin-delay](https://github.com/smeijer/spin-delay)
- *
- * - Smaller footprint and options object as argument
- *
- * @param delay [500]
- * @param minDuration [200]
- */let useSpinDelay=(u,c=500,i=200)=>{let[n,o]=useState(0),l=useRef();return useEffect(()=>{u&&0===n&&(clearTimeout(l.current),l.current=setTimeout(()=>{if(!u)return o(0);l.current=setTimeout(()=>{o(3);},i),o(2);},c),o(1)),u||2===n||(clearTimeout(l.current),o(0));},[u,n,c,i]),useEffect(()=>()=>clearTimeout(l.current),[]),2===n||3===n};
+let useSpinDelay=(u,c=500,i=200)=>{let[n,o]=useState(0),l=useRef();return useEffect(()=>{u&&0===n&&(clearTimeout(l.current),l.current=setTimeout(()=>{if(!u)return o(0);l.current=setTimeout(()=>{o(3);},i),o(2);},c),o(1)),u||2===n||(clearTimeout(l.current),o(0));},[u,n,c,i]),useEffect(()=>()=>clearTimeout(l.current),[]),2===n||3===n};
 
 export { useSpinDelay as default, useSpinDelay };

package/useTraceUpdate.cjs.js

@@ -4,10 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var react = require('react');
 
-/**
- * @see https://stackoverflow.com/a/51082563/9122820
- */let useTraceUpdate=r=>{let c=react.useRef(r);react.useEffect(()=>{let e=Object.entries(r).reduce((e,[t,r])=>(c.current[t]!==r&&// @ts-expect-error Does not matter here...
-    (e[t]=[c.current[t],r]),e),{});Object.keys(e).length>0&&console.info("[@koine/react:useTraceUpdate] changed props:",e),c.current=r;});};
+let useTraceUpdate=r=>{let c=react.useRef(r);react.useEffect(()=>{let e=Object.entries(r).reduce((e,[t,r])=>(c.current[t]!==r&&(e[t]=[c.current[t],r]),e),{});Object.keys(e).length>0&&console.info("[@koine/react:useTraceUpdate] changed props:",e),c.current=r;});};
 
 exports.default = useTraceUpdate;
 exports.useTraceUpdate = useTraceUpdate;

package/useTraceUpdate.d.ts

@@ -1,2 +1,5 @@
+/**
+ * @see https://stackoverflow.com/a/51082563/9122820
+ */
 export declare let useTraceUpdate: (props: any) => void;
 export default useTraceUpdate;

package/useTraceUpdate.esm.js

@@ -1,8 +1,5 @@
 import { useRef, useEffect } from 'react';
 
-/**
- * @see https://stackoverflow.com/a/51082563/9122820
- */let useTraceUpdate=r=>{let c=useRef(r);useEffect(()=>{let e=Object.entries(r).reduce((e,[t,r])=>(c.current[t]!==r&&// @ts-expect-error Does not matter here...
-    (e[t]=[c.current[t],r]),e),{});Object.keys(e).length>0&&console.info("[@koine/react:useTraceUpdate] changed props:",e),c.current=r;});};
+let useTraceUpdate=r=>{let c=useRef(r);useEffect(()=>{let e=Object.entries(r).reduce((e,[t,r])=>(c.current[t]!==r&&(e[t]=[c.current[t],r]),e),{});Object.keys(e).length>0&&console.info("[@koine/react:useTraceUpdate] changed props:",e),c.current=r;});};
 
 export { useTraceUpdate as default, useTraceUpdate };

package/useUpdateEffect.cjs.js

@@ -5,10 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var react = require('react');
 var useFirstMountState = require('./useFirstMountState.cjs.js');
 
-/**
- * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useUpdateEffect.ts)
- */let useUpdateEffect=(r,f)=>{let o=useFirstMountState.useFirstMountState();react.useEffect(()=>{if(!o)return r()},// eslint-disable-next-line react-hooks/exhaustive-deps
-f);};
+let useUpdateEffect=(r,f)=>{let o=useFirstMountState.useFirstMountState();react.useEffect(()=>{if(!o)return r()},f);};
 
 exports.default = useUpdateEffect;
 exports.useUpdateEffect = useUpdateEffect;

package/useUpdateEffect.d.ts

@@ -1,3 +1,6 @@
 import { useEffect } from "react";
+/**
+ * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useUpdateEffect.ts)
+ */
 export declare let useUpdateEffect: typeof useEffect;
 export default useUpdateEffect;