@ngrok/mantle 0.76.11 → 0.78.0

package/dist/hooks.d.ts

@@ -1,6 +1,5 @@
-import { n as MarginType, o as useComposedRefs, s as copyToClipboard } from "./in-view-BC3wmz-a.js";
-import { RefObject, useEffect } from "react";
-
+import { n as MarginType, o as useComposedRefs, s as copyToClipboard } from "./in-view-nkSOdED2.js";
+import { RefObject, useLayoutEffect } from "react";
 //#region src/hooks/use-breakpoint.d.ts
 /**
  * Tailwind CSS breakpoints in descending order (largest → smallest).
@@ -170,6 +169,43 @@ declare function useCallbackRef<T extends (...args: unknown[]) => unknown>(callb
  */
 declare function useCopyToClipboard(): typeof copyToClipboard;
 //#endregion
+//#region src/hooks/use-debounce.d.ts
+/**
+ * Options for {@link useDebounce}.
+ */
+type Options$1 = {
+  /**
+   * The delay in milliseconds to wait after the last change to `value`
+   * before the debounced copy updates.
+   */
+  waitMs: number;
+};
+/**
+ * Returns a debounced copy of `value`: it only updates after `value` has
+ * stopped changing for `options.waitMs` milliseconds. Each change restarts
+ * the timer, so rapid successive changes collapse into a single trailing
+ * update.
+ *
+ * SSR-safe: the server render simply returns the current value (timers
+ * never run there). To debounce a function instead of a value, use
+ * {@link useDebouncedCallback}.
+ *
+ * @param value - The value to debounce. The returned copy lags behind it.
+ * @param options - Debounce options.
+ * @param options.waitMs - Milliseconds of inactivity to wait before the
+ *   debounced copy updates.
+ * @returns The debounced copy of `value`.
+ *
+ * @example
+ * ```tsx
+ * const [searchQuery, setSearchQuery] = useState("");
+ * const debouncedSearchQuery = useDebounce(searchQuery, { waitMs: 300 });
+ * // debouncedSearchQuery lags searchQuery until typing pauses for 300ms,
+ * // so queries keyed on it fire once per pause instead of per keystroke
+ * ```
+ */
+declare function useDebounce<T>(value: T, options: Options$1): T;
+//#endregion
 //#region src/hooks/use-debounced-callback.d.ts
 /**
  * Options for {@link useDebouncedCallback}.
@@ -224,28 +260,24 @@ declare function useDebouncedCallback<T extends (...args: unknown[]) => unknown>
 //#endregion
 //#region src/hooks/use-is-hydrated.d.ts
 /**
- * React hook that returns whether the component tree has been hydrated
- * on the client.
- *
- * Uses `useSyncExternalStore` to ensure the value is consistent between
- * server and client rendering, preventing hydration mismatches.
- *
- * - On the server, it always returns `false`.
- * - On the client (after hydration), it returns `true`.
- *
- * @see https://tkdodo.eu/blog/avoiding-hydration-mismatches-with-use-sync-external-store
+ * Returns `false` during server rendering and the initial hydration render,
+ * then `true` on the client — without hydration mismatches, because React
+ * uses the server snapshot for the hydration pass and re-renders once with
+ * the client snapshot afterwards.
  *
- * @returns {boolean} `true` once hydration has occurred on the client,
- * otherwise `false`.
+ * Use it to gate UI whose initial state only the client can know (for
+ * example, uncontrolled inputs whose mount-time defaults come from
+ * localStorage): render a same-size placeholder until hydration so the real
+ * UI mounts exactly once, with the real client-side values.
  *
  * @example
- * const isHydrated = useIsHydrated();
- *
- * if (!isHydrated) {
- *   return <span style={{ visibility: "hidden" }}>Loading…</span>;
+ * ```tsx
+ * function PreferencesPanel() {
+ *   const isHydrated = useIsHydrated();
+ *   // localStorage-backed defaults are only correct on the client
+ *   return isHydrated ? <PreferenceControls /> : <PreferencesSkeleton />;
  * }
- *
- * return <span>Ready!</span>;
+ * ```
  */
 declare function useIsHydrated(): boolean;
 //#endregion
@@ -282,7 +314,41 @@ declare function useIsHydrated(): boolean;
  *
  * return <div ref={ref}>Width: {width}</div>;
  */
-declare const useIsomorphicLayoutEffect: typeof useEffect;
+declare const useIsomorphicLayoutEffect: typeof useLayoutEffect;
+//#endregion
+//#region src/hooks/use-local-storage.d.ts
+/**
+ * SSR-safe `useSyncExternalStore`-backed localStorage string state.
+ *
+ * Contract:
+ *
+ * - Server rendering returns `defaultValue` and never touches localStorage.
+ * - Values are JSON-encoded on write and JSON-decoded on read — the same
+ *   wire format popular hooks libraries (e.g. `@uidotdev/usehooks`) use,
+ *   so existing stored entries remain readable.
+ * - The setter dispatches a synthetic `storage` event (tagged with its
+ *   `storageArea`) so every same-key hook instance in the tab stays in
+ *   sync; the native `storage` event covers other tabs. Subscriptions are
+ *   filtered per key and per storage area, so unrelated keys and
+ *   sessionStorage churn never wake this hook.
+ * - Missing, corrupt, or non-string entries resolve to `defaultValue`; the
+ *   hook never seeds `defaultValue` into storage on its own (reading is
+ *   side-effect free).
+ *
+ * @param key - The localStorage key to read and write.
+ * @param defaultValue - Returned when no valid entry exists for `key` and
+ *   during server rendering.
+ * @returns A `[value, setValue]` tuple. `setValue` persists the value and
+ *   notifies every same-key hook instance.
+ *
+ * @example
+ * ```tsx
+ * const [dateFormat, setDateFormat] = useLocalStorage("dateFormat", "MMM d, y");
+ * // dateFormat === "MMM d, y" until a preference is stored
+ * setDateFormat("y-MM-dd"); // persists + syncs every subscribed instance
+ * ```
+ */
+declare function useLocalStorage(key: string, defaultValue: string): readonly [value: string, setValue: (next: string) => void];
 //#endregion
 //#region src/hooks/use-matches-media-query.d.ts
 /**
@@ -315,6 +381,36 @@ declare const useIsomorphicLayoutEffect: typeof useEffect;
  */
 declare function useMatchesMediaQuery(query: string): boolean;
 //#endregion
+//#region src/hooks/use-session-storage.d.ts
+/**
+ * SSR-safe `useSyncExternalStore`-backed sessionStorage string state. The
+ * per-tab sibling of {@link useLocalStorage}, with the same contract:
+ *
+ * - Server rendering returns `defaultValue` and never touches sessionStorage.
+ * - Values are JSON-encoded on write and JSON-decoded on read.
+ * - The setter dispatches a synthetic `storage` event (tagged with its
+ *   `storageArea`) so every same-key hook instance in the tab stays in
+ *   sync. Subscriptions are filtered per key and per storage area, so
+ *   unrelated keys and localStorage churn never wake this hook.
+ * - Missing, corrupt, or non-string entries resolve to `defaultValue`; the
+ *   hook never seeds `defaultValue` into storage on its own (reading is
+ *   side-effect free).
+ *
+ * @param key - The sessionStorage key to read and write.
+ * @param defaultValue - Returned when no valid entry exists for `key` and
+ *   during server rendering.
+ * @returns A `[value, setValue]` tuple. `setValue` persists the value for
+ *   the rest of the tab session and notifies every same-key hook instance.
+ *
+ * @example
+ * ```tsx
+ * const [showWarning, setShowWarning] = useSessionStorage("show-warning", "true");
+ * // showWarning === "true" until this tab stores a preference
+ * setShowWarning("false"); // persists for the rest of the tab session
+ * ```
+ */
+declare function useSessionStorage(key: string, defaultValue: string): readonly [value: string, setValue: (next: string) => void];
+//#endregion
 //#region src/hooks/use-prefers-reduced-motion.d.ts
 /**
  * Imperatively reads the current `prefers-reduced-motion` preference once at
@@ -376,49 +472,6 @@ declare function getPrefersReducedMotion(): boolean;
  */
 declare function usePrefersReducedMotion(): boolean;
 //#endregion
-//#region src/hooks/use-random-stable-id.d.ts
-/**
- * React hook that returns a random, stable id (e.g. `"mantle-a3f9k7q"`)
- * suitable for DOM `id` attributes and `aria-*` references.
- *
- * Unlike React's built-in `useId`, the generated suffix does not contain
- * special characters (`:`). The default id is safe to use directly in CSS
- * selectors and `querySelector` calls; if you provide a custom `prefix`,
- * keep it selector-safe or escape the final id with `CSS.escape()` before
- * querying. The id is generated once for the lifetime of the component and
- * is stable across re-renders, but a new value is produced when `prefix`
- * changes.
- *
- * @param prefix - Optional string prepended to the generated suffix.
- *   Whitespace-only or empty values fall back to `"mantle"`. Use a
- *   selector-safe prefix if you plan to reference the id in CSS selectors
- *   without escaping. Defaults to `"mantle"`.
- * @returns A string of the form `"<prefix>-<7-char-random>"`.
- *
- * @example
- * // Associate a label with a custom input
- * const id = useRandomStableId("email-input");
- *
- * return (
- *   <>
- *     <label htmlFor={id}>Email</label>
- *     <input id={id} type="email" />
- *   </>
- * );
- *
- * @example
- * // Use as an aria-controls reference
- * const panelId = useRandomStableId("panel");
- *
- * return (
- *   <>
- *     <button aria-controls={panelId}>Toggle</button>
- *     <div id={panelId}>Panel contents</div>
- *   </>
- * );
- */
-declare const useRandomStableId: (prefix?: string) => string;
-//#endregion
 //#region src/hooks/use-scroll-behavior.d.ts
 /**
  * `scroll-behavior` values:
@@ -535,25 +588,23 @@ type UseInViewOptions = {
  * const ref = useRef<HTMLDivElement>(null);
  * const isInView = useInView(ref, { amount: 0.5 });
  */
-declare function useInView(ref: RefObject<Element | null>, {
-  root,
-  margin,
-  amount,
-  once,
-  initial
-}?: UseInViewOptions): boolean;
+declare function useInView(ref: RefObject<Element | null>, { root, margin, amount, once, initial }?: UseInViewOptions): boolean;
 //#endregion
 //#region src/hooks/use-undo-redo.d.ts
 type UseUndoRedoReturn<T> = {
-  /** Whether there are actions to undo. */canUndo: boolean; /** Whether there are actions to redo. */
-  canRedo: boolean; /** Push a snapshot onto the undo stack. Clears the redo stack. */
-  push: (snapshot: T) => void; /** Pop the last snapshot from the undo stack. Returns `undefined` if empty. */
-  undo: (current: T) => T | undefined; /** Pop the last snapshot from the redo stack. Returns `undefined` if empty. */
+  /** Whether there are actions to undo. */
+  canUndo: boolean;
+  /** Whether there are actions to redo. */
+  canRedo: boolean;
+  /** Push a snapshot onto the undo stack. Clears the redo stack. */
+  push: (snapshot: T) => void;
+  /** Pop the last snapshot from the undo stack. Returns `undefined` if empty. */
+  undo: (current: T) => T | undefined;
+  /** Pop the last snapshot from the redo stack. Returns `undefined` if empty. */
   redo: (current: T) => T | undefined;
 };
 /**
- * Generic undo/redo hook backed by a reducer that maintains two history
- * stacks (undo and redo).
+ * Generic undo/redo hook that maintains two history stacks (undo and redo).
  *
  * The hook does not own your application state — instead it helps you
  * snapshot it. Call `push(snapshot)` *before* mutating state to capture
@@ -562,8 +613,15 @@ type UseUndoRedoReturn<T> = {
  * the snapshot to apply, or `undefined` if their stack is empty. Pushing a
  * new snapshot clears the redo stack, matching standard editor semantics.
  *
+ * `push`, `undo`, and `redo` operate on the live history, so calling them
+ * multiple times within a single event handler works as expected — each
+ * call sees the result of the previous one.
+ *
  * @typeParam T - The type of the value being snapshotted (e.g. a list of
- *   items, a serialized form value, etc.).
+ *   items, a serialized form value, etc.). Constrained to non-nullish
+ *   values: `undefined` is reserved as the "stack is empty" sentinel and
+ *   cannot itself be stored as a snapshot, and `null` snapshots would
+ *   defeat the truthiness checks used at typical call sites.
  *
  * @returns An object with the current undo/redo capability flags and
  *   actions:
@@ -613,6 +671,6 @@ type UseUndoRedoReturn<T> = {
  *   </div>
  * );
  */
-declare function useUndoRedo<T>(): UseUndoRedoReturn<T>;
+declare function useUndoRedo<T extends NonNullable<unknown>>(): UseUndoRedoReturn<T>;
 //#endregion
-export { type Breakpoint, type TailwindBreakpoint, type UseInViewOptions, type UseUndoRedoReturn, breakpoints, getPrefersReducedMotion, useBreakpoint, useCallbackRef, useComposedRefs, useCopyToClipboard, useDebouncedCallback, useInView, useIsBelowBreakpoint, useIsHydrated, useIsomorphicLayoutEffect, useMatchesMediaQuery, usePrefersReducedMotion, useRandomStableId, useScrollBehavior, useUndoRedo };
+export { type Breakpoint, type TailwindBreakpoint, type UseInViewOptions, type UseUndoRedoReturn, breakpoints, getPrefersReducedMotion, useBreakpoint, useCallbackRef, useComposedRefs, useCopyToClipboard, useDebounce, useDebouncedCallback, useInView, useIsBelowBreakpoint, useIsHydrated, useIsomorphicLayoutEffect, useLocalStorage, useMatchesMediaQuery, usePrefersReducedMotion, useScrollBehavior, useSessionStorage, useUndoRedo };

package/dist/hooks.js

@@ -1 +1 @@
-import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-Cjf2gfB8.js";import{t as n}from"./use-matches-media-query-CMSxHR9n.js";import{r}from"./browser-only-BSl_hruR.js";import{t as i}from"./use-copy-to-clipboard-BLpquU9d.js";import{n as a,t as o}from"./use-prefers-reduced-motion-CWIoFA6W.js";import{t as s}from"./in-view-C2DpZ6s0.js";import{useCallback as c,useEffect as l,useMemo as u,useReducer as d,useRef as f,useState as p,useSyncExternalStore as m}from"react";const h=[`2xl`,`xl`,`lg`,`md`,`sm`,`xs`,`2xs`],g=[`default`,...h];function _(){return m(j,M,()=>`default`)}function v(e){return m(P(e),I(e),()=>!1)}const y={"2xl":`(min-width: 96rem)`,xl:`(min-width: 80rem)`,lg:`(min-width: 64rem)`,md:`(min-width: 48rem)`,sm:`(min-width: 40rem)`,xs:`(min-width: 30rem)`,"2xs":`(min-width: 22.5rem)`},b={"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)`,"2xs":`(max-width: 22.49rem)`};let x=null,S=null;function C(){return x||={"2xl":window.matchMedia(y[`2xl`]),xl:window.matchMedia(y.xl),lg:window.matchMedia(y.lg),md:window.matchMedia(y.md),sm:window.matchMedia(y.sm),xs:window.matchMedia(y.xs),"2xs":window.matchMedia(y[`2xs`])},x}function w(e){return S||={"2xl":window.matchMedia(b[`2xl`]),xl:window.matchMedia(b.xl),lg:window.matchMedia(b.lg),md:window.matchMedia(b.md),sm:window.matchMedia(b.sm),xs:window.matchMedia(b.xs),"2xs":window.matchMedia(b[`2xs`])},S[e]}let T=`default`;const E=new Set;let D=!1;function O(){let e=C();for(let t of h)if(e[t].matches)return t;return`default`}let k=!1;function A(){k||(k=!0,requestAnimationFrame(()=>{k=!1;let e=O();if(e!==T){T=e;for(let e of E)e()}}))}function j(e){if(E.add(e),!D){D=!0;let e=C();T=O();for(let t of Object.values(e))t.addEventListener(`change`,A)}return e(),()=>{if(E.delete(e),E.size===0&&D){D=!1;let e=C();for(let t of Object.values(e))t.removeEventListener(`change`,A)}}}function M(){return T}const N=new Map;function P(e){let t=N.get(e);return t||(t=t=>{let n=w(e),r=!1,i=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener(`change`,i),()=>{n.removeEventListener(`change`,i)}},N.set(e,t),t)}const F=new Map;function I(e){let t=F.get(e);return t||(t=()=>w(e).matches,F.set(e,t),t)}function L(e){let t=f(e);return l(()=>{t.current=e}),u(()=>((...e)=>t.current?.(...e)),[])}function R(e,t){let n=L(e),r=f(0);return l(()=>()=>window.clearTimeout(r.current),[]),c((...e)=>{window.clearTimeout(r.current),r.current=window.setTimeout(()=>n(...e),t.waitMs)},[n,t.waitMs])}const z=(e=`mantle`)=>u(()=>B(e),[e]);function B(e=`mantle`){return[e.trim()||`mantle`,V()].join(`-`)}function V(){return Math.random().toString(36).substring(2,9)}function H(){let e=a();return u(()=>e?`auto`:`smooth`,[e])}function U(e,{root:t,margin:n,amount:r,once:i=!1,initial:a=!1}={}){let[o,c]=p(a);return l(()=>{if(!e.current||i&&o)return;function a(){return c(!0),i?void 0:()=>c(!1)}let l={root:t&&t.current||void 0,margin:n,amount:r};return s(e.current,a,l)},[t,e,n,i,r]),o}function W(e,t){switch(t.type){case`push`:return{undoStack:[...e.undoStack,t.snapshot],redoStack:[]};case`undo`:{if(e.undoStack.length===0)return e;let n=e.undoStack.slice(0,-1);return e.undoStack[e.undoStack.length-1]===void 0?e:{undoStack:n,redoStack:[...e.redoStack,t.current]}}case`redo`:{if(e.redoStack.length===0)return e;let n=e.redoStack.slice(0,-1);return e.redoStack[e.redoStack.length-1]===void 0?e:{undoStack:[...e.undoStack,t.current],redoStack:n}}}}function G(){let[e,t]=d(W,{undoStack:[],redoStack:[]}),n=c(e=>{t({type:`push`,snapshot:e})},[]),r=c(n=>{let r=e.undoStack[e.undoStack.length-1];if(r!==void 0)return t({type:`undo`,current:n}),r},[e.undoStack]),i=c(n=>{let r=e.redoStack[e.redoStack.length-1];if(r!==void 0)return t({type:`redo`,current:n}),r},[e.redoStack]);return u(()=>({canUndo:e.undoStack.length>0,canRedo:e.redoStack.length>0,push:n,undo:r,redo:i}),[e.undoStack.length,e.redoStack.length,n,r,i])}export{g as breakpoints,o as getPrefersReducedMotion,_ as useBreakpoint,L as useCallbackRef,t as useComposedRefs,i as useCopyToClipboard,R as useDebouncedCallback,U as useInView,v as useIsBelowBreakpoint,r as useIsHydrated,e as useIsomorphicLayoutEffect,n as useMatchesMediaQuery,a as usePrefersReducedMotion,z as useRandomStableId,H as useScrollBehavior,G as useUndoRedo};
+import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{n as t}from"./compose-refs-Cjf2gfB8.js";import{t as n}from"./use-matches-media-query-CMSxHR9n.js";import{r}from"./browser-only-CPH56Xw_.js";import{t as i}from"./use-copy-to-clipboard-DqQ0_N3E.js";import{n as a,t as o}from"./use-prefers-reduced-motion-CagaNRgm.js";import{t as s}from"./in-view-C2DpZ6s0.js";import{useCallback as c,useEffect as l,useMemo as u,useReducer as d,useRef as f,useState as p,useSyncExternalStore as m}from"react";const h=[`2xl`,`xl`,`lg`,`md`,`sm`,`xs`,`2xs`],g=[`default`,...h];function _(){return m(j,M,()=>`default`)}function v(e){return m(P(e),I(e),()=>!1)}const y={"2xl":`(min-width: 96rem)`,xl:`(min-width: 80rem)`,lg:`(min-width: 64rem)`,md:`(min-width: 48rem)`,sm:`(min-width: 40rem)`,xs:`(min-width: 30rem)`,"2xs":`(min-width: 22.5rem)`},b={"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)`,"2xs":`(max-width: 22.49rem)`};let x=null,S=null;function C(){return x||={"2xl":window.matchMedia(y[`2xl`]),xl:window.matchMedia(y.xl),lg:window.matchMedia(y.lg),md:window.matchMedia(y.md),sm:window.matchMedia(y.sm),xs:window.matchMedia(y.xs),"2xs":window.matchMedia(y[`2xs`])},x}function w(e){return S||={"2xl":window.matchMedia(b[`2xl`]),xl:window.matchMedia(b.xl),lg:window.matchMedia(b.lg),md:window.matchMedia(b.md),sm:window.matchMedia(b.sm),xs:window.matchMedia(b.xs),"2xs":window.matchMedia(b[`2xs`])},S[e]}let T=`default`;const E=new Set;let D=!1;function O(){let e=C();for(let t of h)if(e[t].matches)return t;return`default`}let k=!1;function A(){k||(k=!0,requestAnimationFrame(()=>{k=!1;let e=O();if(e!==T){T=e;for(let e of E)e()}}))}function j(e){if(E.add(e),!D){D=!0;let e=C();T=O();for(let t of Object.values(e))t.addEventListener(`change`,A)}return e(),()=>{if(E.delete(e),E.size===0&&D){D=!1;let e=C();for(let t of Object.values(e))t.removeEventListener(`change`,A)}}}function M(){return T}const N=new Map;function P(e){let t=N.get(e);return t||(t=t=>{let n=w(e),r=!1,i=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener(`change`,i),()=>{n.removeEventListener(`change`,i)}},N.set(e,t),t)}const F=new Map;function I(e){let t=F.get(e);return t||(t=()=>w(e).matches,F.set(e,t),t)}function L(e){let t=f(e);return l(()=>{t.current=e}),u(()=>((...e)=>t.current?.(...e)),[])}function R(e,t){let[n,r]=p(e);return l(()=>{let n=window.setTimeout(()=>{r(e)},t.waitMs);return()=>{window.clearTimeout(n)}},[e,t.waitMs]),n}function z(e,t){let n=L(e),r=f(0);return l(()=>()=>window.clearTimeout(r.current),[]),c((...e)=>{window.clearTimeout(r.current),r.current=window.setTimeout(()=>n(...e),t.waitMs)},[n,t.waitMs])}function B(e){return function(t){function n(n){let r=n.storageArea==null||n.storageArea===window.localStorage,i=n.key==null||n.key===e;r&&i&&t()}return window.addEventListener(`storage`,n),()=>{window.removeEventListener(`storage`,n)}}}function V(){return null}function H(e,t){try{let n=JSON.parse(e);return typeof n==`string`?n:t}catch{return t}}function U(e,t){let n=m(u(()=>B(e),[e]),()=>window.localStorage.getItem(e),V);return[n==null?t:H(n,t),c(t=>{let n=JSON.stringify(t);window.localStorage.setItem(e,n),window.dispatchEvent(new StorageEvent(`storage`,{key:e,newValue:n,storageArea:window.localStorage}))},[e])]}function W(e){return function(t){function n(n){let r=n.storageArea==null||n.storageArea===window.sessionStorage,i=n.key==null||n.key===e;r&&i&&t()}return window.addEventListener(`storage`,n),()=>{window.removeEventListener(`storage`,n)}}}function G(){return null}function K(e,t){try{let n=JSON.parse(e);return typeof n==`string`?n:t}catch{return t}}function q(e,t){let n=m(u(()=>W(e),[e]),()=>window.sessionStorage.getItem(e),G);return[n==null?t:K(n,t),c(t=>{let n=JSON.stringify(t);window.sessionStorage.setItem(e,n),window.dispatchEvent(new StorageEvent(`storage`,{key:e,newValue:n,storageArea:window.sessionStorage}))},[e])]}function J(){let e=a();return u(()=>e?`auto`:`smooth`,[e])}function Y(e,{root:t,margin:n,amount:r,once:i=!1,initial:a=!1}={}){let[o,c]=p(a);return l(()=>{if(!e.current||i&&o)return;function a(){return c(!0),i?void 0:()=>c(!1)}let l={root:t&&t.current||void 0,margin:n,amount:r};return s(e.current,a,l)},[t,e,n,i,r]),o}function X(){let e=f([]),t=f([]),[,n]=d(e=>e+1,0),r=c(r=>{e.current.push(r),t.current=[],n()},[]),i=c(r=>{let i=e.current[e.current.length-1];if(i!==void 0)return e.current.pop(),t.current.push(r),n(),i},[]),a=c(r=>{let i=t.current[t.current.length-1];if(i!==void 0)return t.current.pop(),e.current.push(r),n(),i},[]),o=e.current.length>0,s=t.current.length>0;return u(()=>({canUndo:o,canRedo:s,push:r,undo:i,redo:a}),[o,s,r,i,a])}export{g as breakpoints,o as getPrefersReducedMotion,_ as useBreakpoint,L as useCallbackRef,t as useComposedRefs,i as useCopyToClipboard,R as useDebounce,z as useDebouncedCallback,Y as useInView,v as useIsBelowBreakpoint,r as useIsHydrated,e as useIsomorphicLayoutEffect,U as useLocalStorage,n as useMatchesMediaQuery,a as usePrefersReducedMotion,J as useScrollBehavior,q as useSessionStorage,X as useUndoRedo};

package/dist/hover-card.d.ts

@@ -1,7 +1,34 @@
 import { ComponentPropsWithoutRef } from "react";
 import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
-
 //#region src/components/hover-card/hover-card.d.ts
+/**
+ * A floating card that appears when a user hovers over a trigger element.
+ * This is the root, stateful component that manages the open/closed state of the hover card.
+ *
+ * `HoverCard.Content` renders at Tailwind `z-50`, Mantle's shared floating
+ * z-index. When multiple shared layers are open, the most recently mounted
+ * layer renders on top.
+ *
+ * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardroot
+ *
+ * @example
+ * ```tsx
+ * <HoverCard.Root>
+ *   <HoverCard.Trigger asChild>
+ *     <Button type="button" appearance="outlined">
+ *       Hover me
+ *     </Button>
+ *   </HoverCard.Trigger>
+ *   <HoverCard.Content>
+ *     <p>This is the hover card content.</p>
+ *   </HoverCard.Content>
+ * </HoverCard.Root>
+ * ```
+ */
+declare const Root: {
+  ({ closeDelay, openDelay, ...props }: ComponentPropsWithoutRef<typeof HoverCardPrimitive.Root>): import("react").JSX.Element;
+  displayName: string;
+};
 /**
  * A floating card that appears when a user hovers over a trigger element.
  *
@@ -17,7 +44,7 @@ import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
  * z-index. When multiple shared layers are open, the most recently mounted
  * layer renders on top.
  *
- * @see https://mantle.ngrok.com/components/hover-card
+ * @see https://mantle.ngrok.com/components/overlays/hover-card
  *
  * @example
  * Composition:
@@ -49,7 +76,7 @@ declare const HoverCard: {
    * z-index. When multiple shared layers are open, the most recently mounted
    * layer renders on top.
    *
-   * @see https://mantle.ngrok.com/components/hover-card#hovercardroot
+   * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardroot
    *
    * @example
    * ```tsx
@@ -63,14 +90,7 @@ declare const HoverCard: {
    * </HoverCard.Root>
    * ```
    */
-  readonly Root: {
-    ({
-      closeDelay,
-      openDelay,
-      ...props
-    }: ComponentPropsWithoutRef<typeof HoverCardPrimitive.Root>): import("react").JSX.Element;
-    displayName: string;
-  };
+  readonly Root: typeof Root;
   /**
    * The content to render inside the hover card. Appears in a portal with rich styling and animations.
    *
@@ -78,7 +98,7 @@ declare const HoverCard: {
    * z-index. When multiple shared layers are open, the most recently mounted
    * layer renders on top.
    *
-   * @see https://mantle.ngrok.com/components/hover-card#hovercardcontent
+   * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardcontent
    *
    * @example
    * ```tsx
@@ -103,7 +123,7 @@ declare const HoverCard: {
    * do not need to use `HoverCard.Portal` directly. Use it only when you need to
    * customize portal placement or wrap multiple `HoverCard.Content` instances.
    *
-   * @see https://mantle.ngrok.com/components/hover-card#hovercardportal
+   * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardportal
    *
    * @example
    * ```tsx
@@ -125,7 +145,7 @@ declare const HoverCard: {
   /**
    * The trigger element that opens the hover card when hovered.
    *
-   * @see https://mantle.ngrok.com/components/hover-card#hovercardtrigger
+   * @see https://mantle.ngrok.com/components/overlays/hover-card#hovercardtrigger
    *
    * @example
    * ```tsx

package/dist/hover-card.js

@@ -1 +1 @@
-import{t as e}from"./cx-C1UYP5We.js";import{forwardRef as t}from"react";import{jsx as n}from"react/jsx-runtime";import*as r from"@radix-ui/react-hover-card";const i=({closeDelay:e=300,openDelay:t=100,...i})=>n(r.Root,{closeDelay:e,openDelay:t,...i});i.displayName=`HoverCard`;const a=t((e,t)=>n(r.Trigger,{ref:t,"data-slot":`hover-card-trigger`,...e}));a.displayName=`HoverCardTrigger`;const o=r.Portal;o.displayName=`HoverCardPortal`;const s=t(({className:t,onClick:i,align:a=`center`,sideOffset:s=4,...c},l)=>n(o,{children:n(r.Content,{ref:l,"data-slot":`hover-card-content`,align:a,sideOffset:s,className:e(`bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden`,`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 data-state-open:zoom-in-95 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`,t),onClick:e=>{e.stopPropagation(),i?.(e)},...c})}));s.displayName=r.Content.displayName;const c={Root:i,Content:s,Portal:o,Trigger:a};export{c as HoverCard};
+import{t as e}from"./cx-IiQEAKf5.js";import{forwardRef as t}from"react";import{jsx as n}from"react/jsx-runtime";import*as r from"@radix-ui/react-hover-card";const i=({closeDelay:e=300,openDelay:t=100,...i})=>n(r.Root,{closeDelay:e,openDelay:t,...i});i.displayName=`HoverCard`;const a=t((e,t)=>n(r.Trigger,{ref:t,"data-slot":`hover-card-trigger`,...e}));a.displayName=`HoverCardTrigger`;const o=r.Portal;o.displayName=`HoverCardPortal`;const s=t(({className:t,onClick:i,align:a=`center`,sideOffset:s=4,...c},l)=>n(o,{children:n(r.Content,{ref:l,"data-slot":`hover-card-content`,align:a,sideOffset:s,className:e(`bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden`,`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 data-state-open:zoom-in-95 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`,t),onClick:e=>{e.stopPropagation(),i?.(e)},...c})}));s.displayName=r.Content.displayName;const c={Root:i,Content:s,Portal:o,Trigger:a};export{c as HoverCard};

package/dist/icon-CDtYjF_H.js

@@ -0,0 +1 @@
+import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./svg-only-DDx6FtJd.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({className:n,style:i,svg:a,...o},s)=>r(t,{ref:s,"data-slot":`icon`,className:e(`size-5`,n),style:i,svg:a,...o}));i.displayName=`Icon`;export{i as t};

package/dist/{icon-n49kOh4_.d.ts → icon-Cevjo93X.d.ts}

@@ -1,6 +1,5 @@
-import { t as SvgAttributes } from "./types-BvUzforF.js";
+import { t as SvgAttributes } from "./types-D1RY5Tcj.js";
 import { ReactNode } from "react";
-
 //#region src/components/icon/icon.d.ts
 type IconProps = Omit<SvgAttributes, "children"> & {
   /**
@@ -11,7 +10,7 @@ type IconProps = Omit<SvgAttributes, "children"> & {
 /**
  * Decorates an svg icon with automatic sizing styles and a `shrink-0` class.
  *
- * @see https://mantle.ngrok.com/components/icon
+ * @see https://mantle.ngrok.com/components/data-display/icon
  *
  * @example
  * ```tsx

package/dist/{icon-button-DiX9iZ9n.js → icon-button-CxVsZ2N1.js}

@@ -1 +1 @@
-import{t as e}from"./cx-C1UYP5We.js";import{t}from"./icon-SUx16Sl3.js";import{t as n}from"./slot-DT_E5BQx.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{Children as i,cloneElement as a,forwardRef as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=e(`icon-button`,`inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`),h=f(m,{variants:{appearance:{ghost:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`,outlined:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},isLoading:{false:``,true:`opacity-50`},size:{xs:`size-6`,sm:`size-7`,md:`size-9`}},defaultVariants:{appearance:`outlined`,size:`md`}}),g=o(({"aria-disabled":o,appearance:f,asChild:m=!1,children:g,className:_,disabled:v,icon:y,isLoading:b=!1,label:x,size:S,type:C,...w},T)=>{let E=r(o??v??b),D=b?u(p,{className:`animate-spin`}):y,O={"aria-disabled":E,"data-slot":`icon-button`,className:e(h({appearance:f,isLoading:b,size:S}),_),"data-appearance":f,"data-disabled":E,"data-icon-button":!0,"data-loading":b,"data-size":S,disabled:E,ref:T,...w},k=d(l,{children:[u(`span`,{className:`sr-only`,children:x}),u(t,{svg:D})]});return m?(c(s(g)&&i.only(g),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),u(n,{...O,children:a(g,{},k)})):u(`button`,{...O,type:C??`button`,children:k})});g.displayName=`IconButton`;export{m as n,h as r,g as t};
+import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./icon-CDtYjF_H.js";import{t as n}from"./slot-DmPrjM7N.js";import{t as r}from"./booleanish-BfvnW6vy.js";import{Children as i,cloneElement as a,forwardRef as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=e(`icon-button`,`inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`),h=f(m,{variants:{appearance:{ghost:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`,outlined:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},isLoading:{false:``,true:`opacity-50`},size:{xs:`size-6`,sm:`size-7`,md:`size-9`,lg:`size-10`,xl:`size-12`}},defaultVariants:{appearance:`outlined`,size:`md`}}),g=o(({"aria-disabled":o,appearance:f,asChild:m=!1,children:g,className:_,disabled:v,icon:y,isLoading:b=!1,label:x,size:S=`md`,type:C,...w},T)=>{let E=r(o??v??b),D=b?u(p,{className:`animate-spin`}):y,O={"aria-disabled":E,"data-slot":`icon-button`,className:e(h({appearance:f,isLoading:b,size:S}),_),"data-appearance":f,"data-disabled":E,"data-icon-button":!0,"data-loading":b,"data-size":S,disabled:E,ref:T,...w},k=d(l,{children:[u(`span`,{className:`sr-only`,children:x}),u(t,{svg:D})]});return m?(c(s(g)&&i.only(g),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),u(n,{...O,children:a(g,{},k)})):u(`button`,{...O,type:C??`button`,children:k})});g.displayName=`IconButton`;export{m as n,h as r,g as t};

package/dist/{icon-button-D7hs6bX2.d.ts → icon-button-DuRSCsPh.d.ts}

@@ -1,12 +1,11 @@
-import { t as WithAsChild } from "./as-child-uN_018tj.js";
-import { i as DeepNonNullable, r as VariantProps } from "./index-Bed_XLWa.js";
+import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
+import { i as DeepNonNullable, r as VariantProps } from "./index-D47aqlpz.js";
 import { ButtonHTMLAttributes, ReactNode } from "react";
-
 //#region src/components/button/icon-button.d.ts
 declare const iconButtonVariants: (props?: ({
   appearance?: "ghost" | "outlined" | null | undefined;
   isLoading?: boolean | null | undefined;
-  size?: "xs" | "sm" | "md" | null | undefined;
+  size?: "lg" | "md" | "sm" | "xl" | "xs" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type IconButtonVariants = VariantProps<typeof iconButtonVariants>;
 /**
@@ -48,7 +47,7 @@ type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & I
  * as submitting a form or opening a dialog.
  * Renders only a single icon as children with an accessible, screen-reader-only label.
  *
- * @see https://mantle.ngrok.com/components/icon-button
+ * @see https://mantle.ngrok.com/components/actions/icon-button
  *
  * @example
  * ```tsx
@@ -70,7 +69,7 @@ type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & I
 declare const IconButton: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & Partial<DeepNonNullable<import("class-variance-authority").VariantProps<(props?: ({
   appearance?: "ghost" | "outlined" | null | undefined;
   isLoading?: boolean | null | undefined;
-  size?: "xs" | "sm" | "md" | null | undefined;
+  size?: "lg" | "md" | "sm" | "xl" | "xs" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string>>> & {
   /**
    * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.

package/dist/icon.d.ts

@@ -1,4 +1,4 @@
-import { t as SvgAttributes } from "./types-BvUzforF.js";
-import { n as IconProps, t as Icon } from "./icon-n49kOh4_.js";
-import { n as SvgOnlyProps, t as SvgOnly } from "./svg-only-f6ToFLH0.js";
+import { t as SvgAttributes } from "./types-D1RY5Tcj.js";
+import { n as IconProps, t as Icon } from "./icon-Cevjo93X.js";
+import { n as SvgOnlyProps, t as SvgOnly } from "./svg-only-BFeFS1aa.js";
 export { Icon, type IconProps, type SvgAttributes, SvgOnly, type SvgOnlyProps };

package/dist/icon.js

@@ -1 +1 @@
-import{t as e}from"./svg-only-CSOaF1tL.js";import{t}from"./icon-SUx16Sl3.js";export{t as Icon,e as SvgOnly};
+import{t as e}from"./svg-only-DDx6FtJd.js";import{t}from"./icon-CDtYjF_H.js";export{t as Icon,e as SvgOnly};

package/dist/icons.d.ts

@@ -1,8 +1,7 @@
-import { t as SvgAttributes } from "./types-BvUzforF.js";
-import { a as AlphanumericSortingDirection, c as TimeSortingDirection, o as SortingDirection, s as SortingMode } from "./direction-CcTY0FmA.js";
+import { t as SvgAttributes } from "./types-D1RY5Tcj.js";
+import { a as AlphanumericSortingDirection, c as TimeSortingDirection, o as SortingDirection, s as SortingMode } from "./direction-BjU0bPST.js";
 import { i as Theme } from "./themes-CYNpplwN.js";
 import { ComponentProps } from "react";
-
 //#region src/components/icons/sort.d.ts
 type Props = SvgAttributes & ({
   mode: Extract<SortingMode, "alphanumeric">;
@@ -21,18 +20,10 @@ type Props = SvgAttributes & ({
    */
   direction: TimeSortingDirection | SortingDirection;
 });
-/**
- * A sorting icon that can be used to indicate the sorting direction of a table column or list.
- * It is aware of the sorting mode (alphanumeric or time) and the sorting direction (ascending or descending).
- */
-declare const SortIcon: {
-  ({
-    mode,
-    direction,
-    ...props
-  }: Props): import("react").JSX.Element;
-  displayName: string;
-};
+declare function SortIcon({ mode, direction, ...props }: Props): import("react").JSX.Element;
+declare namespace SortIcon {
+  var displayName: string;
+}
 //#endregion
 //#region src/components/icons/traffic-policy-file.d.ts
 /**
@@ -67,10 +58,7 @@ type ThemeIconProps = SvgAttributes & {
  * - `light-high-contrast`: SunIcon (fill)
  * - `dark-high-contrast`: MoonIcon (fill)
  */
-declare function ThemeIcon({
-  theme,
-  ...props
-}: ThemeIconProps): import("react").JSX.Element;
+declare function ThemeIcon({ theme, ...props }: ThemeIconProps): import("react").JSX.Element;
 declare namespace ThemeIcon {
   var displayName: string;
 }

package/dist/icons.js

@@ -1 +1 @@
-import{s as e}from"./theme-provider-BNFS3Acf.js";import{t}from"./traffic-policy-file-0g5RXFqu.js";import{t as n}from"./sort-BPX2Fk9t.js";import{jsx as r}from"react/jsx-runtime";import{DesktopIcon as i}from"@phosphor-icons/react/Desktop";import{MoonIcon as a}from"@phosphor-icons/react/Moon";import{SunIcon as o}from"@phosphor-icons/react/Sun";function s(t){return r(c,{theme:e(),...t})}s.displayName=`AutoThemeIcon`;function c({theme:e,...t}){switch(e){case`system`:return r(i,{...t});case`light`:return r(o,{...t});case`dark`:return r(a,{...t});case`light-high-contrast`:return r(o,{...t,weight:`fill`});case`dark-high-contrast`:return r(a,{...t,weight:`fill`})}}c.displayName=`ThemeIcon`;function l(e){return r(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 94 36`,width:`2.61em`,...e,children:r(`path`,{d:`M32.272 12.011c-1.298-1.466-2.904-2.205-4.812-2.205-1.176 0-2.26.233-3.255.7a7.995 7.995 0 0 0-2.581 1.906 9.205 9.205 0 0 0-1.715 2.853 9.773 9.773 0 0 0-.628 3.546c0 1.25.194 2.39.58 3.419.362.98.918 1.877 1.635 2.636A7.543 7.543 0 0 0 24 26.584c.965.41 2.025.617 3.176.617.522 0 1.005-.041 1.445-.116.439-.075.858-.2 1.26-.37.4-.175.79-.398 1.18-.664.385-.27.792-.612 1.21-1.018v4.353h-.005v.421h-5.33l-4.005 4.64v.798h15.037v-24.98h-5.697v1.746Zm-.014 7.979a4.25 4.25 0 0 1-.786 1.215 3.555 3.555 0 0 1-2.592 1.1 3.627 3.627 0 0 1-1.464-.292 3.508 3.508 0 0 1-1.166-.808 3.93 3.93 0 0 1-1.054-2.72c0-.519.097-1.006.298-1.457a3.77 3.77 0 0 1 .804-1.181 4.114 4.114 0 0 1 1.162-.808 3.484 3.484 0 0 1 2.817-.016c.448.19.844.463 1.181.81.336.347.6.743.804 1.194.202.452.298.95.298 1.493 0 .505-.104 1.005-.302 1.47m-16.261-7.708a6.173 6.173 0 0 0-2.06-1.602 4.875 4.875 0 0 0-.57-.22 6.383 6.383 0 0 0-.923-.216H8.383L5.697 13.39v-3.082H.002v16.61h5.695V15.712h5.35l.444-.01v11.214h5.697V16.528c0-.885-.084-1.674-.25-2.366a4.655 4.655 0 0 0-.941-1.877zm38.367-2.018h-6.213l-2.47 2.863v-2.864h-5.7v16.61h5.71l.004-11.117h4.144l4.526-5.26zm31.051 7.672 7.79-7.392v-.281H85.7l-5.975 5.991V0h-5.696v26.87h5.696v-6.766l6.262 6.763h7.663v-.316l-8.233-8.617zm-16.11-5.78a9.436 9.436 0 0 0-3.085-1.842 10.953 10.953 0 0 0-3.855-.664c-1.407 0-2.705.226-3.884.678a9.611 9.611 0 0 0-3.072 1.858 8.488 8.488 0 0 0-2.016 2.788 8.281 8.281 0 0 0-.722 3.449c0 1.362.24 2.596.722 3.707a8.52 8.52 0 0 0 2.002 2.862c.85.798 1.86 1.415 3.036 1.847 1.177.432 2.455.647 3.842.647 1.406 0 2.707-.215 3.919-.647 1.204-.431 2.24-1.04 3.098-1.833a8.583 8.583 0 0 0 2.031-2.816c.493-1.09.742-2.29.742-3.611 0-1.316-.244-2.52-.722-3.612a8.424 8.424 0 0 0-2.035-2.81Zm-3.558 7.864c-.2.461-.463.869-.786 1.215a3.573 3.573 0 0 1-2.592 1.1c-.502 0-.981-.096-1.434-.291a3.44 3.44 0 0 1-1.16-.809 4.155 4.155 0 0 1-.788-1.215 3.825 3.825 0 0 1-.297-1.537c0-.517.098-1.004.297-1.456.201-.451.46-.849.787-1.194a3.579 3.579 0 0 1 2.597-1.1c.502 0 .98.096 1.43.29.448.19.839.461 1.16.81.328.345.586.752.786 1.214.2.461.297.954.297 1.471 0 .538-.096 1.04-.297 1.502`})})}function u(e){return r(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 32 32`,width:`1em`,...e,children:r(`path`,{d:`M27.2 6.18a9.47 9.47 0 0 0-3.12-2.5A9.42 9.42 0 0 0 21.82 3h-6.14l-4.06 4.9V3.1H3V29h8.62V11.53h8.09l.67-.02v17.48H29V12.8c0-1.37-.13-2.6-.38-3.68a7.35 7.35 0 0 0-1.42-2.93Z`})})}export{s as AutoThemeIcon,u as NgrokLettermarkIcon,l as NgrokWordmarkIcon,n as SortIcon,c as ThemeIcon,t as TrafficPolicyFileIcon};
+import{t as e}from"./traffic-policy-file-0g5RXFqu.js";import{t}from"./sort-BPX2Fk9t.js";import{n,t as r}from"./theme-D8kZCOzM.js";import{jsx as i}from"react/jsx-runtime";function a(e){return i(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 94 36`,width:`2.61em`,...e,children:i(`path`,{d:`M32.272 12.011c-1.298-1.466-2.904-2.205-4.812-2.205-1.176 0-2.26.233-3.255.7a7.995 7.995 0 0 0-2.581 1.906 9.205 9.205 0 0 0-1.715 2.853 9.773 9.773 0 0 0-.628 3.546c0 1.25.194 2.39.58 3.419.362.98.918 1.877 1.635 2.636A7.543 7.543 0 0 0 24 26.584c.965.41 2.025.617 3.176.617.522 0 1.005-.041 1.445-.116.439-.075.858-.2 1.26-.37.4-.175.79-.398 1.18-.664.385-.27.792-.612 1.21-1.018v4.353h-.005v.421h-5.33l-4.005 4.64v.798h15.037v-24.98h-5.697v1.746Zm-.014 7.979a4.25 4.25 0 0 1-.786 1.215 3.555 3.555 0 0 1-2.592 1.1 3.627 3.627 0 0 1-1.464-.292 3.508 3.508 0 0 1-1.166-.808 3.93 3.93 0 0 1-1.054-2.72c0-.519.097-1.006.298-1.457a3.77 3.77 0 0 1 .804-1.181 4.114 4.114 0 0 1 1.162-.808 3.484 3.484 0 0 1 2.817-.016c.448.19.844.463 1.181.81.336.347.6.743.804 1.194.202.452.298.95.298 1.493 0 .505-.104 1.005-.302 1.47m-16.261-7.708a6.173 6.173 0 0 0-2.06-1.602 4.875 4.875 0 0 0-.57-.22 6.383 6.383 0 0 0-.923-.216H8.383L5.697 13.39v-3.082H.002v16.61h5.695V15.712h5.35l.444-.01v11.214h5.697V16.528c0-.885-.084-1.674-.25-2.366a4.655 4.655 0 0 0-.941-1.877zm38.367-2.018h-6.213l-2.47 2.863v-2.864h-5.7v16.61h5.71l.004-11.117h4.144l4.526-5.26zm31.051 7.672 7.79-7.392v-.281H85.7l-5.975 5.991V0h-5.696v26.87h5.696v-6.766l6.262 6.763h7.663v-.316l-8.233-8.617zm-16.11-5.78a9.436 9.436 0 0 0-3.085-1.842 10.953 10.953 0 0 0-3.855-.664c-1.407 0-2.705.226-3.884.678a9.611 9.611 0 0 0-3.072 1.858 8.488 8.488 0 0 0-2.016 2.788 8.281 8.281 0 0 0-.722 3.449c0 1.362.24 2.596.722 3.707a8.52 8.52 0 0 0 2.002 2.862c.85.798 1.86 1.415 3.036 1.847 1.177.432 2.455.647 3.842.647 1.406 0 2.707-.215 3.919-.647 1.204-.431 2.24-1.04 3.098-1.833a8.583 8.583 0 0 0 2.031-2.816c.493-1.09.742-2.29.742-3.611 0-1.316-.244-2.52-.722-3.612a8.424 8.424 0 0 0-2.035-2.81Zm-3.558 7.864c-.2.461-.463.869-.786 1.215a3.573 3.573 0 0 1-2.592 1.1c-.502 0-.981-.096-1.434-.291a3.44 3.44 0 0 1-1.16-.809 4.155 4.155 0 0 1-.788-1.215 3.825 3.825 0 0 1-.297-1.537c0-.517.098-1.004.297-1.456.201-.451.46-.849.787-1.194a3.579 3.579 0 0 1 2.597-1.1c.502 0 .98.096 1.43.29.448.19.839.461 1.16.81.328.345.586.752.786 1.214.2.461.297.954.297 1.471 0 .538-.096 1.04-.297 1.502`})})}function o(e){return i(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 32 32`,width:`1em`,...e,children:i(`path`,{d:`M27.2 6.18a9.47 9.47 0 0 0-3.12-2.5A9.42 9.42 0 0 0 21.82 3h-6.14l-4.06 4.9V3.1H3V29h8.62V11.53h8.09l.67-.02v17.48H29V12.8c0-1.37-.13-2.6-.38-3.68a7.35 7.35 0 0 0-1.42-2.93Z`})})}export{r as AutoThemeIcon,o as NgrokLettermarkIcon,a as NgrokWordmarkIcon,t as SortIcon,n as ThemeIcon,e as TrafficPolicyFileIcon};

package/dist/{in-view-BC3wmz-a.d.ts → in-view-nkSOdED2.d.ts}

@@ -1,5 +1,4 @@
 import { Ref } from "react";
-
 //#region src/utils/copy-to-clipboard.d.ts
 /**
  * Copy the given string to the clipboard. Uses the Clipboard API when
@@ -14,13 +13,29 @@ declare function copyToClipboard(value: string): Promise<void>;
 //#region src/utils/compose-refs/compose-refs.d.ts
 type PossibleRef<T> = Ref<T> | undefined;
 /**
- * A utility to compose multiple refs together
- * Accepts callback refs and RefObject(s)
+ * A utility that composes multiple refs into a single callback ref. Accepts
+ * callback refs and RefObject(s); the returned ref writes the node to every
+ * given ref.
+ *
+ * Prefer {@link useComposedRefs} inside components — it keeps a stable
+ * function identity across renders.
+ *
+ * @example
+ * const setRefs = composeRefs(internalRef, forwardedRef);
+ * return <input ref={setRefs} />;
  */
 declare function composeRefs<T>(...refs: PossibleRef<T>[]): (node: T | null) => void;
 /**
- * A custom hook that composes multiple refs
- * Accepts callback refs and RefObject(s)
+ * A custom hook that composes multiple refs into a single stable callback
+ * ref. Accepts callback refs and RefObject(s); the latest refs passed on
+ * each render are the ones written to.
+ *
+ * @example
+ * const MyInput = forwardRef<HTMLInputElement>((props, forwardedRef) => {
+ *   const internalRef = useRef<HTMLInputElement>(null);
+ *   const ref = useComposedRefs(internalRef, forwardedRef);
+ *   return <input ref={ref} {...props} />;
+ * });
  */
 declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): (node: T | null) => void;
 //#endregion
@@ -86,10 +101,6 @@ type ViewChangeHandler = (entry: IntersectionObserverEntry) => void;
  * // Later, stop observing:
  * stop();
  */
-declare function inView(element: Element, onStart: (element: Element, entry: IntersectionObserverEntry) => void | ViewChangeHandler, {
-  root,
-  margin: rootMargin,
-  amount
-}?: InViewOptions): VoidFunction;
+declare function inView(element: Element, onStart: (element: Element, entry: IntersectionObserverEntry) => void | ViewChangeHandler, { root, margin: rootMargin, amount }?: InViewOptions): VoidFunction;
 //#endregion
 export { composeRefs as a, inView as i, MarginType as n, useComposedRefs as o, ViewChangeHandler as r, copyToClipboard as s, InViewOptions as t };

package/dist/index-BnI3OppC.d.ts

@@ -0,0 +1 @@
+import "./dropdown-menu-DT30TQzL.js";

package/dist/{index-CTU6apE6.d.ts → index-CDwfBOAA.d.ts}

@@ -1,7 +1,8 @@
-import { t as WithAsChild } from "./as-child-uN_018tj.js";
-import { r as VariantProps } from "./index-Bed_XLWa.js";
+import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
+import { r as VariantProps } from "./index-D47aqlpz.js";
+import "./button-Bw9MpShl.js";
+import "./icon-button-DuRSCsPh.js";
 import { ComponentProps } from "react";
-
 //#region src/components/button/button-group.d.ts
 declare const buttonGroupVariants: (props?: ({
   appearance?: "ghost" | "outlined" | "panel" | null | undefined;
@@ -11,7 +12,7 @@ type ButtonGroupProps = ComponentProps<"div"> & ButtonGroupVariants & WithAsChil
 /**
  * A contained group of related buttons.
  *
- * @see https://mantle.ngrok.com/components/button-group#api-button-group
+ * @see https://mantle.ngrok.com/components/actions/button
  *
  * @example
  * ```tsx