@koine/react 1.0.105 → 1.1.0

package/hooks/index.d.ts

@@ -4,12 +4,15 @@ export * from "./useEffectOnce";
 export * from "./useFirstMountState";
 export * from "./useFixedOffset";
 export * from "./useFocus";
-export * from "./useId";
+export * from "./useInterval";
 export * from "./useIsomorphicLayoutEffect";
+export * from "./useKeyUp";
 export * from "./useMeasure";
 export * from "./useMount";
 export * from "./useMountedState";
+export * from "./useNavigateAway";
 export * from "./usePrevious";
+export * from "./usePreviousRef";
 export * from "./useScrollPosition";
 export * from "./useSmoothScroll";
 export * from "./useTraceUpdate";

package/hooks/index.js

@@ -4,12 +4,15 @@ export * from "./useEffectOnce";
 export * from "./useFirstMountState";
 export * from "./useFixedOffset";
 export * from "./useFocus";
-export * from "./useId";
+export * from "./useInterval";
 export * from "./useIsomorphicLayoutEffect";
+export * from "./useKeyUp";
 export * from "./useMeasure";
 export * from "./useMount";
 export * from "./useMountedState";
+export * from "./useNavigateAway";
 export * from "./usePrevious";
+export * from "./usePreviousRef";
 export * from "./useScrollPosition";
 // export * from "./useScrollTo";
 export * from "./useSmoothScroll";

package/hooks/types.d.ts

@@ -1,8 +1,8 @@
 /**
  * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/misc/types.ts)
  */
-export declare type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
+export type PromiseType<P extends Promise<any>> = P extends Promise<infer T> ? T : never;
 /**
  * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/misc/types.ts)
  */
-export declare type FunctionReturningPromise = (...args: any[]) => Promise<any>;
+export type FunctionReturningPromise = (...args: any[]) => Promise<any>;

package/hooks/useAsyncFn.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import type { FunctionReturningPromise, PromiseType } from "./types";
-export declare type AsyncState<T> = {
+export type AsyncState<T> = {
     loading: boolean;
     error?: undefined;
     value?: undefined;
@@ -17,10 +17,10 @@ export declare type AsyncState<T> = {
     error?: undefined;
     value: T;
 };
-declare type StateFromFunctionReturningPromise<T extends FunctionReturningPromise> = AsyncState<PromiseType<ReturnType<T>>>;
-export declare type AsyncFnReturn<T extends FunctionReturningPromise = FunctionReturningPromise> = [StateFromFunctionReturningPromise<T>, T];
+type StateFromFunctionReturningPromise<T extends FunctionReturningPromise> = AsyncState<PromiseType<ReturnType<T>>>;
+export type AsyncFnReturn<T extends FunctionReturningPromise = FunctionReturningPromise> = [StateFromFunctionReturningPromise<T>, T];
 /**
  * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useAsyncFn.ts)
  */
 export declare function useAsyncFn<T extends FunctionReturningPromise>(fn: T, deps?: React.DependencyList, initialState?: StateFromFunctionReturningPromise<T>): AsyncFnReturn<T>;
-export {};
+export default useAsyncFn;

package/hooks/useAsyncFn.js

@@ -34,3 +34,4 @@ export function useAsyncFn(fn, deps, initialState) {
     }, deps);
     return [state, callback];
 }
+export default useAsyncFn;

package/hooks/useDateLocale.d.ts

@@ -5,3 +5,4 @@
  * @see https://robertmarshall.dev/blog/dynamically-import-datefns-locale-mui-datepicker-localization/
  */
 export declare function useDateLocale(locale?: string, defaultLocale?: string): globalThis.Locale | undefined;
+export default useDateLocale;

package/hooks/useDateLocale.js

@@ -36,3 +36,4 @@ export function useDateLocale(locale, defaultLocale) {
     }, [locale, current]);
     return data;
 }
+export default useDateLocale;

package/hooks/useEffectOnce.d.ts

@@ -3,3 +3,4 @@ import React from "react";
  * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useEffectOnce.ts)
  */
 export declare const useEffectOnce: (effect: React.EffectCallback) => void;
+export default useEffectOnce;

package/hooks/useEffectOnce.js

@@ -6,3 +6,4 @@ export var useEffectOnce = function (effect) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     useEffect(effect, []);
 };
+export default useEffectOnce;

package/hooks/useFirstMountState.d.ts

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

package/hooks/useFirstMountState.js

@@ -10,3 +10,4 @@ export function useFirstMountState() {
     }
     return isFirst.current;
 }
+export default useFirstMountState;

package/hooks/useFocus.d.ts

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

package/hooks/useFocus.js

@@ -9,3 +9,4 @@ export var useFocus = function () {
     };
     return [element, setFocus];
 };
+export default useFocus;

package/hooks/useId.d.ts

@@ -2,3 +2,4 @@
  * FIXME: once we can move to react 18 just replace this import with `{ useId } from "react";`
  */
 export declare function useId(prefix?: string): string;
+export default useId;

package/hooks/useId.js

@@ -6,3 +6,4 @@ export function useId(prefix) {
     if (prefix === void 0) { prefix = "uid"; }
     return "".concat(prefix, "-").concat(uid());
 }
+export default useId;

package/hooks/useInterval.d.ts

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

package/hooks/useInterval.js

@@ -0,0 +1,28 @@
+import { __spreadArray } from "tslib";
+import { useEffect, useRef } from "react";
+import { noop } from "@koine/utils";
+/**
+ * @borrows [dan abramov](https://overreacted.io/making-setinterval-declarative-with-react-hooks/)
+ *
+ * We just add `deps` array argument and typescript support
+ */
+export function useInterval(callback, delay, deps) {
+    if (deps === void 0) { deps = []; }
+    var savedCallback = useRef();
+    useEffect(function () {
+        savedCallback.current = callback;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, __spreadArray([callback], deps, true));
+    useEffect(function () {
+        function tick() {
+            if (savedCallback.current)
+                savedCallback.current();
+        }
+        if (delay !== null) {
+            var id_1 = setInterval(tick, delay);
+            return function () { return clearInterval(id_1); };
+        }
+        return noop;
+    }, [delay]);
+}
+export default useInterval;

package/hooks/useIsomorphicLayoutEffect.d.ts

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

package/hooks/useIsomorphicLayoutEffect.js

@@ -6,3 +6,4 @@ import { isBrowser } from "@koine/utils";
 export var useIsomorphicLayoutEffect = isBrowser
     ? useLayoutEffect
     : useEffect;
+export default useIsomorphicLayoutEffect;

package/hooks/useKeyUp.d.ts

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

package/hooks/useKeyUp.js

@@ -0,0 +1,23 @@
+import { __spreadArray } from "tslib";
+import { useEffect } from "react";
+import { on } from "@koine/dom";
+export function useKeyUp(callback, deps) {
+    if (deps === void 0) { deps = []; }
+    useEffect(function () {
+        var listener = on(window, "keyup", function (event) {
+            // 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
+            if (!event.ctrlKey &&
+                !event.altKey &&
+                !event.shiftKey &&
+                !event.metaKey) {
+                callback(event);
+            }
+        });
+        return listener;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, __spreadArray([callback], deps, true));
+}
+export default useKeyUp;

package/hooks/useMeasure.d.ts

@@ -9,11 +9,11 @@ interface RectReadOnly {
     readonly left: number;
     [key: string]: number;
 }
-declare type HTMLOrSVGElement = HTMLElement | SVGElement;
-export declare type UseMeasureOptions = {
+type HTMLOrSVGElement = HTMLElement | SVGElement;
+export type UseMeasureOptions = {
     scroll?: boolean;
 };
-export declare type UseMeasureReturn = [
+export type UseMeasureReturn = [
     (element: HTMLOrSVGElement | null) => void,
     RectReadOnly,
     () => void

package/hooks/useMount.d.ts

@@ -2,3 +2,4 @@
  * @borrows [streamich/react-use](https://github.com/streamich/react-use/blob/master/src/useMount.ts)
  */
 export declare const useMount: (fn: () => void) => void;
+export default useMount;

package/hooks/useMount.js

@@ -7,3 +7,4 @@ export var useMount = function (fn) {
         fn();
     });
 };
+export default useMount;

package/hooks/useMountedState.d.ts

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

package/hooks/useMountedState.js

@@ -13,3 +13,4 @@ export function useMountedState() {
     }, []);
     return get;
 }
+export default useMountedState;

package/hooks/useNavigateAway.d.ts

@@ -0,0 +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 const useNavigateAway: (handler: UseNavigateAwayHandler) => void;
+export default useNavigateAway;

package/hooks/useNavigateAway.js

@@ -0,0 +1,68 @@
+import { useEffect, useRef } from "react";
+import { on } from "@koine/dom";
+// 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
+ */
+export var useNavigateAway = function (handler) {
+    var beforeUnloadHandlerRef = useRef();
+    // const pagehideHandlerRef = useRef<UseNavigateAwayPagehideHandler | undefined>();
+    useEffect(function () {
+        beforeUnloadHandlerRef.current = function (event) {
+            var customMessageOrCondition = handler(event);
+            if (customMessageOrCondition) {
+                event.preventDefault();
+            }
+            // Handle legacy `event.returnValue` property
+            // https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event
+            if (typeof customMessageOrCondition === "string") {
+                return (event.returnValue = customMessageOrCondition);
+            }
+            // 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
+            if (event.defaultPrevented) {
+                return (event.returnValue = "");
+            }
+            return;
+        };
+        // 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.
+        //   }
+        // };
+    }, [handler]);
+    useEffect(function () {
+        var listenerBeforeunload = on(window, "beforeunload", function (event) { var _a; return (_a = beforeUnloadHandlerRef.current) === null || _a === void 0 ? void 0 : _a.call(beforeUnloadHandlerRef, event); });
+        // const listenerPagehide = on(window, "pagehide", (event) =>
+        //   pagehideHandlerRef.current?.(event)
+        // );
+        return listenerBeforeunload;
+        // return () => {
+        //   listenerBeforeunload();
+        //   // listenerPagehide();
+        // };
+    }, []);
+};
+export default useNavigateAway;

package/hooks/usePrevious.d.ts

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

package/hooks/usePrevious.js

@@ -1,8 +1,12 @@
-import { useEffect, useRef } from "react";
-export function usePrevious(value) {
-    var ref = useRef();
-    useEffect(function () {
-        ref.current = value;
-    });
-    return ref.current;
+import { useState } from "react";
+/**
+ * @borrows [samselikoff/animated-carousel](https://github.com/samselikoff/2022-06-02-animated-carousel/blob/main/pages/final.jsx)
+ */
+export function usePrevious(state, defaulValue) {
+    var _a = useState([state, defaulValue]), tuple = _a[0], setTuple = _a[1];
+    if (tuple[1] !== state) {
+        setTuple([tuple[1], state]);
+    }
+    return tuple[0];
 }
+export default usePrevious;

package/hooks/usePreviousRef.d.ts

@@ -0,0 +1,2 @@
+export declare function usePreviousRef<T>(value: T): T | undefined;
+export default usePreviousRef;

package/hooks/usePreviousRef.js

@@ -0,0 +1,9 @@
+import { useEffect, useRef } from "react";
+export function usePreviousRef(value) {
+    var ref = useRef();
+    useEffect(function () {
+        ref.current = value;
+    });
+    return ref.current;
+}
+export default usePreviousRef;

package/hooks/useScrollPosition.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-declare type Position = {
+type Position = {
     x: number;
     y: number;
 };
-declare type ElementRef = React.MutableRefObject<HTMLElement | undefined>;
+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>`
  *
@@ -12,4 +12,4 @@ declare type ElementRef = React.MutableRefObject<HTMLElement | undefined>;
  * - compacted object arguments in functions as plain argument list to improve compression
  */
 export declare const useScrollPosition: (effect: (currentPosition: Position, prevPosition: Position) => void, deps?: import("react").DependencyList, element?: ElementRef, useWindow?: boolean, wait?: number, boundingElement?: ElementRef) => void;
-export {};
+export default useScrollPosition;

package/hooks/useScrollPosition.js

@@ -78,3 +78,4 @@ export var useScrollPosition = function (effect, deps, element, useWindow, wait,
         };
     }, deps);
 };
+export default useScrollPosition;

package/hooks/useScrollTo.d.ts

@@ -1 +1,2 @@
 export declare function useScrollTo(id?: string, offset?: number): void;
+export default useScrollTo;

package/hooks/useScrollTo.js

@@ -19,3 +19,4 @@ export function useScrollTo(id, offset) {
     top -= headerOffset;
     window.scroll(0, top);
 }
+export default useScrollTo;

package/hooks/useTraceUpdate.d.ts

@@ -2,3 +2,4 @@
  * @see https://stackoverflow.com/a/51082563/9122820
  */
 export declare function useTraceUpdate(props: any): void;
+export default useTraceUpdate;

package/hooks/useTraceUpdate.js

@@ -19,3 +19,4 @@ export function useTraceUpdate(props) {
         prev.current = props;
     });
 }
+export default useTraceUpdate;

package/hooks/useUpdateEffect.d.ts

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

package/hooks/useUpdateEffect.js

@@ -12,3 +12,4 @@ export var useUpdateEffect = function (effect, deps) {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, deps);
 };
+export default useUpdateEffect;

package/hooks/useWindowSize.d.ts

@@ -1 +1,2 @@
 export declare function useWindowSize(): number[];
+export default useWindowSize;

package/hooks/useWindowSize.js

@@ -1,13 +1,15 @@
 import { useEffect, useState } from "react";
+import { on } from "@koine/dom";
 export function useWindowSize() {
     var _a = useState([0, 0]), size = _a[0], setSize = _a[1];
     useEffect(function () {
         function updateSize() {
             setSize([window.innerWidth, window.innerHeight]);
         }
-        window.addEventListener("resize", updateSize);
+        var listener = on(window, "resize", updateSize);
         updateSize();
-        return function () { return window.removeEventListener("resize", updateSize); };
+        return listener;
     }, []);
     return size;
 }
+export default useWindowSize;

package/m/MotionProvider.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { LazyProps } from "framer-motion";
-export declare type MotionProviderFeatures = LazyProps["features"];
-export declare type MotionProviderProps = LazyProps & React.PropsWithChildren<{}>;
+export type MotionProviderFeatures = LazyProps["features"];
+export type MotionProviderProps = LazyProps & React.PropsWithChildren<{}>;
 /**
  * `<LazyMotion />` provider wrapper from `framer-motion`
  *

package/node/Collapsable/CollapsableReach.js

@@ -5,7 +5,7 @@
  * Maybe do a simplified version following this example:
  * https://codesandbox.io/s/framer-motion-accordion-qx958?file=/src/Example.tsx
  */
-// import { forwardRef, useCallback, useEffect, /* useId, */ useRef, useState } from "react";
+// import { forwardRef, useCallback, useEffect, useId, useRef, useState } from "react";
 // import styled from "styled-components";
 // import { MotionProps, m } from "framer-motion";
 // import {
@@ -17,7 +17,6 @@
 // import { btnStyleReset } from "../Buttons";
 // import { useWindowSize } from "../hooks/useWindowSize";
 // import { InputInvisible } from "../Forms/styles";
-// import { useId } from "../hooks/useId";
 // export type CollapsableStyledProps = {
 //   $expanded?: boolean;
 // };

package/node/Dialog/DialogMui.js

@@ -70,7 +70,7 @@ var DialogWithRef = (0, react_1.forwardRef)(function Dialog(_a, ref) {
             onClose(event, "backdropClick");
         }
     };
-    return ((0, jsx_runtime_1.jsx)(exports.Root, tslib_1.__assign({ components: { Backdrop: exports.Backdrop }, onClick: handleBackdropClick, onClose: onClose, ref: ref }, props, { children: (0, jsx_runtime_1.jsx)(exports.Container, tslib_1.__assign({ "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsxs)(exports.Paper, tslib_1.__assign({ "aria-label": title || "", "$scrollPaper": $scrollPaper }, { children: [title && (0, jsx_runtime_1.jsx)(exports.Header, { children: title }), (0, jsx_runtime_1.jsx)(exports.Close, tslib_1.__assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) })), (0, jsx_runtime_1.jsx)(exports.Body, { children: children })] })) })) })));
+    return ((0, jsx_runtime_1.jsx)(exports.Root, tslib_1.__assign({ slots: { backdrop: exports.Backdrop }, onClick: handleBackdropClick, onClose: onClose, ref: ref }, props, { children: (0, jsx_runtime_1.jsx)(exports.Container, tslib_1.__assign({ "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsxs)(exports.Paper, tslib_1.__assign({ "aria-label": title || "", "$scrollPaper": $scrollPaper }, { children: [title && (0, jsx_runtime_1.jsx)(exports.Header, { children: title }), (0, jsx_runtime_1.jsx)(exports.Close, tslib_1.__assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) })), (0, jsx_runtime_1.jsx)(exports.Body, { children: children })] })) })) })));
 });
 exports.KoineDialog = (0, helpers_1.extendComponent)(DialogWithRef, {
     Root: exports.Root,

package/node/Dialog/m/bare.js

@@ -40,7 +40,7 @@ var Dialog = (0, react_1.forwardRef)(function Dialog(_a, ref) {
             onClose(event, "backdropClick");
         }
     };
-    return ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({ keepMounted: true, components: { Backdrop: BackdropMotion }, onClick: handleBackdropClick, onClose: onClose, ref: ref }, props, { style: (0, index_1.mRootStyle)(props) }, { children: (0, jsx_runtime_1.jsx)(Container, tslib_1.__assign({ "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: props.open && (
+    return ((0, jsx_runtime_1.jsx)(Root, tslib_1.__assign({ keepMounted: true, slots: { backdrop: BackdropMotion }, onClick: handleBackdropClick, onClose: onClose, ref: ref }, props, { style: (0, index_1.mRootStyle)(props) }, { children: (0, jsx_runtime_1.jsx)(Container, tslib_1.__assign({ "$scrollPaper": $scrollPaper, onMouseDown: handleMouseDown }, { children: (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: props.open && (
                 // @ts-expect-error framer props collision...
                 (0, jsx_runtime_1.jsxs)(Paper, tslib_1.__assign({}, mPaper, { "aria-label": title || "", "$scrollPaper": $scrollPaper }, { children: [title && (0, jsx_runtime_1.jsx)(Header, { children: title }), (0, jsx_runtime_1.jsx)(Close, tslib_1.__assign({ onClick: onClose }, { children: (0, jsx_runtime_1.jsx)(md_1.MdClear, {}) })), (0, jsx_runtime_1.jsx)(Body, { children: children })] }))) }) })) })));
 });

package/node/Favicon/FaviconTags.js

@@ -14,6 +14,6 @@ var jsx_runtime_1 = require("react/jsx-runtime");
  */
 var FaviconTags = function (_a) {
     var name = _a.name, color = _a.color, safariTabColor = _a.safariTabColor, tileColor = _a.tileColor, themeColor = _a.themeColor;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("link", { rel: "apple-touch-icon", sizes: "180x180", href: "/apple-touch-icon.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: "image/png", sizes: "32x32", href: "/favicon-32x32.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: "image/png", sizes: "16x16", href: "/favicon-16x16.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "manifest", href: "/site.webmanifest" }), (0, jsx_runtime_1.jsx)("link", { rel: "mask-icon", href: "/safari-pinned-tab.svg", color: safariTabColor || color }), (0, jsx_runtime_1.jsx)("meta", { name: "apple-mobile-web-app-title", content: name }), (0, jsx_runtime_1.jsx)("meta", { name: "application-name", content: name }), (0, jsx_runtime_1.jsx)("meta", { name: "msapplication-TileColor", content: tileColor || color }), (0, jsx_runtime_1.jsx)("meta", { name: "theme-color", content: themeColor || color })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("link", { rel: "shortcut icon", href: "/favicon.ico", type: "image/x-icon" }), (0, jsx_runtime_1.jsx)("link", { rel: "apple-touch-icon", sizes: "180x180", href: "/apple-touch-icon.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: "image/png", sizes: "32x32", href: "/favicon-32x32.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "icon", type: "image/png", sizes: "16x16", href: "/favicon-16x16.png" }), (0, jsx_runtime_1.jsx)("link", { rel: "manifest", href: "/site.webmanifest" }), (0, jsx_runtime_1.jsx)("link", { rel: "mask-icon", href: "/safari-pinned-tab.svg", color: safariTabColor || color }), (0, jsx_runtime_1.jsx)("meta", { name: "apple-mobile-web-app-title", content: name }), (0, jsx_runtime_1.jsx)("meta", { name: "application-name", content: name }), (0, jsx_runtime_1.jsx)("meta", { name: "msapplication-TileColor", content: tileColor || color }), (0, jsx_runtime_1.jsx)("meta", { name: "theme-color", content: themeColor || color })] }));
 };
 exports.FaviconTags = FaviconTags;

package/node/Menu/MenuMui.js

@@ -67,7 +67,7 @@ exports.Menu = (0, react_1.forwardRef)(function Menu(props, ref) {
         var childrenProps = { close: close };
         return children(childrenProps);
     }, [children, close]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button, { ref: buttonRef, id: id, "aria-haspopup": "true", "aria-controls": open ? id : undefined, "aria-expanded": open ? "true" : undefined, onClick: handleButtonClick, onKeyDown: handleButtonKeyDown }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: open && ((0, jsx_runtime_1.jsx)(ModalUnstyled_1.default, tslib_1.__assign({ components: { Backdrop: MenuBackdrop }, onClose: close, onBackdropClick: close, open: open }, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.default, tslib_1.__assign({ onClickAway: close }, { children: (0, jsx_runtime_1.jsx)(MenuRoot, tslib_1.__assign({ initial: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button, { ref: buttonRef, id: id, "aria-haspopup": "true", "aria-controls": open ? id : undefined, "aria-expanded": open ? "true" : undefined, onClick: handleButtonClick, onKeyDown: handleButtonKeyDown }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: open && ((0, jsx_runtime_1.jsx)(ModalUnstyled_1.default, tslib_1.__assign({ slots: { backdrop: MenuBackdrop }, onClose: close, onBackdropClick: close, open: open }, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.default, tslib_1.__assign({ onClickAway: close }, { children: (0, jsx_runtime_1.jsx)(MenuRoot, tslib_1.__assign({ initial: {
                                     opacity: 0,
                                 }, animate: {
                                     opacity: 1,

package/node/Tabs/TabsMui.js

@@ -15,7 +15,7 @@ exports.List = TabsListUnstyled_1.default;
 exports.Indicator = "span";
 exports.Panel = TabPanelUnstyled_1.default;
 exports.Tab = (0, react_1.forwardRef)(function Tab(_a, ref) {
-    var children = _a.children, component = _a.component, componentsProps = _a.componentsProps, components = _a.components, Indicator = _a.Indicator, props = tslib_1.__rest(_a, ["children", "component", "componentsProps", "components", "Indicator"]);
+    var children = _a.children, component = _a.component, slotProps = _a.slotProps, slots = _a.slots, Indicator = _a.Indicator, props = tslib_1.__rest(_a, ["children", "component", "slotProps", "slots", "Indicator"]);
     var _b = (0, TabUnstyled_1.useTab)(tslib_1.__assign(tslib_1.__assign({}, props), { ref: ref })), active = _b.active, disabled = _b.disabled, selected = _b.selected;
     var indicatorProps = { active: active, disabled: disabled, selected: selected };
     return ((0, jsx_runtime_1.jsxs)(TabUnstyled_1.default /* ref={ref}  */, tslib_1.__assign({}, props, { children: [children, Indicator && (0, jsx_runtime_1.jsx)(Indicator, tslib_1.__assign({}, indicatorProps))] })));

package/node/helpers/classed.js

@@ -70,3 +70,4 @@ function classed(component) {
     };
 }
 exports.classed = classed;
+exports.default = classed;

package/node/helpers/extend-component.js

@@ -14,3 +14,4 @@ var extendComponent = function (component, defaultProps) {
     return Object.assign(NewComponent, tslib_1.__assign(tslib_1.__assign({}, defaultProps), { defaultProps: defaultProps }));
 };
 exports.extendComponent = extendComponent;
+exports.default = exports.extendComponent;

package/node/hooks/index.js

@@ -7,12 +7,15 @@ tslib_1.__exportStar(require("./useEffectOnce"), exports);
 tslib_1.__exportStar(require("./useFirstMountState"), exports);
 tslib_1.__exportStar(require("./useFixedOffset"), exports);
 tslib_1.__exportStar(require("./useFocus"), exports);
-tslib_1.__exportStar(require("./useId"), exports);
+tslib_1.__exportStar(require("./useInterval"), exports);
 tslib_1.__exportStar(require("./useIsomorphicLayoutEffect"), exports);
+tslib_1.__exportStar(require("./useKeyUp"), exports);
 tslib_1.__exportStar(require("./useMeasure"), exports);
 tslib_1.__exportStar(require("./useMount"), exports);
 tslib_1.__exportStar(require("./useMountedState"), exports);
+tslib_1.__exportStar(require("./useNavigateAway"), exports);
 tslib_1.__exportStar(require("./usePrevious"), exports);
+tslib_1.__exportStar(require("./usePreviousRef"), exports);
 tslib_1.__exportStar(require("./useScrollPosition"), exports);
 // export * from "./useScrollTo";
 tslib_1.__exportStar(require("./useSmoothScroll"), exports);

package/node/hooks/useAsyncFn.js

@@ -38,3 +38,4 @@ function useAsyncFn(fn, deps, initialState) {
     return [state, callback];
 }
 exports.useAsyncFn = useAsyncFn;
+exports.default = useAsyncFn;