@koine/react 2.0.0-beta.21 → 2.0.0-beta.210

package/types.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./types.cjs.js').default;

package/types.cjs.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/types.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './types.cjs.js';
+export { _default as default } from './types.cjs.default.js';

package/types.d.ts

@@ -1,11 +1,3 @@
-export type { KoineImgSmartWrapProps, KoineImgSmartProps } from "./Img/types.js";
-export type Translate = (i18nKey: any, query?: any, options?: any) => string;
-export type Option = {
-    value: string;
-    Label?: NonNullable<import("react").ReactNode>;
-    label: NonNullable<import("react").ReactChild | import("react").ReactFragment>;
-};
+import type { JSX } from "react";
 export type KoineComponentProps<BaseComponentProps, ExtendableProps> = BaseComponentProps & ExtendableProps;
 export type KoineComponent<Props = any> = string | React.ForwardRefExoticComponent<Props> | React.ExoticComponent<Props> | React.FC<Props> | ((props: Props) => JSX.Element);
-export type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
-export type FunctionReturningPromise = (...args: any[]) => Promise<any>;

package/types.esm.js

@@ -0,0 +1 @@
+

package/useAsyncFn.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useAsyncFn.cjs.js').default;

package/useAsyncFn.cjs.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var useMountedState = require('./useMountedState.cjs.js');
+
+let useAsyncFn=(o,u=[],l={loading:false})=>{let a=react.useRef(0),d=useMountedState.useMountedState(),[i,c]=react.useState(l),g=react.useCallback((...e)=>{let t=++a.current;return i.loading||c(e=>({...e,loading:true})),o(...e).then(e=>(d()&&t===a.current&&c({value:e,loading:false}),e),e=>(d()&&t===a.current&&c({error:e,loading:false}),e))},u);return [i,g]};
+
+exports.default = useAsyncFn;
+exports.useAsyncFn = useAsyncFn;

package/useAsyncFn.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useAsyncFn.cjs.js';
+export { _default as default } from './useAsyncFn.cjs.default.js';

package/useAsyncFn.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
-import type { FunctionReturningPromise, PromiseType } from "./types.js";
+type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
+type FunctionReturningPromise = (...args: any[]) => Promise<any>;
 export type UseAsyncState<T> = {
     loading: boolean;
     error?: undefined;
@@ -19,5 +20,8 @@ export type UseAsyncState<T> = {
 };
 type StateFromFunctionReturningPromise<T extends FunctionReturningPromise> = UseAsyncState<PromiseType<ReturnType<T>>>;
 export type UseAsyncFnReturn<T extends FunctionReturningPromise = FunctionReturningPromise> = [StateFromFunctionReturningPromise<T>, T];
-export declare function useAsyncFn<T extends FunctionReturningPromise>(fn: T, deps?: React.DependencyList, initialState?: StateFromFunctionReturningPromise<T>): UseAsyncFnReturn<T>;
+/**
+ * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useAsyncFn.ts)
+ */
+export declare let useAsyncFn: <T extends FunctionReturningPromise>(fn: T, deps?: React.DependencyList, initialState?: StateFromFunctionReturningPromise<T>) => UseAsyncFnReturn<T>;
 export default useAsyncFn;

package/useAsyncFn.esm.js

@@ -0,0 +1,6 @@
+import { useRef, useState, useCallback } from 'react';
+import { useMountedState } from './useMountedState.esm.js';
+
+let useAsyncFn=(o,u=[],l={loading:false})=>{let a=useRef(0),d=useMountedState(),[i,c]=useState(l),g=useCallback((...e)=>{let t=++a.current;return i.loading||c(e=>({...e,loading:true})),o(...e).then(e=>(d()&&t===a.current&&c({value:e,loading:false}),e),e=>(d()&&t===a.current&&c({error:e,loading:false}),e))},u);return [i,g]};
+
+export { useAsyncFn as default, useAsyncFn };

package/useFirstMountState.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useFirstMountState.cjs.js').default;

package/useFirstMountState.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+
+let useFirstMountState=()=>{let r=react.useRef(true);return r.current?(r.current=false,true):r.current};
+
+exports.default = useFirstMountState;
+exports.useFirstMountState = useFirstMountState;

package/useFirstMountState.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useFirstMountState.cjs.js';
+export { _default as default } from './useFirstMountState.cjs.default.js';

package/useFirstMountState.d.ts

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

package/useFirstMountState.esm.js

@@ -0,0 +1,5 @@
+import { useRef } from 'react';
+
+let useFirstMountState=()=>{let r=useRef(true);return r.current?(r.current=false,true):r.current};
+
+export { useFirstMountState as default, useFirstMountState };

package/useFixedOffset.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useFixedOffset.cjs.js').default;

package/useFixedOffset.cjs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var utils = require('@koine/utils');
+var dom = require('@koine/dom');
+var useIsomorphicLayoutEffect = require('./useIsomorphicLayoutEffect.cjs.js');
+
+let n=e=>{dom.injectCss("useFixedOffset",`html{scroll-padding-top: ${e}px}`);};let useFixedOffset=i=>{let l=react.useRef(0);return useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(()=>{let e=()=>{let e=dom.calculateFixedOffset();l.current=e,n(e);};if(e(),!ResizeObserver)return dom.listenResizeDebounced(0,e);{let e=new ResizeObserver(e=>{let r=0;e.forEach(e=>{r+=e.contentRect.height;}),l.current=r,utils.debounce(()=>n(r),400,true)();});return dom.domEach(i||"[data-fixed]",t=>{e&&e.observe(t);}),()=>{e?.disconnect();}}},[i]),l};
+
+exports.default = useFixedOffset;
+exports.useFixedOffset = useFixedOffset;

package/useFixedOffset.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useFixedOffset.cjs.js';
+export { _default as default } from './useFixedOffset.cjs.default.js';

package/useFixedOffset.d.ts

@@ -1,3 +1,11 @@
-/// <reference types="react" />
-export declare function useFixedOffset(selector?: string): import("react").MutableRefObject<number>;
+/**
+ * # Use fixed offset
+ *
+ * Maybe use [ResizeObserver polyfill](https://github.com/juggle/resize-observer)
+ *
+ * @see https://web.dev/resize-observer/
+ *
+ * @param selector By default `[data-fixed]`: anyhting with the data attribute `data-fixed`
+ */
+export declare let useFixedOffset: (selector?: string) => import("react").RefObject<number>;
 export default useFixedOffset;

package/useFixedOffset.esm.js

@@ -0,0 +1,8 @@
+import { useRef } from 'react';
+import { debounce } from '@koine/utils';
+import { listenResizeDebounced, domEach, calculateFixedOffset, injectCss } from '@koine/dom';
+import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect.esm.js';
+
+let n=e=>{injectCss("useFixedOffset",`html{scroll-padding-top: ${e}px}`);};let useFixedOffset=i=>{let l=useRef(0);return useIsomorphicLayoutEffect(()=>{let e=()=>{let e=calculateFixedOffset();l.current=e,n(e);};if(e(),!ResizeObserver)return listenResizeDebounced(0,e);{let e=new ResizeObserver(e=>{let r=0;e.forEach(e=>{r+=e.contentRect.height;}),l.current=r,debounce(()=>n(r),400,true)();});return domEach(i||"[data-fixed]",t=>{e&&e.observe(t);}),()=>{e?.disconnect();}}},[i]),l};
+
+export { useFixedOffset as default, useFixedOffset };

package/useFocus.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useFocus.cjs.js').default;

package/useFocus.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+
+let useFocus=()=>{let r=react.useRef(null);return [r,()=>{r.current&&r.current.focus();}]};
+
+exports.default = useFocus;
+exports.useFocus = useFocus;

package/useFocus.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useFocus.cjs.js';
+export { _default as default } from './useFocus.cjs.default.js';

package/useFocus.d.ts

@@ -1,3 +1,5 @@
-/// <reference types="react" />
-export declare const useFocus: () => (import("react").RefObject<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement> | (() => void))[];
+/**
+ * @see https://stackoverflow.com/a/54159564/1938970
+ */
+export declare let useFocus: () => (import("react").RefObject<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | null> | (() => void))[];
 export default useFocus;

package/useFocus.esm.js

@@ -0,0 +1,5 @@
+import { useRef } from 'react';
+
+let useFocus=()=>{let r=useRef(null);return [r,()=>{r.current&&r.current.focus();}]};
+
+export { useFocus as default, useFocus };

package/useInterval.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useInterval.cjs.js').default;

package/useInterval.cjs.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var utils = require('@koine/utils');
+
+let useInterval=(l,n,u=[])=>{let o=react.useRef(null);react.useEffect(()=>{o.current=l;},[l,...u]),react.useEffect(()=>{if(null!==n){let r=setInterval(function(){o.current&&o.current();},n);return ()=>clearInterval(r)}return utils.noop},[n]);};
+
+exports.default = useInterval;
+exports.useInterval = useInterval;

package/useInterval.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useInterval.cjs.js';
+export { _default as default } from './useInterval.cjs.default.js';

package/useInterval.d.ts

@@ -1,2 +1,7 @@
-export declare function useInterval<T extends () => unknown>(callback: T, delay: number, deps?: unknown[]): void;
+/**
+ * @borrows [dan abramov](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
+ *
+ * We just add `deps` array argument and typescript support
+ */
+export declare let useInterval: <T extends () => unknown>(callback: T, delay: number, deps?: unknown[]) => void;
 export default useInterval;

package/useInterval.esm.js

@@ -0,0 +1,6 @@
+import { useRef, useEffect } from 'react';
+import { noop } from '@koine/utils';
+
+let useInterval=(l,n,u=[])=>{let o=useRef(null);useEffect(()=>{o.current=l;},[l,...u]),useEffect(()=>{if(null!==n){let r=setInterval(function(){o.current&&o.current();},n);return ()=>clearInterval(r)}return noop},[n]);};
+
+export { useInterval as default, useInterval };

package/useIsomorphicLayoutEffect.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useIsomorphicLayoutEffect.cjs.js').default;

package/useIsomorphicLayoutEffect.cjs.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var utils = require('@koine/utils');
+
+let useIsomorphicLayoutEffect=utils.isBrowser?react.useLayoutEffect:react.useEffect;
+
+exports.default = useIsomorphicLayoutEffect;
+exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;

package/useIsomorphicLayoutEffect.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useIsomorphicLayoutEffect.cjs.js';
+export { _default as default } from './useIsomorphicLayoutEffect.cjs.default.js';

package/useIsomorphicLayoutEffect.d.ts

@@ -1,3 +1,6 @@
 import { useLayoutEffect } from "react";
-export declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
+/**
+ * @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

@@ -0,0 +1,6 @@
+import { useLayoutEffect, useEffect } from 'react';
+import { isBrowser } from '@koine/utils';
+
+let useIsomorphicLayoutEffect=isBrowser?useLayoutEffect:useEffect;
+
+export { useIsomorphicLayoutEffect as default, useIsomorphicLayoutEffect };

package/useKeyUp.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useKeyUp.cjs.js').default;

package/useKeyUp.cjs.js

@@ -0,0 +1,11 @@
+'use strict';
+
+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=>{e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),[o,...r]);};
+
+exports.default = useKeyUp;
+exports.useKeyUp = useKeyUp;

package/useKeyUp.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useKeyUp.cjs.js';
+export { _default as default } from './useKeyUp.cjs.default.js';

package/useKeyUp.d.ts

@@ -1,2 +1,2 @@
-export declare function useKeyUp(callback: (event: KeyboardEvent) => void, deps?: unknown[]): void;
+export declare let useKeyUp: (callback: (event: KeyboardEvent) => void, deps?: unknown[]) => void;
 export default useKeyUp;

package/useKeyUp.esm.js

@@ -0,0 +1,6 @@
+import { useEffect } from 'react';
+import { on } from '@koine/dom';
+
+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.default.js

@@ -0,0 +1 @@
+exports._default = require('./useMeasure.cjs.js').default;

package/useMeasure.cjs.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+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"];let useMeasure=d=>{let{scroll:h=false}=d||{},[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(false);react.useEffect(()=>(v.current=true,()=>void(v.current=false)),[]);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&&!p.every(e=>r[e]===n[e])&&(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:true,passive:true})));}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.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useMeasure.cjs.js';
+export { _default as default } from './useMeasure.cjs.default.js';

package/useMeasure.d.ts

@@ -18,5 +18,10 @@ export type UseMeasureReturn = [
     RectReadOnly,
     () => void
 ];
-export declare function useMeasure(options?: UseMeasureOptions): UseMeasureReturn;
+/**
+ * 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

@@ -0,0 +1,7 @@
+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"];let useMeasure=d=>{let{scroll:h=false}=d||{},[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(false);useEffect(()=>(v.current=true,()=>void(v.current=false)),[]);let[w,,y]=useMemo(()=>{let e=(...e)=>{let[t,,,r]=g.current;if(!t)return;let n=t.getBoundingClientRect();Object.freeze(n),v.current&&!p.every(e=>r[e]===n[e])&&(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:true,passive:true})));}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.default.js

@@ -0,0 +1 @@
+exports._default = require('./useMountedState.cjs.js').default;

package/useMountedState.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+
+let useMountedState=()=>{let u=react.useRef(false),n=react.useCallback(()=>u.current,[]);return react.useEffect(()=>(u.current=true,()=>{u.current=false;}),[]),n};
+
+exports.default = useMountedState;
+exports.useMountedState = useMountedState;

package/useMountedState.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useMountedState.cjs.js';
+export { _default as default } from './useMountedState.cjs.default.js';

package/useMountedState.d.ts

@@ -1,2 +1,5 @@
-export declare function useMountedState(): () => boolean;
+/**
+ * @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

@@ -0,0 +1,5 @@
+import { useRef, useCallback, useEffect } from 'react';
+
+let useMountedState=()=>{let u=useRef(false),n=useCallback(()=>u.current,[]);return useEffect(()=>(u.current=true,()=>{u.current=false;}),[]),n};
+
+export { useMountedState as default, useMountedState };

package/useNavigateAway.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useNavigateAway.cjs.js').default;

package/useNavigateAway.cjs.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+var dom = require('@koine/dom');
+
+let useNavigateAway=u=>{let a=react.useRef(null);react.useEffect(()=>{a.current=e=>{let t=u(e);return (t&&e.preventDefault(),"string"==typeof t)?e.returnValue=t:e.defaultPrevented?e.returnValue="":void 0};},[u]),react.useEffect(()=>dom.on(window,"beforeunload",e=>a.current?.(e)),[]);};
+
+exports.default = useNavigateAway;
+exports.useNavigateAway = useNavigateAway;

package/useNavigateAway.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useNavigateAway.cjs.js';
+export { _default as default } from './useNavigateAway.cjs.default.js';

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;
-export declare const useNavigateAway: (handler: UseNavigateAwayHandler) => void;
+/**
+ * @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

@@ -0,0 +1,6 @@
+import { useRef, useEffect } from 'react';
+import { on } from '@koine/dom';
+
+let useNavigateAway=u=>{let a=useRef(null);useEffect(()=>{a.current=e=>{let t=u(e);return (t&&e.preventDefault(),"string"==typeof t)?e.returnValue=t:e.defaultPrevented?e.returnValue="":void 0};},[u]),useEffect(()=>on(window,"beforeunload",e=>a.current?.(e)),[]);};
+
+export { useNavigateAway as default, useNavigateAway };

package/usePrevious.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./usePrevious.cjs.js').default;

package/usePrevious.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+
+let usePrevious=(r,t)=>{let[o,u]=react.useState([r,t]);return o[1]!==r&&u([o[1],r]),o[0]};
+
+exports.default = usePrevious;
+exports.usePrevious = usePrevious;

package/usePrevious.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './usePrevious.cjs.js';
+export { _default as default } from './usePrevious.cjs.default.js';

package/usePrevious.d.ts

@@ -1,2 +1,5 @@
-export declare function usePrevious<T>(state: T, defaulValue: T): T;
+/**
+ * @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/usePrevious.esm.js

@@ -0,0 +1,5 @@
+import { useState } from 'react';
+
+let usePrevious=(r,t)=>{let[o,u]=useState([r,t]);return o[1]!==r&&u([o[1],r]),o[0]};
+
+export { usePrevious as default, usePrevious };

package/usePreviousRef.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./usePreviousRef.cjs.js').default;

package/usePreviousRef.cjs.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+
+let usePreviousRef=t=>{let u=react.useRef(null);return react.useEffect(()=>{u.current=t;}),u.current};
+
+exports.default = usePreviousRef;
+exports.usePreviousRef = usePreviousRef;

package/usePreviousRef.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './usePreviousRef.cjs.js';
+export { _default as default } from './usePreviousRef.cjs.default.js';

package/usePreviousRef.d.ts

@@ -1,2 +1,2 @@
-export declare function usePreviousRef<T>(value: T): T | undefined;
+export declare let usePreviousRef: <T extends unknown>(value: T) => T | null;
 export default usePreviousRef;

package/usePreviousRef.esm.js

@@ -0,0 +1,5 @@
+import { useRef, useEffect } from 'react';
+
+let usePreviousRef=t=>{let u=useRef(null);return useEffect(()=>{u.current=t;}),u.current};
+
+export { usePreviousRef as default, usePreviousRef };

package/useReveal.d.ts

@@ -0,0 +1,34 @@
+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) => {
+    ref: import("react").RefObject<T | null>;
+    startY: number;
+    endY: number;
+    startX: number;
+};
+export default useReveal;

package/useScrollPosition.cjs.default.js

@@ -0,0 +1 @@
+exports._default = require('./useScrollPosition.cjs.js').default;

package/useScrollPosition.cjs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('react');
+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};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.cjs.mjs

@@ -0,0 +1,2 @@
+export * from './useScrollPosition.cjs.js';
+export { _default as default } from './useScrollPosition.cjs.default.js';

package/useScrollPosition.d.ts

@@ -1,8 +1,14 @@
-/// <reference types="react" />
 type Position = {
     x: number;
     y: number;
 };
 type ElementRef = React.MutableRefObject<HTMLElement | undefined>;
-export declare const useScrollPosition: (effect: (currentPosition: Position, prevPosition: Position) => void, deps?: import("react").DependencyList, element?: ElementRef, boundingElement?: ElementRef, wait?: number) => void;
+/**
+ * @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

@@ -0,0 +1,8 @@
+import { useRef } from 'react';
+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};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.default.js

@@ -0,0 +1 @@
+exports._default = require('./useScrollThreshold.cjs.js').default;