@codefast/ui 0.3.9 → 0.3.10

package/dist/css/zinc.css

@@ -1 +1,95 @@
-:root{--input:oklch(92% .004 286.32);--border:oklch(92% .004 286.32);--ring:oklch(70.5% .015 286.067);--background:oklch(100% 0 0);--foreground:oklch(14.1% .005 285.823);--primary:oklch(21% .006 285.885);--primary-foreground:oklch(98.5% 0 0);--secondary:oklch(96.7% .001 286.375);--secondary-foreground:oklch(21% .006 285.885);--destructive:oklch(57.7% .245 27.325);--accent:oklch(96.7% .001 286.375);--accent-foreground:oklch(21% .006 285.885);--muted:oklch(96.7% .001 286.375);--muted-foreground:oklch(55.2% .016 285.938);--popover:oklch(100% 0 0);--popover-foreground:oklch(14.1% .005 285.823);--card:oklch(100% 0 0);--card-foreground:oklch(14.1% .005 285.823);--sidebar:oklch(98.5% 0 0);--sidebar-foreground:oklch(14.1% .005 285.823);--sidebar-primary:oklch(21% .006 285.885);--sidebar-primary-foreground:oklch(98.5% 0 0);--sidebar-accent:oklch(96.7% .001 286.375);--sidebar-accent-foreground:oklch(21% .006 285.885);--sidebar-border:oklch(92% .004 286.32);--sidebar-ring:oklch(70.5% .015 286.067);--chart-1:oklch(64.6% .222 41.116);--chart-2:oklch(60% .118 184.704);--chart-3:oklch(39.8% .07 227.392);--chart-4:oklch(82.8% .189 84.429);--chart-5:oklch(76.9% .188 70.08)}.dark{--input:oklch(100% 0 0/.15);--border:oklch(100% 0 0/.1);--ring:oklch(55.2% .016 285.938);--background:oklch(14.1% .005 285.823);--foreground:oklch(98.5% 0 0);--primary:oklch(92% .004 286.32);--primary-foreground:oklch(21% .006 285.885);--secondary:oklch(27.4% .006 286.033);--secondary-foreground:oklch(98.5% 0 0);--destructive:oklch(70.4% .191 22.216);--accent:oklch(27.4% .006 286.033);--accent-foreground:oklch(98.5% 0 0);--muted:oklch(27.4% .006 286.033);--muted-foreground:oklch(70.5% .015 286.067);--popover:oklch(21% .006 285.885);--popover-foreground:oklch(98.5% 0 0);--card:oklch(21% .006 285.885);--card-foreground:oklch(98.5% 0 0);--sidebar:oklch(21% .006 285.885);--sidebar-foreground:oklch(98.5% 0 0);--sidebar-primary:oklch(48.8% .243 264.376);--sidebar-primary-foreground:oklch(98.5% 0 0);--sidebar-accent:oklch(27.4% .006 286.033);--sidebar-accent-foreground:oklch(98.5% 0 0);--sidebar-border:oklch(100% 0 0/.1);--sidebar-ring:oklch(55.2% .016 285.938);--chart-1:oklch(48.8% .243 264.376);--chart-2:oklch(69.6% .17 162.48);--chart-3:oklch(76.9% .188 70.08);--chart-4:oklch(62.7% .265 303.9);--chart-5:oklch(64.5% .246 16.439)}
+:root {
+  --input: oklch(0.92 0.004 286.32); /* --color-zinc-200 */
+  --border: oklch(0.92 0.004 286.32); /* --color-zinc-200 */
+
+  --ring: oklch(0.705 0.015 286.067); /* --color-zinc-400 */
+
+  --background: oklch(1 0 0); /* --color-zinc-50 */
+  --foreground: oklch(0.141 0.005 285.823); /* --color-zinc-950 */
+
+  --primary: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+  --primary-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --secondary: oklch(0.967 0.001 286.375); /* --color-zinc-100 */
+  --secondary-foreground: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+
+  --destructive: oklch(0.577 0.245 27.325); /* --color-red-600 */
+
+  --accent: oklch(0.967 0.001 286.375); /* --color-zinc-100 */
+  --accent-foreground: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+
+  --muted: oklch(0.967 0.001 286.375); /* --color-zinc-100 */
+  --muted-foreground: oklch(0.552 0.016 285.938); /* --color-zinc-500 */
+
+  --popover: oklch(1 0 0); /* --color-zinc-50 */
+  --popover-foreground: oklch(0.141 0.005 285.823); /* --color-zinc-950 */
+
+  --card: oklch(1 0 0); /* --color-zinc-50 */
+  --card-foreground: oklch(0.141 0.005 285.823); /* --color-zinc-950 */
+
+  --sidebar: oklch(0.985 0 0); /* --color-zinc-50 */
+  --sidebar-foreground: oklch(0.141 0.005 285.823); /* --color-zinc-950 */
+
+  --sidebar-primary: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+  --sidebar-primary-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --sidebar-accent: oklch(0.967 0.001 286.375); /* --color-zinc-100 */
+  --sidebar-accent-foreground: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+
+  --sidebar-border: oklch(0.92 0.004 286.32); /* --color-zinc-200 */
+  --sidebar-ring: oklch(0.705 0.015 286.067); /* --color-zinc-400 */
+
+  --chart-1: oklch(0.646 0.222 41.116); /* --color-orange-600 */
+  --chart-2: oklch(0.6 0.118 184.704); /* --color-teal-600 */
+  --chart-3: oklch(0.398 0.07 227.392); /* --color-cyan-900 */
+  --chart-4: oklch(0.828 0.189 84.429); /* --color-amber-400 */
+  --chart-5: oklch(0.769 0.188 70.08); /* --color-amber-500 */
+}
+
+.dark {
+  --input: oklch(1 0 0 / 15%); /* --color-white */
+  --border: oklch(1 0 0 / 10%); /* --color-white */
+
+  --ring: oklch(0.552 0.016 285.938); /* --color-zinc-500 */
+
+  --background: oklch(0.141 0.005 285.823); /* --color-zinc-950 */
+  --foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --primary: oklch(0.92 0.004 286.32); /* --color-zinc-200 */
+  --primary-foreground: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+
+  --secondary: oklch(0.274 0.006 286.033); /* --color-zinc-800 */
+  --secondary-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --destructive: oklch(0.704 0.191 22.216); /* --color-red-400 */
+
+  --accent: oklch(0.274 0.006 286.033); /* --color-zinc-800 */
+  --accent-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --muted: oklch(0.274 0.006 286.033); /* --color-zinc-800 */
+  --muted-foreground: oklch(0.705 0.015 286.067); /* --color-zinc-400 */
+
+  --popover: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+  --popover-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --card: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+  --card-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --sidebar: oklch(0.21 0.006 285.885); /* --color-zinc-900 */
+  --sidebar-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --sidebar-primary: oklch(0.488 0.243 264.376); /* --color-blue-700 */
+  --sidebar-primary-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --sidebar-accent: oklch(0.274 0.006 286.033); /* --color-zinc-800 */
+  --sidebar-accent-foreground: oklch(0.985 0 0); /* --color-zinc-50 */
+
+  --sidebar-border: oklch(1 0 0 / 10%); /* --color-white */
+  --sidebar-ring: oklch(0.552 0.016 285.938); /* --color-zinc-500 */
+
+  --chart-1: oklch(0.488 0.243 264.376); /* --color-blue-700 */
+  --chart-2: oklch(0.696 0.17 162.48); /* --color-emerald-500 */
+  --chart-3: oklch(0.769 0.188 70.08); /* --color-amber-500 */
+  --chart-4: oklch(0.627 0.265 303.9); /* --color-purple-500 */
+  --chart-5: oklch(0.645 0.246 16.439); /* --color-rose-500 */
+}

package/dist/hooks/use-animated-value.cjs

@@ -1,2 +1,75 @@
+"use strict";
 "use client";
-"use strict";const __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,_)=>{for(var r in _)__webpack_require__.o(_,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:_[r]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{useAnimatedValue:()=>useAnimatedValue});const external_react_namespaceObject=require("react");function useAnimatedValue(e,_,r){let t=e??0,[a,c]=(0,external_react_namespaceObject.useState)(t),n=(0,external_react_namespaceObject.useRef)(t);return(0,external_react_namespaceObject.useEffect)(()=>{n.current=a},[a]),(0,external_react_namespaceObject.useEffect)(()=>{let e;if(!r)return void c(t);let a=n.current,u=t-a,i=performance.now();if(_<=0||0===u)return void c(t);let o=r=>{let n=r-i;if(n>=_)c(t);else{let r=n/_;c(a+u*(1-(1-r)*(1-r))),e=requestAnimationFrame(o)}};return e=requestAnimationFrame(o),()=>{cancelAnimationFrame(e)}},[t,_,r]),Math.round(a)}for(var __webpack_i__ in exports.useAnimatedValue=__webpack_exports__.useAnimatedValue,__webpack_exports__)-1===["useAnimatedValue"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useAnimatedValue: ()=>useAnimatedValue
+});
+const external_react_namespaceObject = require("react");
+function useAnimatedValue(targetValue, duration, animate) {
+    const actualTargetValue = targetValue ?? 0;
+    const [animatedValue, setAnimatedValue] = (0, external_react_namespaceObject.useState)(actualTargetValue);
+    const animatedValueRef = (0, external_react_namespaceObject.useRef)(actualTargetValue);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        animatedValueRef.current = animatedValue;
+    }, [
+        animatedValue
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!animate) return void setAnimatedValue(actualTargetValue);
+        const currentValue = animatedValueRef.current;
+        const valueRange = actualTargetValue - currentValue;
+        const startTime = performance.now();
+        if (duration <= 0 || 0 === valueRange) return void setAnimatedValue(actualTargetValue);
+        let animationFrame;
+        const animateValue = (currentTime)=>{
+            const elapsedTime = currentTime - startTime;
+            if (elapsedTime >= duration) setAnimatedValue(actualTargetValue);
+            else {
+                const progress = elapsedTime / duration;
+                const easeProgress = 1 - (1 - progress) * (1 - progress);
+                const nextValue = currentValue + valueRange * easeProgress;
+                setAnimatedValue(nextValue);
+                animationFrame = requestAnimationFrame(animateValue);
+            }
+        };
+        animationFrame = requestAnimationFrame(animateValue);
+        return ()=>{
+            cancelAnimationFrame(animationFrame);
+        };
+    }, [
+        actualTargetValue,
+        duration,
+        animate
+    ]);
+    return Math.round(animatedValue);
+}
+exports.useAnimatedValue = __webpack_exports__.useAnimatedValue;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useAnimatedValue"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/hooks/use-animated-value.d.ts

@@ -1,19 +1,18 @@
 /**
- * Hook to create a smoothly animated value when changes occur
+ * Produce a smoothly animated numeric value in response to changes.
  *
- * @param targetValue - The target value the animation should reach when complete
- * @param duration - The animation duration in milliseconds
- * @param animate - Enables the animation effect. If false, the value updates immediately
+ * Applies a time-based easing (easeOutQuad) between the current and target values
+ * over the specified duration. When disabled, the value updates immediately.
  *
- * @returns The rounded value currently being displayed during animation
+ * @param targetValue - Target number to animate toward; null resolves to 0.
+ * @param duration - Animation duration in milliseconds.
+ * @param animate - When false, bypasses animation and sets the value directly.
+ * @returns The current (rounded) animated value.
  *
  * @example
  * ```tsx
- * // Use the hook to create an animated value
- * const animatedValue = useAnimatedValue(75, 1000, true);
- *
- * // Display the animated value
- * return <div>{animatedValue}%</div>;
+ * const value = useAnimatedValue(75, 1000, true);
+ * return <div>{value}%</div>;
  * ```
  */
 export declare function useAnimatedValue(targetValue: null | number, duration: number, animate?: boolean): number;

package/dist/hooks/use-animated-value.js

@@ -1,2 +1,41 @@
 "use client";
-import{useEffect as e,useRef as r,useState as t}from"react";function n(n,i,a){let o=n??0,[u,m]=t(o),l=r(o);return e(()=>{l.current=u},[u]),e(()=>{let e;if(!a)return void m(o);let r=l.current,t=o-r,n=performance.now();if(i<=0||0===t)return void m(o);let u=a=>{let l=a-n;if(l>=i)m(o);else{let n=l/i;m(r+t*(1-(1-n)*(1-n))),e=requestAnimationFrame(u)}};return e=requestAnimationFrame(u),()=>{cancelAnimationFrame(e)}},[o,i,a]),Math.round(u)}export{n as useAnimatedValue};
+import { useEffect, useRef, useState } from "react";
+function useAnimatedValue(targetValue, duration, animate) {
+    const actualTargetValue = targetValue ?? 0;
+    const [animatedValue, setAnimatedValue] = useState(actualTargetValue);
+    const animatedValueRef = useRef(actualTargetValue);
+    useEffect(()=>{
+        animatedValueRef.current = animatedValue;
+    }, [
+        animatedValue
+    ]);
+    useEffect(()=>{
+        if (!animate) return void setAnimatedValue(actualTargetValue);
+        const currentValue = animatedValueRef.current;
+        const valueRange = actualTargetValue - currentValue;
+        const startTime = performance.now();
+        if (duration <= 0 || 0 === valueRange) return void setAnimatedValue(actualTargetValue);
+        let animationFrame;
+        const animateValue = (currentTime)=>{
+            const elapsedTime = currentTime - startTime;
+            if (elapsedTime >= duration) setAnimatedValue(actualTargetValue);
+            else {
+                const progress = elapsedTime / duration;
+                const easeProgress = 1 - (1 - progress) * (1 - progress);
+                const nextValue = currentValue + valueRange * easeProgress;
+                setAnimatedValue(nextValue);
+                animationFrame = requestAnimationFrame(animateValue);
+            }
+        };
+        animationFrame = requestAnimationFrame(animateValue);
+        return ()=>{
+            cancelAnimationFrame(animationFrame);
+        };
+    }, [
+        actualTargetValue,
+        duration,
+        animate
+    ]);
+    return Math.round(animatedValue);
+}
+export { useAnimatedValue };

package/dist/hooks/use-copy-to-clipboard.cjs

@@ -1,2 +1,58 @@
+"use strict";
 "use client";
-"use strict";const __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,_)=>{for(var r in _)__webpack_require__.o(_,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:_[r]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{useCopyToClipboard:()=>useCopyToClipboard});const external_react_namespaceObject=require("react");function useCopyToClipboard({onCopy:e,timeout:_=2e3}={}){let[r,o]=(0,external_react_namespaceObject.useState)(!1);return{copyToClipboard:async r=>{if("undefined"!=typeof globalThis&&navigator.clipboard.writeText&&r)try{await navigator.clipboard.writeText(r),o(!0),e&&e(),setTimeout(()=>{o(!1)},_)}catch(e){console.error(e)}},isCopied:r}}for(var __webpack_i__ in exports.useCopyToClipboard=__webpack_exports__.useCopyToClipboard,__webpack_exports__)-1===["useCopyToClipboard"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useCopyToClipboard: ()=>useCopyToClipboard
+});
+const external_react_namespaceObject = require("react");
+function useCopyToClipboard({ onCopy, timeout = 2000 } = {}) {
+    const [isCopied, setIsCopied] = (0, external_react_namespaceObject.useState)(false);
+    const copyToClipboard = async (value)=>{
+        if ("u" < typeof window || !('clipboard' in navigator)) return;
+        if (!value) return;
+        try {
+            await navigator.clipboard.writeText(value);
+            setIsCopied(true);
+            if (onCopy) onCopy();
+            setTimeout(()=>{
+                setIsCopied(false);
+            }, timeout);
+        } catch (error) {
+            console.error(error);
+        }
+    };
+    return {
+        copyToClipboard,
+        isCopied
+    };
+}
+exports.useCopyToClipboard = __webpack_exports__.useCopyToClipboard;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useCopyToClipboard"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/hooks/use-copy-to-clipboard.d.ts

@@ -1,4 +1,21 @@
-export declare function useCopyToClipboard({ onCopy, timeout, }?: {
+/**
+ * Provide clipboard copy capability with a transient copied state.
+ *
+ * Internally uses the Clipboard API when available and sets a temporary
+ * `isCopied` flag for UI feedback. A custom callback may be invoked upon copy.
+ *
+ * @param options - Configuration options.
+ *   - onCopy: Callback invoked after a successful copy.
+ *   - timeout: Duration in milliseconds to keep `isCopied` true. Defaults to 2000.
+ * @returns An object with a `copyToClipboard` function and an `isCopied` flag.
+ *
+ * @example
+ * ```tsx
+ * const { copyToClipboard, isCopied } = useCopyToClipboard({ timeout: 1500 });
+ * <button onClick={() => copyToClipboard("Hello")}>{isCopied ? "Copied" : "Copy"}</button>
+ * ```
+ */
+export declare function useCopyToClipboard({ onCopy, timeout }?: {
     onCopy?: () => void;
     timeout?: number;
 }): {

package/dist/hooks/use-copy-to-clipboard.js

@@ -1,2 +1,24 @@
 "use client";
-import{useState as o}from"react";function r({onCopy:e,timeout:t=2e3}={}){let[i,a]=o(!1);return{copyToClipboard:async o=>{if("undefined"!=typeof globalThis&&navigator.clipboard.writeText&&o)try{await navigator.clipboard.writeText(o),a(!0),e&&e(),setTimeout(()=>{a(!1)},t)}catch(o){console.error(o)}},isCopied:i}}export{r as useCopyToClipboard};
+import { useState } from "react";
+function useCopyToClipboard({ onCopy, timeout = 2000 } = {}) {
+    const [isCopied, setIsCopied] = useState(false);
+    const copyToClipboard = async (value)=>{
+        if ("u" < typeof window || !('clipboard' in navigator)) return;
+        if (!value) return;
+        try {
+            await navigator.clipboard.writeText(value);
+            setIsCopied(true);
+            if (onCopy) onCopy();
+            setTimeout(()=>{
+                setIsCopied(false);
+            }, timeout);
+        } catch (error) {
+            console.error(error);
+        }
+    };
+    return {
+        copyToClipboard,
+        isCopied
+    };
+}
+export { useCopyToClipboard };

package/dist/hooks/use-is-mobile.cjs

@@ -1,2 +1,40 @@
+"use strict";
 "use client";
-"use strict";const __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,_)=>{for(var r in _)__webpack_require__.o(_,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:_[r]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{useIsMobile:()=>useIsMobile});const external_use_media_query_cjs_namespaceObject=require("./use-media-query.cjs"),MOBILE_BREAKPOINT=768;function useIsMobile(){return(0,external_use_media_query_cjs_namespaceObject.useMediaQuery)("(max-width: 767px)")}for(var __webpack_i__ in exports.useIsMobile=__webpack_exports__.useIsMobile,__webpack_exports__)-1===["useIsMobile"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useIsMobile: ()=>useIsMobile
+});
+const external_use_media_query_cjs_namespaceObject = require("./use-media-query.cjs");
+function useIsMobile(mobileBreakpoint = 768) {
+    return (0, external_use_media_query_cjs_namespaceObject.useMediaQuery)(`(max-width: ${(mobileBreakpoint - 1).toString()}px)`);
+}
+exports.useIsMobile = __webpack_exports__.useIsMobile;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useIsMobile"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/hooks/use-is-mobile.d.ts

@@ -1,10 +1,19 @@
 /**
- * Custom hook that determines if the current viewport is mobile-sized.
+ * Determine whether the current viewport should be treated as mobile.
  *
- * This hook uses the useMediaQuery hook to check if the screen width is less than
- * the defined mobile breakpoint (768px).
+ * Uses {@link useMediaQuery} to evaluate a max-width media query derived from the
+ * provided breakpoint. By default, widths below 768px are considered mobile.
  *
- * @returns A boolean indicating whether the current viewport is mobile-sized.
- * True if the screen width is less than 768px, false otherwise.
+ * @param mobileBreakpoint - Pixel width used as the mobile breakpoint. Values strictly
+ * less than this breakpoint are treated as mobile. Defaults to 768.
+ * @returns true when the viewport width is less than the given breakpoint; otherwise false.
+ *
+ * @example
+ * ```tsx
+ * const isMobile = useIsMobile();
+ * if (isMobile) {
+ *   // Render compact layout
+ * }
+ * ```
  */
-export declare function useIsMobile(): boolean;
+export declare function useIsMobile(mobileBreakpoint?: number): boolean;

package/dist/hooks/use-is-mobile.js

@@ -1,2 +1,6 @@
 "use client";
-import{useMediaQuery as e}from"./use-media-query.js";function r(){return e("(max-width: 767px)")}export{r as useIsMobile};
+import { useMediaQuery } from "./use-media-query.js";
+function useIsMobile(mobileBreakpoint = 768) {
+    return useMediaQuery(`(max-width: ${(mobileBreakpoint - 1).toString()}px)`);
+}
+export { useIsMobile };

package/dist/hooks/use-media-query.cjs

@@ -1,2 +1,57 @@
+"use strict";
 "use client";
-"use strict";const __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,_)=>{for(var r in _)__webpack_require__.o(_,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:_[r]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{useMediaQuery:()=>useMediaQuery});const external_react_namespaceObject=require("react");function useMediaQuery(e){let[_,r]=(0,external_react_namespaceObject.useState)(()=>"undefined"!=typeof globalThis&&"function"==typeof globalThis.matchMedia&&globalThis.matchMedia(e).matches);return(0,external_react_namespaceObject.useEffect)(()=>{if("undefined"==typeof globalThis)return;let _=globalThis.matchMedia(e),t=e=>{r(e.matches)};return _.addEventListener("change",t),()=>{_.removeEventListener("change",t)}},[e]),_}for(var __webpack_i__ in exports.useMediaQuery=__webpack_exports__.useMediaQuery,__webpack_exports__)-1===["useMediaQuery"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useMediaQuery: ()=>useMediaQuery
+});
+const external_react_namespaceObject = require("react");
+function useMediaQuery(query) {
+    const [matches, setMatches] = (0, external_react_namespaceObject.useState)(()=>{
+        if ("u" > typeof window && 'function' == typeof window.matchMedia) return window.matchMedia(query).matches;
+        return false;
+    });
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if ("u" < typeof window) return;
+        const mediaQueryList = window.matchMedia(query);
+        const onChange = (event)=>{
+            setMatches(event.matches);
+        };
+        mediaQueryList.addEventListener('change', onChange);
+        return ()=>{
+            mediaQueryList.removeEventListener('change', onChange);
+        };
+    }, [
+        query
+    ]);
+    return matches;
+}
+exports.useMediaQuery = __webpack_exports__.useMediaQuery;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useMediaQuery"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/hooks/use-media-query.d.ts

@@ -1,7 +1,15 @@
 /**
- * Custom hook to listen to CSS media query.
+ * Subscribe to a CSS media query and receive its match state.
  *
- * @param query - Media query string.
- * @returns Whether the media query matches or not.
+ * Evaluates the query immediately (when supported) and updates on changes
+ * via an event listener.
+ *
+ * @param query - A valid media query string (e.g., "(max-width: 768px)").
+ * @returns true when the media query currently matches; otherwise false.
+ *
+ * @example
+ * ```tsx
+ * const isNarrow = useMediaQuery("(max-width: 768px)");
+ * ```
  */
 export declare function useMediaQuery(query: string): boolean;

package/dist/hooks/use-media-query.js

@@ -1,2 +1,23 @@
 "use client";
-import{useEffect as e,useState as t}from"react";function a(a){let[i,n]=t(()=>"undefined"!=typeof globalThis&&"function"==typeof globalThis.matchMedia&&globalThis.matchMedia(a).matches);return e(()=>{if("undefined"==typeof globalThis)return;let e=globalThis.matchMedia(a),t=e=>{n(e.matches)};return e.addEventListener("change",t),()=>{e.removeEventListener("change",t)}},[a]),i}export{a as useMediaQuery};
+import { useEffect, useState } from "react";
+function useMediaQuery(query) {
+    const [matches, setMatches] = useState(()=>{
+        if ("u" > typeof window && 'function' == typeof window.matchMedia) return window.matchMedia(query).matches;
+        return false;
+    });
+    useEffect(()=>{
+        if ("u" < typeof window) return;
+        const mediaQueryList = window.matchMedia(query);
+        const onChange = (event)=>{
+            setMatches(event.matches);
+        };
+        mediaQueryList.addEventListener('change', onChange);
+        return ()=>{
+            mediaQueryList.removeEventListener('change', onChange);
+        };
+    }, [
+        query
+    ]);
+    return matches;
+}
+export { useMediaQuery };

package/dist/hooks/use-mutation-observer.cjs

@@ -1,2 +1,57 @@
+"use strict";
 "use client";
-"use strict";const __rslib_import_meta_url__="undefined"==typeof document?new(require("url".replace("",""))).URL("file:"+__filename).href:document.currentScript&&document.currentScript.src||new URL("main.js",document.baseURI).href;var __webpack_require__={};__webpack_require__.d=(e,_)=>{for(var r in _)__webpack_require__.o(_,r)&&!__webpack_require__.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:_[r]})},__webpack_require__.o=(e,_)=>Object.prototype.hasOwnProperty.call(e,_),__webpack_require__.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var __webpack_exports__={};__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{useMutationObserver:()=>useMutationObserver});const external_react_namespaceObject=require("react"),defaultOptions={attributes:!0,characterData:!0,childList:!0,subtree:!0};function useMutationObserver(e,_,r=defaultOptions){(0,external_react_namespaceObject.useEffect)(()=>{if(!e.current)return;let t=new MutationObserver(_);return t.observe(e.current,r),()=>{t.disconnect()}},[e,_,r])}for(var __webpack_i__ in exports.useMutationObserver=__webpack_exports__.useMutationObserver,__webpack_exports__)-1===["useMutationObserver"].indexOf(__webpack_i__)&&(exports[__webpack_i__]=__webpack_exports__[__webpack_i__]);Object.defineProperty(exports,"__esModule",{value:!0});
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    useMutationObserver: ()=>useMutationObserver
+});
+const external_react_namespaceObject = require("react");
+const defaultOptions = {
+    attributes: true,
+    characterData: true,
+    childList: true,
+    subtree: true
+};
+function useMutationObserver(ref, callback, options = defaultOptions) {
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!ref.current) return;
+        const observer = new MutationObserver(callback);
+        observer.observe(ref.current, options);
+        return ()=>{
+            observer.disconnect();
+        };
+    }, [
+        ref,
+        callback,
+        options
+    ]);
+}
+exports.useMutationObserver = __webpack_exports__.useMutationObserver;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "useMutationObserver"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/hooks/use-mutation-observer.d.ts

@@ -1,18 +1,14 @@
-import type { RefObject } from "react";
+import type { RefObject } from 'react';
 /**
- * Attaches a MutationObserver to a given HTMLElement and invokes a callback
- * function when mutations occur in the observed elements.
+ * Observe DOM mutations on a referenced element and invoke a callback.
  *
- * @param ref - The mutable reference to the HTMLElement to be observed for mutations
- * @param callback - The function to be called when mutations are detected
- * @param options - Configuration options for the MutationObserver, defaults to watching all changes
- * @returns void
+ * Attaches a MutationObserver to the provided element reference with the given
+ * options and calls the callback whenever mutations occur.
  *
- * @remarks
- * This function is a React hook that attaches a MutationObserver to a given
- * HTMLElement. The MutationObserver listens for mutations in the observed
- * element and its descendants and invokes the provided callback function
- * when mutations occur.
+ * @param ref - Ref to the target HTMLElement to observe.
+ * @param callback - Mutation callback invoked with observed records.
+ * @param options - Observer configuration. Defaults watch attributes, characterData, childList, subtree.
+ * @returns void
  *
  * @see [MutationObserver](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
  */