entangle-ui 0.8.2 → 0.10.0

package/dist/esm/components/feedback/CommandPalette/fuzzySearch.js

@@ -0,0 +1,86 @@
+/**
+ * Score how well `query` matches `target`. Higher = better. Zero = no match.
+ *
+ * Heuristics, in priority order:
+ *   1. Exact case-insensitive match (1000).
+ *   2. Target starts with the query (800 + length bonus).
+ *   3. Target contains the query as a contiguous substring (500 + position bonus).
+ *   4. Subsequence match: every query char appears in target in order; bonuses
+ *      for consecutive matches, word-boundary matches, and earlier positions.
+ *
+ * @example
+ * ```ts
+ * fuzzyScore('opn', 'open file')  // > 0, subsequence match
+ * fuzzyScore('zzz', 'open file')  // 0
+ * ```
+ */
+function fuzzyScore(query, target) {
+    if (query === '')
+        return 1;
+    if (target === '')
+        return 0;
+    const q = query.toLowerCase();
+    const t = target.toLowerCase();
+    if (q === t)
+        return 1000;
+    if (t.startsWith(q))
+        return 800 + Math.max(0, 50 - target.length);
+    const containsAt = t.indexOf(q);
+    if (containsAt !== -1)
+        return 500 - containsAt + Math.max(0, 30 - target.length);
+    let score = 0;
+    let qi = 0;
+    let lastMatch = -2;
+    for (let ti = 0; ti < t.length && qi < q.length; ti++) {
+        const ch = t[ti];
+        if (ch === q[qi]) {
+            // Earlier matches contribute more.
+            score += Math.max(1, 30 - ti);
+            if (lastMatch === ti - 1) {
+                score += 25;
+            }
+            // Bonus when the match begins a "word" (after space/-/_/.)
+            const prev = ti > 0 ? t[ti - 1] : '';
+            if (ti === 0 ||
+                prev === ' ' ||
+                prev === '-' ||
+                prev === '_' ||
+                prev === '.') {
+                score += 20;
+            }
+            lastMatch = ti;
+            qi++;
+        }
+    }
+    if (qi !== q.length)
+        return 0;
+    return score;
+}
+/**
+ * Score a list of items against a query. Items with score 0 are dropped, the
+ * rest are sorted by descending score. The `getStrings` accessor returns one
+ * or more strings per item to score against; the highest-scoring string wins.
+ */
+function fuzzyFilter(query, items, getStrings) {
+    if (query === '') {
+        return items.map(item => ({ item, score: 1 }));
+    }
+    const result = [];
+    for (const item of items) {
+        const strings = getStrings(item);
+        let best = 0;
+        for (const s of strings) {
+            const score = fuzzyScore(query, s);
+            if (score > best)
+                best = score;
+        }
+        if (best > 0) {
+            result.push({ item, score: best });
+        }
+    }
+    result.sort((a, b) => b.score - a.score);
+    return result;
+}
+
+export { fuzzyFilter, fuzzyScore };
+//# sourceMappingURL=fuzzySearch.js.map

package/dist/esm/components/feedback/CommandPalette/fuzzySearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fuzzySearch.js","sources":["../../../../../../src/components/feedback/CommandPalette/fuzzySearch.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/esm/components/feedback/CommandPalette/useRecentItems.js

@@ -0,0 +1,65 @@
+"use client";
+import { useState, useEffect, useCallback } from 'react';
+
+function readStorage(key) {
+    if (typeof window === 'undefined')
+        return [];
+    try {
+        const raw = window.localStorage.getItem(key);
+        if (!raw)
+            return [];
+        const parsed = JSON.parse(raw);
+        if (Array.isArray(parsed)) {
+            return parsed.filter((v) => typeof v === 'string');
+        }
+        return [];
+    }
+    catch {
+        return [];
+    }
+}
+function writeStorage(key, ids) {
+    if (typeof window === 'undefined')
+        return;
+    try {
+        window.localStorage.setItem(key, JSON.stringify(ids));
+    }
+    catch {
+        // localStorage may be unavailable (private mode, full quota); silently ignore.
+    }
+}
+/**
+ * Track recently selected command ids. Backed by localStorage when
+ * `storageKey` is provided; otherwise the list is in-memory only.
+ */
+function useRecentItems({ storageKey, maxRecent = 5, }) {
+    const [recentIds, setRecentIds] = useState(() => storageKey ? readStorage(storageKey).slice(0, maxRecent) : []);
+    // Re-read storage if the key changes after mount. External-system sync
+    // (localStorage), so setState in the effect is the correct pattern.
+    useEffect(() => {
+        if (storageKey) {
+            // eslint-disable-next-line react-hooks/set-state-in-effect
+            setRecentIds(readStorage(storageKey).slice(0, maxRecent));
+        }
+        else {
+            setRecentIds([]);
+        }
+    }, [storageKey, maxRecent]);
+    const pushRecent = useCallback((id) => {
+        setRecentIds(prev => {
+            const next = [id, ...prev.filter(v => v !== id)].slice(0, maxRecent);
+            if (storageKey)
+                writeStorage(storageKey, next);
+            return next;
+        });
+    }, [storageKey, maxRecent]);
+    const clearRecent = useCallback(() => {
+        setRecentIds([]);
+        if (storageKey)
+            writeStorage(storageKey, []);
+    }, [storageKey]);
+    return { recentIds, pushRecent, clearRecent };
+}
+
+export { useRecentItems };
+//# sourceMappingURL=useRecentItems.js.map

package/dist/esm/components/feedback/CommandPalette/useRecentItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRecentItems.js","sources":["../../../../../../src/components/feedback/CommandPalette/useRecentItems.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAiBA;;AACqC;AACnC;;AAEE;AAAU;;AAEV;AACE;;AAEF;;AACA;AACA;;AAEJ;AAEA;;;AAEE;AACE;;AACA;;;AAGJ;AAEA;;;AAGG;AACG;AAIJ;;;;;;AASI;;;;;AAIJ;AAEA;;;AAIM;AAAgB;AAChB;AACF;AACF;AAIF;;AAEE;AAAgB;AAClB;AAEA;AACF;;"}

package/dist/esm/components/feedback/Dialog/Dialog.js

@@ -2,11 +2,11 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useId, useRef, useCallback, createContext, useContext } from 'react';
 import { createPortal } from 'react-dom';
-import { overlayRecipe, dialogPanelRecipe } from './Dialog.css.js';
-import { useDialogAnimation } from './useDialogAnimation.js';
 import { useFocusTrap } from '../../../hooks/useFocusTrap/useFocusTrap.js';
 import { useMergedRef } from '../../../hooks/useMergedRef/useMergedRef.js';
 import { cx } from '../../../utils/cx.js';
+import { overlayRecipe, dialogPanelRecipe } from './Dialog.css.js';
+import { useDialogAnimation } from './useDialogAnimation.js';
 
 // --- Context ---
 const DialogContext = /*#__PURE__*/ createContext(null);
@@ -74,7 +74,10 @@ const Dialog = ({ open, onClose, size = 'md', title, description, closeOnOverlay
         titleId,
         descriptionId,
     };
-    const dialogContent = (jsxs(DialogContext.Provider, { value: contextValue, children: [showOverlay && (jsx("div", { className: overlayRecipe({ closing }), onClick: handleOverlayClick, "data-testid": testId ? `${testId}-overlay` : undefined })), jsxs("div", { ref: setPanelRef, role: "dialog", "aria-modal": "true", "aria-labelledby": title ? titleId : undefined, "aria-describedby": description ? descriptionId : undefined, tabIndex: -1, className: cx(dialogPanelRecipe({ size, closing }), className), style: style, id: id, "data-testid": testId, onKeyDown: handleKeyDown, ...rest, children: [title && (jsx("span", { id: titleId, style: { display: 'none' }, children: title })), description && (jsx("span", { id: descriptionId, style: { display: 'none' }, children: description })), children] })] }));
+    const dialogContent = (jsxs(DialogContext.Provider, { value: contextValue, children: [showOverlay && (
+            // Decorative backdrop: pointer users can click to dismiss, while
+            // keyboard users dismiss via Escape handled on the dialog panel.
+            jsx("div", { "aria-hidden": "true", className: overlayRecipe({ closing }), onClick: handleOverlayClick, "data-testid": testId ? `${testId}-overlay` : undefined })), jsxs("div", { ref: setPanelRef, role: "dialog", "aria-modal": "true", "aria-labelledby": title ? titleId : undefined, "aria-describedby": description ? descriptionId : undefined, tabIndex: -1, className: cx(dialogPanelRecipe({ size, closing }), className), style: style, id: id, "data-testid": testId, onKeyDown: handleKeyDown, ...rest, children: [title && (jsx("span", { id: titleId, style: { display: 'none' }, children: title })), description && (jsx("span", { id: descriptionId, style: { display: 'none' }, children: description })), children] })] }));
     if (portal) {
         return createPortal(dialogContent, document.body);
     }

package/dist/esm/components/feedback/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../../../../src/components/feedback/Dialog/Dialog.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;AAiBA;AAEA;;AAKE;;AAEE;;AAIF;AACF;AAEA;AAEA;;;;;;;;;;;;;;;;;;AAkBG;AACI;AAoBL;AACA;AACA;AACA;AAEA;;;;AAIC;;AAGC;AACA;AACD;;AAID;;;;AAKM;;;;;;AASN;;AAGM;;AAEJ;AAIF;AAAc;AAEd;;;;;AAMA;;;;AA2CA;AACF;AAEA;;"}
+{"version":3,"file":"Dialog.js","sources":["../../../../../../src/components/feedback/Dialog/Dialog.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;AAoBA;AAEA;;AAKE;;AAEE;;AAIF;AACF;AAEA;AAEA;;;;;;;;;;;;;;;;;;AAkBG;AACI;AAoBL;AACA;AACA;AACA;AAEA;;;;AAIC;;AAGC;AACA;AACD;;AAID;;;;AAKM;;;;;;AASN;;AAGM;;AAEJ;AAIF;AAAc;AAEd;;;;;AAMA;;;AAKM;;;;AA6CN;AACF;AAEA;;"}

package/dist/esm/components/feedback/Dialog/DialogBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogBody.js","sources":["../../../../../../src/components/feedback/Dialog/DialogBody.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAOA;AAEA;;;;;;;;;AASG;;;AAoBH;AAEA;;"}
+{"version":3,"file":"DialogBody.js","sources":["../../../../../../src/components/feedback/Dialog/DialogBody.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAUA;AAEA;;;;;;;;;AASG;;;AAoBH;AAEA;;"}

package/dist/esm/components/feedback/Dialog/DialogClose.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogClose.js","sources":["../../../../../../src/components/feedback/Dialog/DialogClose.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;AAUA;;;;;;;;;AASG;;AAED;AAEA;AACE;;AAEE;;AAEH;AACH;AAEA;;"}
+{"version":3,"file":"DialogClose.js","sources":["../../../../../../src/components/feedback/Dialog/DialogClose.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;AAWA;;;;;;;;;AASG;;AAED;AAEA;AACE;;AAEE;;AAEH;AACH;AAEA;;"}

package/dist/esm/components/feedback/Dialog/DialogFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogFooter.js","sources":["../../../../../../src/components/feedback/Dialog/DialogFooter.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAOA;AAEA;;;;;;;;;;AAUG;AACI;AASL;AAWF;AAEA;;"}
+{"version":3,"file":"DialogFooter.js","sources":["../../../../../../src/components/feedback/Dialog/DialogFooter.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAUA;AAEA;;;;;;;;;;AAUG;AACI;AASL;AAWF;AAEA;;"}

package/dist/esm/components/feedback/Dialog/DialogHeader.js

@@ -1,7 +1,8 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { useDialogContext } from './Dialog.js';
+import { CloseIcon } from '../../Icons/CloseIcon.js';
 import { cx } from '../../../utils/cx.js';
+import { useDialogContext } from './Dialog.js';
 import { dialogHeaderContentStyle, dialogTitleStyle, dialogDescriptionStyle, dialogCloseButtonStyle, dialogHeaderStyle } from './Dialog.css.js';
 
 // --- Component ---
@@ -18,7 +19,7 @@ import { dialogHeaderContentStyle, dialogTitleStyle, dialogDescriptionStyle, dia
  */
 const DialogHeader = ({ children, showClose = true, description, className, style, testId, ref, ...rest }) => {
     const { onClose, titleId, descriptionId } = useDialogContext();
-    return (jsxs("div", { ref: ref, className: cx(dialogHeaderStyle, className), style: style, "data-testid": testId, ...rest, children: [jsxs("div", { className: dialogHeaderContentStyle, children: [jsx("div", { id: titleId, className: dialogTitleStyle, children: children }), description && (jsx("div", { id: descriptionId, className: dialogDescriptionStyle, children: description }))] }), showClose && (jsx("button", { type: "button", onClick: onClose, "aria-label": "Close dialog", className: dialogCloseButtonStyle, "data-testid": testId ? `${testId}-close` : undefined, children: jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M1 1L11 11M11 1L1 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) }))] }));
+    return (jsxs("div", { ref: ref, className: cx(dialogHeaderStyle, className), style: style, "data-testid": testId, ...rest, children: [jsxs("div", { className: dialogHeaderContentStyle, children: [jsx("div", { id: titleId, className: dialogTitleStyle, children: children }), description && (jsx("div", { id: descriptionId, className: dialogDescriptionStyle, children: description }))] }), showClose && (jsx("button", { type: "button", onClick: onClose, "aria-label": "Close dialog", className: dialogCloseButtonStyle, "data-testid": testId ? `${testId}-close` : undefined, children: jsx(CloseIcon, { size: "sm", decorative: true }) }))] }));
 };
 DialogHeader.displayName = 'DialogHeader';
 

package/dist/esm/components/feedback/Dialog/DialogHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"DialogHeader.js","sources":["../../../../../../src/components/feedback/Dialog/DialogHeader.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;AAcA;AAEA;;;;;;;;;;AAUG;AACI;;AAYL;AA4CF;AAEA;;"}
+{"version":3,"file":"DialogHeader.js","sources":["../../../../../../src/components/feedback/Dialog/DialogHeader.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAkBA;AAEA;;;;;;;;;;AAUG;AACI;;;AA2CP;AAEA;;"}

package/dist/esm/components/feedback/Dialog/useDialogAnimation.js

@@ -20,6 +20,10 @@ function useDialogAnimation({ open, panelRef, initialFocusRef, }) {
         if (open) {
             // Opening: capture previous focus, mount immediately
             previousFocusRef.current = document.activeElement;
+            // Mount/closing state is driven by the `open` prop and gates a timed
+            // enter/exit animation (delayed unmount below), so it must live in an
+            // effect rather than be derived during render.
+            // eslint-disable-next-line react-hooks/set-state-in-effect
             setClosing(false);
             setMounted(true);
             wasOpenRef.current = true;
@@ -44,7 +48,9 @@ function useDialogAnimation({ open, panelRef, initialFocusRef, }) {
                     previousFocusRef.current = null;
                 }
             }, delay);
-            return () => clearTimeout(timer);
+            return () => {
+                clearTimeout(timer);
+            };
         }
         return undefined;
     }, [open]);
@@ -69,7 +75,9 @@ function useDialogAnimation({ open, panelRef, initialFocusRef, }) {
                 }
             }
         }, 0);
-        return () => clearTimeout(timer);
+        return () => {
+            clearTimeout(timer);
+        };
     }, [open, mounted, initialFocusRef, panelRef]);
     return { mounted, closing };
 }

package/dist/esm/components/feedback/Dialog/useDialogAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDialogAnimation.js","sources":["../../../../../../src/components/feedback/Dialog/useDialogAnimation.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAiBA;;;;;;;AAOG;AACG;;;AAOJ;AACA;;;;AAKI;;;AAGA;;AACK;;;;;AAKL;;AAEA;AAEE;AACA;;AAEF;;;;AAKE;AACE;AACA;;;AAGJ;;AAEF;AACF;;;AAIE;;AAEA;AACE;AACE;;;AAEA;;;;;;;;;;;;AAaJ;;AAGF;AACF;;"}
+{"version":3,"file":"useDialogAnimation.js","sources":["../../../../../../src/components/feedback/Dialog/useDialogAnimation.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAqBA;;;;;;;AAOG;AACG;;;AAOJ;AACA;;;;AAKI;;;;;;;AAOA;;AACK;;;;;AAKL;;AAEA;AAEE;AACA;;AAEF;;;;AAKE;AACE;AACA;;;AAGJ;;AAEA;;AAEF;AACF;;;AAIE;;AAEA;AACE;AACE;;;AAEA;;;;;;;;;;;;AAYJ;;AAEA;;AAGF;AACF;;"}

package/dist/esm/components/feedback/Drawer/Drawer.css.js

@@ -0,0 +1,17 @@
+import './../../../assets/src/components/feedback/Drawer/Drawer.css.ts.vanilla-CLPTOUrA.css';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+var DRAWER_ANIMATION_MS = 220;
+var DRAWER_SIZE_MAP = {sm:'280px',md:'360px',lg:'480px',xl:'640px'};
+var drawerBodyStyle = 'Drawer_drawerBodyStyle__x57sw1x';
+var drawerCloseButtonStyle = 'Drawer_drawerCloseButtonStyle__x57sw113';
+var drawerDescriptionStyle = 'Drawer_drawerDescriptionStyle__x57sw1w';
+var drawerFooterRecipe = createRuntimeFn({defaultClassName:'Drawer_drawerFooterRecipe__x57sw1y',variantClassNames:{align:{left:'Drawer_drawerFooterRecipe_align_left__x57sw1z',center:'Drawer_drawerFooterRecipe_align_center__x57sw110',right:'Drawer_drawerFooterRecipe_align_right__x57sw111','space-between':'Drawer_drawerFooterRecipe_align_space-between__x57sw112'}},defaultVariants:{align:'right'},compoundVariants:[]});
+var drawerHeaderContentStyle = 'Drawer_drawerHeaderContentStyle__x57sw1u';
+var drawerHeaderStyle = 'Drawer_drawerHeaderStyle__x57sw1t';
+var drawerPanelRecipe = createRuntimeFn({defaultClassName:'Drawer_drawerPanelBase__x57sw1d',variantClassNames:{anchor:{left:'Drawer_drawerPanelRecipe_anchor_left__x57sw1f',right:'Drawer_drawerPanelRecipe_anchor_right__x57sw1g',top:'Drawer_drawerPanelRecipe_anchor_top__x57sw1h',bottom:'Drawer_drawerPanelRecipe_anchor_bottom__x57sw1i'},state:{open:'Drawer_drawerPanelRecipe_state_open__x57sw1j',closing:'Drawer_drawerPanelRecipe_state_closing__x57sw1k'}},defaultVariants:{anchor:'right',state:'open'},compoundVariants:[[{anchor:'left',state:'open'},'Drawer_drawerPanelRecipe_compound_0__x57sw1l'],[{anchor:'left',state:'closing'},'Drawer_drawerPanelRecipe_compound_1__x57sw1m'],[{anchor:'right',state:'open'},'Drawer_drawerPanelRecipe_compound_2__x57sw1n'],[{anchor:'right',state:'closing'},'Drawer_drawerPanelRecipe_compound_3__x57sw1o'],[{anchor:'top',state:'open'},'Drawer_drawerPanelRecipe_compound_4__x57sw1p'],[{anchor:'top',state:'closing'},'Drawer_drawerPanelRecipe_compound_5__x57sw1q'],[{anchor:'bottom',state:'open'},'Drawer_drawerPanelRecipe_compound_6__x57sw1r'],[{anchor:'bottom',state:'closing'},'Drawer_drawerPanelRecipe_compound_7__x57sw1s']]});
+var drawerTitleStyle = 'Drawer_drawerTitleStyle__x57sw1v';
+var overlayRecipe = createRuntimeFn({defaultClassName:'Drawer_overlayRecipe__x57sw1a',variantClassNames:{closing:{true:'Drawer_overlayRecipe_closing_true__x57sw1b',false:'Drawer_overlayRecipe_closing_false__x57sw1c'}},defaultVariants:{closing:false},compoundVariants:[]});
+
+export { DRAWER_ANIMATION_MS, DRAWER_SIZE_MAP, drawerBodyStyle, drawerCloseButtonStyle, drawerDescriptionStyle, drawerFooterRecipe, drawerHeaderContentStyle, drawerHeaderStyle, drawerPanelRecipe, drawerTitleStyle, overlayRecipe };
+//# sourceMappingURL=Drawer.css.js.map

package/dist/esm/components/feedback/Drawer/Drawer.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}

package/dist/esm/components/feedback/Drawer/Drawer.js

@@ -0,0 +1,123 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useId, useRef, useCallback, createContext, useContext } from 'react';
+import { createPortal } from 'react-dom';
+import { CloseIcon } from '../../Icons/CloseIcon.js';
+import { useFocusTrap } from '../../../hooks/useFocusTrap/useFocusTrap.js';
+import { useMergedRef } from '../../../hooks/useMergedRef/useMergedRef.js';
+import { cx } from '../../../utils/cx.js';
+import { overlayRecipe, drawerPanelRecipe, drawerHeaderContentStyle, drawerTitleStyle, drawerDescriptionStyle, drawerCloseButtonStyle, drawerHeaderStyle, drawerBodyStyle, drawerFooterRecipe, DRAWER_SIZE_MAP } from './Drawer.css.js';
+import { useDrawerAnimation } from './useDrawerAnimation.js';
+
+const DrawerContext = /*#__PURE__*/ createContext(null);
+function useDrawerContext() {
+    const ctx = useContext(DrawerContext);
+    if (!ctx) {
+        throw new Error('Drawer sub-components must be used within <Drawer>');
+    }
+    return ctx;
+}
+function resolveSize(size, anchor) {
+    const isHorizontal = anchor === 'left' || anchor === 'right';
+    const dimension = isHorizontal ? 'width' : 'height';
+    let value;
+    if (typeof size === 'number') {
+        value = `${String(size)}px`;
+    }
+    else {
+        value = DRAWER_SIZE_MAP[size] ?? size;
+    }
+    return {
+        [dimension]: value,
+        maxWidth: '100vw',
+        maxHeight: '100vh',
+    };
+}
+/**
+ * Anchored sliding panel for secondary navigation, filters, or detail views.
+ * Modal mode renders an overlay backdrop and traps focus; non-modal mode
+ * leaves the rest of the page interactive.
+ *
+ * @example
+ * ```tsx
+ * <Drawer open={isOpen} onClose={close} anchor="right" size="md">
+ *   <Drawer.Header>Filters</Drawer.Header>
+ *   <Drawer.Body>...</Drawer.Body>
+ *   <Drawer.Footer>
+ *     <Button onClick={close}>Cancel</Button>
+ *     <Button variant="filled">Apply</Button>
+ *   </Drawer.Footer>
+ * </Drawer>
+ * ```
+ */
+const DrawerRoot = ({ open, onClose, anchor = 'right', size = 'md', modal = true, closeOnOverlayClick = true, closeOnEscape = true, trapFocus, initialFocusRef, portal = true, title, description, className, style, testId, id, children, ref, ...rest }) => {
+    const autoId = useId();
+    const titleId = `drawer-title-${autoId}`;
+    const descriptionId = `drawer-desc-${autoId}`;
+    const panelRef = useRef(null);
+    const shouldTrapFocus = trapFocus ?? modal;
+    const { mounted, closing } = useDrawerAnimation({
+        open,
+        panelRef,
+        initialFocusRef,
+        shouldFocus: shouldTrapFocus,
+    });
+    const handleFocusTrap = useFocusTrap({
+        containerRef: panelRef,
+        enabled: shouldTrapFocus,
+    });
+    const setPanelRef = useMergedRef(panelRef, ref);
+    const handleKeyDown = useCallback((e) => {
+        if (closeOnEscape && e.key === 'Escape') {
+            e.stopPropagation();
+            onClose();
+            return;
+        }
+        handleFocusTrap(e);
+    }, [closeOnEscape, onClose, handleFocusTrap]);
+    const handleOverlayClick = useCallback((e) => {
+        if (closeOnOverlayClick && e.target === e.currentTarget) {
+            onClose();
+        }
+    }, [closeOnOverlayClick, onClose]);
+    if (!mounted)
+        return null;
+    const contextValue = {
+        onClose,
+        titleId,
+        descriptionId,
+    };
+    const sizeStyle = resolveSize(size, anchor);
+    const drawerContent = (jsxs(DrawerContext.Provider, { value: contextValue, children: [modal && (
+            // Decorative backdrop: pointer users can click to dismiss, while
+            // keyboard users dismiss via Escape handled on the drawer panel.
+            jsx("div", { "aria-hidden": "true", className: overlayRecipe({ closing }), onClick: handleOverlayClick, "data-testid": testId ? `${testId}-overlay` : undefined })), jsxs("div", { ref: setPanelRef, role: "dialog", "aria-modal": modal ? 'true' : undefined, "aria-labelledby": title ? titleId : undefined, "aria-describedby": description ? descriptionId : undefined, tabIndex: -1, className: cx(drawerPanelRecipe({ anchor, state: closing ? 'closing' : 'open' }), className), style: { ...sizeStyle, ...style }, id: id, "data-testid": testId, "data-anchor": anchor, onKeyDown: handleKeyDown, ...rest, children: [title && (jsx("span", { id: titleId, style: { display: 'none' }, children: title })), description && (jsx("span", { id: descriptionId, style: { display: 'none' }, children: description })), children] })] }));
+    if (portal && typeof document !== 'undefined') {
+        return createPortal(drawerContent, document.body);
+    }
+    return drawerContent;
+};
+DrawerRoot.displayName = 'Drawer';
+const DrawerHeader = ({ children, showClose = true, description, className, style, testId, ref, ...rest }) => {
+    const { onClose, titleId, descriptionId } = useDrawerContext();
+    return (jsxs("div", { ref: ref, className: cx(drawerHeaderStyle, className), style: style, "data-testid": testId, ...rest, children: [jsxs("div", { className: drawerHeaderContentStyle, children: [jsx("div", { id: titleId, className: drawerTitleStyle, children: children }), description && (jsx("div", { id: descriptionId, className: drawerDescriptionStyle, children: description }))] }), showClose && (jsx("button", { type: "button", onClick: onClose, "aria-label": "Close drawer", className: drawerCloseButtonStyle, "data-testid": testId ? `${testId}-close` : undefined, children: jsx(CloseIcon, { size: "sm", decorative: true }) }))] }));
+};
+DrawerHeader.displayName = 'Drawer.Header';
+const DrawerBody = ({ children, className, style, testId, ref, ...rest }) => (jsx("div", { ref: ref, className: cx(drawerBodyStyle, className), style: style, "data-testid": testId, ...rest, children: children }));
+DrawerBody.displayName = 'Drawer.Body';
+const DrawerFooter = ({ children, align = 'right', className, style, testId, ref, ...rest }) => (jsx("div", { ref: ref, className: cx(drawerFooterRecipe({ align }), className), style: style, "data-testid": testId, ...rest, children: children }));
+DrawerFooter.displayName = 'Drawer.Footer';
+const DrawerCloseButton = ({ children, className, style, testId, 'aria-label': ariaLabel = 'Close drawer', ref, ...rest }) => {
+    const { onClose } = useDrawerContext();
+    return (jsx("button", { ref: ref, type: "button", onClick: onClose, "aria-label": ariaLabel, className: cx(drawerCloseButtonStyle, className), style: style, "data-testid": testId, ...rest, children: children ?? jsx(CloseIcon, { size: "sm", decorative: true }) }));
+};
+DrawerCloseButton.displayName = 'Drawer.CloseButton';
+const Drawer = Object.assign(DrawerRoot, {
+    Header: DrawerHeader,
+    Body: DrawerBody,
+    Footer: DrawerFooter,
+    CloseButton: DrawerCloseButton,
+});
+
+export { Drawer };
+//# sourceMappingURL=Drawer.js.map

package/dist/esm/components/feedback/Drawer/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Drawer.js","sources":["../../../../../../src/components/feedback/Drawer/Drawer.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;AAwCA;AAIA;AACE;;AAEE;;AAEF;AACF;AAEA;;;AAME;AACA;AACE;;;AAEA;;;;AAIA;AACA;;AAEJ;AAEA;;;;;;;;;;;;;;;;AAgBG;AACH;AAqBE;AACA;AACA;AACA;AAEA;AAEA;;;;AAIE;AACD;;AAGC;AACA;AACD;;AAID;;;AAIM;;;;;AAQN;;AAGM;;AAEJ;AAIF;AAAc;AAEd;;;;;;AAQA;;;AAKM;AA4CN;;;AAGA;AACF;AAEA;AAEA;;;AA0CA;AAEA;AAEA;AAmBA;AAEA;AAoBA;AAEA;AASE;;AAeF;AAEA;;AAUE;AACA;AACA;AACA;AACD;;"}

package/dist/esm/components/feedback/Drawer/useDrawerAnimation.js

@@ -0,0 +1,78 @@
+"use client";
+import { useState, useRef, useEffect } from 'react';
+import { FOCUSABLE_SELECTOR } from '../../../hooks/useFocusTrap/useFocusTrap.js';
+import { DRAWER_ANIMATION_MS } from './Drawer.css.js';
+
+/**
+ * Mount/unmount animation lifecycle plus focus management for Drawer.
+ * Mirrors the Dialog hook so behavior stays consistent: mount on open,
+ * delay unmount on close to play the slide-out, return focus to the
+ * previously focused element. `prefers-reduced-motion: reduce` collapses
+ * the animation delay to zero.
+ */
+function useDrawerAnimation({ open, panelRef, initialFocusRef, shouldFocus, }) {
+    const [mounted, setMounted] = useState(false);
+    const [closing, setClosing] = useState(false);
+    const previousFocusRef = useRef(null);
+    const wasOpenRef = useRef(false);
+    useEffect(() => {
+        if (open) {
+            previousFocusRef.current = document.activeElement;
+            // Mount/closing state is driven by the `open` prop and gates a timed
+            // enter/exit animation (delayed unmount below), so it must live in an
+            // effect rather than be derived during render.
+            // eslint-disable-next-line react-hooks/set-state-in-effect
+            setClosing(false);
+            setMounted(true);
+            wasOpenRef.current = true;
+            return undefined;
+        }
+        if (wasOpenRef.current) {
+            wasOpenRef.current = false;
+            setClosing(true);
+            const prefersReducedMotion = typeof window !== 'undefined' &&
+                typeof window.matchMedia === 'function' &&
+                window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+            const delay = prefersReducedMotion ? 0 : DRAWER_ANIMATION_MS;
+            const timer = setTimeout(() => {
+                setMounted(false);
+                setClosing(false);
+                if (previousFocusRef.current) {
+                    previousFocusRef.current.focus();
+                    previousFocusRef.current = null;
+                }
+            }, delay);
+            return () => {
+                clearTimeout(timer);
+            };
+        }
+        return undefined;
+    }, [open]);
+    useEffect(() => {
+        if (!open || !mounted || !shouldFocus)
+            return undefined;
+        const timer = setTimeout(() => {
+            if (initialFocusRef?.current) {
+                initialFocusRef.current.focus();
+                return;
+            }
+            const panel = panelRef.current;
+            if (!panel)
+                return;
+            const firstFocusable = panel.querySelector(FOCUSABLE_SELECTOR);
+            if (firstFocusable) {
+                firstFocusable.focus();
+            }
+            else {
+                panel.focus();
+            }
+        }, 0);
+        return () => {
+            clearTimeout(timer);
+        };
+    }, [open, mounted, initialFocusRef, panelRef, shouldFocus]);
+    return { mounted, closing };
+}
+
+export { useDrawerAnimation };
+//# sourceMappingURL=useDrawerAnimation.js.map

package/dist/esm/components/feedback/Drawer/useDrawerAnimation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDrawerAnimation.js","sources":["../../../../../../src/components/feedback/Drawer/useDrawerAnimation.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAsBA;;;;;;AAMG;AACG;;;AAQJ;AACA;;;AAII;;;;;;;AAOA;AACA;;AAEF;AACE;;AAEA;AAEE;AACA;;AAEF;;;AAGE;AACE;AACA;;;AAGJ;;AAEA;;AAEF;AACF;;AAGE;AAAuC;AACvC;AACE;AACE;;;AAGF;AACA;;;;;;;;;;AASF;;AAEA;AACF;AAEA;AACF;;"}

package/dist/esm/components/feedback/EmptyState/EmptyState.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React from 'react';
-import { cx } from '../../../utils/cx.js';
 import { Spinner } from '../Spinner/Spinner.js';
+import { cx } from '../../../utils/cx.js';
 import { emptyStateIconStyle, emptyStateTextColumnCompactStyle, emptyStateTextColumnStyle, emptyStateTitleStyle, emptyStateDescriptionStyle, emptyStateActionStyle, emptyStateRecipe } from './EmptyState.css.js';
 
 /**

package/dist/esm/components/feedback/EmptyState/EmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.js","sources":["../../../../../../src/components/feedback/EmptyState/EmptyState.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAgBA;;;;;;;;;;;;;;;;;;AAkBG;AACI;AAcH;AAEI;;;AAIF;AACI;AACA;AACD;;AAGL;AAkBI;AAcN;AAGF;;"}
+{"version":3,"file":"EmptyState.js","sources":["../../../../../../src/components/feedback/EmptyState/EmptyState.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAmBA;;;;;;;;;;;;;;;;;;AAkBG;AACI;AAcH;AAEI;;;AAIF;AACI;AACA;AACD;;AAGL;AAkBI;AAcN;AAGF;;"}

package/dist/esm/components/feedback/LogView/LogView.css.js

@@ -0,0 +1,35 @@
+import './../../../assets/src/components/feedback/LogView/LogView.css.ts.vanilla-nB5ENOpw.css';
+import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
+
+var DENSITY_ROW_HEIGHT = {comfortable:30,compact:26,dense:22};
+var bodyDensityRecipe = createRuntimeFn({defaultClassName:'LogView__1koarpap',variantClassNames:{density:{comfortable:'LogView_bodyDensityRecipe_density_comfortable__1koarpaq',compact:'LogView_bodyDensityRecipe_density_compact__1koarpar',dense:'LogView_bodyDensityRecipe_density_dense__1koarpas'}},defaultVariants:{density:'compact'},compoundVariants:[]});
+var bodyStyle = 'LogView_bodyStyle__1koarpan';
+var chipCountStyle = 'LogView_chipCountStyle__1koarpam';
+var copyLineButtonStyle = 'LogView_copyLineButtonStyle__1koarpa1e';
+var emptyStateStyle = 'LogView_emptyStateStyle__1koarpa1f';
+var footerStyle = 'LogView_footerStyle__1koarpa9';
+var highlightStyle = 'LogView_highlightStyle__1koarpa1d';
+var jumpBadgeStyle = 'LogView_jumpBadgeStyle__1koarpa1j';
+var jumpButtonRecipe = createRuntimeFn({defaultClassName:'LogView_jumpButtonRecipe__1koarpa1g',variantClassNames:{visible:{true:'LogView_jumpButtonRecipe_visible_true__1koarpa1h',false:'LogView_jumpButtonRecipe_visible_false__1koarpa1i'}},defaultVariants:{visible:false},compoundVariants:[]});
+var levelChipRecipe = createRuntimeFn({defaultClassName:'LogView_levelChipRecipe__1koarpac',variantClassNames:{level:{debug:'LogView_levelChipRecipe_level_debug__1koarpad',info:'LogView_levelChipRecipe_level_info__1koarpae',warn:'LogView_levelChipRecipe_level_warn__1koarpaf',error:'LogView_levelChipRecipe_level_error__1koarpag',custom:'LogView_levelChipRecipe_level_custom__1koarpah'},active:{true:'LogView_levelChipRecipe_active_true__1koarpai',false:'LogView_levelChipRecipe_active_false__1koarpaj'}},defaultVariants:{active:true},compoundVariants:[]});
+var levelColorVar = 'var(--levelColorVar__1koarpa2)';
+var levelDotStyle = 'LogView_levelDotStyle__1koarpal';
+var levelFilterStyle = 'LogView_levelFilterStyle__1koarpab';
+var levelGlyphStyle = 'LogView_levelGlyphStyle__1koarpak';
+var messageRecipe = createRuntimeFn({defaultClassName:'LogView_messageRecipe__1koarpa1a',variantClassNames:{wrap:{true:'LogView_messageRecipe_wrap_true__1koarpa1b',false:'LogView_messageRecipe_wrap_false__1koarpa1c'}},defaultVariants:{wrap:false},compoundVariants:[]});
+var plainBodyStyle = 'LogView_plainBodyStyle__1koarpau';
+var rootRecipe = createRuntimeFn({defaultClassName:'LogView_rootRecipe__1koarpa3',variantClassNames:{density:{comfortable:'LogView_rootRecipe_density_comfortable__1koarpa4',compact:'LogView_rootRecipe_density_compact__1koarpa5',dense:'LogView_rootRecipe_density_dense__1koarpa6'}},defaultVariants:{density:'compact'},compoundVariants:[]});
+var rowGlyphStyle = 'LogView_rowGlyphStyle__1koarpa17';
+var rowRecipe = createRuntimeFn({defaultClassName:'LogView_rowRecipe__1koarpav',variantClassNames:{level:{debug:'LogView_rowRecipe_level_debug__1koarpaw',info:'LogView_rowRecipe_level_info__1koarpax',warn:'LogView_rowRecipe_level_warn__1koarpay',error:'LogView_rowRecipe_level_error__1koarpaz',custom:'LogView_rowRecipe_level_custom__1koarpa10'},virtualized:{true:'LogView_rowRecipe_virtualized_true__1koarpa11'},interactive:{true:'LogView_rowRecipe_interactive_true__1koarpa12'},selected:{true:'LogView_rowRecipe_selected_true__1koarpa13'},align:{center:'LogView_rowRecipe_align_center__1koarpa14',start:'LogView_rowRecipe_align_start__1koarpa15'}},defaultVariants:{align:'center'},compoundVariants:[]});
+var scrollViewportStyle = 'LogView_scrollViewportStyle__1koarpao';
+var searchWrapperStyle = 'LogView_searchWrapperStyle__1koarpaa';
+var sourceCellStyle = 'LogView_sourceCellStyle__1koarpa18';
+var sourceTagStyle = 'LogView_sourceTagStyle__1koarpa19';
+var timestampStyle = 'LogView_timestampStyle__1koarpa16';
+var toolbarSpacerStyle = 'LogView_toolbarSpacerStyle__1koarpa8';
+var toolbarStyle = 'LogView_toolbarStyle__1koarpa7';
+var totalHeightVar = 'var(--totalHeightVar__1koarpa0)';
+var virtualBodyStyle = 'LogView_virtualBodyStyle__1koarpat';
+
+export { DENSITY_ROW_HEIGHT, bodyDensityRecipe, bodyStyle, chipCountStyle, copyLineButtonStyle, emptyStateStyle, footerStyle, highlightStyle, jumpBadgeStyle, jumpButtonRecipe, levelChipRecipe, levelColorVar, levelDotStyle, levelFilterStyle, levelGlyphStyle, messageRecipe, plainBodyStyle, rootRecipe, rowGlyphStyle, rowRecipe, scrollViewportStyle, searchWrapperStyle, sourceCellStyle, sourceTagStyle, timestampStyle, toolbarSpacerStyle, toolbarStyle, totalHeightVar, virtualBodyStyle };
+//# sourceMappingURL=LogView.css.js.map

package/dist/esm/components/feedback/LogView/LogView.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LogView.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}