@mendylanda/ui 0.4.2 → 0.4.3-dev.68.e3417befc4d5

package/dist/sheet/provider.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from "react";
+import type { SheetController, SheetPersistence } from "./types.js";
+export interface SheetProviderProps {
+    children: ReactNode;
+    /** Supply once above the router outlet to retain managed sheets across navigation. */
+    persistence?: SheetPersistence;
+    /** Opening and layout motion is enabled by default, and respects reduced motion. */
+    animation?: boolean;
+    className?: string;
+}
+export declare function SheetProvider(props: SheetProviderProps): import("react/jsx-runtime").JSX.Element;
+/** Open persistent instances from events. Render functions run beneath the provider. */
+export declare function useSheets(): SheetController;

package/dist/sheet/provider.js

@@ -0,0 +1,156 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore, } from "react";
+import { createPortal } from "react-dom";
+import { useMendyUI } from "../customization.js";
+import { useMendyLocale } from "../locale-context.js";
+import { cn } from "../utils.js";
+import { SheetStackContext } from "./context.js";
+import { createSheetStore } from "./store.js";
+import { SheetRoot } from "./root.js";
+import { lockSheetScroll } from "./scroll-lock.js";
+import { readSheetRecords } from "./persistence.js";
+export function SheetProvider(props) {
+    // A different account/workspace must never inherit another scope's open instances.
+    return _jsx(ProviderScope, { ...props }, props.persistence?.key ?? "default");
+}
+function ProviderScope({ children, persistence, animation = true, className }) {
+    const [store] = useState(createSheetStore);
+    const [mounted, setMounted] = useState(false);
+    useLayoutEffect(() => {
+        setMounted(true);
+    }, []);
+    const [container, setContainer] = useState(null);
+    const settings = useMendyUI();
+    const { direction } = useMendyLocale();
+    const layout = useSyncExternalStore(store.subscribe, store.getLayout, store.getLayout);
+    const managed = useSyncExternalStore(store.subscribe, store.getManaged, store.getManaged);
+    const pageRef = useRef(null);
+    const persistenceRef = useRef(persistence);
+    useLayoutEffect(() => {
+        persistenceRef.current = persistence;
+    });
+    const value = useMemo(() => ({ store, container, animation, pageRef }), [store, container, animation]);
+    useLayoutEffect(() => {
+        let frame = 0;
+        const update = () => {
+            if (frame)
+                return;
+            frame = requestAnimationFrame(() => {
+                frame = 0;
+                store.setViewport(window.innerWidth);
+            });
+        };
+        store.setViewport(window.innerWidth);
+        window.addEventListener("resize", update);
+        return () => {
+            window.removeEventListener("resize", update);
+            cancelAnimationFrame(frame);
+        };
+    }, [store]);
+    useEffect(() => {
+        const config = persistenceRef.current;
+        if (!config)
+            return;
+        let storage;
+        try {
+            storage = config.storage ?? window.sessionStorage;
+            for (const record of readSheetRecords(storage.getItem(config.key))) {
+                try {
+                    const content = config.resolve(record);
+                    if (content == null)
+                        continue;
+                    store.restore({
+                        side: record.side,
+                        width: record.width,
+                        id: record.id,
+                        persist: { type: record.type, payload: record.payload },
+                        render: () => content,
+                    });
+                }
+                catch (error) {
+                    config.onError?.(error);
+                }
+            }
+        }
+        catch (error) {
+            config.onError?.(error);
+            return;
+        }
+        let last = "";
+        // Coalesce mount and pin updates, avoiding writes for viewport/layout-only changes.
+        let queued = false;
+        let disposed = false;
+        const save = () => {
+            if (queued)
+                return;
+            queued = true;
+            queueMicrotask(() => {
+                queued = false;
+                if (disposed)
+                    return;
+                try {
+                    const next = JSON.stringify({ version: 1, sheets: store.records() });
+                    if (next !== last) {
+                        storage.setItem(config.key, next);
+                        last = next;
+                    }
+                }
+                catch (error) {
+                    persistenceRef.current?.onError?.(error);
+                }
+            });
+        };
+        const unsubscribe = store.subscribe(save);
+        return () => {
+            disposed = true;
+            unsubscribe();
+        };
+    }, [store]);
+    const hasOverlay = layout.hasOverlay;
+    useEffect(() => {
+        if (!hasOverlay)
+            return;
+        return lockSheetScroll(document);
+    }, [hasOverlay]);
+    useEffect(() => {
+        const onKeyDown = (event) => {
+            const target = event.target;
+            if (event.defaultPrevented ||
+                event.repeat ||
+                event.isComposing ||
+                event.ctrlKey ||
+                event.metaKey ||
+                event.altKey ||
+                event.key.toLowerCase() !== "p" ||
+                !(target instanceof Element) ||
+                !container?.contains(target) ||
+                target.closest("input,textarea,select,[contenteditable]:not([contenteditable=false]),[role=textbox],[role=combobox],[role=menu],[role=listbox],[role=alertdialog]"))
+                return;
+            if (store.pinTop())
+                event.preventDefault();
+        };
+        document.addEventListener("keydown", onKeyDown);
+        return () => document.removeEventListener("keydown", onKeyDown);
+    }, [store, container]);
+    return (_jsxs(SheetStackContext.Provider, { value: value, children: [_jsx("div", { "data-mendy-sheet-page": "", ref: pageRef, tabIndex: -1, dir: direction, inert: hasOverlay || undefined, className: cn("mui-184ddc11e5f9", animation && "mui-55fc320dcf4a mui-f07df86364db mui-b2ed949e45a3", className), style: { paddingInlineStart: layout.startWidth, paddingInlineEnd: layout.endWidth }, children: children }), mounted &&
+                createPortal(_jsx("div", { "data-mendy-ui": "", "data-mendy-sheet-host": "", dir: direction, ref: setContainer, className: "mui-33228ff7d583 mui-992a93455c71 mui-ce13093ad8c9 mui-3eef1ce97dba", children: hasOverlay && (_jsx("div", { "data-mendy-sheet-overlay": "", "aria-hidden": "true", className: "mui-cb20bd519346 mui-747355bdc2a2 mui-ce13093ad8c9 mui-4a30330fe460", onPointerDown: (event) => {
+                            if (event.button !== 0)
+                                return;
+                            event.preventDefault();
+                            store.closeTop("outside");
+                        } })) }), settings.portalContainer ?? document.body), managed.map((entry) => (_jsx(ManagedSheet, { entry: entry }, entry.id)))] }));
+}
+const ManagedSheet = memo(function ManagedSheet({ entry }) {
+    return (_jsx(SheetRoot, { id: entry.id, defaultOpen: true, defaultPinned: entry.initialPinned, side: entry.side, width: entry.width, pinnable: entry.pinnable, children: _jsx(ManagedContent, { render: entry.render }) }));
+});
+const ManagedContent = memo(function ManagedContent({ render }) {
+    return render();
+});
+/** Open persistent instances from events. Render functions run beneath the provider. */
+export function useSheets() {
+    const stack = useContext(SheetStackContext);
+    if (!stack)
+        throw new Error("useSheets requires a SheetProvider.");
+    return stack.store;
+}

package/dist/sheet/root.d.ts

@@ -0,0 +1,22 @@
+import type { ReactNode } from "react";
+import type { SheetCloseReason, SheetSide } from "./types.js";
+export interface SheetProps {
+    children: ReactNode;
+    id?: string;
+    /** Opening sequence for route-driven sheets whose code may load out of order. */
+    order?: number;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    pinned?: boolean;
+    defaultPinned?: boolean;
+    onPinnedChange?: (pinned: boolean) => void;
+    pinnable?: boolean;
+    /** Logical end by default: right in LTR, left in RTL. */
+    side?: SheetSide;
+    /** Desired width in CSS pixels. Clamped to the available viewport. */
+    width?: number;
+    /** Return false to prevent a user/API close request. Controlled prop changes remain authoritative. */
+    onBeforeClose?: (reason: SheetCloseReason) => boolean | void;
+}
+export declare function SheetRoot(props: SheetProps): import("react/jsx-runtime").JSX.Element;

package/dist/sheet/root.js

@@ -0,0 +1,132 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useContext, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore, } from "react";
+import * as Dialog from "@radix-ui/react-dialog";
+import { SheetControlsContext, SheetInstanceContext, SheetStackContext } from "./context.js";
+import { SheetProvider } from "./provider.js";
+import { CloseConfirmation } from "./sheet-guard.js";
+export function SheetRoot(props) {
+    const stack = useContext(SheetStackContext);
+    return stack ? (_jsx(SheetInstance, { ...props })) : (_jsx(SheetProvider, { children: _jsx(SheetInstance, { ...props }) }));
+}
+function SheetInstance({ children, id: explicitId, order, open: controlledOpen, defaultOpen = false, onOpenChange, pinned: controlledPinned, defaultPinned = false, onPinnedChange, pinnable = true, side = "end", width: requestedWidth = 520, onBeforeClose, }) {
+    const stack = useContext(SheetStackContext);
+    const generatedId = useId();
+    const id = explicitId ?? generatedId;
+    const width = Number.isFinite(requestedWidth) ? Math.max(240, requestedWidth) : 520;
+    const [descriptionId, setDescriptionId] = useState();
+    const registerDescription = useCallback((id) => {
+        setDescriptionId(id);
+        return () => setDescriptionId((current) => (current === id ? undefined : current));
+    }, []);
+    const [ownOpen, setOwnOpen] = useState(defaultOpen);
+    const [ownPinned, setOwnPinned] = useState(defaultPinned);
+    const open = controlledOpen ?? ownOpen;
+    const pinned = controlledPinned ?? ownPinned;
+    const getLayout = useCallback(() => stack.store.getSheet(id), [stack.store, id]);
+    const layout = useSyncExternalStore(stack.store.subscribe, getLayout, getLayout);
+    const contentRef = useRef(null);
+    const triggerRef = useRef(null);
+    const guards = useRef(new Map());
+    const [confirmation, setConfirmation] = useState(null);
+    const registerGuard = useCallback((read) => {
+        const key = Symbol();
+        guards.current.set(key, read);
+        return () => {
+            guards.current.delete(key);
+        };
+    }, []);
+    const setPinned = useCallback((next) => {
+        if (pinned === next)
+            return;
+        if (controlledPinned === undefined)
+            setOwnPinned(next);
+        onPinnedChange?.(next);
+    }, [pinned, controlledPinned, onPinnedChange]);
+    const setOpen = useCallback((next) => {
+        if (open === next)
+            return;
+        if (!next) {
+            setConfirmation(null);
+            setPinned(false);
+        }
+        if (controlledOpen === undefined)
+            setOwnOpen(next);
+        onOpenChange?.(next);
+    }, [open, controlledOpen, onOpenChange, setPinned]);
+    const requestClose = useCallback((reason = "programmatic") => {
+        if (onBeforeClose?.(reason) === false)
+            return;
+        for (const read of guards.current.values()) {
+            const guard = read();
+            if (guard.dirty) {
+                setConfirmation({ messages: guard.messages });
+                return;
+            }
+        }
+        setOpen(false);
+    }, [onBeforeClose, setOpen]);
+    // Stable handlers read the most recent committed props, without resubscribing the stack.
+    const actions = useRef({ requestClose, setPinned, setOpen });
+    useLayoutEffect(() => {
+        actions.current = { requestClose, setPinned, setOpen };
+    });
+    useLayoutEffect(() => stack.store.register(id, {
+        reopen: () => actions.current.setOpen(true),
+        close: (reason) => actions.current.requestClose(reason),
+        pin: (next) => actions.current.setPinned(next),
+        focus: () => contentRef.current?.focus({ preventScroll: true }),
+    }), [stack.store, id]);
+    useLayoutEffect(() => {
+        if (open)
+            stack.store.update(id, { side, width, pinned, pinnable, requestedOrder: order });
+        else
+            stack.store.remove(id);
+    }, [stack.store, id, open, side, width, pinned, pinnable, order]);
+    const controls = useMemo(() => ({
+        open,
+        pinned,
+        docked: layout?.pinned ?? false,
+        close: (reason) => actions.current.requestClose(reason),
+        pin: () => stack.store.pin(id),
+        unpin: () => actions.current.setPinned(false),
+        registerGuard,
+    }), [open, pinned, layout?.pinned, stack.store, id, registerGuard]);
+    const value = useMemo(() => ({
+        id,
+        open,
+        pinned,
+        pinnable,
+        side,
+        width,
+        layout,
+        descriptionId,
+        registerDescription,
+        contentRef,
+        triggerRef,
+        requestClose,
+        setOpen,
+        setPinned,
+        registerGuard,
+    }), [
+        id,
+        open,
+        pinned,
+        pinnable,
+        side,
+        width,
+        layout,
+        requestClose,
+        setOpen,
+        setPinned,
+        registerGuard,
+        descriptionId,
+        registerDescription,
+    ]);
+    return (_jsx(SheetControlsContext.Provider, { value: controls, children: _jsxs(SheetInstanceContext.Provider, { value: value, children: [_jsx(Dialog.Root, { open: open, modal: false, onOpenChange: (next) => (next ? setOpen(true) : requestClose()), children: children }), _jsx(CloseConfirmation, { open: open && confirmation !== null, messages: confirmation?.messages, onCancel: () => setConfirmation(null), onDiscard: () => setOpen(false), onPin: layout?.canPin && !pinned
+                        ? () => {
+                            setPinned(true);
+                            setConfirmation(null);
+                        }
+                        : undefined })] }) }));
+}

package/dist/sheet/scroll-lock.d.ts

@@ -0,0 +1 @@
+export declare function lockSheetScroll(document: Document): () => void;

package/dist/sheet/scroll-lock.js

@@ -0,0 +1,16 @@
+// Multiple independent providers may overlap. Closing one must not unlock another's page.
+const locks = new WeakMap();
+export function lockSheetScroll(document) {
+    const existing = locks.get(document);
+    const lock = existing ?? { count: 0, overflow: document.body.style.overflow };
+    lock.count += 1;
+    locks.set(document, lock);
+    document.body.style.overflow = "hidden";
+    return () => {
+        lock.count -= 1;
+        if (lock.count)
+            return;
+        document.body.style.overflow = lock.overflow;
+        locks.delete(document);
+    };
+}

package/dist/sheet/sheet-guard.d.ts

@@ -0,0 +1,10 @@
+import type { SheetGuardMessages } from "./context.js";
+/** Inline messages are safe. Dirty form changes do not rerender the sheet stack. */
+export declare function useSheetCloseGuard(dirty: boolean, messages?: SheetGuardMessages): void;
+export declare function CloseConfirmation({ open, messages, onCancel, onDiscard, onPin, }: {
+    open: boolean;
+    messages?: SheetGuardMessages;
+    onCancel: () => void;
+    onDiscard: () => void;
+    onPin?: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/sheet/sheet-guard.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext, useLayoutEffect, useRef } from "react";
+import * as AlertDialog from "@radix-ui/react-alert-dialog";
+import { Button } from "../customization.js";
+import { useMendyLocale } from "../locale-context.js";
+import { SheetControlsContext, SheetStackContext } from "./context.js";
+/** Inline messages are safe. Dirty form changes do not rerender the sheet stack. */
+export function useSheetCloseGuard(dirty, messages) {
+    const registerGuard = useContext(SheetControlsContext)?.registerGuard;
+    const current = useRef({ dirty, messages });
+    useLayoutEffect(() => {
+        current.current = { dirty, messages };
+    });
+    useLayoutEffect(() => registerGuard?.(() => current.current), [registerGuard]);
+}
+export function CloseConfirmation({ open, messages, onCancel, onDiscard, onPin, }) {
+    const { t, direction } = useMendyLocale();
+    const stack = useContext(SheetStackContext);
+    return (_jsx(AlertDialog.Root, { open: open, onOpenChange: (next) => {
+            if (!next)
+                onCancel();
+        }, children: _jsxs(AlertDialog.Portal, { container: stack.container, children: [_jsx(AlertDialog.Overlay, { "data-mendy-ui": "", className: "mui-cb20bd519346 mui-992a93455c71 mui-ce13093ad8c9 mui-e749b7f89462 mui-8e5a84e37552" }), _jsxs(AlertDialog.Content, { "data-mendy-ui": "", dir: direction, className: "mui-cb20bd519346 mui-992a93455c71 mui-69b8e049976d mui-4e45f4841abb mui-d0957da54446 mui-0f2a693e93e2 mui-42be1194a64d mui-7b7574448a48 mui-90fc3ec35a37 mui-49abc543ea42 mui-4f1a55de40bc mui-e593c38256e0 mui-c432836760e3 mui-5bd2afe89f0b mui-0d4ca75de41c mui-b30fc56058b6", style: { transform: `translate(${direction === "rtl" ? "50%" : "-50%"}, -50%)` }, children: [_jsx(AlertDialog.Title, { className: "mui-035bd245837f mui-87e86ce38eaf", children: messages?.title ?? t("sheetUnsavedTitle") }), _jsx(AlertDialog.Description, { className: "mui-c74ab393b96d mui-35f35c41d134", children: messages?.description ??
+                                t(onPin ? "sheetUnsavedPinDescription" : "sheetUnsavedDescription") }), _jsxs("div", { className: "mui-222f930b8752 mui-faa8a23c68f6 mui-307644c34db6 mui-074569488cca", children: [_jsx(AlertDialog.Cancel, { asChild: true, children: _jsx(Button, { variant: "outline", children: messages?.cancel ?? t("sheetKeepEditing") }) }), _jsx(AlertDialog.Action, { asChild: true, children: _jsx(Button, { variant: "destructive", onClick: onDiscard, children: messages?.confirm ?? t("sheetDiscard") }) }), onPin && (_jsx(AlertDialog.Action, { asChild: true, children: _jsx(Button, { onClick: onPin, children: t("sheetPin") }) }))] })] })] }) }));
+}

package/dist/sheet/store.d.ts

@@ -0,0 +1,33 @@
+import type { SheetEntry, StackLayout } from "./layout.js";
+import type { OpenSheetOptions, SheetCloseReason, SheetLayout, SheetRecord } from "./types.js";
+type Handlers = {
+    close: (reason: SheetCloseReason) => void;
+    reopen: () => void;
+    pin: (pinned: boolean) => void;
+    focus: () => void;
+};
+export interface ManagedSheetOptions extends OpenSheetOptions {
+    initialPinned: boolean;
+}
+export declare function createSheetStore(): {
+    subscribe(listener: () => void): () => void;
+    getLayout: () => StackLayout;
+    getSheet: (id: string) => SheetLayout | undefined;
+    getManaged: () => readonly ManagedSheetOptions[];
+    setViewport(width: number): void;
+    register(id: string, callbacks: Handlers): () => void;
+    update(id: string, config: Omit<SheetEntry, "id" | "order" | "pinOrder">): void;
+    remove(id: string): void;
+    close(id: string, reason?: SheetCloseReason): void;
+    closeTop(reason?: SheetCloseReason): void;
+    pin(id: string): void;
+    unpin(id: string): void;
+    pinTop(): boolean;
+    focusTop(): boolean;
+    restore(options: OpenSheetOptions): void;
+    open(options: OpenSheetOptions): void;
+    removeManaged(id: string): void;
+    records(): SheetRecord[];
+};
+export type SheetStore = ReturnType<typeof createSheetStore>;
+export {};

package/dist/sheet/store.js

@@ -0,0 +1,155 @@
+import { layoutSheets } from "./layout.js";
+const EMPTY_MANAGED = [];
+export function createSheetStore() {
+    const entries = new Map();
+    const handlers = new Map();
+    const listeners = new Set();
+    let managed = EMPTY_MANAGED;
+    let viewport = 0;
+    let order = 0;
+    let layout = layoutSheets([], viewport);
+    function emit() {
+        for (const listener of listeners)
+            listener();
+    }
+    function recalculate() {
+        const next = layoutSheets([...entries.values()], viewport);
+        // Keep individual snapshots referentially stable for useSyncExternalStore.
+        const stable = new Map();
+        for (const [id, value] of next.sheets) {
+            const previous = layout.sheets.get(id);
+            stable.set(id, previous &&
+                Object.keys(value).every((key) => value[key] === previous[key])
+                ? previous
+                : value);
+        }
+        if (layout.startWidth === next.startWidth &&
+            layout.endWidth === next.endWidth &&
+            layout.hasOverlay === next.hasOverlay &&
+            layout.sheets.size === stable.size &&
+            [...stable].every(([id, value]) => layout.sheets.get(id) === value))
+            return;
+        layout = { ...next, sheets: stable };
+        emit();
+    }
+    const api = {
+        subscribe(listener) {
+            listeners.add(listener);
+            return () => {
+                listeners.delete(listener);
+            };
+        },
+        getLayout: () => layout,
+        getSheet: (id) => layout.sheets.get(id),
+        getManaged: () => managed,
+        setViewport(width) {
+            if (width === viewport)
+                return;
+            viewport = width;
+            recalculate();
+        },
+        register(id, callbacks) {
+            handlers.set(id, callbacks);
+            return () => {
+                if (handlers.get(id) === callbacks) {
+                    handlers.delete(id);
+                    entries.delete(id);
+                    recalculate();
+                }
+            };
+        },
+        update(id, config) {
+            const previous = entries.get(id);
+            if (previous &&
+                Object.keys(config).every((key) => previous[key] === config[key]))
+                return;
+            const nextOrder = config.requestedOrder ?? previous?.order ?? ++order;
+            entries.set(id, {
+                ...config,
+                id,
+                order: nextOrder,
+                pinOrder: config.pinned ? (previous?.pinned ? previous.pinOrder : ++order) : 0,
+            });
+            order = Math.max(order, nextOrder);
+            recalculate();
+        },
+        remove(id) {
+            if (entries.delete(id))
+                recalculate();
+        },
+        close(id, reason = "programmatic") {
+            handlers.get(id)?.close(reason);
+        },
+        closeTop(reason = "programmatic") {
+            const top = [...layout.sheets].find(([, value]) => value.top);
+            if (top)
+                handlers.get(top[0])?.close(reason);
+        },
+        pin(id) {
+            if (layout.sheets.get(id)?.canPin)
+                handlers.get(id)?.pin(true);
+        },
+        unpin(id) {
+            handlers.get(id)?.pin(false);
+        },
+        pinTop() {
+            const top = [...layout.sheets].find(([, value]) => value.top && value.canPin && !value.pinned);
+            if (!top)
+                return false;
+            api.pin(top[0]);
+            return true;
+        },
+        focusTop() {
+            const top = [...layout.sheets].find(([, value]) => value.top);
+            if (top)
+                handlers.get(top[0])?.focus();
+            return Boolean(top);
+        },
+        restore(options) {
+            if (managed.some((entry) => entry.id === options.id))
+                return;
+            managed = [...managed, { ...options, initialPinned: true }];
+            emit();
+        },
+        open(options) {
+            if (entries.has(options.id)) {
+                const existing = entries.get(options.id);
+                entries.set(options.id, { ...existing, order: ++order });
+                recalculate();
+                handlers.get(options.id)?.focus();
+                return;
+            }
+            if (managed.some((entry) => entry.id === options.id)) {
+                handlers.get(options.id)?.reopen();
+                return;
+            }
+            managed = [...managed, { ...options, initialPinned: false }];
+            emit();
+        },
+        removeManaged(id) {
+            if (entries.has(id))
+                return;
+            if (!managed.some((entry) => entry.id === id))
+                return;
+            managed = managed.filter((entry) => entry.id !== id);
+            emit();
+        },
+        records() {
+            return managed
+                .flatMap((entry) => {
+                const state = entries.get(entry.id);
+                if (!entry.persist || !state?.pinned)
+                    return [];
+                return [
+                    {
+                        pinOrder: state.pinOrder,
+                        record: { id: entry.id, ...entry.persist, side: state.side, width: state.width },
+                    },
+                ];
+            })
+                .sort((a, b) => a.pinOrder - b.pinOrder)
+                .map(({ record }) => record);
+        },
+    };
+    return api;
+}

package/dist/sheet/types.d.ts

@@ -0,0 +1,48 @@
+import type { ReactNode } from "react";
+export type SheetSide = "start" | "end";
+export type SheetCloseReason = "close-button" | "escape" | "outside" | "programmatic";
+export type SheetJson = null | boolean | number | string | SheetJson[] | {
+    [key: string]: SheetJson;
+};
+/** Only identifiers needed to fetch a record again. Form drafts are never saved automatically. */
+export interface SheetRecord {
+    id: string;
+    type: string;
+    payload?: SheetJson;
+}
+export interface SheetPersistence {
+    /** Scope this key to the signed-in user and workspace. Changing it resets managed sheets. */
+    key: string;
+    /** Defaults to sessionStorage. Access is deferred until mount. */
+    storage?: Pick<Storage, "getItem" | "setItem">;
+    /** Return sheet content, or null for records that no longer exist or are accessible. */
+    resolve: (record: SheetRecord) => ReactNode;
+    onError?: (error: unknown) => void;
+}
+export interface OpenSheetOptions {
+    /** Opening an existing id brings that instance forward without losing its state. */
+    id: string;
+    render: () => ReactNode;
+    side?: SheetSide;
+    width?: number;
+    pinnable?: boolean;
+    /** Opt this instance into reload restoration. */
+    persist?: Omit<SheetRecord, "id">;
+}
+export interface SheetController {
+    open: (options: OpenSheetOptions) => void;
+    /** Uses the same unsaved-changes guard as the close button. */
+    close: (id: string) => void;
+    closeTop: () => void;
+    pin: (id: string) => void;
+    unpin: (id: string) => void;
+}
+export interface SheetLayout {
+    offset: number;
+    width: number;
+    pinned: boolean;
+    covered: boolean;
+    top: boolean;
+    canPin: boolean;
+    modal: boolean;
+}

package/dist/sheet/types.js

@@ -0,0 +1 @@
+export {};

package/dist/sheet/use-sheet-focus.d.ts

@@ -0,0 +1,6 @@
+import type { ComponentProps } from "react";
+import type * as Dialog from "@radix-ui/react-dialog";
+export declare function useSheetFocus({ onOpenAutoFocus, onCloseAutoFocus, }: Pick<ComponentProps<typeof Dialog.Content>, "onOpenAutoFocus" | "onCloseAutoFocus">): {
+    onOpen(event: Event): void;
+    onClose(event: Event): void;
+};