@ngrok/mantle 0.54.3 → 0.55.0

package/dist/button.js

@@ -1,2 +1,2 @@
-import{a as c}from"./chunk-3H3EUKI7.js";import{a as b}from"./chunk-T5U5KWUW.js";import{c as a}from"./chunk-XTCU7MXB.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import"./chunk-AZ56JGNY.js";export{b as Button,c as ButtonGroup,a as IconButton};
+import{a as c}from"./chunk-3H3EUKI7.js";import{c as a}from"./chunk-XTCU7MXB.js";import{a as b}from"./chunk-T5U5KWUW.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import"./chunk-AZ56JGNY.js";export{b as Button,c as ButtonGroup,a as IconButton};
 //# sourceMappingURL=button.js.map

package/dist/{chunk-MEIVQLEY.js → chunk-EBW5W235.js}

@@ -1,2 +1,2 @@
-import{a as P}from"./chunk-MF2QITTY.js";import{b as h}from"./chunk-J6ZF5J72.js";import{a as d}from"./chunk-I6T6YV2L.js";import{a as r}from"./chunk-AZ56JGNY.js";import{CaretDownIcon as b}from"@phosphor-icons/react/CaretDown";import{CaretUpIcon as z}from"@phosphor-icons/react/CaretUp";import{CheckIcon as D}from"@phosphor-icons/react/Check";import*as e from"@radix-ui/react-select";import{createContext as H,forwardRef as n,useContext as M}from"react";import{jsx as t,jsxs as g}from"react/jsx-runtime";var y=H({}),C=n(({"aria-invalid":o,children:a,id:i,validation:l,onBlur:s,onValueChange:p,onChange:u,...c},m)=>t(e.Root,{...c,onValueChange:f=>{u?.(f),p?.(f)},children:t(y.Provider,{value:{"aria-invalid":o,id:i,validation:l,onBlur:s,ref:m},children:a})}));C.displayName="Select";var x=e.Group;x.displayName="SelectGroup";var w=e.Value;w.displayName="SelectValue";var I=n(({"aria-invalid":o,className:a,children:i,id:l,validation:s,...p},u)=>{let c=M(y),m=c["aria-invalid"]??o,f=m!=null&&m!=="false",v=c.validation??s,S=f?"error":typeof v=="function"?v():v,V=m??S==="error",E=c.id??l;return g(e.Trigger,{"aria-invalid":V,className:r("h-9 text-sm","border-form bg-form text-strong placeholder:text-placeholder hover:bg-form-hover hover:text-strong flex w-full items-center justify-between gap-1.5 rounded-md border px-3 py-2 disabled:pointer-events-none disabled:opacity-50 [&>span]:line-clamp-1 [&>span]:text-left","hover:border-neutral-400","focus:outline-hidden focus:ring-4 aria-expanded:ring-4","focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent","data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success","data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning","data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger",a),"data-validation":S||void 0,id:E,ref:P(u,c.ref),...p,children:[i,t(e.Icon,{asChild:!0,children:t(d,{svg:t(b,{weight:"bold"}),className:"size-4"})})]})});I.displayName="SelectTrigger";var N=n(({className:o,...a},i)=>t(e.ScrollUpButton,{ref:i,className:r("flex cursor-default items-center justify-center py-1",o),...a,children:t(d,{svg:t(z,{weight:"bold"}),className:"size-4"})}));N.displayName="SelectScrollUpButton";var R=n(({className:o,...a},i)=>t(e.ScrollDownButton,{ref:i,className:r("flex cursor-default items-center justify-center py-1",o),...a,children:t(d,{svg:t(b,{weight:"bold"}),className:"size-4"})}));R.displayName="SelectScrollDownButton";var T=n(({className:o,children:a,position:i="popper",width:l="trigger",...s},p)=>t(e.Portal,{children:g(e.Content,{ref:p,className:r("border-popover data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border shadow-md","bg-popover",i==="popper"&&"data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2 max-h-[var(--radix-select-content-available-height)]",l==="trigger"&&"w-[var(--radix-select-trigger-width)]",o),position:i,...s,children:[t(N,{}),t(e.Viewport,{className:r("p-1",i==="popper"&&"h-[var(--radix-select-trigger-height)] w-full"),children:a}),t(R,{})]})}));T.displayName="SelectContent";var B=n(({className:o,...a},i)=>t(e.Label,{ref:i,className:r("px-2 py-1.5 text-sm font-semibold",o),...a}));B.displayName="SelectLabel";var W=n(({className:o,children:a,icon:i,...l},s)=>g(e.Item,{ref:s,className:r("relative flex gap-2 w-full cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-8 text-sm outline-hidden","focus:bg-popover-hover","data-disabled:pointer-events-none data-disabled:opacity-50","data-state-checked:bg-filled-accent data-state-checked:text-on-filled","focus:data-state-checked:bg-filled-accent",o),...l,children:[i&&t(d,{svg:i}),t(e.ItemText,{children:a}),t(e.ItemIndicator,{className:"absolute right-2 flex h-3.5 w-3.5 items-center justify-center",children:t(d,{svg:t(D,{weight:"bold"}),className:"size-4"})})]}));W.displayName="SelectItem";var L=n(({className:o,...a},i)=>t(h,{ref:i,className:r("-mx-1 my-1 h-px w-auto",o),...a}));L.displayName="SelectSeparator";var q={Root:C,Content:T,Group:x,Item:W,Label:B,Separator:L,Trigger:I,Value:w};export{q as a};
-//# sourceMappingURL=chunk-MEIVQLEY.js.map
+import{b as h}from"./chunk-J6ZF5J72.js";import{a as P}from"./chunk-MF2QITTY.js";import{a as d}from"./chunk-I6T6YV2L.js";import{a as r}from"./chunk-AZ56JGNY.js";import{CaretDownIcon as b}from"@phosphor-icons/react/CaretDown";import{CaretUpIcon as z}from"@phosphor-icons/react/CaretUp";import{CheckIcon as D}from"@phosphor-icons/react/Check";import*as e from"@radix-ui/react-select";import{createContext as H,forwardRef as n,useContext as M}from"react";import{jsx as t,jsxs as g}from"react/jsx-runtime";var y=H({}),C=n(({"aria-invalid":o,children:a,id:i,validation:l,onBlur:s,onValueChange:p,onChange:u,...c},m)=>t(e.Root,{...c,onValueChange:f=>{u?.(f),p?.(f)},children:t(y.Provider,{value:{"aria-invalid":o,id:i,validation:l,onBlur:s,ref:m},children:a})}));C.displayName="Select";var x=e.Group;x.displayName="SelectGroup";var w=e.Value;w.displayName="SelectValue";var I=n(({"aria-invalid":o,className:a,children:i,id:l,validation:s,...p},u)=>{let c=M(y),m=c["aria-invalid"]??o,f=m!=null&&m!=="false",v=c.validation??s,S=f?"error":typeof v=="function"?v():v,V=m??S==="error",E=c.id??l;return g(e.Trigger,{"aria-invalid":V,className:r("h-9 text-sm","border-form bg-form text-strong placeholder:text-placeholder hover:bg-form-hover hover:text-strong flex w-full items-center justify-between gap-1.5 rounded-md border px-3 py-2 disabled:pointer-events-none disabled:opacity-50 [&>span]:line-clamp-1 [&>span]:text-left","hover:border-neutral-400","focus:outline-hidden focus:ring-4 aria-expanded:ring-4","focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent","data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success","data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning","data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger",a),"data-validation":S||void 0,id:E,ref:P(u,c.ref),...p,children:[i,t(e.Icon,{asChild:!0,children:t(d,{svg:t(b,{weight:"bold"}),className:"size-4"})})]})});I.displayName="SelectTrigger";var N=n(({className:o,...a},i)=>t(e.ScrollUpButton,{ref:i,className:r("flex cursor-default items-center justify-center py-1",o),...a,children:t(d,{svg:t(z,{weight:"bold"}),className:"size-4"})}));N.displayName="SelectScrollUpButton";var R=n(({className:o,...a},i)=>t(e.ScrollDownButton,{ref:i,className:r("flex cursor-default items-center justify-center py-1",o),...a,children:t(d,{svg:t(b,{weight:"bold"}),className:"size-4"})}));R.displayName="SelectScrollDownButton";var T=n(({className:o,children:a,position:i="popper",width:l="trigger",...s},p)=>t(e.Portal,{children:g(e.Content,{ref:p,className:r("border-popover data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border shadow-md","bg-popover",i==="popper"&&"data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2 max-h-[var(--radix-select-content-available-height)]",l==="trigger"&&"w-[var(--radix-select-trigger-width)]",o),position:i,...s,children:[t(N,{}),t(e.Viewport,{className:r("p-1",i==="popper"&&"h-[var(--radix-select-trigger-height)] w-full"),children:a}),t(R,{})]})}));T.displayName="SelectContent";var B=n(({className:o,...a},i)=>t(e.Label,{ref:i,className:r("px-2 py-1.5 text-sm font-semibold",o),...a}));B.displayName="SelectLabel";var W=n(({className:o,children:a,icon:i,...l},s)=>g(e.Item,{ref:s,className:r("relative flex gap-2 w-full cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-8 text-sm outline-hidden","focus:bg-popover-hover","data-disabled:pointer-events-none data-disabled:opacity-50","data-state-checked:bg-filled-accent data-state-checked:text-on-filled","focus:data-state-checked:bg-filled-accent",o),...l,children:[i&&t(d,{svg:i}),t(e.ItemText,{children:a}),t(e.ItemIndicator,{className:"absolute right-2 flex h-3.5 w-3.5 items-center justify-center",children:t(d,{svg:t(D,{weight:"bold"}),className:"size-4"})})]}));W.displayName="SelectItem";var L=n(({className:o,...a},i)=>t(h,{ref:i,className:r("-mx-1 my-1 h-px w-auto",o),...a}));L.displayName="SelectSeparator";var q={Root:C,Content:T,Group:x,Item:W,Label:B,Separator:L,Trigger:I,Value:w};export{q as a};
+//# sourceMappingURL=chunk-EBW5W235.js.map

package/dist/chunk-V4TWM6RF.js

@@ -0,0 +1,2 @@
+import{useEffect as u,useLayoutEffect as c}from"react";var p=typeof window<"u"?c:u;import{useEffect as i,useState as f}from"react";var d="(prefers-reduced-motion: no-preference)";function n(){let[e,t]=f(!0);return i(()=>{let o=window.matchMedia(d);t(!o.matches);function r(s){t(!s.matches)}return o.addEventListener("change",r),()=>{o.removeEventListener("change",r)}},[]),e}import{useMemo as a}from"react";function E(){let e=n();return a(()=>e?"auto":"smooth",[e])}export{p as a,n as b,E as c};
+//# sourceMappingURL=chunk-V4TWM6RF.js.map

package/dist/chunk-V4TWM6RF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-isomorphic-layout-effect.tsx","../src/hooks/use-prefers-reduced-motion.tsx","../src/hooks/use-scroll-behavior.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect } from \"react\";\n\n/**\n * useIsomorphicLayoutEffect is a hook that uses useLayoutEffect on the client and useEffect on the server.\n */\nexport const useIsomorphicLayoutEffect =\n\ttypeof window !== \"undefined\" ? useLayoutEffect : useEffect;\n","import { useEffect, useState } from \"react\";\n\n/**\n * no-preference is the default value for the prefers-reduced-motion media query.\n * Users who have never fiddled with their a11y settings will still see animations\n * (no explicit opt-in required from a user's perspective)\n */\nconst query = \"(prefers-reduced-motion: no-preference)\";\n\n/**\n * Returns `true` when the user has opted out of animations (i.e., prefers reduced motion).\n *\n * Implementation notes:\n * - Uses the `(prefers-reduced-motion: no-preference)` media query and inverts it.\n *   This keeps the “default” mental model explicit: if the system hasn’t opted out,\n *   animations are allowed.\n * - Defaults to `true` on the server to avoid animating before hydration. The initial\n *   client effect reads the *real* preference and updates state.\n *\n * @example\n * // Conditionally shorten or skip transitions\n * const reduce = usePrefersReducedMotion();\n * const duration = reduce ? 0 : 200;\n *\n * @remarks\n * If you need to support very old browsers that lack `MediaQueryList.addEventListener`,\n * consider falling back to `addListener/removeListener`.\n */\nexport function usePrefersReducedMotion(): boolean {\n\t// Default to no animations on SSR/first paint; update on mount with the real value.\n\tconst [prefersReducedMotion, setPrefersReducedMotion] = useState(true);\n\n\tuseEffect(() => {\n\t\tconst mediaQueryList = window.matchMedia(query);\n\n\t\t// set the _real_ initial value now that we're on the client\n\t\tsetPrefersReducedMotion(!mediaQueryList.matches);\n\n\t\t// register for updates\n\t\tfunction listener(event: MediaQueryListEvent) {\n\t\t\tsetPrefersReducedMotion(!event.matches);\n\t\t}\n\n\t\tmediaQueryList.addEventListener(\"change\", listener);\n\n\t\treturn () => {\n\t\t\tmediaQueryList.removeEventListener(\"change\", listener);\n\t\t};\n\t}, []);\n\n\treturn prefersReducedMotion;\n}\n","import { useMemo } from \"react\";\nimport { usePrefersReducedMotion } from \"./use-prefers-reduced-motion.js\";\n\n/**\n * `scroll-behavior` values:\n *\n * - `\"auto\"`   — scrolling happens instantly (no animation).\n * - `\"smooth\"` — scrolling animates smoothly using a user-agent–defined easing and duration.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior#values\n */\ntype ScrollBehavior = \"auto\" | \"smooth\";\n\n/**\n * Returns a `ScrollBehavior` that respects the user's motion preference via `usePrefersReducedMotion`.\n *\n * - When `usePrefersReducedMotion()` is `true`, returns `\"auto\"` (no animated scroll).\n * - Otherwise returns `\"smooth\"`.\n *\n * Use this with `window.scrollTo`, `Element.scrollIntoView`, etc. It prevents\n * smooth-scrolling for users who opt out of motion and avoids SSR “first paint”\n * animations thanks to the hook’s conservative server default.\n *\n * @example\n * // Scroll to top\n * const behavior = useScrollBehavior();\n * window.scrollTo({ top: 0, behavior });\n *\n * @example\n * // Bring a section into view\n * const behavior = useScrollBehavior();\n * sectionRef.current?.scrollIntoView({ behavior, block: \"start\" });\n *\n * @see {@link usePrefersReducedMotion}\n * @see CSS `scroll-behavior` property (values: `\"auto\"`, `\"smooth\"`).\n */\nexport function useScrollBehavior(): ScrollBehavior {\n\tconst prefersReducedMotion = usePrefersReducedMotion();\n\n\treturn useMemo(\n\t\t() => (prefersReducedMotion ? \"auto\" : \"smooth\"),\n\t\t[prefersReducedMotion],\n\t);\n}\n"],"mappings":"AAAA,OAAS,aAAAA,EAAW,mBAAAC,MAAuB,QAKpC,IAAMC,EACZ,OAAO,OAAW,IAAcD,EAAkBD,ECNnD,OAAS,aAAAG,EAAW,YAAAC,MAAgB,QAOpC,IAAMC,EAAQ,0CAqBP,SAASC,GAAmC,CAElD,GAAM,CAACC,EAAsBC,CAAuB,EAAIJ,EAAS,EAAI,EAErE,OAAAD,EAAU,IAAM,CACf,IAAMM,EAAiB,OAAO,WAAWJ,CAAK,EAG9CG,EAAwB,CAACC,EAAe,OAAO,EAG/C,SAASC,EAASC,EAA4B,CAC7CH,EAAwB,CAACG,EAAM,OAAO,CACvC,CAEA,OAAAF,EAAe,iBAAiB,SAAUC,CAAQ,EAE3C,IAAM,CACZD,EAAe,oBAAoB,SAAUC,CAAQ,CACtD,CACD,EAAG,CAAC,CAAC,EAEEH,CACR,CCnDA,OAAS,WAAAK,MAAe,QAoCjB,SAASC,GAAoC,CACnD,IAAMC,EAAuBC,EAAwB,EAErD,OAAOC,EACN,IAAOF,EAAuB,OAAS,SACvC,CAACA,CAAoB,CACtB,CACD","names":["useEffect","useLayoutEffect","useIsomorphicLayoutEffect","useEffect","useState","query","usePrefersReducedMotion","prefersReducedMotion","setPrefersReducedMotion","mediaQueryList","listener","event","useMemo","useScrollBehavior","prefersReducedMotion","usePrefersReducedMotion","useMemo"]}

package/dist/hooks.d.ts

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useLayoutEffect } from 'react';
 
 /**
  * Tailwind CSS breakpoints in descending order (largest → smallest).
@@ -162,7 +162,7 @@ declare function useIsHydrated(): boolean;
 /**
  * useIsomorphicLayoutEffect is a hook that uses useLayoutEffect on the client and useEffect on the server.
  */
-declare const useIsomorphicLayoutEffect: typeof useEffect;
+declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
 
 /**
  * React hook that subscribes to and returns the result of a CSS media query.
@@ -187,7 +187,23 @@ declare const useIsomorphicLayoutEffect: typeof useEffect;
 declare function useMatchesMediaQuery(query: string): boolean;
 
 /**
- * usePrefersReducedMotion returns true if the user has opted out of animations
+ * Returns `true` when the user has opted out of animations (i.e., prefers reduced motion).
+ *
+ * Implementation notes:
+ * - Uses the `(prefers-reduced-motion: no-preference)` media query and inverts it.
+ *   This keeps the “default” mental model explicit: if the system hasn’t opted out,
+ *   animations are allowed.
+ * - Defaults to `true` on the server to avoid animating before hydration. The initial
+ *   client effect reads the *real* preference and updates state.
+ *
+ * @example
+ * // Conditionally shorten or skip transitions
+ * const reduce = usePrefersReducedMotion();
+ * const duration = reduce ? 0 : 200;
+ *
+ * @remarks
+ * If you need to support very old browsers that lack `MediaQueryList.addEventListener`,
+ * consider falling back to `addListener/removeListener`.
  */
 declare function usePrefersReducedMotion(): boolean;
 
@@ -198,4 +214,38 @@ declare function usePrefersReducedMotion(): boolean;
  */
 declare const useRandomStableId: (prefix?: string) => string;
 
-export { type Breakpoint, type TailwindBreakpoint, breakpoints, useBreakpoint, useCallbackRef, useCopyToClipboard, useDebouncedCallback, useIsBelowBreakpoint, useIsHydrated, useIsomorphicLayoutEffect, useMatchesMediaQuery, usePrefersReducedMotion, useRandomStableId };
+/**
+ * `scroll-behavior` values:
+ *
+ * - `"auto"`   — scrolling happens instantly (no animation).
+ * - `"smooth"` — scrolling animates smoothly using a user-agent–defined easing and duration.
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior#values
+ */
+type ScrollBehavior = "auto" | "smooth";
+/**
+ * Returns a `ScrollBehavior` that respects the user's motion preference via `usePrefersReducedMotion`.
+ *
+ * - When `usePrefersReducedMotion()` is `true`, returns `"auto"` (no animated scroll).
+ * - Otherwise returns `"smooth"`.
+ *
+ * Use this with `window.scrollTo`, `Element.scrollIntoView`, etc. It prevents
+ * smooth-scrolling for users who opt out of motion and avoids SSR “first paint”
+ * animations thanks to the hook’s conservative server default.
+ *
+ * @example
+ * // Scroll to top
+ * const behavior = useScrollBehavior();
+ * window.scrollTo({ top: 0, behavior });
+ *
+ * @example
+ * // Bring a section into view
+ * const behavior = useScrollBehavior();
+ * sectionRef.current?.scrollIntoView({ behavior, block: "start" });
+ *
+ * @see {@link usePrefersReducedMotion}
+ * @see CSS `scroll-behavior` property (values: `"auto"`, `"smooth"`).
+ */
+declare function useScrollBehavior(): ScrollBehavior;
+
+export { type Breakpoint, type TailwindBreakpoint, breakpoints, useBreakpoint, useCallbackRef, useCopyToClipboard, useDebouncedCallback, useIsBelowBreakpoint, useIsHydrated, useIsomorphicLayoutEffect, useMatchesMediaQuery, usePrefersReducedMotion, useRandomStableId, useScrollBehavior };

package/dist/hooks.js

@@ -1,2 +1,2 @@
-import{a as y}from"./chunk-X7RUBITL.js";import{a as B}from"./chunk-6J7D73WA.js";import{a as b}from"./chunk-KMNACVH6.js";import{useSyncExternalStore as x}from"react";var h=["2xl","xl","lg","md","sm","xs"],g=["default",...h];function T(){return x(Q,R,()=>"default")}function L(e){return x(v(e),E(e),()=>!1)}var i={"2xl":"(min-width: 96rem)",xl:"(min-width: 80rem)",lg:"(min-width: 64rem)",md:"(min-width: 48rem)",sm:"(min-width: 40rem)",xs:"(min-width: 30rem)"},a={"2xl":"(max-width: 95.99rem)",xl:"(max-width: 79.99rem)",lg:"(max-width: 63.99rem)",md:"(max-width: 47.99rem)",sm:"(max-width: 39.99rem)",xs:"(max-width: 29.99rem)"},m=null,c=null;function f(){return m||(m={"2xl":window.matchMedia(i["2xl"]),xl:window.matchMedia(i.xl),lg:window.matchMedia(i.lg),md:window.matchMedia(i.md),sm:window.matchMedia(i.sm),xs:window.matchMedia(i.xs)}),m}function k(e){return c||(c={"2xl":window.matchMedia(a["2xl"]),xl:window.matchMedia(a.xl),lg:window.matchMedia(a.lg),md:window.matchMedia(a.md),sm:window.matchMedia(a.sm),xs:window.matchMedia(a.xs)}),c[e]}var u="default",d=new Set,s=!1;function M(){let e=f();for(let t of h)if(e[t].matches)return t;return"default"}var l=!1;function w(){l||(l=!0,requestAnimationFrame(()=>{l=!1;let e=M();if(e!==u){u=e;for(let t of d)t()}}))}function Q(e){if(d.add(e),!s){s=!0;let t=f();u=M();for(let n of Object.values(t))n.addEventListener("change",w)}return e(),()=>{if(d.delete(e),d.size===0&&s){s=!1;let t=f();for(let n of Object.values(t))n.removeEventListener("change",w)}}}function R(){return u}function v(e){return t=>{let n=k(e),r=!1,o=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener("change",o),()=>{n.removeEventListener("change",o)}}}function E(e){return()=>k(e).matches}import{useEffect as C,useMemo as S,useRef as q}from"react";function p(e){let t=q(e);return C(()=>{t.current=e}),S(()=>((...n)=>t.current?.(...n)),[])}import{useCallback as I,useEffect as W,useRef as P}from"react";function j(e,t){let n=p(e),r=P(0);return W(()=>()=>window.clearTimeout(r.current),[]),I((...o)=>{window.clearTimeout(r.current),r.current=window.setTimeout(()=>n(...o),t.waitMs)},[n,t.waitMs])}import{useEffect as O,useLayoutEffect as A}from"react";var F=typeof window<"u"?A:O;import{useEffect as D,useState as _}from"react";var $="(prefers-reduced-motion: no-preference)";function z(){let[e,t]=_(!0);return D(()=>{let n=window.matchMedia($);t(!n.matches);function r(o){t(!o.matches)}return n.addEventListener("change",r),()=>{n.removeEventListener("change",r)}},[]),e}import{useMemo as G}from"react";var H=(e="mantle")=>G(()=>U(e),[e]);function U(e="mantle"){return[e.trim()||"mantle",V()].join("-")}function V(){return Math.random().toString(36).substring(2,9)}export{g as breakpoints,T as useBreakpoint,p as useCallbackRef,y as useCopyToClipboard,j as useDebouncedCallback,L as useIsBelowBreakpoint,b as useIsHydrated,F as useIsomorphicLayoutEffect,B as useMatchesMediaQuery,z as usePrefersReducedMotion,H as useRandomStableId};
+import{a as Q}from"./chunk-X7RUBITL.js";import{a as b}from"./chunk-6J7D73WA.js";import{a as M,b as y,c as T}from"./chunk-V4TWM6RF.js";import{a as g}from"./chunk-KMNACVH6.js";import{useSyncExternalStore as x}from"react";var k=["2xl","xl","lg","md","sm","xs"],R=["default",...k];function C(){return x(v,S,()=>"default")}function L(e){return x(E(e),W(e),()=>!1)}var r={"2xl":"(min-width: 96rem)",xl:"(min-width: 80rem)",lg:"(min-width: 64rem)",md:"(min-width: 48rem)",sm:"(min-width: 40rem)",xs:"(min-width: 30rem)"},o={"2xl":"(max-width: 95.99rem)",xl:"(max-width: 79.99rem)",lg:"(max-width: 63.99rem)",md:"(max-width: 47.99rem)",sm:"(max-width: 39.99rem)",xs:"(max-width: 29.99rem)"},m=null,c=null;function p(){return m||(m={"2xl":window.matchMedia(r["2xl"]),xl:window.matchMedia(r.xl),lg:window.matchMedia(r.lg),md:window.matchMedia(r.md),sm:window.matchMedia(r.sm),xs:window.matchMedia(r.xs)}),m}function h(e){return c||(c={"2xl":window.matchMedia(o["2xl"]),xl:window.matchMedia(o.xl),lg:window.matchMedia(o.lg),md:window.matchMedia(o.md),sm:window.matchMedia(o.sm),xs:window.matchMedia(o.xs)}),c[e]}var u="default",d=new Set,s=!1;function B(){let e=p();for(let t of k)if(e[t].matches)return t;return"default"}var l=!1;function w(){l||(l=!0,requestAnimationFrame(()=>{l=!1;let e=B();if(e!==u){u=e;for(let t of d)t()}}))}function v(e){if(d.add(e),!s){s=!0;let t=p();u=B();for(let n of Object.values(t))n.addEventListener("change",w)}return e(),()=>{if(d.delete(e),d.size===0&&s){s=!1;let t=p();for(let n of Object.values(t))n.removeEventListener("change",w)}}}function S(){return u}function E(e){return t=>{let n=h(e),i=!1,a=()=>{i||(i=!0,requestAnimationFrame(()=>{i=!1,t()}))};return n.addEventListener("change",a),()=>{n.removeEventListener("change",a)}}}function W(e){return()=>h(e).matches}import{useEffect as q,useMemo as I,useRef as j}from"react";function f(e){let t=j(e);return q(()=>{t.current=e}),I(()=>((...n)=>t.current?.(...n)),[])}import{useCallback as O,useEffect as P,useRef as A}from"react";function F(e,t){let n=f(e),i=A(0);return P(()=>()=>window.clearTimeout(i.current),[]),O((...a)=>{window.clearTimeout(i.current),i.current=window.setTimeout(()=>n(...a),t.waitMs)},[n,t.waitMs])}import{useMemo as D}from"react";var _=(e="mantle")=>D(()=>$(e),[e]);function $(e="mantle"){return[e.trim()||"mantle",z()].join("-")}function z(){return Math.random().toString(36).substring(2,9)}export{R as breakpoints,C as useBreakpoint,f as useCallbackRef,Q as useCopyToClipboard,F as useDebouncedCallback,L as useIsBelowBreakpoint,g as useIsHydrated,M as useIsomorphicLayoutEffect,b as useMatchesMediaQuery,y as usePrefersReducedMotion,_ as useRandomStableId,T as useScrollBehavior};
 //# sourceMappingURL=hooks.js.map

package/dist/hooks.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/use-breakpoint.tsx","../src/hooks/use-callback-ref.tsx","../src/hooks/use-debounced-callback.tsx","../src/hooks/use-isomorphic-layout-effect.tsx","../src/hooks/use-prefers-reduced-motion.tsx","../src/hooks/use-random-stable-id.tsx"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\n\n/**\n * Tailwind CSS breakpoints in descending order (largest → smallest).\n *\n * These correspond to Tailwind’s default `theme.screens` config and are used\n * to determine the current viewport size.\n *\n * @see https://tailwindcss.com/docs/screens\n *\n * @example\n * \"2xl\" // ≥96rem (1536px)\n * \"xl\"  // ≥80rem (1280px)\n * \"lg\"  // ≥64rem (1024px)\n * \"md\"  // ≥48rem (768px)\n * \"sm\"  // ≥40rem (640px)\n * \"xs\"  // ≥30rem (480px)\n */\nconst tailwindBreakpoints = [\"2xl\", \"xl\", \"lg\", \"md\", \"sm\", \"xs\"] as const;\n\n/**\n * A valid Tailwind CSS breakpoint identifier.\n *\n * @example\n * const bp: TailwindBreakpoint = \"md\"; // ≥48rem (768px)\n *\n * @example\n * \"2xl\" // ≥96rem (1536px)\n * \"xl\"  // ≥80rem (1280px)\n * \"lg\"  // ≥64rem (1024px)\n * \"md\"  // ≥48rem (768px)\n * \"sm\"  // ≥40rem (640px)\n * \"xs\"  // ≥30rem (480px)\n */\ntype TailwindBreakpoint = (typeof tailwindBreakpoints)[number];\n\n/**\n * Mantle’s breakpoint set, extending Tailwind’s with `\"default\"`.\n *\n * `\"default\"` represents the base (0px and up) viewport,\n * useful for defining fallbacks or mobile-first styles.\n *\n * @example\n * \"default\" // ≥0rem (0px)\n * \"xs\"      // ≥30rem (480px)\n * \"sm\"      // ≥40rem (640px)\n * \"md\"      // ≥48rem (768px)\n * \"lg\"      // ≥64rem (1024px)\n * \"xl\"      // ≥80rem (1280px)\n * \"2xl\"     // ≥96rem (1536px)\n */\nconst breakpoints = [\"default\", ...tailwindBreakpoints] as const;\n\n/**\n * A valid Mantle breakpoint identifier.\n *\n * Includes Tailwind’s standard breakpoints plus `\"default\"` for 0px+.\n *\n * @example\n * const bp: Breakpoint = \"default\"; // ≥0px\n *\n * @example\n * \"default\" // ≥0rem (0px)\n * \"xs\"      // ≥30rem (480px)\n * \"sm\"      // ≥40rem (640px)\n * \"md\"      // ≥48rem (768px)\n * \"lg\"      // ≥64rem (1024px)\n * \"xl\"      // ≥80rem (1280px)\n * \"2xl\"     // ≥96rem (1536px)\n */\ntype Breakpoint = (typeof breakpoints)[number];\n\n/**\n * React hook that returns the current breakpoint based on the viewport width.\n *\n * Uses a singleton subscription to a set of min-width media queries and returns\n * the largest matching breakpoint. Designed for React 18+ with\n * `useSyncExternalStore`.\n *\n * @returns {Breakpoint} The current breakpoint that matches the viewport width.\n *\n * @example\n * const breakpoint = useBreakpoint();\n * if (breakpoint === \"lg\") {\n *   // Do something for large screens and above\n * }\n */\nfunction useBreakpoint(): Breakpoint {\n\treturn useSyncExternalStore(\n\t\tsubscribeToBreakpointChanges,\n\t\tgetCurrentBreakpointSnapshot,\n\t\t() => \"default\", // SSR fallback\n\t);\n}\n\n/**\n * React hook that returns true if the current viewport width is below the specified breakpoint.\n *\n * This hook uses `window.matchMedia` with a max-width media query and leverages\n * `useSyncExternalStore` to stay compliant with React's concurrent rendering model.\n *\n * @param {TailwindBreakpoint} breakpoint - The breakpoint to check against (e.g., \"md\", \"lg\").\n *\n * @returns {boolean} `true` if the viewport width is below the breakpoint, otherwise `false`.\n *\n * @example\n * // Check if viewport is below medium (768px)\n * const isBelowMd = useIsBelowBreakpoint(\"md\");\n */\nfunction useIsBelowBreakpoint(breakpoint: TailwindBreakpoint): boolean {\n\treturn useSyncExternalStore(\n\t\tcreateBelowBreakpointSubscribe(breakpoint),\n\t\tcreateBelowBreakpointGetSnapshot(breakpoint),\n\t\t() => false, // SSR fallback - assume desktop\n\t);\n}\n\nexport {\n\t//,\n\tbreakpoints,\n\tuseBreakpoint,\n\tuseIsBelowBreakpoint,\n};\n\nexport type {\n\t//,\n\tBreakpoint,\n\tTailwindBreakpoint,\n};\n\n/**\n * A CSS media query string representing a minimum width in `rem` units.\n *\n * @example\n * const query: MinWidthQuery = \"(min-width: 48rem)\";\n *\n * @private\n */\ntype MinWidthQuery = `(min-width: ${number}rem)`;\n\n/**\n * A CSS media query string representing a maximum width in `rem` units.\n *\n * @example\n * const query: MaxWidthQuery = \"(max-width: 47.99rem)\";\n *\n * @private\n */\ntype MaxWidthQuery = `(max-width: ${number}rem)`;\n\n/**\n * Precomputed min-width media query strings for each Tailwind breakpoint.\n *\n * Using constants avoids template string work in hot paths and ensures type\n * safety against the `MinWidthQuery` template literal type.\n *\n * @remarks\n * These are expressed in `rem`. If your CSS breakpoints are in `px`, consider\n * aligning units to avoid JS/CSS drift when `html{font-size}` changes.\n *\n * @private\n */\nconst breakpointQueries = {\n\t\"2xl\": \"(min-width: 96rem)\" as const,\n\txl: \"(min-width: 80rem)\" as const,\n\tlg: \"(min-width: 64rem)\" as const,\n\tmd: \"(min-width: 48rem)\" as const,\n\tsm: \"(min-width: 40rem)\" as const,\n\txs: \"(min-width: 30rem)\" as const,\n} as const satisfies Record<TailwindBreakpoint, MinWidthQuery>;\n\n/**\n * Precomputed max-width media query strings used by `useIsBelowBreakpoint`.\n *\n * The `-0.01rem` offset avoids overlap at exact boundaries.\n *\n * @private\n */\nconst belowBreakpointQueries = {\n\t\"2xl\": \"(max-width: 95.99rem)\" as const, // 96 - 0.01\n\txl: \"(max-width: 79.99rem)\" as const, // 80 - 0.01\n\tlg: \"(max-width: 63.99rem)\" as const, // 64 - 0.01\n\tmd: \"(max-width: 47.99rem)\" as const, // 48 - 0.01\n\tsm: \"(max-width: 39.99rem)\" as const, // 40 - 0.01\n\txs: \"(max-width: 29.99rem)\" as const, // 40 - 0.01\n} as const satisfies Record<TailwindBreakpoint, MaxWidthQuery>;\n\n/**\n * Lazily-initialized cache of `MediaQueryList` objects for min-width queries.\n *\n * Initialized on first access to remain SSR-safe (no `window` at import time).\n *\n * @private\n */\nlet minWidthMQLs: Record<TailwindBreakpoint, MediaQueryList> | null = null;\n\n/**\n * Lazily-initialized cache of `MediaQueryList` objects for max-width queries.\n *\n * Used by `useIsBelowBreakpoint`. Also SSR-safe by lazy access.\n *\n * @private\n */\nlet maxWidthMQLs: Record<TailwindBreakpoint, MediaQueryList> | null = null;\n\n/**\n * Get (and lazily create) the cached `MediaQueryList` objects for min-width queries.\n *\n * @returns A record of `MediaQueryList` keyed by Tailwind breakpoint.\n * @private\n */\nfunction getMinWidthMQLs(): Record<TailwindBreakpoint, MediaQueryList> {\n\tif (!minWidthMQLs) {\n\t\tminWidthMQLs = {\n\t\t\t\"2xl\": window.matchMedia(breakpointQueries[\"2xl\"]),\n\t\t\txl: window.matchMedia(breakpointQueries.xl),\n\t\t\tlg: window.matchMedia(breakpointQueries.lg),\n\t\t\tmd: window.matchMedia(breakpointQueries.md),\n\t\t\tsm: window.matchMedia(breakpointQueries.sm),\n\t\t\txs: window.matchMedia(breakpointQueries.xs),\n\t\t};\n\t}\n\treturn minWidthMQLs;\n}\n\n/**\n * Get (and lazily create) the cached `MediaQueryList` for a specific max-width breakpoint.\n *\n * @param breakpoint - Tailwind breakpoint identifier (e.g., \"md\").\n * @returns The corresponding `MediaQueryList`.\n * @private\n */\nfunction getMaxWidthMQL(breakpoint: TailwindBreakpoint): MediaQueryList {\n\tif (!maxWidthMQLs) {\n\t\tmaxWidthMQLs = {\n\t\t\t\"2xl\": window.matchMedia(belowBreakpointQueries[\"2xl\"]),\n\t\t\txl: window.matchMedia(belowBreakpointQueries.xl),\n\t\t\tlg: window.matchMedia(belowBreakpointQueries.lg),\n\t\t\tmd: window.matchMedia(belowBreakpointQueries.md),\n\t\t\tsm: window.matchMedia(belowBreakpointQueries.sm),\n\t\t\txs: window.matchMedia(belowBreakpointQueries.xs),\n\t\t};\n\t}\n\treturn maxWidthMQLs[breakpoint];\n}\n\n/**\n * Current breakpoint value used by the singleton store backing `useBreakpoint`.\n *\n * Initialized to `\"default\"` and updated on media-query change events.\n *\n * @private\n */\nlet currentBreakpointValue: Breakpoint = \"default\";\n\n/**\n * Set of component listeners subscribed to the singleton breakpoint store.\n *\n * Each listener is invoked when the current breakpoint value changes.\n *\n * @private\n */\nconst breakpointListeners = new Set<() => void>();\n\n/**\n * Flag indicating whether global media-query listeners are currently attached.\n *\n * Prevents duplicate registrations and enables full teardown when unused.\n *\n * @private\n */\nlet breakpointSubscriptionActive = false;\n\n/**\n * Compute the current breakpoint by checking cached min-width MQLs\n * from largest to smallest.\n *\n * @returns {Breakpoint} The largest matching breakpoint, or `\"default\"`.\n * @private\n */\nfunction getCurrentBreakpoint(): Breakpoint {\n\tconst mqls = getMinWidthMQLs();\n\tfor (const breakpoint of tailwindBreakpoints) {\n\t\tif (mqls[breakpoint].matches) {\n\t\t\treturn breakpoint;\n\t\t}\n\t}\n\treturn \"default\";\n}\n\n/**\n * Update the current breakpoint value and notify all listeners.\n *\n * Uses `requestAnimationFrame` to coalesce rapid resize events and minimize\n * re-renders during active window resizing.\n *\n * @private\n */\nlet breakpointUpdatePending = false;\nfunction updateCurrentBreakpoint() {\n\tif (!breakpointUpdatePending) {\n\t\tbreakpointUpdatePending = true;\n\t\trequestAnimationFrame(() => {\n\t\t\tbreakpointUpdatePending = false;\n\t\t\tconst newBreakpoint = getCurrentBreakpoint();\n\t\t\tif (newBreakpoint !== currentBreakpointValue) {\n\t\t\t\tcurrentBreakpointValue = newBreakpoint;\n\t\t\t\tfor (const listener of breakpointListeners) {\n\t\t\t\t\tlistener();\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t}\n}\n\n/**\n * Subscribe a component to breakpoint changes (singleton pattern).\n *\n * Ensures only one set of MQL listeners exists app-wide. Also reconciles the\n * `useSyncExternalStore` initial snapshot/subscribe race by invoking the\n * subscriber once on mount.\n *\n * @param callback - Listener invoked when the breakpoint value may have changed.\n * @returns Cleanup function to unsubscribe the listener.\n * @private\n */\nfunction subscribeToBreakpointChanges(callback: () => void) {\n\tbreakpointListeners.add(callback);\n\n\t// Attach global listeners once\n\tif (!breakpointSubscriptionActive) {\n\t\tbreakpointSubscriptionActive = true;\n\t\tconst mqls = getMinWidthMQLs();\n\n\t\t// Initialize current value synchronously\n\t\tcurrentBreakpointValue = getCurrentBreakpoint();\n\n\t\t// Attach listeners to all breakpoint MQLs\n\t\tfor (const mql of Object.values(mqls)) {\n\t\t\tmql.addEventListener(\"change\", updateCurrentBreakpoint);\n\t\t}\n\t}\n\n\t// Reconcile initial getSnapshot vs subscribe ordering\n\tcallback();\n\n\t// Cleanup\n\treturn () => {\n\t\tbreakpointListeners.delete(callback);\n\n\t\t// Tear down global listeners when no one is listening\n\t\tif (breakpointListeners.size === 0 && breakpointSubscriptionActive) {\n\t\t\tbreakpointSubscriptionActive = false;\n\t\t\tconst mqls = getMinWidthMQLs();\n\t\t\tfor (const mql of Object.values(mqls)) {\n\t\t\t\tmql.removeEventListener(\"change\", updateCurrentBreakpoint);\n\t\t\t}\n\t\t}\n\t};\n}\n\n/**\n * Return the current breakpoint value from the singleton store.\n *\n * Used as the `getSnapshot` for `useSyncExternalStore`.\n *\n * @returns {Breakpoint} The latest computed breakpoint.\n * @private\n */\nfunction getCurrentBreakpointSnapshot(): Breakpoint {\n\treturn currentBreakpointValue;\n}\n\n/**\n * Factory to create a `subscribe` function for a specific \"below\" breakpoint.\n *\n * Uses a cached `MediaQueryList` and rAF-throttled change handler to avoid\n * bursty updates during resize.\n *\n * @param breakpoint - Tailwind breakpoint identifier (e.g., \"lg\").\n * @returns A `subscribe` function suitable for `useSyncExternalStore`.\n * @private\n */\nfunction createBelowBreakpointSubscribe(breakpoint: TailwindBreakpoint) {\n\treturn (callback: () => void) => {\n\t\tconst mediaQuery = getMaxWidthMQL(breakpoint);\n\n\t\t// rAF throttle the change callback during active resize\n\t\tlet pending = false;\n\t\tconst onChange = () => {\n\t\t\tif (!pending) {\n\t\t\t\tpending = true;\n\t\t\t\trequestAnimationFrame(() => {\n\t\t\t\t\tpending = false;\n\t\t\t\t\tcallback();\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\n\t\tmediaQuery.addEventListener(\"change\", onChange);\n\t\treturn () => {\n\t\t\tmediaQuery.removeEventListener(\"change\", onChange);\n\t\t};\n\t};\n}\n\n/**\n * Factory to create a `getSnapshot` function for a specific \"below\" breakpoint.\n *\n * Uses the cached `MediaQueryList` for the target breakpoint.\n *\n * @param breakpoint - Tailwind breakpoint identifier (e.g., \"lg\").\n * @returns A function that returns `true` when the viewport is below the breakpoint.\n * @private\n */\nfunction createBelowBreakpointGetSnapshot(breakpoint: TailwindBreakpoint) {\n\treturn () => {\n\t\tconst mediaQuery = getMaxWidthMQL(breakpoint);\n\t\treturn mediaQuery.matches;\n\t};\n}\n","import { useEffect, useMemo, useRef } from \"react\";\n\n/**\n * Returns a memoized callback that will always refer to the latest callback\n * passed to the hook.\n *\n * This is useful when you want to pass a callback which may or may not be\n * memoized (have a stable identity) to a child component that will be updated\n * without causing the child component to re-render.\n */\nfunction useCallbackRef<T extends (...args: unknown[]) => unknown>(\n\tcallback: T | undefined,\n): T {\n\tconst callbackRef = useRef(callback);\n\n\tuseEffect(() => {\n\t\tcallbackRef.current = callback;\n\t});\n\n\treturn useMemo(() => ((...args) => callbackRef.current?.(...args)) as T, []);\n}\n\nexport {\n\t//,\n\tuseCallbackRef,\n};\n","import { useCallback, useEffect, useRef } from \"react\";\nimport { useCallbackRef } from \"./use-callback-ref.js\";\n\ntype Options = {\n\t/**\n\t * The delay in milliseconds to wait before calling the callback.\n\t */\n\twaitMs: number;\n};\n\n/**\n * Create a debounced version of a callback function.\n *\n * It allows you to delay the execution of a function until a certain period of\n * inactivity has passed (the `options.waitMs`), which can be useful for limiting rapid\n * invocations of a function (like in search inputs or button clicks)\n *\n * Note: The debounced callback will always refer to the latest callback passed\n * even without memoization, so it's stable and safe to use in dependency arrays.\n */\nfunction useDebouncedCallback<T extends (...args: unknown[]) => unknown>(\n\tcallbackFn: T,\n\toptions: Options,\n) {\n\tconst stableCallbackFn = useCallbackRef(callbackFn);\n\tconst debounceTimerRef = useRef(0);\n\tuseEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);\n\n\treturn useCallback(\n\t\t(...args: Parameters<T>) => {\n\t\t\twindow.clearTimeout(debounceTimerRef.current);\n\t\t\tdebounceTimerRef.current = window.setTimeout(\n\t\t\t\t() => stableCallbackFn(...args),\n\t\t\t\toptions.waitMs,\n\t\t\t);\n\t\t},\n\t\t[stableCallbackFn, options.waitMs],\n\t);\n}\n\nexport {\n\t//,\n\tuseDebouncedCallback,\n};\n","import { useEffect, useLayoutEffect } from \"react\";\n\n/**\n * useIsomorphicLayoutEffect is a hook that uses useLayoutEffect on the client and useEffect on the server.\n */\nexport const useIsomorphicLayoutEffect =\n\ttypeof window !== \"undefined\" ? useLayoutEffect : useEffect;\n","import { useEffect, useState } from \"react\";\n\n/**\n * no-preference is the default value for the prefers-reduced-motion media query.\n * Users who have never fiddled with their a11y settings will still see animations\n * (no explicit opt-in required from a user's perspective)\n */\nconst query = \"(prefers-reduced-motion: no-preference)\";\n\n/**\n * usePrefersReducedMotion returns true if the user has opted out of animations\n */\nexport function usePrefersReducedMotion() {\n\t// default to no animations, since we don't know what the user's preference is on the server\n\tconst [prefersReducedMotion, setPrefersReducedMotion] = useState(true);\n\n\tuseEffect(() => {\n\t\tconst mediaQueryList = window.matchMedia(query);\n\n\t\t// set the _real_ initial value now that we're on the client\n\t\tsetPrefersReducedMotion(!mediaQueryList.matches);\n\n\t\t// register for updates\n\t\tfunction listener(event: MediaQueryListEvent) {\n\t\t\tsetPrefersReducedMotion(!event.matches);\n\t\t}\n\n\t\tmediaQueryList.addEventListener(\"change\", listener);\n\n\t\treturn () => {\n\t\t\tmediaQueryList.removeEventListener(\"change\", listener);\n\t\t};\n\t}, []);\n\n\treturn prefersReducedMotion;\n}\n","import { useMemo } from \"react\";\n\n/**\n * Hook to generate a random, stable id.\n * This is similar to `useId`, but generates a stable id client side which can also\n * be used for css selectors and element ids.\n */\nconst useRandomStableId = (prefix = \"mantle\") =>\n\tuseMemo(() => randomStableId(prefix), [prefix]);\n\nexport {\n\t//,\n\tuseRandomStableId,\n};\n\nfunction randomStableId(prefix = \"mantle\") {\n\tconst _prefix = prefix.trim() || \"mantle\";\n\treturn [_prefix, randomPostfix()].join(\"-\");\n}\n\nfunction randomPostfix() {\n\treturn Math.random().toString(36).substring(2, 9);\n}\n"],"mappings":"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","names":["useSyncExternalStore","tailwindBreakpoints","breakpoints","useBreakpoint","subscribeToBreakpointChanges","getCurrentBreakpointSnapshot","useIsBelowBreakpoint","breakpoint","createBelowBreakpointSubscribe","createBelowBreakpointGetSnapshot","breakpointQueries","belowBreakpointQueries","minWidthMQLs","maxWidthMQLs","getMinWidthMQLs","getMaxWidthMQL","breakpoint","currentBreakpointValue","breakpointListeners","breakpointSubscriptionActive","getCurrentBreakpoint","mqls","tailwindBreakpoints","breakpointUpdatePending","updateCurrentBreakpoint","newBreakpoint","listener","subscribeToBreakpointChanges","callback","mql","getCurrentBreakpointSnapshot","createBelowBreakpointSubscribe","mediaQuery","pending","onChange","createBelowBreakpointGetSnapshot","useEffect","useMemo","useRef","useCallbackRef","callback","callbackRef","args","useCallback","useEffect","useRef","useDebouncedCallback","callbackFn","options","stableCallbackFn","useCallbackRef","debounceTimerRef","useRef","useEffect","useCallback","args","useEffect","useLayoutEffect","useIsomorphicLayoutEffect","useEffect","useState","query","usePrefersReducedMotion","prefersReducedMotion","setPrefersReducedMotion","mediaQueryList","listener","event","useMemo","useRandomStableId","prefix","randomStableId","randomStableId","prefix","randomPostfix"]}
+{"version":3,"sources":["../src/hooks/use-breakpoint.tsx","../src/hooks/use-callback-ref.tsx","../src/hooks/use-debounced-callback.tsx","../src/hooks/use-random-stable-id.tsx"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\n\n/**\n * Tailwind CSS breakpoints in descending order (largest → smallest).\n *\n * These correspond to Tailwind’s default `theme.screens` config and are used\n * to determine the current viewport size.\n *\n * @see https://tailwindcss.com/docs/screens\n *\n * @example\n * \"2xl\" // ≥96rem (1536px)\n * \"xl\"  // ≥80rem (1280px)\n * \"lg\"  // ≥64rem (1024px)\n * \"md\"  // ≥48rem (768px)\n * \"sm\"  // ≥40rem (640px)\n * \"xs\"  // ≥30rem (480px)\n */\nconst tailwindBreakpoints = [\"2xl\", \"xl\", \"lg\", \"md\", \"sm\", \"xs\"] as const;\n\n/**\n * A valid Tailwind CSS breakpoint identifier.\n *\n * @example\n * const bp: TailwindBreakpoint = \"md\"; // ≥48rem (768px)\n *\n * @example\n * \"2xl\" // ≥96rem (1536px)\n * \"xl\"  // ≥80rem (1280px)\n * \"lg\"  // ≥64rem (1024px)\n * \"md\"  // ≥48rem (768px)\n * \"sm\"  // ≥40rem (640px)\n * \"xs\"  // ≥30rem (480px)\n */\ntype TailwindBreakpoint = (typeof tailwindBreakpoints)[number];\n\n/**\n * Mantle’s breakpoint set, extending Tailwind’s with `\"default\"`.\n *\n * `\"default\"` represents the base (0px and up) viewport,\n * useful for defining fallbacks or mobile-first styles.\n *\n * @example\n * \"default\" // ≥0rem (0px)\n * \"xs\"      // ≥30rem (480px)\n * \"sm\"      // ≥40rem (640px)\n * \"md\"      // ≥48rem (768px)\n * \"lg\"      // ≥64rem (1024px)\n * \"xl\"      // ≥80rem (1280px)\n * \"2xl\"     // ≥96rem (1536px)\n */\nconst breakpoints = [\"default\", ...tailwindBreakpoints] as const;\n\n/**\n * A valid Mantle breakpoint identifier.\n *\n * Includes Tailwind’s standard breakpoints plus `\"default\"` for 0px+.\n *\n * @example\n * const bp: Breakpoint = \"default\"; // ≥0px\n *\n * @example\n * \"default\" // ≥0rem (0px)\n * \"xs\"      // ≥30rem (480px)\n * \"sm\"      // ≥40rem (640px)\n * \"md\"      // ≥48rem (768px)\n * \"lg\"      // ≥64rem (1024px)\n * \"xl\"      // ≥80rem (1280px)\n * \"2xl\"     // ≥96rem (1536px)\n */\ntype Breakpoint = (typeof breakpoints)[number];\n\n/**\n * React hook that returns the current breakpoint based on the viewport width.\n *\n * Uses a singleton subscription to a set of min-width media queries and returns\n * the largest matching breakpoint. Designed for React 18+ with\n * `useSyncExternalStore`.\n *\n * @returns {Breakpoint} The current breakpoint that matches the viewport width.\n *\n * @example\n * const breakpoint = useBreakpoint();\n * if (breakpoint === \"lg\") {\n *   // Do something for large screens and above\n * }\n */\nfunction useBreakpoint(): Breakpoint {\n\treturn useSyncExternalStore(\n\t\tsubscribeToBreakpointChanges,\n\t\tgetCurrentBreakpointSnapshot,\n\t\t() => \"default\", // SSR fallback\n\t);\n}\n\n/**\n * React hook that returns true if the current viewport width is below the specified breakpoint.\n *\n * This hook uses `window.matchMedia` with a max-width media query and leverages\n * `useSyncExternalStore` to stay compliant with React's concurrent rendering model.\n *\n * @param {TailwindBreakpoint} breakpoint - The breakpoint to check against (e.g., \"md\", \"lg\").\n *\n * @returns {boolean} `true` if the viewport width is below the breakpoint, otherwise `false`.\n *\n * @example\n * // Check if viewport is below medium (768px)\n * const isBelowMd = useIsBelowBreakpoint(\"md\");\n */\nfunction useIsBelowBreakpoint(breakpoint: TailwindBreakpoint): boolean {\n\treturn useSyncExternalStore(\n\t\tcreateBelowBreakpointSubscribe(breakpoint),\n\t\tcreateBelowBreakpointGetSnapshot(breakpoint),\n\t\t() => false, // SSR fallback - assume desktop\n\t);\n}\n\nexport {\n\t//,\n\tbreakpoints,\n\tuseBreakpoint,\n\tuseIsBelowBreakpoint,\n};\n\nexport type {\n\t//,\n\tBreakpoint,\n\tTailwindBreakpoint,\n};\n\n/**\n * A CSS media query string representing a minimum width in `rem` units.\n *\n * @example\n * const query: MinWidthQuery = \"(min-width: 48rem)\";\n *\n * @private\n */\ntype MinWidthQuery = `(min-width: ${number}rem)`;\n\n/**\n * A CSS media query string representing a maximum width in `rem` units.\n *\n * @example\n * const query: MaxWidthQuery = \"(max-width: 47.99rem)\";\n *\n * @private\n */\ntype MaxWidthQuery = `(max-width: ${number}rem)`;\n\n/**\n * Precomputed min-width media query strings for each Tailwind breakpoint.\n *\n * Using constants avoids template string work in hot paths and ensures type\n * safety against the `MinWidthQuery` template literal type.\n *\n * @remarks\n * These are expressed in `rem`. If your CSS breakpoints are in `px`, consider\n * aligning units to avoid JS/CSS drift when `html{font-size}` changes.\n *\n * @private\n */\nconst breakpointQueries = {\n\t\"2xl\": \"(min-width: 96rem)\" as const,\n\txl: \"(min-width: 80rem)\" as const,\n\tlg: \"(min-width: 64rem)\" as const,\n\tmd: \"(min-width: 48rem)\" as const,\n\tsm: \"(min-width: 40rem)\" as const,\n\txs: \"(min-width: 30rem)\" as const,\n} as const satisfies Record<TailwindBreakpoint, MinWidthQuery>;\n\n/**\n * Precomputed max-width media query strings used by `useIsBelowBreakpoint`.\n *\n * The `-0.01rem` offset avoids overlap at exact boundaries.\n *\n * @private\n */\nconst belowBreakpointQueries = {\n\t\"2xl\": \"(max-width: 95.99rem)\" as const, // 96 - 0.01\n\txl: \"(max-width: 79.99rem)\" as const, // 80 - 0.01\n\tlg: \"(max-width: 63.99rem)\" as const, // 64 - 0.01\n\tmd: \"(max-width: 47.99rem)\" as const, // 48 - 0.01\n\tsm: \"(max-width: 39.99rem)\" as const, // 40 - 0.01\n\txs: \"(max-width: 29.99rem)\" as const, // 40 - 0.01\n} as const satisfies Record<TailwindBreakpoint, MaxWidthQuery>;\n\n/**\n * Lazily-initialized cache of `MediaQueryList` objects for min-width queries.\n *\n * Initialized on first access to remain SSR-safe (no `window` at import time).\n *\n * @private\n */\nlet minWidthMQLs: Record<TailwindBreakpoint, MediaQueryList> | null = null;\n\n/**\n * Lazily-initialized cache of `MediaQueryList` objects for max-width queries.\n *\n * Used by `useIsBelowBreakpoint`. Also SSR-safe by lazy access.\n *\n * @private\n */\nlet maxWidthMQLs: Record<TailwindBreakpoint, MediaQueryList> | null = null;\n\n/**\n * Get (and lazily create) the cached `MediaQueryList` objects for min-width queries.\n *\n * @returns A record of `MediaQueryList` keyed by Tailwind breakpoint.\n * @private\n */\nfunction getMinWidthMQLs(): Record<TailwindBreakpoint, MediaQueryList> {\n\tif (!minWidthMQLs) {\n\t\tminWidthMQLs = {\n\t\t\t\"2xl\": window.matchMedia(breakpointQueries[\"2xl\"]),\n\t\t\txl: window.matchMedia(breakpointQueries.xl),\n\t\t\tlg: window.matchMedia(breakpointQueries.lg),\n\t\t\tmd: window.matchMedia(breakpointQueries.md),\n\t\t\tsm: window.matchMedia(breakpointQueries.sm),\n\t\t\txs: window.matchMedia(breakpointQueries.xs),\n\t\t};\n\t}\n\treturn minWidthMQLs;\n}\n\n/**\n * Get (and lazily create) the cached `MediaQueryList` for a specific max-width breakpoint.\n *\n * @param breakpoint - Tailwind breakpoint identifier (e.g., \"md\").\n * @returns The corresponding `MediaQueryList`.\n * @private\n */\nfunction getMaxWidthMQL(breakpoint: TailwindBreakpoint): MediaQueryList {\n\tif (!maxWidthMQLs) {\n\t\tmaxWidthMQLs = {\n\t\t\t\"2xl\": window.matchMedia(belowBreakpointQueries[\"2xl\"]),\n\t\t\txl: window.matchMedia(belowBreakpointQueries.xl),\n\t\t\tlg: window.matchMedia(belowBreakpointQueries.lg),\n\t\t\tmd: window.matchMedia(belowBreakpointQueries.md),\n\t\t\tsm: window.matchMedia(belowBreakpointQueries.sm),\n\t\t\txs: window.matchMedia(belowBreakpointQueries.xs),\n\t\t};\n\t}\n\treturn maxWidthMQLs[breakpoint];\n}\n\n/**\n * Current breakpoint value used by the singleton store backing `useBreakpoint`.\n *\n * Initialized to `\"default\"` and updated on media-query change events.\n *\n * @private\n */\nlet currentBreakpointValue: Breakpoint = \"default\";\n\n/**\n * Set of component listeners subscribed to the singleton breakpoint store.\n *\n * Each listener is invoked when the current breakpoint value changes.\n *\n * @private\n */\nconst breakpointListeners = new Set<() => void>();\n\n/**\n * Flag indicating whether global media-query listeners are currently attached.\n *\n * Prevents duplicate registrations and enables full teardown when unused.\n *\n * @private\n */\nlet breakpointSubscriptionActive = false;\n\n/**\n * Compute the current breakpoint by checking cached min-width MQLs\n * from largest to smallest.\n *\n * @returns {Breakpoint} The largest matching breakpoint, or `\"default\"`.\n * @private\n */\nfunction getCurrentBreakpoint(): Breakpoint {\n\tconst mqls = getMinWidthMQLs();\n\tfor (const breakpoint of tailwindBreakpoints) {\n\t\tif (mqls[breakpoint].matches) {\n\t\t\treturn breakpoint;\n\t\t}\n\t}\n\treturn \"default\";\n}\n\n/**\n * Update the current breakpoint value and notify all listeners.\n *\n * Uses `requestAnimationFrame` to coalesce rapid resize events and minimize\n * re-renders during active window resizing.\n *\n * @private\n */\nlet breakpointUpdatePending = false;\nfunction updateCurrentBreakpoint() {\n\tif (!breakpointUpdatePending) {\n\t\tbreakpointUpdatePending = true;\n\t\trequestAnimationFrame(() => {\n\t\t\tbreakpointUpdatePending = false;\n\t\t\tconst newBreakpoint = getCurrentBreakpoint();\n\t\t\tif (newBreakpoint !== currentBreakpointValue) {\n\t\t\t\tcurrentBreakpointValue = newBreakpoint;\n\t\t\t\tfor (const listener of breakpointListeners) {\n\t\t\t\t\tlistener();\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t}\n}\n\n/**\n * Subscribe a component to breakpoint changes (singleton pattern).\n *\n * Ensures only one set of MQL listeners exists app-wide. Also reconciles the\n * `useSyncExternalStore` initial snapshot/subscribe race by invoking the\n * subscriber once on mount.\n *\n * @param callback - Listener invoked when the breakpoint value may have changed.\n * @returns Cleanup function to unsubscribe the listener.\n * @private\n */\nfunction subscribeToBreakpointChanges(callback: () => void) {\n\tbreakpointListeners.add(callback);\n\n\t// Attach global listeners once\n\tif (!breakpointSubscriptionActive) {\n\t\tbreakpointSubscriptionActive = true;\n\t\tconst mqls = getMinWidthMQLs();\n\n\t\t// Initialize current value synchronously\n\t\tcurrentBreakpointValue = getCurrentBreakpoint();\n\n\t\t// Attach listeners to all breakpoint MQLs\n\t\tfor (const mql of Object.values(mqls)) {\n\t\t\tmql.addEventListener(\"change\", updateCurrentBreakpoint);\n\t\t}\n\t}\n\n\t// Reconcile initial getSnapshot vs subscribe ordering\n\tcallback();\n\n\t// Cleanup\n\treturn () => {\n\t\tbreakpointListeners.delete(callback);\n\n\t\t// Tear down global listeners when no one is listening\n\t\tif (breakpointListeners.size === 0 && breakpointSubscriptionActive) {\n\t\t\tbreakpointSubscriptionActive = false;\n\t\t\tconst mqls = getMinWidthMQLs();\n\t\t\tfor (const mql of Object.values(mqls)) {\n\t\t\t\tmql.removeEventListener(\"change\", updateCurrentBreakpoint);\n\t\t\t}\n\t\t}\n\t};\n}\n\n/**\n * Return the current breakpoint value from the singleton store.\n *\n * Used as the `getSnapshot` for `useSyncExternalStore`.\n *\n * @returns {Breakpoint} The latest computed breakpoint.\n * @private\n */\nfunction getCurrentBreakpointSnapshot(): Breakpoint {\n\treturn currentBreakpointValue;\n}\n\n/**\n * Factory to create a `subscribe` function for a specific \"below\" breakpoint.\n *\n * Uses a cached `MediaQueryList` and rAF-throttled change handler to avoid\n * bursty updates during resize.\n *\n * @param breakpoint - Tailwind breakpoint identifier (e.g., \"lg\").\n * @returns A `subscribe` function suitable for `useSyncExternalStore`.\n * @private\n */\nfunction createBelowBreakpointSubscribe(breakpoint: TailwindBreakpoint) {\n\treturn (callback: () => void) => {\n\t\tconst mediaQuery = getMaxWidthMQL(breakpoint);\n\n\t\t// rAF throttle the change callback during active resize\n\t\tlet pending = false;\n\t\tconst onChange = () => {\n\t\t\tif (!pending) {\n\t\t\t\tpending = true;\n\t\t\t\trequestAnimationFrame(() => {\n\t\t\t\t\tpending = false;\n\t\t\t\t\tcallback();\n\t\t\t\t});\n\t\t\t}\n\t\t};\n\n\t\tmediaQuery.addEventListener(\"change\", onChange);\n\t\treturn () => {\n\t\t\tmediaQuery.removeEventListener(\"change\", onChange);\n\t\t};\n\t};\n}\n\n/**\n * Factory to create a `getSnapshot` function for a specific \"below\" breakpoint.\n *\n * Uses the cached `MediaQueryList` for the target breakpoint.\n *\n * @param breakpoint - Tailwind breakpoint identifier (e.g., \"lg\").\n * @returns A function that returns `true` when the viewport is below the breakpoint.\n * @private\n */\nfunction createBelowBreakpointGetSnapshot(breakpoint: TailwindBreakpoint) {\n\treturn () => {\n\t\tconst mediaQuery = getMaxWidthMQL(breakpoint);\n\t\treturn mediaQuery.matches;\n\t};\n}\n","import { useEffect, useMemo, useRef } from \"react\";\n\n/**\n * Returns a memoized callback that will always refer to the latest callback\n * passed to the hook.\n *\n * This is useful when you want to pass a callback which may or may not be\n * memoized (have a stable identity) to a child component that will be updated\n * without causing the child component to re-render.\n */\nfunction useCallbackRef<T extends (...args: unknown[]) => unknown>(\n\tcallback: T | undefined,\n): T {\n\tconst callbackRef = useRef(callback);\n\n\tuseEffect(() => {\n\t\tcallbackRef.current = callback;\n\t});\n\n\treturn useMemo(() => ((...args) => callbackRef.current?.(...args)) as T, []);\n}\n\nexport {\n\t//,\n\tuseCallbackRef,\n};\n","import { useCallback, useEffect, useRef } from \"react\";\nimport { useCallbackRef } from \"./use-callback-ref.js\";\n\ntype Options = {\n\t/**\n\t * The delay in milliseconds to wait before calling the callback.\n\t */\n\twaitMs: number;\n};\n\n/**\n * Create a debounced version of a callback function.\n *\n * It allows you to delay the execution of a function until a certain period of\n * inactivity has passed (the `options.waitMs`), which can be useful for limiting rapid\n * invocations of a function (like in search inputs or button clicks)\n *\n * Note: The debounced callback will always refer to the latest callback passed\n * even without memoization, so it's stable and safe to use in dependency arrays.\n */\nfunction useDebouncedCallback<T extends (...args: unknown[]) => unknown>(\n\tcallbackFn: T,\n\toptions: Options,\n) {\n\tconst stableCallbackFn = useCallbackRef(callbackFn);\n\tconst debounceTimerRef = useRef(0);\n\tuseEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);\n\n\treturn useCallback(\n\t\t(...args: Parameters<T>) => {\n\t\t\twindow.clearTimeout(debounceTimerRef.current);\n\t\t\tdebounceTimerRef.current = window.setTimeout(\n\t\t\t\t() => stableCallbackFn(...args),\n\t\t\t\toptions.waitMs,\n\t\t\t);\n\t\t},\n\t\t[stableCallbackFn, options.waitMs],\n\t);\n}\n\nexport {\n\t//,\n\tuseDebouncedCallback,\n};\n","import { useMemo } from \"react\";\n\n/**\n * Hook to generate a random, stable id.\n * This is similar to `useId`, but generates a stable id client side which can also\n * be used for css selectors and element ids.\n */\nconst useRandomStableId = (prefix = \"mantle\") =>\n\tuseMemo(() => randomStableId(prefix), [prefix]);\n\nexport {\n\t//,\n\tuseRandomStableId,\n};\n\nfunction randomStableId(prefix = \"mantle\") {\n\tconst _prefix = prefix.trim() || \"mantle\";\n\treturn [_prefix, randomPostfix()].join(\"-\");\n}\n\nfunction randomPostfix() {\n\treturn Math.random().toString(36).substring(2, 9);\n}\n"],"mappings":"8KAAA,OAAS,wBAAAA,MAA4B,QAkBrC,IAAMC,EAAsB,CAAC,MAAO,KAAM,KAAM,KAAM,KAAM,IAAI,EAiC1DC,EAAc,CAAC,UAAW,GAAGD,CAAmB,EAoCtD,SAASE,GAA4B,CACpC,OAAOH,EACNI,EACAC,EACA,IAAM,SACP,CACD,CAgBA,SAASC,EAAqBC,EAAyC,CACtE,OAAOP,EACNQ,EAA+BD,CAAU,EACzCE,EAAiCF,CAAU,EAC3C,IAAM,EACP,CACD,CA+CA,IAAMG,EAAoB,CACzB,MAAO,qBACP,GAAI,qBACJ,GAAI,qBACJ,GAAI,qBACJ,GAAI,qBACJ,GAAI,oBACL,EASMC,EAAyB,CAC9B,MAAO,wBACP,GAAI,wBACJ,GAAI,wBACJ,GAAI,wBACJ,GAAI,wBACJ,GAAI,uBACL,EASIC,EAAkE,KASlEC,EAAkE,KAQtE,SAASC,GAA8D,CACtE,OAAKF,IACJA,EAAe,CACd,MAAO,OAAO,WAAWF,EAAkB,KAAK,CAAC,EACjD,GAAI,OAAO,WAAWA,EAAkB,EAAE,EAC1C,GAAI,OAAO,WAAWA,EAAkB,EAAE,EAC1C,GAAI,OAAO,WAAWA,EAAkB,EAAE,EAC1C,GAAI,OAAO,WAAWA,EAAkB,EAAE,EAC1C,GAAI,OAAO,WAAWA,EAAkB,EAAE,CAC3C,GAEME,CACR,CASA,SAASG,EAAeC,EAAgD,CACvE,OAAKH,IACJA,EAAe,CACd,MAAO,OAAO,WAAWF,EAAuB,KAAK,CAAC,EACtD,GAAI,OAAO,WAAWA,EAAuB,EAAE,EAC/C,GAAI,OAAO,WAAWA,EAAuB,EAAE,EAC/C,GAAI,OAAO,WAAWA,EAAuB,EAAE,EAC/C,GAAI,OAAO,WAAWA,EAAuB,EAAE,EAC/C,GAAI,OAAO,WAAWA,EAAuB,EAAE,CAChD,GAEME,EAAaG,CAAU,CAC/B,CASA,IAAIC,EAAqC,UASnCC,EAAsB,IAAI,IAS5BC,EAA+B,GASnC,SAASC,GAAmC,CAC3C,IAAMC,EAAOP,EAAgB,EAC7B,QAAWE,KAAcM,EACxB,GAAID,EAAKL,CAAU,EAAE,QACpB,OAAOA,EAGT,MAAO,SACR,CAUA,IAAIO,EAA0B,GAC9B,SAASC,GAA0B,CAC7BD,IACJA,EAA0B,GAC1B,sBAAsB,IAAM,CAC3BA,EAA0B,GAC1B,IAAME,EAAgBL,EAAqB,EAC3C,GAAIK,IAAkBR,EAAwB,CAC7CA,EAAyBQ,EACzB,QAAWC,KAAYR,EACtBQ,EAAS,CAEX,CACD,CAAC,EAEH,CAaA,SAASC,EAA6BC,EAAsB,CAI3D,GAHAV,EAAoB,IAAIU,CAAQ,EAG5B,CAACT,EAA8B,CAClCA,EAA+B,GAC/B,IAAME,EAAOP,EAAgB,EAG7BG,EAAyBG,EAAqB,EAG9C,QAAWS,KAAO,OAAO,OAAOR,CAAI,EACnCQ,EAAI,iBAAiB,SAAUL,CAAuB,CAExD,CAGA,OAAAI,EAAS,EAGF,IAAM,CAIZ,GAHAV,EAAoB,OAAOU,CAAQ,EAG/BV,EAAoB,OAAS,GAAKC,EAA8B,CACnEA,EAA+B,GAC/B,IAAME,EAAOP,EAAgB,EAC7B,QAAWe,KAAO,OAAO,OAAOR,CAAI,EACnCQ,EAAI,oBAAoB,SAAUL,CAAuB,CAE3D,CACD,CACD,CAUA,SAASM,GAA2C,CACnD,OAAOb,CACR,CAYA,SAASc,EAA+Bf,EAAgC,CACvE,OAAQY,GAAyB,CAChC,IAAMI,EAAajB,EAAeC,CAAU,EAGxCiB,EAAU,GACRC,EAAW,IAAM,CACjBD,IACJA,EAAU,GACV,sBAAsB,IAAM,CAC3BA,EAAU,GACVL,EAAS,CACV,CAAC,EAEH,EAEA,OAAAI,EAAW,iBAAiB,SAAUE,CAAQ,EACvC,IAAM,CACZF,EAAW,oBAAoB,SAAUE,CAAQ,CAClD,CACD,CACD,CAWA,SAASC,EAAiCnB,EAAgC,CACzE,MAAO,IACaD,EAAeC,CAAU,EAC1B,OAEpB,CCpaA,OAAS,aAAAoB,EAAW,WAAAC,EAAS,UAAAC,MAAc,QAU3C,SAASC,EACRC,EACI,CACJ,IAAMC,EAAcH,EAAOE,CAAQ,EAEnC,OAAAJ,EAAU,IAAM,CACfK,EAAY,QAAUD,CACvB,CAAC,EAEMH,EAAQ,KAAO,IAAIK,IAASD,EAAY,UAAU,GAAGC,CAAI,GAAS,CAAC,CAAC,CAC5E,CCpBA,OAAS,eAAAC,EAAa,aAAAC,EAAW,UAAAC,MAAc,QAoB/C,SAASC,EACRC,EACAC,EACC,CACD,IAAMC,EAAmBC,EAAeH,CAAU,EAC5CI,EAAmBC,EAAO,CAAC,EACjC,OAAAC,EAAU,IAAM,IAAM,OAAO,aAAaF,EAAiB,OAAO,EAAG,CAAC,CAAC,EAEhEG,EACN,IAAIC,IAAwB,CAC3B,OAAO,aAAaJ,EAAiB,OAAO,EAC5CA,EAAiB,QAAU,OAAO,WACjC,IAAMF,EAAiB,GAAGM,CAAI,EAC9BP,EAAQ,MACT,CACD,EACA,CAACC,EAAkBD,EAAQ,MAAM,CAClC,CACD,CCtCA,OAAS,WAAAQ,MAAe,QAOxB,IAAMC,EAAoB,CAACC,EAAS,WACnCF,EAAQ,IAAMG,EAAeD,CAAM,EAAG,CAACA,CAAM,CAAC,EAO/C,SAASE,EAAeC,EAAS,SAAU,CAE1C,MAAO,CADSA,EAAO,KAAK,GAAK,SAChBC,EAAc,CAAC,EAAE,KAAK,GAAG,CAC3C,CAEA,SAASA,GAAgB,CACxB,OAAO,KAAK,OAAO,EAAE,SAAS,EAAE,EAAE,UAAU,EAAG,CAAC,CACjD","names":["useSyncExternalStore","tailwindBreakpoints","breakpoints","useBreakpoint","subscribeToBreakpointChanges","getCurrentBreakpointSnapshot","useIsBelowBreakpoint","breakpoint","createBelowBreakpointSubscribe","createBelowBreakpointGetSnapshot","breakpointQueries","belowBreakpointQueries","minWidthMQLs","maxWidthMQLs","getMinWidthMQLs","getMaxWidthMQL","breakpoint","currentBreakpointValue","breakpointListeners","breakpointSubscriptionActive","getCurrentBreakpoint","mqls","tailwindBreakpoints","breakpointUpdatePending","updateCurrentBreakpoint","newBreakpoint","listener","subscribeToBreakpointChanges","callback","mql","getCurrentBreakpointSnapshot","createBelowBreakpointSubscribe","mediaQuery","pending","onChange","createBelowBreakpointGetSnapshot","useEffect","useMemo","useRef","useCallbackRef","callback","callbackRef","args","useCallback","useEffect","useRef","useDebouncedCallback","callbackFn","options","stableCallbackFn","useCallbackRef","debounceTimerRef","useRef","useEffect","useCallback","args","useMemo","useRandomStableId","prefix","randomStableId","randomStableId","prefix","randomPostfix"]}

package/dist/pagination.js

@@ -1,2 +1,2 @@
-import{a as p}from"./chunk-MEIVQLEY.js";import"./chunk-MF2QITTY.js";import{b}from"./chunk-J6ZF5J72.js";import{a as z}from"./chunk-3H3EUKI7.js";import"./chunk-T5U5KWUW.js";import{c as m}from"./chunk-XTCU7MXB.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import{a as P}from"./chunk-AZ56JGNY.js";import{CaretLeftIcon as L}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as U}from"@phosphor-icons/react/CaretRight";import{Slot as j}from"@radix-ui/react-slot";import{createContext as k,forwardRef as c,useContext as v,useState as A}from"react";import f from"tiny-invariant";import{jsx as s,jsxs as l}from"react/jsx-runtime";var S=k(void 0),y=c(({className:r,children:e,defaultPageSize:a,...t},i)=>{let[o,n]=A(a);return s(S.Provider,{value:{defaultPageSize:a,pageSize:o,setPageSize:n},children:s("div",{className:P("inline-flex items-center justify-between gap-2",r),ref:i,...t,children:e})})});y.displayName="CursorPagination";var x=c(({hasNextPage:r,hasPreviousPage:e,onNextPage:a,onPreviousPage:t,...i},o)=>l(z,{appearance:"panel",ref:o,...i,children:[s(m,{appearance:"ghost",disabled:!e,icon:s(L,{}),label:"Previous page",onClick:t,size:"sm",type:"button"}),s(b,{orientation:"vertical",className:"min-h-5"}),s(m,{appearance:"ghost",disabled:!r,icon:s(U,{}),label:"Next page",onClick:a,size:"sm",type:"button"})]}));x.displayName="CursorButtons";var E=[5,10,20,50,100],h=c(({className:r,pageSizes:e=E,onChangePageSize:a,...t},i)=>{let o=v(S);return f(o,"CursorPageSizeSelect must be used as a child of a CursorPagination component"),f(e.includes(o.defaultPageSize),"CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes"),f(e.includes(o.pageSize),"CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes"),l(p.Root,{defaultValue:`${o.pageSize}`,onValueChange:n=>{let g=Number.parseInt(n,10);Number.isNaN(g)&&(g=o.defaultPageSize),o.setPageSize(g),a?.(g)},children:[s(p.Trigger,{ref:i,className:P("w-auto min-w-36",r),value:o.pageSize,...t,children:s(p.Value,{})}),s(p.Content,{width:"trigger",children:e.map(n=>l(p.Item,{value:`${n}`,children:[n," per page"]},n))})]})});h.displayName="CursorPageSizeSelect";function N({asChild:r=!1,className:e,...a}){let t=v(S);return f(t,"CursorPageSizeValue must be used as a child of a CursorPagination component"),l(r?j:"span",{className:P("text-muted text-sm font-normal",e),...a,children:[t.pageSize," per page"]})}N.displayName="CursorPageSizeValue";var F={Root:y,Buttons:x,PageSizeSelect:h,PageSizeValue:N};import{useEffect as O,useState as T}from"react";function W({listSize:r,pageSize:e}){let[a,t]=T(1),[i,o]=T(e);O(()=>{o(e),t(1)},[e]),O(()=>{t(1)},[r]);let n=Math.ceil(r/i),g=(a-1)*i,C=a>1,d=a<n;function V(u){let G=Math.max(1,Math.min(u,n));t(G)}function B(){d&&t(u=>Math.min(u+1,n))}function R(){C&&t(u=>Math.max(u-1,1))}function w(u){o(u),t(1)}function I(){t(n)}function M(){t(1)}return{currentPage:a,goToFirstPage:M,goToLastPage:I,goToPage:V,hasNextPage:d,hasPreviousPage:C,nextPage:B,offset:g,pageSize:i,previousPage:R,setPageSize:w,totalPages:n}}function $(r,e){return r.slice(e.offset,e.offset+e.pageSize)}export{F as CursorPagination,$ as getOffsetPaginatedSlice,W as useOffsetPagination};
+import{a as p}from"./chunk-EBW5W235.js";import{b}from"./chunk-J6ZF5J72.js";import"./chunk-MF2QITTY.js";import{a as z}from"./chunk-3H3EUKI7.js";import{c as m}from"./chunk-XTCU7MXB.js";import"./chunk-T5U5KWUW.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import{a as P}from"./chunk-AZ56JGNY.js";import{CaretLeftIcon as L}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as U}from"@phosphor-icons/react/CaretRight";import{Slot as j}from"@radix-ui/react-slot";import{createContext as k,forwardRef as c,useContext as v,useState as A}from"react";import f from"tiny-invariant";import{jsx as s,jsxs as l}from"react/jsx-runtime";var S=k(void 0),y=c(({className:r,children:e,defaultPageSize:a,...t},i)=>{let[o,n]=A(a);return s(S.Provider,{value:{defaultPageSize:a,pageSize:o,setPageSize:n},children:s("div",{className:P("inline-flex items-center justify-between gap-2",r),ref:i,...t,children:e})})});y.displayName="CursorPagination";var x=c(({hasNextPage:r,hasPreviousPage:e,onNextPage:a,onPreviousPage:t,...i},o)=>l(z,{appearance:"panel",ref:o,...i,children:[s(m,{appearance:"ghost",disabled:!e,icon:s(L,{}),label:"Previous page",onClick:t,size:"sm",type:"button"}),s(b,{orientation:"vertical",className:"min-h-5"}),s(m,{appearance:"ghost",disabled:!r,icon:s(U,{}),label:"Next page",onClick:a,size:"sm",type:"button"})]}));x.displayName="CursorButtons";var E=[5,10,20,50,100],h=c(({className:r,pageSizes:e=E,onChangePageSize:a,...t},i)=>{let o=v(S);return f(o,"CursorPageSizeSelect must be used as a child of a CursorPagination component"),f(e.includes(o.defaultPageSize),"CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes"),f(e.includes(o.pageSize),"CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes"),l(p.Root,{defaultValue:`${o.pageSize}`,onValueChange:n=>{let g=Number.parseInt(n,10);Number.isNaN(g)&&(g=o.defaultPageSize),o.setPageSize(g),a?.(g)},children:[s(p.Trigger,{ref:i,className:P("w-auto min-w-36",r),value:o.pageSize,...t,children:s(p.Value,{})}),s(p.Content,{width:"trigger",children:e.map(n=>l(p.Item,{value:`${n}`,children:[n," per page"]},n))})]})});h.displayName="CursorPageSizeSelect";function N({asChild:r=!1,className:e,...a}){let t=v(S);return f(t,"CursorPageSizeValue must be used as a child of a CursorPagination component"),l(r?j:"span",{className:P("text-muted text-sm font-normal",e),...a,children:[t.pageSize," per page"]})}N.displayName="CursorPageSizeValue";var F={Root:y,Buttons:x,PageSizeSelect:h,PageSizeValue:N};import{useEffect as O,useState as T}from"react";function W({listSize:r,pageSize:e}){let[a,t]=T(1),[i,o]=T(e);O(()=>{o(e),t(1)},[e]),O(()=>{t(1)},[r]);let n=Math.ceil(r/i),g=(a-1)*i,C=a>1,d=a<n;function V(u){let G=Math.max(1,Math.min(u,n));t(G)}function B(){d&&t(u=>Math.min(u+1,n))}function R(){C&&t(u=>Math.max(u-1,1))}function w(u){o(u),t(1)}function I(){t(n)}function M(){t(1)}return{currentPage:a,goToFirstPage:M,goToLastPage:I,goToPage:V,hasNextPage:d,hasPreviousPage:C,nextPage:B,offset:g,pageSize:i,previousPage:R,setPageSize:w,totalPages:n}}function $(r,e){return r.slice(e.offset,e.offset+e.pageSize)}export{F as CursorPagination,$ as getOffsetPaginatedSlice,W as useOffsetPagination};
 //# sourceMappingURL=pagination.js.map

package/dist/select.js

@@ -1,2 +1,2 @@
-import{a as e}from"./chunk-MEIVQLEY.js";import"./chunk-MF2QITTY.js";import"./chunk-J6ZF5J72.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import"./chunk-AZ56JGNY.js";export{e as Select};
+import{a as e}from"./chunk-EBW5W235.js";import"./chunk-J6ZF5J72.js";import"./chunk-MF2QITTY.js";import"./chunk-I6T6YV2L.js";import"./chunk-NPTDRQT5.js";import"./chunk-AZ56JGNY.js";export{e as Select};
 //# sourceMappingURL=select.js.map

package/package.json

@@ -3,7 +3,7 @@
   "description": "mantle is ngrok's UI library and design system.",
   "author": "ngrok",
   "license": "MIT",
-  "version": "0.54.3",
+  "version": "0.55.0",
   "homepage": "https://mantle.ngrok.com",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
   },
   "dependencies": {
     "@ariakit/react": "0.4.18",
-    "@headlessui/react": "2.2.8",
+    "@headlessui/react": "2.2.9",
     "@radix-ui/react-accordion": "1.2.12",
     "@radix-ui/react-dialog": "1.1.15",
     "@radix-ui/react-dropdown-menu": "2.1.16",
@@ -52,21 +52,21 @@
   "devDependencies": {
     "@phosphor-icons/react": "2.1.10",
     "@testing-library/dom": "10.4.1",
-    "@testing-library/jest-dom": "6.8.0",
+    "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.0",
     "@testing-library/user-event": "14.6.1",
     "@types/prismjs": "1.26.5",
-    "@types/react": "18.3.24",
+    "@types/react": "18.3.25",
     "@types/react-dom": "18.3.7",
-    "browserslist": "4.26.2",
+    "browserslist": "4.26.3",
     "date-fns": "4.1.0",
     "jsdom": "27.0.0",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "react-router": "7.9.2",
-    "tailwindcss": "4.1.13",
+    "react-router": "7.9.3",
+    "tailwindcss": "4.1.14",
     "tsup": "8.5.0",
-    "typescript": "5.9.2",
+    "typescript": "5.9.3",
     "@cfg/tsconfig": "1.0.0"
   },
   "peerDependencies": {
@@ -74,7 +74,7 @@
     "date-fns": "^4.1.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19",
-    "tailwindcss": "^4.1.13"
+    "tailwindcss": "^4.1.14"
   },
   "exports": {
     "./mantle.css": "./assets/mantle.css",
@@ -99,6 +99,11 @@
       "import": "./dist/anchor.js",
       "types": "./dist/anchor.d.ts"
     },
+    "./auto-scroll-to-hash": {
+      "@ngrok/mantle/source": "./src/components/auto-scroll-to-hash/index.ts",
+      "import": "./dist/auto-scroll-to-hash.js",
+      "types": "./dist/auto-scroll-to-hash.d.ts"
+    },
     "./badge": {
       "@ngrok/mantle/source": "./src/components/badge/index.ts",
       "import": "./dist/badge.js",