@voxel51/voodo 0.0.27 → 0.0.29

package/dist/theme/index.d.ts

@@ -1,3 +1,2 @@
-export * from './mui';
 export * from './tokens';
 //# sourceMappingURL=index.d.ts.map

package/dist/theme/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/theme/tokens/index.d.ts

@@ -1,3 +1,5 @@
+import { transitions } from './transitions';
+export { transitions };
 declare const _default: {
     colors: {
         common: {
@@ -192,6 +194,34 @@ declare const _default: {
         readonly lg: "1.5rem";
         readonly xl: "2rem";
     };
+    transitions: {
+        readonly duration: {
+            readonly instant: "0ms";
+            readonly fast: "100ms";
+            readonly normal: "200ms";
+            readonly moderate: "300ms";
+            readonly slow: "500ms";
+            readonly deliberate: "700ms";
+        };
+        readonly easing: {
+            readonly linear: "linear";
+            readonly in: "cubic-bezier(0.4, 0, 1, 1)";
+            readonly out: "cubic-bezier(0, 0, 0.2, 1)";
+            readonly "in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly spring: "cubic-bezier(0.34, 1.56, 0.64, 1)";
+            readonly sharp: "cubic-bezier(0.4, 0, 0.6, 1)";
+        };
+        readonly preset: {
+            readonly colors: "color 200ms cubic-bezier(0.4, 0, 0.2, 1), background-color 200ms cubic-bezier(0.4, 0, 0.2, 1), border-color 200ms cubic-bezier(0.4, 0, 0.2, 1), fill 200ms cubic-bezier(0.4, 0, 0.2, 1), stroke 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly opacity: "opacity 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly transform: "transform 200ms cubic-bezier(0, 0, 0.2, 1)";
+            readonly shadow: "box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly menu: "opacity 100ms cubic-bezier(0, 0, 0.2, 1), transform 100ms cubic-bezier(0, 0, 0.2, 1)";
+            readonly panel: "transform 300ms cubic-bezier(0, 0, 0.2, 1)";
+            readonly overlay: "opacity 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+            readonly all: "all 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+        };
+    };
     typography: {
         readonly fontFamily: {
             readonly sans: readonly ["Palanquin", "sans-serif"];

package/dist/theme/tokens/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/theme/tokens/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,wBAIE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/theme/tokens/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,OAAO,EAAE,WAAW,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEvB,wBAKE"}

package/dist/theme/tokens/transitions.d.ts

@@ -0,0 +1,74 @@
+/**
+ * Transition design tokens for the VOODO design system.
+ *
+ * Three layers:
+ *  1. `duration`  — how long a transition takes
+ *  2. `easing`    — the timing curve (how it accelerates / decelerates)
+ *  3. `preset`    — pre-composed shorthand values for common UI patterns
+ *
+ * These are compiled into CSS custom properties by the generate-tailwind-theme
+ * script and consumed through the TypeScript helpers in `src/types/transition.ts`.
+ */
+export declare const transitions: {
+    /**
+     * Duration tokens — semantic names for how long an animation takes.
+     *
+     * instant   (0ms)   Use for state that should feel truly immediate.
+     * fast      (100ms) Micro-interactions: hover highlights, icon swaps.
+     * normal    (200ms) Default: color, border, and opacity changes.
+     * moderate  (300ms) Slightly heavier state changes: panel reveals, tooltips.
+     * slow      (500ms) Deliberate motion: drawers, slide-in panels.
+     * deliberate(700ms) Page-level or dramatic transitions.
+     */
+    readonly duration: {
+        readonly instant: "0ms";
+        readonly fast: "100ms";
+        readonly normal: "200ms";
+        readonly moderate: "300ms";
+        readonly slow: "500ms";
+        readonly deliberate: "700ms";
+    };
+    /**
+     * Easing (timing-function) tokens.
+     *
+     * linear   Constant speed.  Mechanical feel; suits progress bars/loaders.
+     * in       Starts slow, accelerates.  Best for exits / elements leaving the screen.
+     * out      Starts fast, decelerates.  Best for entrances / elements arriving.
+     * in-out   Slow start and end.  Best for general UI state changes.
+     * spring   Slight overshoot then settles.  Adds energy to interactive elements.
+     * sharp    Quick in, gradual out.  Crisp, snappy feel for menus/overlays.
+     */
+    readonly easing: {
+        readonly linear: "linear";
+        readonly in: "cubic-bezier(0.4, 0, 1, 1)";
+        readonly out: "cubic-bezier(0, 0, 0.2, 1)";
+        readonly "in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly spring: "cubic-bezier(0.34, 1.56, 0.64, 1)";
+        readonly sharp: "cubic-bezier(0.4, 0, 0.6, 1)";
+    };
+    /**
+     * Pre-composed transition shorthands for common UI patterns.
+     * These bake in the right duration + easing for each context so
+     * component authors pick semantics, not numbers.
+     *
+     * colors   Background, text, border, fill, and stroke color changes.
+     * opacity  Fade in/out.
+     * transform Scale, translate, and rotate.
+     * shadow   Box-shadow elevation changes.
+     * menu     Dropdown / context menu appear and disappear.
+     * panel    Drawers and slide-in sheets.
+     * overlay  Modal backdrop fade.
+     * all      General-purpose catch-all.
+     */
+    readonly preset: {
+        readonly colors: "color 200ms cubic-bezier(0.4, 0, 0.2, 1), background-color 200ms cubic-bezier(0.4, 0, 0.2, 1), border-color 200ms cubic-bezier(0.4, 0, 0.2, 1), fill 200ms cubic-bezier(0.4, 0, 0.2, 1), stroke 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly opacity: "opacity 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly transform: "transform 200ms cubic-bezier(0, 0, 0.2, 1)";
+        readonly shadow: "box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly menu: "opacity 100ms cubic-bezier(0, 0, 0.2, 1), transform 100ms cubic-bezier(0, 0, 0.2, 1)";
+        readonly panel: "transform 300ms cubic-bezier(0, 0, 0.2, 1)";
+        readonly overlay: "opacity 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+        readonly all: "all 200ms cubic-bezier(0.4, 0, 0.2, 1)";
+    };
+};
+//# sourceMappingURL=transitions.d.ts.map

package/dist/theme/tokens/transitions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transitions.d.ts","sourceRoot":"","sources":["../../../src/theme/tokens/transitions.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,eAAO,MAAM,WAAW;IACtB;;;;;;;;;OASG;;;;;;;;;IAUH;;;;;;;;;OASG;;;;;;;;;IAUH;;;;;;;;;;;;;OAaG;;;;;;;;;;;CAYK,CAAC"}

package/dist/types/index.d.ts

@@ -13,5 +13,6 @@ export * from './shadow';
 export * from './size';
 export * from './spacing';
 export * from './text';
+export * from './transition';
 export * from './variant';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC"}

package/dist/types/transition.d.ts

@@ -0,0 +1,127 @@
+/**
+ * Transition type system for the VOODO design system.
+ *
+ * Three enums map to the three layers of CSS custom properties generated
+ * from `src/theme/tokens/transitions.ts`:
+ *
+ *   TransitionDuration  →  --transition-duration-{name}
+ *   TransitionEasing    →  --transition-easing-{name}
+ *   TransitionPreset    →  --transition-preset-{name}
+ *
+ * The helper functions return Tailwind arbitrary-value classes that
+ * reference those variables, keeping component code declarative:
+ *
+ * @example
+ * ```tsx
+ * // Individual duration + easing
+ * <div className={cn(
+ *   transitionDuration(TransitionDuration.Normal),
+ *   transitionEasing(TransitionEasing.Out),
+ *   "transition-transform"
+ * )} />
+ *
+ * // Pre-composed preset
+ * <div style={{ transition: transitionPresetValue(TransitionPreset.Panel) }} />
+ * ```
+ */
+/**
+ * Semantic names for how long a transition takes.
+ * Maps to `--transition-duration-{name}` CSS variables.
+ */
+export declare enum TransitionDuration {
+    /** 0ms — truly immediate, no perceivable animation. */
+    Instant = "instant",
+    /** 100ms — micro-interactions: hover highlights, icon swaps. */
+    Fast = "fast",
+    /** 200ms — default for color, border, and opacity changes. */
+    Normal = "normal",
+    /** 300ms — panel reveals, tooltips, slightly heavier state changes. */
+    Moderate = "moderate",
+    /** 500ms — drawers, slide-in sheets. */
+    Slow = "slow",
+    /** 700ms — page-level or dramatic reveal transitions. */
+    Deliberate = "deliberate"
+}
+/**
+ * Timing-curve tokens that control how a transition accelerates.
+ * Maps to `--transition-easing-{name}` CSS variables.
+ */
+export declare enum TransitionEasing {
+    /** Constant speed. Suits progress bars and loaders. */
+    Linear = "linear",
+    /** Starts slow, accelerates. Best for elements *leaving* the screen. */
+    In = "in",
+    /** Starts fast, decelerates. Best for elements *arriving* on screen. */
+    Out = "out",
+    /** Slow start and end. Best for general UI state changes. */
+    InOut = "in-out",
+    /** Slight overshoot then settles. Adds energy to interactive elements. */
+    Spring = "spring",
+    /** Quick in, gradual out. Crisp, snappy feel for menus and overlays. */
+    Sharp = "sharp"
+}
+/**
+ * Pre-composed transition shorthands for common UI patterns.
+ * Bakes in the right duration + easing so component authors pick semantics,
+ * not numbers. Maps to `--transition-preset-{name}` CSS variables.
+ */
+export declare enum TransitionPreset {
+    /** Background, text, border, fill, and stroke color changes. */
+    Colors = "colors",
+    /** Fade in / fade out. */
+    Opacity = "opacity",
+    /** Scale, translate, and rotate. */
+    Transform = "transform",
+    /** Box-shadow elevation changes. */
+    Shadow = "shadow",
+    /** Dropdown / context menu appear and disappear. */
+    Menu = "menu",
+    /** Drawers and slide-in sheets. */
+    Panel = "panel",
+    /** Modal backdrop fade. */
+    Overlay = "overlay",
+    /** General-purpose catch-all. */
+    All = "all"
+}
+/**
+ * Returns a Tailwind `duration-[var(...)]` class for the given duration token.
+ *
+ * @example
+ * ```tsx
+ * <div className={cn("transition-colors", transitionDuration(TransitionDuration.Fast))} />
+ * // → "transition-colors duration-[var(--transition-duration-fast)]"
+ * ```
+ */
+export declare function transitionDuration(duration: TransitionDuration): string;
+/**
+ * Returns a Tailwind `ease-[var(...)]` class for the given easing token.
+ *
+ * @example
+ * ```tsx
+ * <div className={cn("transition-transform", transitionEasing(TransitionEasing.Out))} />
+ * // → "transition-transform ease-[var(--transition-easing-out)]"
+ * ```
+ */
+export declare function transitionEasing(easing: TransitionEasing): string;
+/**
+ * Returns a Tailwind `transition-[var(...)]` class for the given preset token.
+ * The preset encodes both the property list, duration, and easing in one token.
+ *
+ * @example
+ * ```tsx
+ * <div className={transitionPreset(TransitionPreset.Colors)} />
+ * // → "transition-[var(--transition-preset-colors)]"
+ * ```
+ */
+export declare function transitionPreset(preset: TransitionPreset): string;
+/**
+ * Returns the raw CSS `var(--transition-preset-{name})` string for use in
+ * `style` props or inline CSS where a Tailwind class is not appropriate.
+ *
+ * @example
+ * ```tsx
+ * <div style={{ transition: transitionPresetValue(TransitionPreset.Panel) }} />
+ * ```
+ */
+export declare function transitionPresetValue(preset: TransitionPreset): string;
+//# sourceMappingURL=transition.d.ts.map

package/dist/types/transition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../src/types/transition.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH;;;GAGG;AACH,oBAAY,kBAAkB;IAC5B,uDAAuD;IACvD,OAAO,YAAY;IACnB,gEAAgE;IAChE,IAAI,SAAS;IACb,8DAA8D;IAC9D,MAAM,WAAW;IACjB,uEAAuE;IACvE,QAAQ,aAAa;IACrB,wCAAwC;IACxC,IAAI,SAAS;IACb,yDAAyD;IACzD,UAAU,eAAe;CAC1B;AAED;;;GAGG;AACH,oBAAY,gBAAgB;IAC1B,uDAAuD;IACvD,MAAM,WAAW;IACjB,wEAAwE;IACxE,EAAE,OAAO;IACT,wEAAwE;IACxE,GAAG,QAAQ;IACX,6DAA6D;IAC7D,KAAK,WAAW;IAChB,0EAA0E;IAC1E,MAAM,WAAW;IACjB,wEAAwE;IACxE,KAAK,UAAU;CAChB;AAED;;;;GAIG;AACH,oBAAY,gBAAgB;IAC1B,gEAAgE;IAChE,MAAM,WAAW;IACjB,0BAA0B;IAC1B,OAAO,YAAY;IACnB,oCAAoC;IACpC,SAAS,cAAc;IACvB,oCAAoC;IACpC,MAAM,WAAW;IACjB,oDAAoD;IACpD,IAAI,SAAS;IACb,mCAAmC;IACnC,KAAK,UAAU;IACf,2BAA2B;IAC3B,OAAO,YAAY;IACnB,iCAAiC;IACjC,GAAG,QAAQ;CACZ;AAED;;;;;;;;GAQG;AACH,wBAAgB,kBAAkB,CAAC,QAAQ,EAAE,kBAAkB,GAAG,MAAM,CAEvE;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAEjE;AAED;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAEjE;AAED;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAEtE"}

package/dist/util/useControllableState.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Props for {@link useControllableState}.
+ *
+ * A component is "controlled" when `value` is defined and "uncontrolled"
+ * otherwise. In uncontrolled mode the hook owns the state and seeds it with
+ * `initializer`; in controlled mode the consumer owns the state and is
+ * responsible for updating `value` in response to `onChange`.
+ */
+export type ControllableStateProps<T> = {
+    /** Lazily produces the initial value used when the hook is uncontrolled. */
+    initializer: () => T;
+    /** Invoked with the next value on every change, in both controlled and uncontrolled modes. */
+    onChange?: (value: T) => void;
+    /** When defined, switches the hook into controlled mode and uses this as the resolved value. */
+    value?: T;
+};
+/**
+ * Tuple of `[value, onChange]` returned by {@link useControllableState}, mirroring
+ * the shape of `useState`.
+ */
+export type Controllable<T> = [value: T, onChange: (value: T) => void];
+/**
+ * Hook for implementing components that may be either controlled or
+ * uncontrolled, following the same convention as native form inputs.
+ *
+ * - If `value` is `undefined`, the hook manages internal state seeded by
+ *   `initializer` and updates it on every change.
+ * - If `value` is defined, the hook returns `value` as-is and never mutates
+ *   internal state; the consumer is responsible for re-rendering with the
+ *   next value.
+ *
+ * `onChange` (when provided) fires on every change in either mode.
+ *
+ * @example
+ * ```tsx
+ * const [value, setValue] = useControllableState({
+ *   initializer: () => defaultValue,
+ *   onChange,
+ *   value: controlledValue,
+ * });
+ * ```
+ */
+export declare const useControllableState: <T>({ initializer, onChange, value, }: ControllableStateProps<T>) => Controllable<T>;
+//# sourceMappingURL=useControllableState.d.ts.map

package/dist/util/useControllableState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useControllableState.d.ts","sourceRoot":"","sources":["../../src/util/useControllableState.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,MAAM,MAAM,sBAAsB,CAAC,CAAC,IAAI;IACtC,4EAA4E;IAC5E,WAAW,EAAE,MAAM,CAAC,CAAC;IACrB,8FAA8F;IAC9F,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,gGAAgG;IAChG,KAAK,CAAC,EAAE,CAAC,CAAC;CACX,CAAC;AAEF;;;GAGG;AACH,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC,CAAC;AAEvE;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,oBAAoB,GAAI,CAAC,EAAE,mCAIrC,sBAAsB,CAAC,CAAC,CAAC,KAAG,YAAY,CAAC,CAAC,CAmB5C,CAAC"}

package/dist/util/useDisclosure.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Options for {@link useDisclosure}.
+ *
+ * Provide `defaultOpen` for an uncontrolled disclosure, or `open` (with
+ * `onOpenChange`) for a controlled disclosure.
+ */
+export interface UseDisclosureOptions {
+    /** Initial open state when uncontrolled. Default `true`. */
+    defaultOpen?: boolean;
+    /** When defined, switches the hook into controlled mode and uses this as the resolved open state. */
+    open?: boolean;
+    /** Invoked with the next open state on every change, in both controlled and uncontrolled modes. */
+    onOpenChange?: (open: boolean) => void;
+}
+/**
+ * Return value of {@link useDisclosure}.
+ */
+export interface UseDisclosureReturn {
+    /** Current open state. */
+    open: boolean;
+    /** Flip the open state. In controlled mode this only fires `onOpenChange` and does not update internal state. */
+    toggle: () => void;
+    /** Set the open state. In controlled mode this only fires `onOpenChange` and does not update internal state. */
+    setOpen: (next: boolean) => void;
+}
+/**
+ * Hook for managing a boolean "open / closed" state, suitable for popovers,
+ * dialogs, accordions, and other disclosures.
+ *
+ * Supports both controlled and uncontrolled usage via {@link useControllableState}:
+ * pass `defaultOpen` for uncontrolled, or `open` (typically alongside
+ * `onOpenChange`) for controlled.
+ *
+ * @example
+ * ```tsx
+ * // Uncontrolled
+ * const { open, toggle, setOpen } = useDisclosure({ defaultOpen: false });
+ *
+ * // Controlled
+ * const { open, toggle } = useDisclosure({ open: isOpen, onOpenChange: setIsOpen });
+ * ```
+ */
+export declare function useDisclosure({ defaultOpen, open: controlledOpen, onOpenChange, }?: UseDisclosureOptions): UseDisclosureReturn;
+//# sourceMappingURL=useDisclosure.d.ts.map

package/dist/util/useDisclosure.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDisclosure.d.ts","sourceRoot":"","sources":["../../src/util/useDisclosure.ts"],"names":[],"mappings":"AAIA;;;;;GAKG;AACH,MAAM,WAAW,oBAAoB;IACnC,4DAA4D;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qGAAqG;IACrG,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,mGAAmG;IACnG,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,0BAA0B;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,iHAAiH;IACjH,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,gHAAgH;IAChH,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAClC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,WAAkB,EAClB,IAAI,EAAE,cAAc,EACpB,YAAY,GACb,GAAE,oBAAyB,GAAG,mBAAmB,CAUjD"}

package/dist/util/useDragDelta.d.ts

@@ -0,0 +1,58 @@
+import { default as React } from 'react';
+/**
+ * Axis along which a drag delta is measured.
+ *
+ * - `"horizontal"` reports `clientX` deltas.
+ * - `"vertical"` reports `clientY` deltas.
+ */
+export type DragAxis = "horizontal" | "vertical";
+/**
+ * Options for {@link useDragDelta}.
+ */
+export interface UseDragDeltaOptions {
+    /** Axis to measure the drag along. */
+    axis: DragAxis;
+    /** Invoked once when a drag begins (on pointer-down). */
+    onDragStart?: () => void;
+    /**
+     * Invoked on every pointer-move during a drag with the signed pixel delta
+     * from the drag start position. Positive values mean right (horizontal) or
+     * down (vertical).
+     */
+    onDelta: (delta: number) => void;
+    /** Invoked once when a drag ends (on pointer-up). */
+    onDragEnd?: () => void;
+}
+/**
+ * Return value of {@link useDragDelta}.
+ */
+export interface UseDragDeltaReturn {
+    /** `true` while a drag is in progress (between pointer-down and pointer-up). */
+    isDragging: boolean;
+    /** Props to spread onto the drag handle element. */
+    handleProps: {
+        onPointerDown: (e: React.PointerEvent<HTMLElement>) => void;
+        onPointerMove: (e: React.PointerEvent<HTMLElement>) => void;
+        onPointerUp: () => void;
+    };
+}
+/**
+ * Hook that tracks a single-axis pointer drag and reports the running delta
+ * from the drag start position.
+ *
+ * Uses pointer capture, so the drag continues correctly even if the pointer
+ * leaves the handle element. The supplied callbacks may be inline; the hook
+ * routes them through {@link useLatest} so the returned `handleProps` are
+ * stable across renders.
+ *
+ * @example
+ * ```tsx
+ * const { isDragging, handleProps } = useDragDelta({
+ *   axis: "horizontal",
+ *   onDelta: (delta) => setX((x) => x + delta),
+ * });
+ * return <div {...handleProps} />;
+ * ```
+ */
+export declare function useDragDelta({ axis, onDragStart, onDelta, onDragEnd, }: UseDragDeltaOptions): UseDragDeltaReturn;
+//# sourceMappingURL=useDragDelta.d.ts.map

package/dist/util/useDragDelta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDragDelta.d.ts","sourceRoot":"","sources":["../../src/util/useDragDelta.ts"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAI7D;;;;;GAKG;AACH,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,UAAU,CAAC;AAEjD;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,sCAAsC;IACtC,IAAI,EAAE,QAAQ,CAAC;IACf,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,gFAAgF;IAChF,UAAU,EAAE,OAAO,CAAC;IACpB,oDAAoD;IACpD,WAAW,EAAE;QACX,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;QAC5D,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;QAC5D,WAAW,EAAE,MAAM,IAAI,CAAC;KACzB,CAAC;CACH;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,WAAW,EACX,OAAO,EACP,SAAS,GACV,EAAE,mBAAmB,GAAG,kBAAkB,CAwC1C"}

package/dist/util/useElementSize.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Return value of {@link useElementSize}.
+ */
+export interface UseElementSizeReturn {
+    /** Callback ref to attach to the element you want to measure. */
+    ref: (el: HTMLElement | null) => void;
+    /** Current width of the observed element in pixels. `0` before the ref attaches. */
+    width: number;
+    /** Current height of the observed element in pixels. `0` before the ref attaches. */
+    height: number;
+}
+/**
+ * Hook that tracks the pixel dimensions of a DOM element via
+ * {@link https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver | ResizeObserver}.
+ *
+ * Attach the returned `ref` callback to any element; `width` and `height`
+ * update on mount and on every subsequent resize. The observer is
+ * automatically disconnected when the element is unmounted or replaced.
+ *
+ * @example
+ * ```tsx
+ * function Panel() {
+ *   const { ref, width, height } = useElementSize();
+ *   return <div ref={ref}>Size: {width} × {height}</div>;
+ * }
+ * ```
+ */
+export declare function useElementSize(): UseElementSizeReturn;
+//# sourceMappingURL=useElementSize.d.ts.map

package/dist/util/useElementSize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useElementSize.d.ts","sourceRoot":"","sources":["../../src/util/useElementSize.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,iEAAiE;IACjE,GAAG,EAAE,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC,oFAAoF;IACpF,KAAK,EAAE,MAAM,CAAC;IACd,qFAAqF;IACrF,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,cAAc,IAAI,oBAAoB,CAgBrD"}

package/dist/util/useLatest.d.ts

@@ -0,0 +1,24 @@
+import { RefObject } from 'react';
+/**
+ * Hook that returns a ref whose `.current` always points to the most recent
+ * value passed in.
+ *
+ * Useful for letting an otherwise-stable callback (e.g. one returned by
+ * `useCallback` with no dependencies) read fresh values without re-subscribing
+ * — typically a parent-supplied handler or a frequently-changing piece of
+ * state. The returned ref's identity is stable across renders.
+ *
+ * The assignment happens during render. Do not read `ref.current` during the
+ * same render in which the value is captured; only read it from event
+ * handlers, effects, or other deferred work.
+ *
+ * @example
+ * ```tsx
+ * const onChangeRef = useLatest(onChange);
+ * const handler = useCallback(() => {
+ *   onChangeRef.current?.(nextValue);
+ * }, []);
+ * ```
+ */
+export declare function useLatest<T>(value: T): RefObject<T>;
+//# sourceMappingURL=useLatest.d.ts.map

package/dist/util/useLatest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLatest.d.ts","sourceRoot":"","sources":["../../src/util/useLatest.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,SAAS,CAAC,CAAC,CAAC,CAInD"}

package/dist/util/useResizableDrawer.d.ts

@@ -0,0 +1,69 @@
+import { default as React } from 'react';
+import { UseDisclosureOptions, UseDisclosureReturn } from './useDisclosure';
+import { DragAxis } from './useDragDelta';
+export type { DragAxis };
+/**
+ * Options for {@link useResizableDrawer}.
+ *
+ * Extends {@link UseDisclosureOptions} so the drawer's open state can be
+ * controlled or uncontrolled in the same way as {@link useDisclosure}.
+ */
+export interface UseResizableDrawerOptions extends UseDisclosureOptions {
+    /** Axis the drawer resizes along. `"horizontal"` for left/right drawers, `"vertical"` for top/bottom. */
+    axis: DragAxis;
+    /** Initial drawer size in pixels, also used as the restore target after closing. */
+    defaultSize: number;
+    /** Minimum drawer size in pixels while open. */
+    minSize: number;
+    /** Maximum drawer size in pixels. */
+    maxSize: number;
+    /** Size at which a drag triggers close. Defaults to 0. */
+    closeThreshold?: number;
+    /** Flip the delta sign — use for right-side and bottom-side handles. */
+    invert?: boolean;
+    /** Invoked with the new size on every drag-induced resize (not on open/close-only changes). */
+    onSizeChange?: (size: number) => void;
+}
+/**
+ * Return value of {@link useResizableDrawer}. Extends {@link UseDisclosureReturn}
+ * with size and drag state.
+ */
+export interface UseResizableDrawerReturn extends UseDisclosureReturn {
+    /** Current drawer size in pixels. Reflects the last committed size even while closed. */
+    size: number;
+    /** `true` while the user is actively dragging the resize handle. */
+    isDragging: boolean;
+    /** Props to spread onto the drag handle element. */
+    dragHandleProps: {
+        onPointerDown: (e: React.PointerEvent<HTMLElement>) => void;
+        onPointerMove: (e: React.PointerEvent<HTMLElement>) => void;
+        onPointerUp: () => void;
+    };
+}
+/**
+ * Hook which models a drawer that can be opened, closed, and resized by
+ * dragging a handle.
+ *
+ * Behavior:
+ * - Dragging below `closeThreshold` (default `0`) closes the drawer.
+ * - Dragging above `closeThreshold` while closed reopens the drawer.
+ * - Sizes are clamped to `[minSize, maxSize]` while open.
+ * - `toggle()` restores the last dragged size when reopening.
+ *
+ * @example
+ * ```tsx
+ * const { open, size, toggle, dragHandleProps } = useResizableDrawer({
+ *   axis: "horizontal",
+ *   defaultSize: 320,
+ *   minSize: 200,
+ *   maxSize: 600,
+ * });
+ * return (
+ *   <aside style={{ width: open ? size : 0 }}>
+ *     <div {...dragHandleProps} />
+ *   </aside>
+ * );
+ * ```
+ */
+export declare function useResizableDrawer({ axis, defaultSize, minSize, maxSize, closeThreshold, invert, onSizeChange, ...disclosureOptions }: UseResizableDrawerOptions): UseResizableDrawerReturn;
+//# sourceMappingURL=useResizableDrawer.d.ts.map

package/dist/util/useResizableDrawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useResizableDrawer.d.ts","sourceRoot":"","sources":["../../src/util/useResizableDrawer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAE7D,OAAO,EACL,oBAAoB,EACpB,mBAAmB,EAEpB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,QAAQ,EAAgB,MAAM,gBAAgB,CAAC;AAGxD,YAAY,EAAE,QAAQ,EAAE,CAAC;AAEzB;;;;;GAKG;AACH,MAAM,WAAW,yBAA0B,SAAQ,oBAAoB;IACrE,yGAAyG;IACzG,IAAI,EAAE,QAAQ,CAAC;IACf,oFAAoF;IACpF,WAAW,EAAE,MAAM,CAAC;IACpB,gDAAgD;IAChD,OAAO,EAAE,MAAM,CAAC;IAChB,qCAAqC;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,0DAA0D;IAC1D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,wEAAwE;IACxE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,+FAA+F;IAC/F,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED;;;GAGG;AACH,MAAM,WAAW,wBAAyB,SAAQ,mBAAmB;IACnE,yFAAyF;IACzF,IAAI,EAAE,MAAM,CAAC;IACb,oEAAoE;IACpE,UAAU,EAAE,OAAO,CAAC;IACpB,oDAAoD;IACpD,eAAe,EAAE;QACf,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;QAC5D,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;QAC5D,WAAW,EAAE,MAAM,IAAI,CAAC;KACzB,CAAC;CACH;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,WAAW,EACX,OAAO,EACP,OAAO,EACP,cAAkB,EAClB,MAAc,EACd,YAAY,EACZ,GAAG,iBAAiB,EACrB,EAAE,yBAAyB,GAAG,wBAAwB,CA0EtD"}