@elmethis/react 0.3.19 → 0.4.0

package/lib-types/hooks/use-debounced-signal.d.ts

@@ -0,0 +1,39 @@
+/**
+ * React shape returned by {@link useDebouncedSignal}.
+ *
+ * Qwik returns three `Signal<T>` objects (`signal`, `debouncedSignal`,
+ * `isPending`). React has no signal/store split, so the equivalent is exposed
+ * as a `useState`-style tuple object: `value` + `setValue` replace the
+ * read/write `signal`, `debouncedValue` replaces the read-only
+ * `debouncedSignal`, and `isPending` is a plain boolean.
+ */
+export interface UseDebouncedSignalReturn<T> {
+    /** The current value. Reflects every write to `setValue` immediately. */
+    value: T;
+    /** Writes a new value (or applies an updater). Mirrors qwik's `signal.value =`. */
+    setValue: React.Dispatch<React.SetStateAction<T>>;
+    /**
+     * The debounced value. Reflects `value` only after `delay` ms have elapsed
+     * since the last write. Rapid successive writes reset the timer so only the
+     * final value propagates.
+     */
+    debouncedValue: T;
+    /** `true` while a debounced update is queued but has not yet committed. */
+    isPending: boolean;
+}
+/**
+ * Returns a debounced value pair where writing through `setValue` drives a
+ * debounced update to `debouncedValue`.
+ *
+ * `value` reflects every write immediately.
+ * `debouncedValue` reflects the same value only after `delay` ms have elapsed
+ * since the last write. Rapid successive writes reset the timer so only the
+ * final value propagates to `debouncedValue`.
+ *
+ * When `delay` is 0 or negative, `debouncedValue` is updated synchronously.
+ *
+ * @param initialValue - The initial value for both `value` and `debouncedValue`.
+ * @param delay - Debounce delay in milliseconds.
+ */
+export declare const useDebouncedSignal: <T>(initialValue: T | (() => T), delay: number) => UseDebouncedSignalReturn<T>;
+//# sourceMappingURL=use-debounced-signal.d.ts.map

package/lib-types/hooks/use-debounced-signal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-debounced-signal.d.ts","sourceRoot":"","sources":["../../src/hooks/use-debounced-signal.ts"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AACH,MAAM,WAAW,wBAAwB,CAAC,CAAC;IACzC,yEAAyE;IACzE,KAAK,EAAE,CAAC,CAAC;IACT,mFAAmF;IACnF,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IAClD;;;;OAIG;IACH,cAAc,EAAE,CAAC,CAAC;IAClB,2EAA2E;IAC3E,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAClC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,EAC3B,OAAO,MAAM,KACZ,wBAAwB,CAAC,CAAC,CAmC5B,CAAC"}

package/lib-types/hooks/use-debounced-store.d.ts

@@ -0,0 +1,40 @@
+import type { Dispatch, SetStateAction } from "react";
+/**
+ * Returns a store pair with debounced reactivity.
+ *
+ * React port of qwik's `useDebouncedStore`. Qwik's signal/store model does not
+ * exist in React, so where qwik returned a deep-reactive proxy pair plus an
+ * `isPending` signal, this hook returns plain React state:
+ *
+ * - `store` — the current value, reflecting every write immediately.
+ * - `setStore` — the setter for `store` (accepts a value or an updater fn,
+ *   exactly like a `useState` setter). Use it where qwik mutated the proxy
+ *   in place (e.g. `setStore((s) => ({ ...s, query: next }))`).
+ * - `debouncedStore` — receives the same state only after `delay` ms have
+ *   elapsed since the last write to `store`. Rapid successive writes reset the
+ *   timer so only the final state propagates.
+ * - `isPending` — `true` while the debounce timer is active (a write to
+ *   `store` has not yet propagated to `debouncedStore`).
+ *
+ * When `delay` is 0 or negative, `debouncedStore` tracks `store` synchronously.
+ *
+ * @param initialValue - The initial value for both stores.
+ * @param delay - Debounce delay in milliseconds.
+ *
+ * @example
+ *   const { store, setStore, debouncedStore, isPending } = useDebouncedStore(
+ *     { query: "" },
+ *     500,
+ *   );
+ *
+ *   // store.query updates on every keystroke
+ *   // debouncedStore.query updates 500 ms after the user stops typing
+ *   <input onInput={(e) => setStore((s) => ({ ...s, query: e.currentTarget.value }))} />
+ */
+export declare function useDebouncedStore<T extends object>(initialValue: T, delay: number): {
+    store: T;
+    setStore: Dispatch<SetStateAction<T>>;
+    debouncedStore: T;
+    isPending: boolean;
+};
+//# sourceMappingURL=use-debounced-store.d.ts.map

package/lib-types/hooks/use-debounced-store.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-debounced-store.d.ts","sourceRoot":"","sources":["../../src/hooks/use-debounced-store.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAOtD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,SAAS,MAAM,EAChD,YAAY,EAAE,CAAC,EACf,KAAK,EAAE,MAAM,GACZ;IACD,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IACtC,cAAc,EAAE,CAAC,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;CACpB,CAgCA"}

package/lib-types/hooks/use-delayed-signal.d.ts

@@ -0,0 +1,37 @@
+export interface UseDelayedSignalReturn<T> {
+    /** Reflects the dispatched value immediately. */
+    value: T;
+    /** Receives the dispatched value after `delay` ms (or synchronously). */
+    delayedValue: T;
+    /** `true` while a timer is pending. */
+    isValueChanging: boolean;
+    /**
+     * Propagate `value` to `value` immediately and to `delayedValue` after
+     * `delay` ms, or synchronously when `delay` is omitted / `<= 0`.
+     */
+    dispatch: (value: T, delay?: number) => void;
+}
+/**
+ * Imperative companion to a debounced value: the consumer chooses *when*
+ * and *with what delay* a write should propagate from `value` (eager) to
+ * `delayedValue` (lagging).
+ *
+ * `value` reflects the dispatched value immediately.
+ * `delayedValue` receives the same value after `delay` ms, or synchronously
+ * when `delay` is omitted / `<= 0`.
+ *
+ * Calling `dispatch` again before the previous timer fires **cancels** the
+ * earlier pending update. Without that cancellation, two overlapping
+ * dispatches would race and the older value could clobber the newer one
+ * after both timers fire.
+ *
+ * `isValueChanging` is `true` while a timer is pending.
+ *
+ * Unlike the qwik twin (which returns a `{ signal, delayedSignal, dispatch }`
+ * trio of signals), this React port returns plain reactive values via
+ * `{ value, delayedValue, isValueChanging, dispatch }`.
+ *
+ * @param initialValue - Seed value for both `value` and `delayedValue`.
+ */
+export declare const useDelayedSignal: <T>(initialValue: T) => UseDelayedSignalReturn<T>;
+//# sourceMappingURL=use-delayed-signal.d.ts.map

package/lib-types/hooks/use-delayed-signal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-delayed-signal.d.ts","sourceRoot":"","sources":["../../src/hooks/use-delayed-signal.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,sBAAsB,CAAC,CAAC;IACvC,iDAAiD;IACjD,KAAK,EAAE,CAAC,CAAC;IACT,yEAAyE;IACzE,YAAY,EAAE,CAAC,CAAC;IAChB,uCAAuC;IACvC,eAAe,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CAC9C;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,gBAAgB,GAAI,CAAC,EAChC,cAAc,CAAC,KACd,sBAAsB,CAAC,CAAC,CAwC1B,CAAC"}

package/lib-types/hooks/use-elmethis-theme.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Same-tab broadcast channel. Fired on `window` by `applyTheme` after every
+ * theme mutation. Each `useElmethisTheme()` call owns an independent piece of
+ * state, and the `storage` event only fires in *other* tabs — so without this
+ * event, sibling components in the same tab would never see a toggle.
+ * `detail` carries the new `Theme | null` (`null` = reverted to OS auto).
+ */
+export declare const THEME_CHANGE_EVENT = "elmethis-theme-change";
+type Theme = "light" | "dark";
+/**
+ * Coerce a raw storage value into an explicit Theme, or `null` when no
+ * explicit choice is stored. `null` means "follow the OS" — i.e. fall back
+ * to the `color-scheme: light dark` default, which tracks
+ * `prefers-color-scheme`.
+ *
+ * Exported so the (otherwise inline) decision rule can be regression-tested
+ * directly without having to dispatch a real `StorageEvent`.
+ *
+ * Only the literal strings `"dark"` and `"light"` are explicit choices;
+ * anything else — including `null` (the key was cleared in another tab) and
+ * unknown strings — resolves to `null` (auto / OS).
+ */
+export declare const parseTheme: (raw: string | null) => Theme | null;
+export declare function useElmethisTheme(): {
+    isDarkTheme: boolean;
+    toggleTheme: () => void;
+};
+export {};
+//# sourceMappingURL=use-elmethis-theme.d.ts.map

package/lib-types/hooks/use-elmethis-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-elmethis-theme.d.ts","sourceRoot":"","sources":["../../src/hooks/use-elmethis-theme.ts"],"names":[],"mappings":"AAIA;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB,0BAA0B,CAAC;AAE1D,KAAK,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAE9B;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,UAAU,GAAI,KAAK,MAAM,GAAG,IAAI,KAAG,KAAK,GAAG,IACI,CAAC;AAmE7D,wBAAgB,gBAAgB;;;EAwE/B"}

package/lib-types/hooks/use-modal.d.ts

@@ -0,0 +1,23 @@
+import { type ReactNode } from "react";
+export interface UseModalOptions {
+    /**
+     * Delay in **milliseconds** of the open/close fade animation.
+     */
+    delay?: number;
+}
+/**
+ * Imperative sugar over {@link ElmModal}. Owns a single `isOpen` intent state
+ * and returns `show` / `hide` / `toggle` to drive it, plus a `Modal` component
+ * that renders the native `<dialog>` (open/animate/close lifecycle and timer
+ * cleanup all live in `ElmModal`).
+ */
+export declare const useModal: (options?: UseModalOptions) => {
+    Modal: ({ children }: {
+        children?: ReactNode;
+    }) => import("react").JSX.Element;
+    isOpen: boolean;
+    show: () => void;
+    hide: () => void;
+    toggle: () => void;
+};
+//# sourceMappingURL=use-modal.d.ts.map

package/lib-types/hooks/use-modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-modal.d.ts","sourceRoot":"","sources":["../../src/hooks/use-modal.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;GAKG;AACH,eAAO,MAAM,QAAQ,GAAI,UAAS,eAAoB;0BAwCnB;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE;;;;;CAe1D,CAAC"}

package/lib-types/hooks/use-storage.d.ts

@@ -0,0 +1,35 @@
+export type UseStorageOptions<T> = {
+    storageArea: "local" | "session";
+    key: string;
+    initialValue: T;
+    /** BroadcastChannel name for cross-tab sync (required for sessionStorage) */
+    channel?: string;
+};
+export type UseStorageReturn<T> = {
+    /** The current value. Initialized with `initialValue` until the client reads storage. */
+    state: T;
+    /** Update the value (and persist it to the storage area). */
+    setState: (value: T) => void;
+    /** Reset to `initialValue` and remove the key from the storage area. */
+    remove: () => void;
+};
+/**
+ * Persisted, cross-tab-synced state backed by `localStorage` / `sessionStorage`.
+ *
+ * React port of qwik's `useStorage`. Qwik's signal model does not exist in
+ * React, so where qwik returned `{ state, remove }` with `state` as a
+ * read/write `Signal<T>`, this returns `{ state, setState, remove }` — read
+ * `state`, write with `setState(next)`, clear with `remove()`.
+ *
+ * Reads happen only on the client (after mount), matching qwik's
+ * `useVisibleTask$({ strategy: "document-ready" })`. Cross-tab sync uses the
+ * native `storage` event for `localStorage`; `sessionStorage` (which does not
+ * emit `storage` across tabs) syncs via a `BroadcastChannel`. The channel is
+ * allocated once per mount and reused for every write/remove.
+ */
+export declare const useStorage: <T>({ storageArea, key, initialValue, channel, }: UseStorageOptions<T>) => UseStorageReturn<T>;
+export type UseLocalStorageOptions<T> = Omit<UseStorageOptions<T>, "storageArea">;
+export declare const useLocalStorage: <T>({ key, initialValue, }: UseLocalStorageOptions<T>) => UseStorageReturn<T>;
+export type UseSessionStorageOptions<T> = Omit<UseStorageOptions<T>, "storageArea">;
+export declare const useSessionStorage: <T>({ key, initialValue, }: UseSessionStorageOptions<T>) => UseStorageReturn<T>;
+//# sourceMappingURL=use-storage.d.ts.map

package/lib-types/hooks/use-storage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-storage.d.ts","sourceRoot":"","sources":["../../src/hooks/use-storage.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,iBAAiB,CAAC,CAAC,IAAI;IACjC,WAAW,EAAE,OAAO,GAAG,SAAS,CAAC;IACjC,GAAG,EAAE,MAAM,CAAC;IACZ,YAAY,EAAE,CAAC,CAAC;IAChB,6EAA6E;IAC7E,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI;IAChC,yFAAyF;IACzF,KAAK,EAAE,CAAC,CAAC;IACT,6DAA6D;IAC7D,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,wEAAwE;IACxE,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAKF;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,UAAU,GAAI,CAAC,EAAE,8CAK3B,iBAAiB,CAAC,CAAC,CAAC,KAAG,gBAAgB,CAAC,CAAC,CA8G3C,CAAC;AAEF,MAAM,MAAM,sBAAsB,CAAC,CAAC,IAAI,IAAI,CAC1C,iBAAiB,CAAC,CAAC,CAAC,EACpB,aAAa,CACd,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,CAAC,EAAE,wBAGhC,sBAAsB,CAAC,CAAC,CAAC,KAAG,gBAAgB,CAAC,CAAC,CAMhD,CAAC;AAEF,MAAM,MAAM,wBAAwB,CAAC,CAAC,IAAI,IAAI,CAC5C,iBAAiB,CAAC,CAAC,CAAC,EACpB,aAAa,CACd,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,CAAC,EAAE,wBAGlC,wBAAwB,CAAC,CAAC,CAAC,KAAG,gBAAgB,CAAC,CAAC,CAOlD,CAAC"}

package/lib-types/hooks/use-throttled-queue.d.ts

@@ -0,0 +1,32 @@
+export declare class ThrottledQueue {
+    private readonly queue;
+    private lastFinishedAt;
+    private running;
+    private destroyed;
+    private timer;
+    private readonly minInterval;
+    constructor(minInterval?: number);
+    push<T>(fn: () => Promise<T>): Promise<T>;
+    destroy(reason?: string): void;
+    private drain;
+    private scheduleNext;
+}
+/**
+ * Client-side throttled task queue.
+ *
+ * React port of qwik's `useThrottledQueue`. Qwik returned a
+ * `Signal<NoSerialize<ThrottledQueue>>` instantiated in a mount-time
+ * `useVisibleTask$`. React has no signal/serialization model, so the queue is
+ * held in a ref and created on mount via `useEffect` (which, like
+ * `useVisibleTask$`, only runs on the client). The hook returns the
+ * `ThrottledQueue` instance directly.
+ *
+ * The queue is created lazily on first client render and destroyed on unmount,
+ * rejecting any still-pending tasks.
+ *
+ * @example
+ *   const queue = useThrottledQueue(200);
+ *   await queue?.push(async () => doWork());
+ */
+export declare function useThrottledQueue(minInterval?: number): ThrottledQueue | null;
+//# sourceMappingURL=use-throttled-queue.d.ts.map

package/lib-types/hooks/use-throttled-queue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-throttled-queue.d.ts","sourceRoot":"","sources":["../../src/hooks/use-throttled-queue.tsx"],"names":[],"mappings":"AAIA,qBAAa,cAAc;IACzB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAe;IACrC,OAAO,CAAC,cAAc,CAAK;IAC3B,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,KAAK,CAA8C;IAC3D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAS;gBAEzB,WAAW,SAAM;IAI7B,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,CAAC,CAAC,CAAC;IAmBzC,OAAO,CAAC,MAAM,SAA6B,GAAG,IAAI;IAgBlD,OAAO,CAAC,KAAK;IAMb,OAAO,CAAC,YAAY;CAiBrB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,iBAAiB,CAAC,WAAW,SAAM,GAAG,cAAc,GAAG,IAAI,CA0B1E"}

package/lib-types/hooks/use-throttled-signal.d.ts

@@ -0,0 +1,47 @@
+import { type Dispatch, type SetStateAction } from "react";
+export interface UseThrottledSignalReturn<T> {
+    /** Reflects every write immediately. */
+    value: T;
+    /** Setter for `value`. Writing drives the throttled update. */
+    setValue: Dispatch<SetStateAction<T>>;
+    /** Leading + trailing edge throttled view of `value`. */
+    throttledValue: T;
+    /** `true` while the throttle cooldown window is active. */
+    isCooling: boolean;
+}
+/**
+ * Returns reactive state where writing to `value` drives a leading + trailing
+ * edge throttled update to `throttledValue`.
+ *
+ * React port of qwik's `useThrottledSignal`. Qwik's signal model does not exist
+ * in React, so where qwik returned a `{ signal, throttledSignal, isCooling }`
+ * trio of `Signal<T>`, the React idiom returns
+ * `{ value, setValue, throttledValue, isCooling }` — `value`/`setValue` is the
+ * usual `useState` pair, `throttledValue` and `isCooling` are read-only.
+ *
+ * `value` reflects every write immediately.
+ * `throttledValue` updates on the *leading edge* of each throttle window: the
+ * first write within any `interval` ms window propagates at once. Further
+ * writes within the same window are suppressed, but the most recent suppressed
+ * value is delivered on the *trailing edge* when the window expires, and a
+ * fresh window starts.
+ *
+ * `isCooling` is `true` while the throttle cooldown window is active.
+ *
+ * When `interval` is 0 or negative, `throttledValue` is updated synchronously
+ * alongside `value` (no throttling).
+ *
+ * @param initialValue - The initial value for both `value` and `throttledValue`.
+ * @param interval - Throttle interval in milliseconds.
+ *
+ * @example
+ * ```tsx
+ * const { value, setValue, throttledValue, isCooling } = useThrottledSignal(0, 200);
+ *
+ * // value updates on every mousemove
+ * // throttledValue updates at most once every 200 ms
+ * <div onMouseMove={(e) => setValue(e.clientX)} />
+ * ```
+ */
+export declare const useThrottledSignal: <T>(initialValue: T | (() => T), interval: number) => UseThrottledSignalReturn<T>;
+//# sourceMappingURL=use-throttled-signal.d.ts.map

package/lib-types/hooks/use-throttled-signal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-throttled-signal.d.ts","sourceRoot":"","sources":["../../src/hooks/use-throttled-signal.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,QAAQ,EACb,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAEf,MAAM,WAAW,wBAAwB,CAAC,CAAC;IACzC,wCAAwC;IACxC,KAAK,EAAE,CAAC,CAAC;IACT,+DAA+D;IAC/D,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IACtC,yDAAyD;IACzD,cAAc,EAAE,CAAC,CAAC;IAClB,2DAA2D;IAC3D,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,kBAAkB,GAAI,CAAC,EAClC,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,EAC3B,UAAU,MAAM,KACf,wBAAwB,CAAC,CAAC,CAiE5B,CAAC"}

package/lib-types/hooks/use-throttled-store.d.ts

@@ -0,0 +1,61 @@
+import { type Dispatch, type SetStateAction } from "react";
+export interface UseThrottledStoreReturn<T extends object> {
+    /** Reflects every write immediately. */
+    value: T;
+    /** Setter for `value`. Writing drives the throttled update. */
+    setValue: Dispatch<SetStateAction<T>>;
+    /** Leading + trailing edge throttled view of `value`. */
+    throttledValue: T;
+    /** `true` while the throttle cooldown window is active. */
+    isCooling: boolean;
+}
+/**
+ * Returns reactive struct state where writing to `value` drives a leading +
+ * trailing edge throttled update to `throttledValue`.
+ *
+ * React port of qwik's `useThrottledStore`. Qwik's store model — a mutable,
+ * deep-reactive `Proxy<T>` you mutate in place (`store.x = 1`) — does not exist
+ * in React. Where qwik returned a `{ store, throttledStore, isCooling }` trio of
+ * proxies, this port returns `{ value, setValue, throttledValue, isCooling }`:
+ * `value`/`setValue` is the usual `useState` pair, `throttledValue` and
+ * `isCooling` are read-only. To update a field, set a fresh object:
+ * `setValue((prev) => ({ ...prev, name: "Alice" }))`.
+ *
+ * Because React state is immutable, the deep-clone / key-stripping machinery the
+ * qwik twin needs to isolate the two proxies and delete stale keys is not
+ * required here — callers hand the hook fresh objects. Equality between the two
+ * stores is compared **structurally** (`es-toolkit` `isEqual`), so setting a
+ * fresh object that is deeply equal to the current `throttledValue` does not
+ * arm a throttle window.
+ *
+ * `value` reflects every write immediately.
+ * `throttledValue` updates on the *leading edge* of each throttle window: the
+ * first write within any `interval` ms window propagates at once. Further writes
+ * within the same window are suppressed, but the most recent suppressed value is
+ * delivered on the *trailing edge* when the window expires, and a fresh window
+ * starts.
+ *
+ * `isCooling` is `true` while the throttle cooldown window is active.
+ *
+ * When `interval` is 0 or negative, `throttledValue` is updated synchronously
+ * alongside `value` (no throttling).
+ *
+ * Aliasing footgun: passing a module-scope object as `initialValue` will share
+ * its nested references across every component instance. Pass a fresh object
+ * literal at the call site so updates do not leak between instances.
+ *
+ * @param initialValue - The initial value for both `value` and `throttledValue`.
+ * @param interval - Throttle interval in milliseconds.
+ *
+ * @example
+ * ```tsx
+ * const { value, setValue, throttledValue, isCooling } =
+ *   useThrottledStore({ x: 0, y: 0 }, 100);
+ *
+ * // value updates on every mousemove
+ * // throttledValue updates at most once every 100 ms
+ * <div onMouseMove={(e) => setValue({ x: e.clientX, y: e.clientY })} />
+ * ```
+ */
+export declare const useThrottledStore: <T extends object>(initialValue: T | (() => T), interval: number) => UseThrottledStoreReturn<T>;
+//# sourceMappingURL=use-throttled-store.d.ts.map

package/lib-types/hooks/use-throttled-store.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-throttled-store.d.ts","sourceRoot":"","sources":["../../src/hooks/use-throttled-store.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,QAAQ,EACb,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAGf,MAAM,WAAW,uBAAuB,CAAC,CAAC,SAAS,MAAM;IACvD,wCAAwC;IACxC,KAAK,EAAE,CAAC,CAAC;IACT,+DAA+D;IAC/D,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IACtC,yDAAyD;IACzD,cAAc,EAAE,CAAC,CAAC;IAClB,2DAA2D;IAC3D,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,eAAO,MAAM,iBAAiB,GAAI,CAAC,SAAS,MAAM,EAChD,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,EAC3B,UAAU,MAAM,KACf,uBAAuB,CAAC,CAAC,CAiE3B,CAAC"}

package/lib-types/index.d.ts

@@ -0,0 +1,63 @@
+import "@elmethis/core/tokens.css";
+export { ElmA2ui, type ElmA2uiProps } from "./components/a2ui/elm-a2ui";
+export { blockCatalog, blockComponents, blockFunctions, } from "./components/a2ui/catalog/block-catalog";
+export { ElmCodeBlock, type ElmCodeBlockProps, } from "./components/code/elm-code-block";
+export { ElmKatex, type ElmKatexProps } from "./components/code/elm-katex";
+export { ElmShikiHighlighter, type ElmShikiHighlighterProps, } from "./components/code/elm-shiki-highlighter";
+export { ElmCollapse, type ElmCollapseProps, } from "./components/containments/elm-collapse";
+export { ElmModal, type ElmModalProps, } from "./components/containments/elm-modal";
+export { ElmParallax, type ElmParallaxProps, } from "./components/containments/elm-parallax";
+export { ElmTab, ElmTabList, ElmTabPanel, ElmTabs, type ElmTabListProps, type ElmTabPanelProps, type ElmTabProps, type ElmTabsProps, } from "./components/containments/elm-tabs";
+export { ElmToggle, type ElmToggleProps, } from "./components/containments/elm-toggle";
+export { ElmTooltip, type ElmTooltipProps, } from "./components/containments/elm-tooltip";
+export { ElmBlockFallback, type ElmBlockFallbackProps, } from "./components/fallback/elm-block-fallback";
+export { ElmRectangleWave, type ElmRectangleWaveProps, } from "./components/fallback/elm-rectangle-wave";
+export { ElmUnsupportedBlock, type ElmUnsupportedBlockProps, } from "./components/fallback/elm-unsupported-block";
+export { ElmButton, type ElmButtonProps } from "./components/form/elm-button";
+export { ElmCheckbox, type ElmCheckboxProps, } from "./components/form/elm-checkbox";
+export { ElmSelect, type ElmSelectOption, type ElmSelectProps, } from "./components/form/elm-select";
+export { ElmSwitch, type ElmSwitchProps } from "./components/form/elm-switch";
+export { ElmTextArea, type ElmTextAreaProps, } from "./components/form/elm-text-area";
+export { ElmTextField, type ElmTextFieldProps, } from "./components/form/elm-text-field";
+export { ElmValidation, type ElmValidationProps, } from "./components/form/elm-validation";
+export { ElmCopyIcon, type ElmCopyIconProps, } from "./components/icon/elm-copy-icon";
+export { ElmDotLoadingIcon, type ElmDotLoadingIconProps, } from "./components/icon/elm-dot-loading-icon";
+export { ElmInlineIcon, type ElmInlineIconProps, } from "./components/icon/elm-inline-icon";
+export { ElmLanguageIcon, type ElmLanguageIconProps, } from "./components/icon/elm-language-icon";
+export { ElmMdiIcon, type ElmMdiIconProps, } from "./components/icon/elm-mdi-icon";
+export { ElmSquareLoadingIcon, type ElmSquareLoadingIconProps, } from "./components/icon/elm-square-loading-icon";
+export { ElmToggleTheme, type ElmToggleThemeProps, } from "./components/icon/elm-toggle-theme";
+export { ElmBlockImage, type ElmBlockImageProps, } from "./components/media/elm-block-image";
+export { ElmFile, type ElmFileProps } from "./components/media/elm-file";
+export { ElmBookmark, type ElmBookmarkProps, } from "./components/navigation/elm-bookmark";
+export { ElmBreadcrumb, type ElmBreadcrumbProps, } from "./components/navigation/elm-breadcrumb";
+export { ElmPageTop, type ElmPageTopProps, } from "./components/navigation/elm-page-top";
+export { ElmColorPrimitiveSample, type ElmColorPrimitiveSampleProps, } from "./components/others/elm-color-primitive-sample";
+export { ElmColorSemanticSample, type ElmColorSemanticSampleProps, } from "./components/others/elm-color-semantic-sample";
+export { ElmJarkup, type ElmJarkupProps } from "./components/others/elm-jarkup";
+export { ElmMarkdown, type ElmMarkdownProps, } from "./components/others/elm-markdown";
+export { useWordle, type UseWordleOptions, type LetterResult, type LetterStatus, type GameStatus, } from "./components/others/use-wordle";
+export * from "./components/table";
+export { ElmBlockQuote, type ElmBlockQuoteProps, } from "./components/typography/elm-block-quote";
+export { ElmCallout, type ElmCalloutProps, } from "./components/typography/elm-callout";
+export { ElmDivider, type ElmDividerProps, } from "./components/typography/elm-divider";
+export { ElmFragmentIdentifier, type ElmFragmentIdentifierProps, } from "./components/typography/elm-fragment-identifier";
+export { ElmHeading, type ElmHeadingProps, } from "./components/typography/elm-heading";
+export { ElmInlineText, type ElmInlineTextProps, } from "./components/typography/elm-inline-text";
+export { ElmList, type ElmListProps } from "./components/typography/elm-list";
+export { ElmParagraph, type ElmParagraphProps, } from "./components/typography/elm-paragraph";
+export { useAsyncState, type UseAsyncStateOptions, type UseAsyncStateReturn, } from "./hooks/use-async-state";
+export { useAutoAnimate, type UseAutoAnimateOptions, } from "./hooks/use-auto-animate";
+export { useBindableSignal } from "./hooks/use-bindable-signal";
+export { useClipboard, type UseClipboardOptions } from "./hooks/use-clipboard";
+export { useBindableStore } from "./hooks/use-bindable-store";
+export { useDebouncedSignal, type UseDebouncedSignalReturn, } from "./hooks/use-debounced-signal";
+export { useDebouncedStore } from "./hooks/use-debounced-store";
+export { useDelayedSignal, type UseDelayedSignalReturn, } from "./hooks/use-delayed-signal";
+export { THEME_CHANGE_EVENT, useElmethisTheme, } from "./hooks/use-elmethis-theme";
+export { useLocalStorage, type UseLocalStorageOptions, useSessionStorage, type UseSessionStorageOptions, } from "./hooks/use-storage";
+export { useModal, type UseModalOptions } from "./hooks/use-modal";
+export { useThrottledQueue, ThrottledQueue } from "./hooks/use-throttled-queue";
+export { useThrottledSignal, type UseThrottledSignalReturn, } from "./hooks/use-throttled-signal";
+export { useThrottledStore, type UseThrottledStoreReturn, } from "./hooks/use-throttled-store";
+//# sourceMappingURL=index.d.ts.map

package/lib-types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,28 +1,24 @@
 {
   "name": "@elmethis/react",
-  "version": "0.3.19",
+  "version": "0.4.0",
+  "description": "React component library for elmethis.",
   "publishConfig": {
     "access": "public"
   },
+  "private": false,
   "type": "module",
-  "author": "Ikuma Yamashita",
-  "repository": {
-    "type": "git",
-    "url": "git@github.com:46ki75/elmethis.git"
-  },
   "main": "./lib/index.react.mjs",
-  "react": "./lib/index.react.mjs",
-  "types": "./lib-types/index.d.ts",
   "module": "./lib/index.react.mjs",
+  "types": "./lib-types/index.d.ts",
   "exports": {
     ".": {
-      "types": "./lib-types/lib.d.ts",
+      "types": "./lib-types/index.d.ts",
       "import": {
-        "types": "./lib-types/lib.d.ts",
+        "types": "./lib-types/index.d.ts",
         "default": "./lib/index.react.mjs"
       },
       "require": {
-        "types": "./lib-types/lib.d.ts",
+        "types": "./lib-types/index.d.ts",
         "default": "./lib/index.react.cjs"
       }
     },
@@ -34,49 +30,83 @@
     "lib",
     "lib-types"
   ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "engines": {
+    "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
+  },
+  "peerDependencies": {
+    "react": ">=19",
+    "react-dom": ">=19"
+  },
   "dependencies": {
-    "@iconify-json/devicon": "^1.2.62",
-    "@iconify-json/mdi": "^1.2.3",
-    "@iconify/react": "^6.0.2",
+    "@46ki75/ikuma-theme": "^0.0.10",
+    "@a2ui/react": "^0.10.0",
+    "@a2ui/web_core": "^0.10.0",
+    "@formkit/auto-animate": "^0.9.0",
     "@mdi/js": "^7.4.47",
-    "@radix-ui/react-use-controllable-state": "^1.2.2",
+    "@radix-ui/react-use-controllable-state": "^1.2.3",
     "clsx": "^2.1.1",
+    "dompurify": "^3.4.2",
+    "es-toolkit": "^1.47.1",
     "jarkup-ts": "^0.14.0",
-    "katex": "^0.16.45",
-    "lodash-es": "^4.18.1",
-    "marked": "^18.0.0",
-    "mermaid": "^11.14.0",
-    "polished": "^4.3.1",
-    "react": "^19.2.5",
-    "react-dom": "^19.2.5",
-    "shiki": "^4.0.2"
+    "katex": "^0.17.0",
+    "marked": "^18.0.5",
+    "shiki": "^4.2.0",
+    "usehooks-ts": "^3.1.1",
+    "zod": "^3",
+    "@elmethis/core": "^0.10.0"
   },
   "devDependencies": {
-    "@copilotkit/react-core": "^1.56.2",
-    "@eslint/js": "^10.0.1",
-    "@storybook/addon-docs": "^10.3.5",
-    "@storybook/react-vite": "^10.3.5",
-    "@types/lodash-es": "^4.17.12",
-    "@types/node": "^24.12.2",
-    "@types/react": "^19.2.14",
+    "@eslint/js": "latest",
+    "@storybook/addon-docs": "^10.4.4",
+    "@storybook/react-vite": "^10.4.4",
+    "@testing-library/jest-dom": "^6.9.0",
+    "@testing-library/react": "^16.3.0",
+    "@types/katex": "^0.16.8",
+    "@types/node": "^25.7.0",
+    "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^6.0.1",
-    "eslint": "^10.2.0",
-    "eslint-plugin-react-hooks": "^7.0.1",
+    "@vitejs/plugin-react": "^6.0.2",
+    "@vitest/browser-playwright": "^4.1.8",
+    "@vitest/ui": "^4.1.8",
+    "concurrently": "^10.0.3",
+    "eslint": "^10.4.1",
+    "eslint-plugin-react-hooks": "^7.1.1",
     "eslint-plugin-react-refresh": "^0.5.2",
-    "globals": "^17.5.0",
-    "prettier": "3.8.3",
-    "storybook": "^10.3.5",
-    "typescript": "~6.0.2",
-    "typescript-eslint": "^8.58.2",
-    "vite": "^8.0.4"
+    "globals": "^17.6.0",
+    "happy-dom": "^20.10.2",
+    "playwright": "^1.60.0",
+    "prettier": "3.8.4",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7",
+    "storybook": "^10.4.4",
+    "stylelint": "^17.13.0",
+    "stylelint-config-css-modules": "^4.6.0",
+    "stylelint-config-standard": "^40.0.0",
+    "stylelint-value-no-unknown-custom-properties": "^6.1.1",
+    "typescript": "~6.0.3",
+    "typescript-eslint": "^8.61.0",
+    "vite": "^8.0.4",
+    "vitest": "^4.1.8",
+    "vitest-browser-react": "^2.2.0"
   },
   "scripts": {
-    "build": "tsc --noEmit && vite build && pnpm run build.types",
+    "build": "pnpm run build.lib && pnpm run build.types",
+    "build.lib": "vite build",
     "build.types": "tsc --project tsconfig.lib.json",
-    "lint": "eslint .",
-    "format": "prettier --write ./src",
-    "storybook": "storybook dev -p 6006 --no-open",
-    "build-storybook": "storybook build"
+    "build-storybook": "storybook build",
+    "dev": "storybook dev -p 19221 --no-open",
+    "fmt": "prettier --write ./src",
+    "fmt.check": "prettier --check ./src",
+    "lint": "eslint \"src/**/*.ts*\"",
+    "lint.css": "stylelint \"src/**/*.css\"",
+    "test": "pnpm run test.unit && pnpm run test.browser",
+    "test.unit": "vitest --run",
+    "test.browser": "vitest --run --config vitest.browser.config.ts",
+    "test.build": "pnpm run build && pnpm run build-storybook",
+    "check": "concurrently -g \"pnpm:fmt.check\" \"pnpm:lint\" \"pnpm:lint.css\" \"pnpm:test.unit\" \"pnpm:test.browser\"",
+    "check.ci": "concurrently -g \"pnpm:check\" \"pnpm:test.build\""
   }
 }