@koine/react 2.0.0-beta.75 → 2.0.0-beta.76

package/hooks/useScrollThreshold.js

@@ -1,25 +0,0 @@
-import { useCallback, useEffect, useState } from "react";
-import { noop } from "@koine/utils";
-import { listenScroll } from "@koine/dom";
-export let useScrollThreshold = (threshold, callback) => {
-    const [isBelow, setIsBelow] = useState(false);
-    const handler = useCallback(() => {
-        if (threshold) {
-            const posY = window.scrollY;
-            const isAbove = posY < threshold;
-            const isBelow = posY > threshold;
-            setIsBelow(isBelow);
-            if (callback)
-                callback(isAbove, isBelow);
-        }
-    }, [threshold, callback]);
-    useEffect(() => {
-        if (threshold) {
-            const listener = listenScroll(handler);
-            handler();
-            return listener;
-        }
-        return noop;
-    }, [threshold, handler]);
-    return isBelow;
-};

package/hooks/useScrollTo.js

@@ -1,17 +0,0 @@
-import { isBrowser } from "@koine/utils";
-export let useScrollTo = (id = "", offset = 0) => {
-    if (!isBrowser) {
-        return;
-    }
-    const headerOffset = 0;
-    let element = document.getElementById(id);
-    let top = 0;
-    if (element && element.offsetParent) {
-        do {
-            top += element.offsetTop;
-        } while ((element = element.offsetParent));
-    }
-    top -= offset;
-    top -= headerOffset;
-    window.scroll(0, top);
-};

package/hooks/useSmoothScroll.js

@@ -1,31 +0,0 @@
-import { useCallback } from "react";
-import { isNumber } from "@koine/utils";
-import { getOffsetTopSlim, scrollTo } from "@koine/dom";
-import { useFixedOffset } from "./useFixedOffset";
-export let useSmoothScroll = (disregardAutomaticFixedOffset) => {
-    const fixedOffset = useFixedOffset();
-    const scroll = useCallback((to, customOffset, callback, fallbackTimeout, behavior) => {
-        let top = undefined;
-        let toIsElement = false;
-        if (isNumber(to)) {
-            top = to;
-        }
-        else if (to) {
-            const el = document.getElementById(to);
-            if (el) {
-                top = getOffsetTopSlim(el) - fixedOffset.current;
-                toIsElement = true;
-            }
-        }
-        if (isNumber(top)) {
-            top =
-                top +
-                    (customOffset || 0) +
-                    (disregardAutomaticFixedOffset || toIsElement
-                        ? 0
-                        : fixedOffset.current);
-            scrollTo(top, callback, fallbackTimeout, behavior);
-        }
-    }, [disregardAutomaticFixedOffset, fixedOffset]);
-    return scroll;
-};

package/hooks/useSpinDelay.js

@@ -1,35 +0,0 @@
-import { useEffect, useRef, useState } from "react";
-var State;
-(function (State) {
-    State[State["IDLE"] = 0] = "IDLE";
-    State[State["DELAY"] = 1] = "DELAY";
-    State[State["DISPLAY"] = 2] = "DISPLAY";
-    State[State["EXPIRE"] = 3] = "EXPIRE";
-})(State || (State = {}));
-export let useSpinDelay = (loading, delay = 500, minDuration = 200) => {
-    const [state, setState] = useState(State.IDLE);
-    const timeout = useRef();
-    useEffect(() => {
-        if (loading && state === State.IDLE) {
-            clearTimeout(timeout.current);
-            timeout.current = setTimeout(() => {
-                if (!loading) {
-                    return setState(State.IDLE);
-                }
-                timeout.current = setTimeout(() => {
-                    setState(State.EXPIRE);
-                }, minDuration);
-                setState(State.DISPLAY);
-            }, delay);
-            setState(State.DELAY);
-        }
-        if (!loading && state !== State.DISPLAY) {
-            clearTimeout(timeout.current);
-            setState(State.IDLE);
-        }
-    }, [loading, state, delay, minDuration]);
-    useEffect(() => {
-        return () => clearTimeout(timeout.current);
-    }, []);
-    return state === State.DISPLAY || state === State.EXPIRE;
-};

package/hooks/useTraceUpdate.js

@@ -1,16 +0,0 @@
-import { useEffect, useRef } from "react";
-export let useTraceUpdate = (props) => {
-    const prev = useRef(props);
-    useEffect(() => {
-        const changedProps = Object.entries(props).reduce((ps, [k, v]) => {
-            if (prev.current[k] !== v) {
-                ps[k] = [prev.current[k], v];
-            }
-            return ps;
-        }, {});
-        if (Object.keys(changedProps).length > 0) {
-            console.info("[@koine/react:useTraceUpdate] changed props:", changedProps);
-        }
-        prev.current = props;
-    });
-};

package/hooks/useUpdateEffect.js

@@ -1,10 +0,0 @@
-import { useEffect } from "react";
-import { useFirstMountState } from "./useFirstMountState";
-export let useUpdateEffect = (effect, deps) => {
-    const isFirstMount = useFirstMountState();
-    useEffect(() => {
-        if (!isFirstMount) {
-            return effect();
-        }
-    }, deps);
-};

package/hooks/useWindowSize.js

@@ -1,19 +0,0 @@
-import { useEffect, useState } from "react";
-import { debounce } from "@koine/utils";
-import { listenResize, listenResizeDebounced } from "@koine/dom";
-export let useWindowSize = (wait, immediate) => {
-    const [width, widthSet] = useState(0);
-    const [height, heightSet] = useState(0);
-    useEffect(() => {
-        const updateSize = () => {
-            widthSet(window.innerWidth);
-            heightSet(window.innerHeight);
-        };
-        const listener = wait
-            ? listenResizeDebounced(0, updateSize, wait, immediate)
-            : listenResize(updateSize);
-        updateSize();
-        return listener;
-    }, [wait, immediate]);
-    return [width, height];
-};

package/index.cjs.d.ts

@@ -1 +0,0 @@
-export * from "./index";

package/index.cjs.default.js

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

package/index.cjs.js

@@ -1,87 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('react');
-var utils = require('@koine/utils');
-var jsxRuntime = require('react/jsx-runtime');
-var dom = require('@koine/dom');
-
-let classed=r=>{let s=r.type||r;return function(r,...a){return react.forwardRef(function(e,n){let o=a.map((t,s)=>{let a="";return "function"==typeof t?a=t(e):void 0!==t&&(a=t.toString()),r[s]+a}).join(""),l="string"==typeof s,i=l?{}:e;if(l)for(let t in e)t.startsWith("$")||(i[t]=e[t]);let c=o||r[0];return c=(c.match(/class="([^"]*)/)?.[1]||c)+(e?.className?" "+e?.className:""),react.createElement(s,{...i,className:c||void 0,ref:n})})}};
-
-let useIsomorphicLayoutEffect=utils.isBrowser?react.useLayoutEffect:react.useEffect;
-
-let createUseMediaQueryWidth=n=>{let a=utils.getMediaQueryWidthResolvers(n);return function(t,n){let[o,s]=t.substring(1).split("-");utils.isUndefined(s)&&(s=o),utils.isUndefined(o)&&(o="min");let[d,m]=s.split("_"),u=a[o](d,m),[c,l]=react.useState(utils.isUndefined(n)?null:n);return useIsomorphicLayoutEffect(()=>{let e=window.matchMedia(u),t=e=>{l(e.matches);};return (l(e.matches),e.addEventListener)?(e.addEventListener("change",t),()=>{e.removeEventListener("change",t);}):(e.addListener(t),()=>{e.removeListener(t);})},[u]),c}};
-
-let extendComponent=(t,o)=>Object.assign(o=>react.createElement(t,o),{...o,defaultProps:o});
-
-let FaviconTags=({name:a,color:t,safariTabColor:o,tileColor:c,themeColor:l})=>jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("link",{rel:"shortcut icon",href:"/favicon.ico",type:"image/x-icon"}),jsxRuntime.jsx("link",{rel:"apple-touch-icon",sizes:"180x180",href:"/apple-touch-icon.png"}),jsxRuntime.jsx("link",{rel:"icon",type:"image/png",sizes:"32x32",href:"/favicon-32x32.png"}),jsxRuntime.jsx("link",{rel:"icon",type:"image/png",sizes:"16x16",href:"/favicon-16x16.png"}),jsxRuntime.jsx("link",{rel:"manifest",href:"/site.webmanifest"}),jsxRuntime.jsx("link",{rel:"mask-icon",href:"/safari-pinned-tab.svg",color:o||t}),jsxRuntime.jsx("meta",{name:"apple-mobile-web-app-title",content:a}),jsxRuntime.jsx("meta",{name:"application-name",content:a}),jsxRuntime.jsx("meta",{name:"msapplication-TileColor",content:c||t}),jsxRuntime.jsx("meta",{name:"theme-color",content:l||t})]});
-
-let mergeRefs=e=>r=>{e.forEach(e=>{"function"==typeof e?e(r):null!=e&&(e.current=r);});};
-
-let Meta=({zoom:t})=>jsxRuntime.jsx("meta",{name:"viewport",content:`width=device-width, initial-scale=1, maximum-scale=1${t?"":", user-scalable=0"}`});
-
-let NoJs=t=>jsxRuntime.jsx("script",{id:"no-js",dangerouslySetInnerHTML:{__html:'document.querySelector("html").className=document.querySelector("html").className.replace(/no-js/,"") + "js";'}});
-
-let useMountedState=()=>{let u=react.useRef(!1),n=react.useCallback(()=>u.current,[]);return react.useEffect(()=>(u.current=!0,()=>{u.current=!1;}),[]),n};
-
-let useAsyncFn=(o,u=[],l={loading:!1})=>{let a=react.useRef(0),d=useMountedState(),[i,c]=react.useState(l),g=react.useCallback((...e)=>{let t=++a.current;return i.loading||c(e=>({...e,loading:!0})),o(...e).then(e=>(d()&&t===a.current&&c({value:e,loading:!1}),e),e=>(d()&&t===a.current&&c({error:e,loading:!1}),e))},u);return [i,g]};
-
-let useFirstMountState=()=>{let r=react.useRef(!0);return r.current?(r.current=!1,!0):r.current};
-
-let n$1=e=>{dom.injectCss("useFixedOffset",`html{scroll-padding-top: ${e}px}`);};let useFixedOffset=i=>{let l=react.useRef(0);return useIsomorphicLayoutEffect(()=>{let e=()=>{let e=dom.calculateFixedOffset();l.current=e,n$1(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$1(r),400,!0)();});return dom.$each(i||"[data-fixed]",t=>{e&&e.observe(t);}),()=>{e?.disconnect();}}},[i]),l};
-
-let useFocus=()=>{let r=react.useRef(null);return [r,()=>{r.current&&r.current.focus();}]};
-
-let useInterval=(n,l,u=[])=>{let o=react.useRef();react.useEffect(()=>{o.current=n;},[n,...u]),react.useEffect(()=>{if(null!==l){let r=setInterval(function(){o.current&&o.current();},l);return ()=>clearInterval(r)}return utils.noop},[l]);};
-
-let useKeyUp=(o,r=[])=>{react.useEffect(()=>dom.on(window,"keyup",e=>{e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),[o,...r]);};
-
-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]};
-
-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)),[]);};
-
-let usePrevious=(r,t)=>{let[o,u]=react.useState([r,t]);return o[1]!==r&&u([o[1],r]),o[0]};
-
-let usePreviousRef=t=>{let u=react.useRef();return react.useEffect(()=>{u.current=t;}),u.current};
-
-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(()=>{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 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};
-
-let useSmoothScroll=m=>{let i=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 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 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;});};
-
-let useUpdateEffect=(r,f)=>{let o=useFirstMountState();react.useEffect(()=>{if(!o)return r()},f);};
-
-let useWindowSize=(o,n)=>{let[d,w]=react.useState(0),[m,u]=react.useState(0);return react.useEffect(()=>{let e=()=>{w(window.innerWidth),u(window.innerHeight);},i=o?dom.listenResizeDebounced(0,e,o,n):dom.listenResize(e);return e(),i},[o,n]),[d,m]};
-
-exports.FaviconTags = FaviconTags;
-exports.Meta = Meta;
-exports.NoJs = NoJs;
-exports.classed = classed;
-exports.createUseMediaQueryWidth = createUseMediaQueryWidth;
-exports.extendComponent = extendComponent;
-exports.mergeRefs = mergeRefs;
-exports.useAsyncFn = useAsyncFn;
-exports.useFirstMountState = useFirstMountState;
-exports.useFixedOffset = useFixedOffset;
-exports.useFocus = useFocus;
-exports.useInterval = useInterval;
-exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect;
-exports.useKeyUp = useKeyUp;
-exports.useMeasure = useMeasure;
-exports.useMountedState = useMountedState;
-exports.useNavigateAway = useNavigateAway;
-exports.usePrevious = usePrevious;
-exports.usePreviousRef = usePreviousRef;
-exports.useScrollPosition = useScrollPosition;
-exports.useScrollThreshold = useScrollThreshold;
-exports.useSmoothScroll = useSmoothScroll;
-exports.useSpinDelay = useSpinDelay;
-exports.useTraceUpdate = useTraceUpdate;
-exports.useUpdateEffect = useUpdateEffect;
-exports.useWindowSize = useWindowSize;

package/index.cjs.mjs

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

package/index.esm.js

@@ -1,58 +0,0 @@
-import { forwardRef, createElement, useLayoutEffect, useEffect, useState, useRef, useCallback, useMemo } from 'react';
-import { isBrowser, getMediaQueryWidthResolvers, isUndefined, debounce, noop, isNumber } from '@koine/utils';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { listenResizeDebounced, $each, calculateFixedOffset, injectCss, on, listenScrollDebounced, off, listenScroll, getOffsetTopSlim, scrollTo, listenResize } from '@koine/dom';
-
-let classed=r=>{let s=r.type||r;return function(r,...a){return forwardRef(function(e,n){let o=a.map((t,s)=>{let a="";return "function"==typeof t?a=t(e):void 0!==t&&(a=t.toString()),r[s]+a}).join(""),l="string"==typeof s,i=l?{}:e;if(l)for(let t in e)t.startsWith("$")||(i[t]=e[t]);let c=o||r[0];return c=(c.match(/class="([^"]*)/)?.[1]||c)+(e?.className?" "+e?.className:""),createElement(s,{...i,className:c||void 0,ref:n})})}};
-
-let useIsomorphicLayoutEffect=isBrowser?useLayoutEffect:useEffect;
-
-let createUseMediaQueryWidth=n=>{let a=getMediaQueryWidthResolvers(n);return function(t,n){let[o,s]=t.substring(1).split("-");isUndefined(s)&&(s=o),isUndefined(o)&&(o="min");let[d,m]=s.split("_"),u=a[o](d,m),[c,l]=useState(isUndefined(n)?null:n);return useIsomorphicLayoutEffect(()=>{let e=window.matchMedia(u),t=e=>{l(e.matches);};return (l(e.matches),e.addEventListener)?(e.addEventListener("change",t),()=>{e.removeEventListener("change",t);}):(e.addListener(t),()=>{e.removeListener(t);})},[u]),c}};
-
-let extendComponent=(t,o)=>Object.assign(o=>createElement(t,o),{...o,defaultProps:o});
-
-let FaviconTags=({name:a,color:t,safariTabColor:o,tileColor:c,themeColor:l})=>jsxs(Fragment,{children:[jsx("link",{rel:"shortcut icon",href:"/favicon.ico",type:"image/x-icon"}),jsx("link",{rel:"apple-touch-icon",sizes:"180x180",href:"/apple-touch-icon.png"}),jsx("link",{rel:"icon",type:"image/png",sizes:"32x32",href:"/favicon-32x32.png"}),jsx("link",{rel:"icon",type:"image/png",sizes:"16x16",href:"/favicon-16x16.png"}),jsx("link",{rel:"manifest",href:"/site.webmanifest"}),jsx("link",{rel:"mask-icon",href:"/safari-pinned-tab.svg",color:o||t}),jsx("meta",{name:"apple-mobile-web-app-title",content:a}),jsx("meta",{name:"application-name",content:a}),jsx("meta",{name:"msapplication-TileColor",content:c||t}),jsx("meta",{name:"theme-color",content:l||t})]});
-
-let mergeRefs=e=>r=>{e.forEach(e=>{"function"==typeof e?e(r):null!=e&&(e.current=r);});};
-
-let Meta=({zoom:t})=>jsx("meta",{name:"viewport",content:`width=device-width, initial-scale=1, maximum-scale=1${t?"":", user-scalable=0"}`});
-
-let NoJs=t=>jsx("script",{id:"no-js",dangerouslySetInnerHTML:{__html:'document.querySelector("html").className=document.querySelector("html").className.replace(/no-js/,"") + "js";'}});
-
-let useMountedState=()=>{let u=useRef(!1),n=useCallback(()=>u.current,[]);return useEffect(()=>(u.current=!0,()=>{u.current=!1;}),[]),n};
-
-let useAsyncFn=(o,u=[],l={loading:!1})=>{let a=useRef(0),d=useMountedState(),[i,c]=useState(l),g=useCallback((...e)=>{let t=++a.current;return i.loading||c(e=>({...e,loading:!0})),o(...e).then(e=>(d()&&t===a.current&&c({value:e,loading:!1}),e),e=>(d()&&t===a.current&&c({error:e,loading:!1}),e))},u);return [i,g]};
-
-let useFirstMountState=()=>{let r=useRef(!0);return r.current?(r.current=!1,!0):r.current};
-
-let n$1=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$1(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$1(r),400,!0)();});return $each(i||"[data-fixed]",t=>{e&&e.observe(t);}),()=>{e?.disconnect();}}},[i]),l};
-
-let useFocus=()=>{let r=useRef(null);return [r,()=>{r.current&&r.current.focus();}]};
-
-let useInterval=(n,l,u=[])=>{let o=useRef();useEffect(()=>{o.current=n;},[n,...u]),useEffect(()=>{if(null!==l){let r=setInterval(function(){o.current&&o.current();},l);return ()=>clearInterval(r)}return noop},[l]);};
-
-let useKeyUp=(o,r=[])=>{useEffect(()=>on(window,"keyup",e=>{e.ctrlKey||e.altKey||e.shiftKey||e.metaKey||o(e);}),[o,...r]);};
-
-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]};
-
-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)),[]);};
-
-let usePrevious=(r,t)=>{let[o,u]=useState([r,t]);return o[1]!==r&&u([o[1],r]),o[0]};
-
-let usePreviousRef=t=>{let u=useRef();return useEffect(()=>{u.current=t;}),u.current};
-
-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);};
-
-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};
-
-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 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 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;});};
-
-let useUpdateEffect=(r,f)=>{let o=useFirstMountState();useEffect(()=>{if(!o)return r()},f);};
-
-let useWindowSize=(o,n)=>{let[d,w]=useState(0),[m,u]=useState(0);return useEffect(()=>{let e=()=>{w(window.innerWidth),u(window.innerHeight);},i=o?listenResizeDebounced(0,e,o,n):listenResize(e);return e(),i},[o,n]),[d,m]};
-
-export { FaviconTags, Meta, NoJs, classed, createUseMediaQueryWidth, extendComponent, mergeRefs, useAsyncFn, useFirstMountState, useFixedOffset, useFocus, useInterval, useIsomorphicLayoutEffect, useKeyUp, useMeasure, useMountedState, useNavigateAway, usePrevious, usePreviousRef, useScrollPosition, useScrollThreshold, useSmoothScroll, useSpinDelay, useTraceUpdate, useUpdateEffect, useWindowSize };

package/utils/Polymorphic.js

@@ -1 +0,0 @@
-export {};

package/utils/classed.js

@@ -1,40 +0,0 @@
-import React, { createElement, forwardRef } from "react";
-export let classed = (component) => {
-    const type = component.type || component;
-    return function (strings, ...args) {
-        const WrappedComponent = forwardRef(function (props, ref) {
-            const argResolved = args
-                .map((arg, index) => {
-                let result = "";
-                if (typeof arg === "function") {
-                    result = arg(props);
-                }
-                else if (typeof arg !== "undefined") {
-                    result = arg.toString();
-                }
-                return strings[index] + result;
-            })
-                .join("");
-            const isNativeHtmlElement = typeof type === "string";
-            const propsToForward = isNativeHtmlElement
-                ? {}
-                : props;
-            if (isNativeHtmlElement) {
-                for (const key in props) {
-                    if (!key.startsWith("$")) {
-                        propsToForward[key] = props[key];
-                    }
-                }
-            }
-            let className = argResolved || strings[0];
-            className = className.match(/class="([^"]*)/)?.[1] || className;
-            className += props?.className ? " " + props?.className : "";
-            return createElement(type, {
-                ...propsToForward,
-                className: className || undefined,
-                ref,
-            });
-        });
-        return WrappedComponent;
-    };
-};

package/utils/createUseMediaQueryWidth.js

@@ -1,37 +0,0 @@
-import { useState } from "react";
-import { getMediaQueryWidthResolvers, isUndefined, } from "@koine/utils";
-import { useIsomorphicLayoutEffect } from "../hooks";
-export let createUseMediaQueryWidth = (customBreakpoints) => {
-    const queryResolvers = getMediaQueryWidthResolvers(customBreakpoints);
-    return function useMediaQueryWidth(media, serverValue) {
-        const definition = media.substring(1);
-        let [rule, ruleBreakpoint] = definition.split("-");
-        if (isUndefined(ruleBreakpoint)) {
-            ruleBreakpoint = rule;
-        }
-        if (isUndefined(rule)) {
-            rule = "min";
-        }
-        const [br1, br2] = ruleBreakpoint.split("_");
-        const query = queryResolvers[rule](br1, br2);
-        const [matches, setMatches] = useState(isUndefined(serverValue) ? null : serverValue);
-        useIsomorphicLayoutEffect(() => {
-            const mq = window.matchMedia(query);
-            const handleChange = (event) => {
-                setMatches(event.matches);
-            };
-            setMatches(mq.matches);
-            if (!mq.addEventListener) {
-                mq.addListener(handleChange);
-                return () => {
-                    mq.removeListener(handleChange);
-                };
-            }
-            mq.addEventListener("change", handleChange);
-            return () => {
-                mq.removeEventListener("change", handleChange);
-            };
-        }, [query]);
-        return matches;
-    };
-};

package/utils/extendComponent.js

@@ -1,8 +0,0 @@
-import { createElement } from "react";
-export let extendComponent = (component, defaultProps) => {
-    const NewComponent = (props) => createElement(component, props);
-    return Object.assign(NewComponent, {
-        ...defaultProps,
-        defaultProps,
-    });
-};

package/utils/index.d.ts

@@ -1,5 +0,0 @@
-export { classed } from "./classed";
-export { createUseMediaQueryWidth, type MediaQuerWidthDef, type MediaQueryWidth, } from "./createUseMediaQueryWidth";
-export { type ExtendableComponent, type OverridableComponents, type WithComponents, extendComponent, } from "./extendComponent";
-export { mergeRefs } from "./mergeRefs";
-export type { Polymorphic } from "./Polymorphic";

package/utils/index.js

@@ -1,4 +0,0 @@
-export { classed } from "./classed";
-export { createUseMediaQueryWidth, } from "./createUseMediaQueryWidth";
-export { extendComponent, } from "./extendComponent";
-export { mergeRefs } from "./mergeRefs";

package/utils/mergeRefs.js

@@ -1,12 +0,0 @@
-export let mergeRefs = (refs) => {
-    return (value) => {
-        refs.forEach((ref) => {
-            if (typeof ref === "function") {
-                ref(value);
-            }
-            else if (ref != null) {
-                ref.current = value;
-            }
-        });
-    };
-};