@moldable-ai/ui 0.2.22 → 0.2.25

package/dist/components/ui/context-menu.js

@@ -2,12 +2,68 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
 import { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';
-import { cn } from '../../lib/utils';
-function ContextMenu({ ...props }) {
-    return _jsx(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...props });
+import * as React from 'react';
+import { cn } from '../../lib/utils.js';
+import { MenuItemContents, hasMenuContentChild, useDeclarativeMenuState, withoutMenuContentChild, } from './menu-items.js';
+const ContextMenuItemsContext = React.createContext(null);
+function DeclarativeContextMenu({ items, onSelectItem, children, onOpenChange, ...props }) {
+    const hasContent = hasMenuContentChild(children, ContextMenuContent);
+    const fallbackRef = React.useRef(null);
+    const replayingFallbackRef = React.useRef(false);
+    const replayPortableMenu = React.useCallback(() => {
+        const fallback = fallbackRef.current;
+        if (!fallback)
+            return;
+        replayingFallbackRef.current = true;
+        fallback.trigger.dispatchEvent(new MouseEvent('contextmenu', {
+            bubbles: true,
+            cancelable: true,
+            clientX: fallback.position.x,
+            clientY: fallback.position.y,
+        }));
+    }, []);
+    const menu = useDeclarativeMenuState({
+        items,
+        onSelectItem,
+        onOpenChange,
+        onFallback: replayPortableMenu,
+    });
+    React.useEffect(() => {
+        if (process.env.NODE_ENV !== 'production' && hasContent) {
+            console.error('ContextMenu received both items and ContextMenuContent children. The items prop wins.');
+        }
+    }, [hasContent]);
+    const { requestNativeMenu } = menu;
+    const contextValue = React.useMemo(() => ({
+        requestNativeMenu: (position, trigger) => {
+            if (replayingFallbackRef.current) {
+                replayingFallbackRef.current = false;
+                return false;
+            }
+            fallbackRef.current = { position, trigger };
+            return requestNativeMenu({ position });
+        },
+    }), [requestNativeMenu]);
+    return (_jsx(ContextMenuItemsContext.Provider, { value: contextValue, children: _jsxs(ContextMenuPrimitive.Root, { "data-slot": "context-menu", onOpenChange: onOpenChange, ...props, children: [withoutMenuContentChild(children, ContextMenuContent), menu.nativeOpen ? null : (_jsx(ContextMenuContent, { children: _jsx(ContextMenuGeneratedItems, { items: items, onSelectItem: onSelectItem }) }))] }) }));
 }
-function ContextMenuTrigger({ ...props }) {
-    return (_jsx(ContextMenuPrimitive.Trigger, { "data-slot": "context-menu-trigger", ...props }));
+function ContextMenu(props) {
+    if (props.items)
+        return _jsx(DeclarativeContextMenu, { ...props, items: props.items });
+    const { items: _items, onSelectItem: _onSelectItem, ...rootProps } = props;
+    return _jsx(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...rootProps });
+}
+function ContextMenuTrigger({ onContextMenu, ...props }) {
+    const menu = React.useContext(ContextMenuItemsContext);
+    return (_jsx(ContextMenuPrimitive.Trigger, { "data-slot": "context-menu-trigger", onContextMenu: (event) => {
+            onContextMenu?.(event);
+            if (!event.defaultPrevented &&
+                menu?.requestNativeMenu({
+                    x: event.clientX,
+                    y: event.clientY,
+                }, event.currentTarget)) {
+                event.preventDefault();
+            }
+        }, ...props }));
 }
 function ContextMenuGroup({ ...props }) {
     return (_jsx(ContextMenuPrimitive.Group, { "data-slot": "context-menu-group", ...props }));
@@ -21,31 +77,51 @@ function ContextMenuSub({ ...props }) {
 function ContextMenuRadioGroup({ ...props }) {
     return (_jsx(ContextMenuPrimitive.RadioGroup, { "data-slot": "context-menu-radio-group", ...props }));
 }
-function ContextMenuSubTrigger({ className, inset, children, ...props }) {
-    return (_jsxs(ContextMenuPrimitive.SubTrigger, { "data-slot": "context-menu-sub-trigger", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto" })] }));
+function ContextMenuSubTrigger({ className, inset, children, variant = 'default', ...props }) {
+    return (_jsxs(ContextMenuPrimitive.SubTrigger, { "data-slot": "context-menu-sub-trigger", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden rounded-control text-ui-body flex cursor-default select-none items-center px-2 py-1.5 data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto" })] }));
 }
 function ContextMenuSubContent({ className, ...props }) {
-    return (_jsx(ContextMenuPrimitive.SubContent, { "data-slot": "context-menu-sub-content", className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-context-menu-content-transform-origin) z-50 min-w-[8rem] overflow-hidden rounded-md border p-1 shadow-lg', className), ...props }));
+    return (_jsx(ContextMenuPrimitive.SubContent, { "data-slot": "context-menu-sub-content", className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-context-menu-content-transform-origin) rounded-overlay shadow-overlay z-50 min-w-[8rem] overflow-hidden border p-1', className), ...props }));
 }
 function ContextMenuContent({ className, ...props }) {
-    return (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, { "data-slot": "context-menu-content", className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-h-(--radix-context-menu-content-available-height) origin-(--radix-context-menu-content-transform-origin) z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border p-1 shadow-md', className), ...props }) }));
+    return (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, { "data-slot": "context-menu-content", className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-h-(--radix-context-menu-content-available-height) origin-(--radix-context-menu-content-transform-origin) rounded-overlay shadow-overlay z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden border p-1', className), ...props }) }));
 }
 function ContextMenuItem({ className, inset, variant = 'default', ...props }) {
-    return (_jsx(ContextMenuPrimitive.Item, { "data-slot": "context-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props }));
+    return (_jsx(ContextMenuPrimitive.Item, { "data-slot": "context-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden rounded-control text-ui-body relative flex cursor-default select-none items-center gap-2 px-2 py-1.5 data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props }));
 }
-function ContextMenuCheckboxItem({ className, children, checked, ...props }) {
-    return (_jsxs(ContextMenuPrimitive.CheckboxItem, { "data-slot": "context-menu-checkbox-item", className: cn("focus:bg-accent focus:text-accent-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pl-8 pr-2 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), checked: checked, ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4" }) }) }), children] }));
+function ContextMenuCheckboxItem({ className, children, checked, variant = 'default', ...props }) {
+    return (_jsxs(ContextMenuPrimitive.CheckboxItem, { "data-slot": "context-menu-checkbox-item", "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive outline-hidden rounded-control text-ui-body relative flex cursor-default select-none items-center gap-2 py-1.5 pl-8 pr-2 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), checked: checked, ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4" }) }) }), children] }));
 }
-function ContextMenuRadioItem({ className, children, ...props }) {
-    return (_jsxs(ContextMenuPrimitive.RadioItem, { "data-slot": "context-menu-radio-item", className: cn("focus:bg-accent focus:text-accent-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pl-8 pr-2 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
+function ContextMenuRadioItem({ className, children, variant = 'default', ...props }) {
+    return (_jsxs(ContextMenuPrimitive.RadioItem, { "data-slot": "context-menu-radio-item", "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive outline-hidden rounded-control text-ui-body relative flex cursor-default select-none items-center gap-2 py-1.5 pl-8 pr-2 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(ContextMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
 }
 function ContextMenuLabel({ className, inset, ...props }) {
-    return (_jsx(ContextMenuPrimitive.Label, { "data-slot": "context-menu-label", "data-inset": inset, className: cn('text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', className), ...props }));
+    return (_jsx(ContextMenuPrimitive.Label, { "data-slot": "context-menu-label", "data-inset": inset, className: cn('text-foreground text-ui-body px-2 py-1.5 font-medium data-[inset]:pl-8', className), ...props }));
 }
 function ContextMenuSeparator({ className, ...props }) {
     return (_jsx(ContextMenuPrimitive.Separator, { "data-slot": "context-menu-separator", className: cn('bg-border -mx-1 my-1 h-px', className), ...props }));
 }
 function ContextMenuShortcut({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "context-menu-shortcut", className: cn('text-muted-foreground ml-auto text-xs tracking-widest', className), ...props }));
+    return (_jsx("span", { "data-slot": "context-menu-shortcut", className: cn('text-muted-foreground text-ui-caption ml-auto tracking-widest', className), ...props }));
+}
+function ContextMenuGeneratedItems({ items, onSelectItem, }) {
+    return items.map((item) => {
+        if (item.kind === 'separator') {
+            return _jsx(ContextMenuSeparator, {}, item.id);
+        }
+        const contents = (_jsx(MenuItemContents, { item: item, shortcutSlot: "context-menu-shortcut" }));
+        const handleSelect = () => onSelectItem?.(item.id);
+        const variant = item.destructive ? 'destructive' : 'default';
+        if (item.kind === 'checkbox') {
+            return (_jsx(ContextMenuCheckboxItem, { checked: item.checked === 'mixed' ? 'indeterminate' : item.checked, disabled: item.enabled === false, variant: variant, onSelect: handleSelect, children: contents }, item.id));
+        }
+        if (item.kind === 'radio') {
+            return (_jsx(ContextMenuRadioGroup, { value: item.checked ? item.id : '', children: _jsx(ContextMenuRadioItem, { value: item.id, disabled: item.enabled === false, variant: variant, onSelect: handleSelect, children: contents }) }, item.id));
+        }
+        if (item.submenu) {
+            return (_jsxs(ContextMenuSub, { children: [_jsx(ContextMenuSubTrigger, { disabled: item.enabled === false, variant: variant, children: contents }), _jsx(ContextMenuSubContent, { children: _jsx(ContextMenuGeneratedItems, { items: item.submenu, onSelectItem: onSelectItem }) })] }, item.id));
+        }
+        return (_jsx(ContextMenuItem, { disabled: item.enabled === false, variant: variant, onSelect: handleSelect, children: contents }, item.id));
+    });
 }
 export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuRadioItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuGroup, ContextMenuPortal, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuRadioGroup, };

package/dist/components/ui/date-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-field.d.ts","sourceRoot":"","sources":["../../../src/components/ui/date-field.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAEjE,QAAA,MAAM,iBAAiB;;;8EAmBtB,CAAA;AAED,UAAU,cACR,SAAQ,IAAI,CACR,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAC7B,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAC3C,EACD,YAAY,CAAC,OAAO,iBAAiB,CAAC;IACxC,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,cAAc,EACd,KAAK,EACL,YAAiB,EACjB,QAAQ,EACR,aAAa,EACb,OAAO,EACP,SAAiB,EACjB,UAAyB,EACzB,OAAmB,EACnB,OAAmB,EACnB,QAAQ,EACR,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,2CAkFhB;AAED,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,cAAc,EAAE,CAAA"}
+{"version":3,"file":"date-field.d.ts","sourceRoot":"","sources":["../../../src/components/ui/date-field.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,KAAK,YAAY,EAAO,MAAM,0BAA0B,CAAA;AAEjE,QAAA,MAAM,iBAAiB;;;8EAmBtB,CAAA;AAED,UAAU,cACR,SAAQ,IAAI,CACR,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAC7B,cAAc,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAC3C,EACD,YAAY,CAAC,OAAO,iBAAiB,CAAC;IACxC,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,cAAc,EACd,KAAK,EACL,YAAiB,EACjB,QAAQ,EACR,aAAa,EACb,OAAO,EACP,SAAiB,EACjB,UAAyB,EACzB,OAAmB,EACnB,OAAmB,EACnB,QAAQ,EACR,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,2CA2EhB;AAED,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,KAAK,cAAc,EAAE,CAAA"}

package/dist/components/ui/date-field.js

@@ -1,20 +1,20 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CalendarDaysIcon, XIcon } from 'lucide-react';
+import { XIcon } from 'lucide-react';
 import * as React from 'react';
-import { cn } from '../../lib/utils';
-import { IconButton } from './icon-button';
+import { cn } from '../../lib/utils.js';
+import { IconButton } from './icon-button.js';
 import { cva } from 'class-variance-authority';
-const dateFieldVariants = cva('group/date-field border-input focus-within:border-ring focus-within:ring-ring/50 flex w-full min-w-0 items-center rounded-md border text-foreground shadow-xs transition-[background-color,border-color,box-shadow] focus-within:ring-[3px] has-[[aria-invalid=true]]:border-destructive has-[[aria-invalid=true]]:ring-destructive/20', {
+const dateFieldVariants = cva('group/date-field border-input has-[:focus-visible]:border-ring has-[:focus-visible]:ring-1 has-[:focus-visible]:ring-ring flex w-full min-w-0 items-center rounded-control border text-foreground shadow-xs transition-[background-color,border-color,box-shadow] has-[[aria-invalid=true]]:border-destructive', {
     variants: {
         variant: {
             default: 'bg-background',
             filled: 'border-transparent bg-muted/70 shadow-none',
         },
         density: {
-            compact: 'h-7',
-            default: 'h-9',
-            comfortable: 'h-10',
+            compact: 'h-control-sm',
+            default: 'h-control-md',
+            comfortable: 'h-control-md',
         },
     },
     defaultVariants: {
@@ -46,7 +46,7 @@ function DateField({ className, inputClassName, value, defaultValue = '', onChan
         onClear?.();
         inputRef.current?.focus();
     }, [commitValue, currentValue, onClear]);
-    return (_jsxs("div", { "data-slot": "date-field", "data-density": density, "data-variant": variant, "data-disabled": disabled || undefined, "data-readonly": readOnly || undefined, className: cn(dateFieldVariants({ variant, density }), disabled && 'cursor-not-allowed opacity-50', className), children: [_jsx(CalendarDaysIcon, { "aria-hidden": "true", className: cn('text-muted-foreground pointer-events-none ml-2.5 shrink-0', density === 'compact' ? 'size-3.5' : 'size-4') }), _jsx("input", { ref: setRefs, "data-slot": "date-field-input", type: "date", value: currentValue, disabled: disabled, readOnly: readOnly, className: cn('min-w-0 flex-1 bg-transparent px-2 text-sm outline-none dark:[color-scheme:dark] [&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-60 [&::-webkit-calendar-picker-indicator]:hover:opacity-100', density === 'compact' && 'text-xs', inputClassName), onChange: (event) => {
+    return (_jsxs("div", { "data-slot": "date-field", "data-density": density, "data-variant": variant, "data-disabled": disabled || undefined, "data-readonly": readOnly || undefined, className: cn(dateFieldVariants({ variant, density }), disabled && 'cursor-not-allowed opacity-50', className), children: [_jsx("input", { ref: setRefs, "data-slot": "date-field-input", type: "date", value: currentValue, disabled: disabled, readOnly: readOnly, className: cn('text-ui-body min-w-0 flex-1 bg-transparent px-control-inline outline-none dark:[color-scheme:dark] [&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-60 [&::-webkit-calendar-picker-indicator]:hover:opacity-100', density === 'compact' && 'text-ui-caption', inputClassName), onChange: (event) => {
                     onChange?.(event);
                     commitValue(event.currentTarget.value);
                 }, ...props }), clearable && currentValue && !readOnly ? (_jsx(IconButton, { label: clearLabel, size: "xs", variant: "ghost", disabled: disabled, className: "mr-0.5 shrink-0", onClick: clear, children: _jsx(XIcon, {}) })) : null] }));

package/dist/components/ui/date-picker.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { Button } from './button';
-import { Calendar } from './calendar';
+import { Button } from './button.js';
+import { Calendar } from './calendar.js';
 type DatePickerDensity = 'compact' | 'default' | 'comfortable';
 interface DatePickerProps extends Omit<React.ComponentProps<typeof Button>, 'children' | 'defaultValue' | 'size' | 'value'> {
     /** ISO calendar date in YYYY-MM-DD form. No timezone conversion is applied. */

package/dist/components/ui/date-picker.js

@@ -2,10 +2,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CalendarDaysIcon } from 'lucide-react';
 import * as React from 'react';
-import { cn } from '../../lib/utils';
-import { Button } from './button';
-import { Calendar } from './calendar';
-import { Popover, PopoverContent, PopoverTrigger } from './popover';
+import { cn } from '../../lib/utils.js';
+import { Button } from './button.js';
+import { Calendar } from './calendar.js';
+import { Popover, PopoverContent, PopoverTrigger } from './popover.js';
 const ISO_CALENDAR_DATE = /^(\d{4})-(\d{2})-(\d{2})$/;
 function parseCalendarDate(value) {
     if (!value)
@@ -33,9 +33,9 @@ function formatCalendarDate(date) {
     return `${year}-${month}-${day}`;
 }
 const densityClasses = {
-    compact: 'h-7 gap-1.5 px-2 text-xs',
-    default: 'h-9 px-3',
-    comfortable: 'h-10 px-3.5',
+    compact: 'h-control-sm gap-1.5 px-2 text-ui-caption',
+    default: 'h-control-md px-control-inline',
+    comfortable: 'h-control-md px-control-inline',
 };
 function DatePicker({ className, value, defaultValue = '', onValueChange, min, max, placeholder = 'Choose date', locale, formatValue, clearable = false, clearLabel = 'Clear date', density = 'default', open, defaultOpen = false, onOpenChange, disabled, variant = 'outline', 'aria-invalid': ariaInvalid, ...buttonProps }) {
     const controlled = value !== undefined;

package/dist/components/ui/dialog.d.ts

@@ -1,12 +1,12 @@
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as React from 'react';
-import { Button } from './button';
+import { Button } from './button.js';
 declare function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
 declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
 declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
 declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): import("react/jsx-runtime").JSX.Element;
 declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): import("react/jsx-runtime").JSX.Element;
-declare function DialogContent({ className, children, onKeyDown, size, showCloseButton, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
+declare function DialogContent({ className, children, onKeyDown, onOpenAutoFocus, size, showCloseButton, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
     size?: 'sm' | 'default' | 'lg' | 'full';
     showCloseButton?: boolean;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAEzD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAGjC,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAEnD;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAEtD;AAED,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAErD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAWtD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,SAAS,EACT,IAAgB,EAChB,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,CAAA;IACvC,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,2CAuCA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWzE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWvE;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,eAAuB,EACvB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,2CAkBA;AAED,iBAAS,YAAY,CAAC,EACpB,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,2CAQA;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQpD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,2CAQ1D;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,CAAA"}
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../../src/components/ui/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAEzD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAGjC,iBAAS,MAAM,CAAC,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,2CAEnD;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAEtD;AAED,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,MAAM,CAAC,2CAErD;AAED,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAEpD;AAED,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,2CAWtD;AASD,iBAAS,aAAa,CAAC,EACrB,SAAS,EACT,QAAQ,EACR,SAAS,EACT,eAAe,EACf,IAAgB,EAChB,eAAsB,EACtB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,GAAG;IACxD,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,CAAA;IACvC,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,2CA8CA;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWzE;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAWvE;AAED,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,eAAuB,EACvB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B,2CAkBA;AAED,iBAAS,YAAY,CAAC,EACpB,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IACvC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,2CAQA;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,KAAK,CAAC,2CAQpD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,eAAe,CAAC,WAAW,CAAC,2CAQ1D;AAED,OAAO,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EACX,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,WAAW,EACX,aAAa,GACd,CAAA"}

package/dist/components/ui/dialog.js

@@ -2,9 +2,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { XIcon } from 'lucide-react';
-import { cn } from '../../lib/utils';
-import { Button } from './button';
-import { handleDialogPrimaryActionKeyDown } from './dialog-primary-action';
+import { cn } from '../../lib/utils.js';
+import { Button } from './button.js';
+import { handleDialogPrimaryActionKeyDown } from './dialog-primary-action.js';
 function Dialog({ ...props }) {
     return _jsx(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
 }
@@ -20,11 +20,19 @@ function DialogClose({ ...props }) {
 function DialogOverlay({ className, ...props }) {
     return (_jsx(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50', className), ...props }));
 }
-function DialogContent({ className, children, onKeyDown, size = 'default', showCloseButton = true, ...props }) {
-    return (_jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [_jsx(DialogOverlay, {}), _jsx("div", { "data-slot": "dialog-positioner", className: "pointer-events-none fixed bottom-[max(var(--window-content-inset-bottom),var(--chat-safe-padding),1rem)] left-[max(var(--window-content-inset-inline-start),1rem)] right-[max(var(--window-content-inset-inline-end),1rem)] top-[max(var(--window-content-inset-top),1rem)] z-50 grid place-items-center", children: _jsxs(DialogPrimitive.Content, { "data-slot": "dialog-content", "data-size": size, className: cn('bg-background rounded-overlay border-separator shadow-overlay pointer-events-auto relative grid max-h-full min-h-0 w-full gap-4 overflow-hidden border p-6 outline-none', 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95', 'duration-[var(--motion-duration-normal)]', 'data-[size=default]:max-w-lg data-[size=lg]:max-w-2xl data-[size=sm]:max-w-sm', 'data-[size=full]:size-full data-[size=full]:max-w-none', className), onKeyDown: (event) => {
+function focusDialogContentOnOpen(event) {
+    event.preventDefault();
+    if (event.currentTarget instanceof HTMLElement) {
+        event.currentTarget.focus({ preventScroll: true });
+    }
+}
+function DialogContent({ className, children, onKeyDown, onOpenAutoFocus, size = 'default', showCloseButton = true, ...props }) {
+    return (_jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [_jsx(DialogOverlay, {}), _jsx("div", { "data-slot": "dialog-positioner", className: cn('pointer-events-none fixed z-50 grid place-items-center', size === 'full'
+                    ? 'inset-1'
+                    : 'bottom-[max(var(--window-content-inset-bottom),var(--chat-safe-padding),1rem)] left-[max(var(--window-content-inset-inline-start),1rem)] right-[max(var(--window-content-inset-inline-end),1rem)] top-[max(var(--window-content-inset-top),1rem)]'), children: _jsxs(DialogPrimitive.Content, { "data-slot": "dialog-content", "data-size": size, tabIndex: -1, className: cn('bg-background border-separator shadow-dialog rounded-dialog pointer-events-auto relative grid max-h-full min-h-0 w-full gap-4 overflow-hidden border p-6 outline-none', 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95', 'duration-[var(--motion-duration-normal)]', 'data-[size=default]:max-w-lg data-[size=lg]:max-w-2xl data-[size=sm]:max-w-sm', 'data-[size=full]:size-full data-[size=full]:max-w-none', className), onKeyDown: (event) => {
                         onKeyDown?.(event);
                         handleDialogPrimaryActionKeyDown(event);
-                    }, ...props, children: [children, showCloseButton && (_jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", "aria-label": "Close", className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground rounded-control focus:outline-hidden absolute right-4 top-4 inline-flex size-7 cursor-pointer items-center justify-center opacity-70 transition-opacity duration-[var(--motion-duration-fast)] hover:opacity-100 focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none disabled:cursor-not-allowed [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", children: _jsx(XIcon, { "aria-hidden": "true" }) }))] }) })] }));
+                    }, onOpenAutoFocus: onOpenAutoFocus ?? focusDialogContentOnOpen, ...props, children: [children, showCloseButton && (_jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", "aria-label": "Close", className: "ring-offset-background data-[state=open]:bg-accent data-[state=open]:text-muted-foreground rounded-control focus-visible:ring-ring absolute right-4 top-4 inline-flex size-7 cursor-pointer items-center justify-center opacity-70 transition-opacity duration-[var(--motion-duration-fast)] hover:opacity-100 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:cursor-not-allowed [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", children: _jsx(XIcon, { "aria-hidden": "true" }) }))] }) })] }));
 }
 function DialogHeader({ className, ...props }) {
     return (_jsx("div", { "data-slot": "dialog-header", className: cn('flex shrink-0 flex-col gap-2 pr-8 text-center sm:text-left', className), ...props }));
@@ -39,9 +47,9 @@ function DialogAction({ primary = false, ...props }) {
     return (_jsx(Button, { ...props, "data-slot": "dialog-action", "data-dialog-primary-action": primary || undefined }));
 }
 function DialogTitle({ className, ...props }) {
-    return (_jsx(DialogPrimitive.Title, { "data-slot": "dialog-title", className: cn('text-lg font-semibold leading-none', className), ...props }));
+    return (_jsx(DialogPrimitive.Title, { "data-slot": "dialog-title", className: cn('text-ui-heading', className), ...props }));
 }
 function DialogDescription({ className, ...props }) {
-    return (_jsx(DialogPrimitive.Description, { "data-slot": "dialog-description", className: cn('text-muted-foreground text-sm', className), ...props }));
+    return (_jsx(DialogPrimitive.Description, { "data-slot": "dialog-description", className: cn('text-text-secondary text-ui-body', className), ...props }));
 }
 export { Dialog, DialogAction, DialogClose, DialogContent, DialogDescription, DialogBody, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };

package/dist/components/ui/drawer.js

@@ -1,6 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '../../lib/utils';
+import { cn } from '../../lib/utils.js';
 import { Drawer as DrawerPrimitive } from 'vaul';
 function Drawer({ ...props }) {
     return _jsx(DrawerPrimitive.Root, { "data-slot": "drawer", ...props });
@@ -18,7 +18,7 @@ function DrawerOverlay({ className, ...props }) {
     return (_jsx(DrawerPrimitive.Overlay, { "data-slot": "drawer-overlay", className: cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50', className), ...props }));
 }
 function DrawerContent({ className, children, ...props }) {
-    return (_jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { "data-slot": "drawer-content", className: cn('group/drawer-content bg-background fixed z-50 flex h-auto flex-col', 'data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b', 'data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t', 'data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm', 'data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm', className), ...props, children: [_jsx("div", { className: "bg-muted mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), children] })] }));
+    return (_jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { "data-slot": "drawer-content", className: cn('group/drawer-content bg-background fixed z-50 flex h-auto flex-col', 'data-[vaul-drawer-direction=top]:rounded-b-panel data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:border-b', 'data-[vaul-drawer-direction=bottom]:rounded-t-panel data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:border-t', 'data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm', 'data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm', className), ...props, children: [_jsx("div", { className: "bg-muted rounded-pill mx-auto mt-4 hidden h-2 w-[100px] shrink-0 group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), children] })] }));
 }
 function DrawerHeader({ className, ...props }) {
     return (_jsx("div", { "data-slot": "drawer-header", className: cn('flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left', className), ...props }));
@@ -27,9 +27,9 @@ function DrawerFooter({ className, ...props }) {
     return (_jsx("div", { "data-slot": "drawer-footer", className: cn('mt-auto flex flex-col gap-2 p-4', className), ...props }));
 }
 function DrawerTitle({ className, ...props }) {
-    return (_jsx(DrawerPrimitive.Title, { "data-slot": "drawer-title", className: cn('text-foreground font-semibold', className), ...props }));
+    return (_jsx(DrawerPrimitive.Title, { "data-slot": "drawer-title", className: cn('text-ui-title text-foreground', className), ...props }));
 }
 function DrawerDescription({ className, ...props }) {
-    return (_jsx(DrawerPrimitive.Description, { "data-slot": "drawer-description", className: cn('text-muted-foreground text-sm', className), ...props }));
+    return (_jsx(DrawerPrimitive.Description, { "data-slot": "drawer-description", className: cn('text-text-secondary text-ui-body', className), ...props }));
 }
 export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContent, DrawerHeader, DrawerFooter, DrawerTitle, DrawerDescription, };

package/dist/components/ui/dropdown-menu.d.ts

@@ -1,25 +1,35 @@
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as React from 'react';
-declare function DropdownMenu({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+import type { MenuItems } from '../../lib/host-native-menu.js';
+type DropdownMenuProps = React.ComponentProps<typeof DropdownMenuPrimitive.Root> & {
+    items?: MenuItems[];
+    onSelectItem?: (id: string) => void;
+};
+declare function DropdownMenu(props: DropdownMenuProps): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuPortal({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
-declare function DropdownMenuTrigger({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function DropdownMenuTrigger({ onClick, onKeyDown, onPointerDown, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuContent({ className, sideOffset, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuItem({ className, inset, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
     inset?: boolean;
     variant?: 'default' | 'destructive';
 }): import("react/jsx-runtime").JSX.Element;
-declare function DropdownMenuCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>): import("react/jsx-runtime").JSX.Element;
+declare function DropdownMenuCheckboxItem({ className, children, checked, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem> & {
+    variant?: 'default' | 'destructive';
+}): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuRadioGroup({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>): import("react/jsx-runtime").JSX.Element;
-declare function DropdownMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>): import("react/jsx-runtime").JSX.Element;
+declare function DropdownMenuRadioItem({ className, children, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem> & {
+    variant?: 'default' | 'destructive';
+}): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuLabel({ className, inset, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
     inset?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuSeparator({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuShortcut({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuSub({ ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>): import("react/jsx-runtime").JSX.Element;
-declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
+declare function DropdownMenuSubTrigger({ className, inset, children, variant, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
     inset?: boolean;
+    variant?: 'default' | 'destructive';
 }): import("react/jsx-runtime").JSX.Element;
 declare function DropdownMenuSubContent({ className, ...props }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>): import("react/jsx-runtime").JSX.Element;
 export { DropdownMenu, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, };

package/dist/components/ui/dropdown-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../../src/components/ui/dropdown-menu.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,qBAAqB,MAAM,+BAA+B,CAAA;AAEtE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,iBAAS,YAAY,CAAC,EACpB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,IAAI,CAAC,2CAEzD;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,MAAM,CAAC,2CAI3D;AAED,iBAAS,mBAAmB,CAAC,EAC3B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,OAAO,CAAC,2CAO5D;AAED,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,UAAc,EACd,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,OAAO,CAAC,2CAc5D;AAED,iBAAS,iBAAiB,CAAC,EACzB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,KAAK,CAAC,2CAI1D;AAED,iBAAS,gBAAgB,CAAC,EACxB,SAAS,EACT,KAAK,EACL,OAAmB,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,IAAI,CAAC,GAAG;IAC3D,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAA;CACpC,2CAaA;AAED,iBAAS,wBAAwB,CAAC,EAChC,SAAS,EACT,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,YAAY,CAAC,2CAmBjE;AAED,iBAAS,sBAAsB,CAAC,EAC9B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,UAAU,CAAC,2CAO/D;AAED,iBAAS,qBAAqB,CAAC,EAC7B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,SAAS,CAAC,2CAkB9D;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,KAAK,CAAC,GAAG;IAC5D,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,2CAYA;AAED,iBAAS,qBAAqB,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,SAAS,CAAC,2CAQ9D;AAED,iBAAS,oBAAoB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAW9B;AAED,iBAAS,eAAe,CAAC,EACvB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,GAAG,CAAC,2CAExD;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,UAAU,CAAC,GAAG;IACjE,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,2CAeA;AAED,iBAAS,sBAAsB,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,qBAAqB,CAAC,UAAU,CAAC,2CAW/D;AAED,OAAO,EACL,YAAY,EACZ,kBAAkB,EAClB,mBAAmB,EACnB,mBAAmB,EACnB,iBAAiB,EACjB,iBAAiB,EACjB,gBAAgB,EAChB,wBAAwB,EACxB,sBAAsB,EACtB,qBAAqB,EACrB,qBAAqB,EACrB,oBAAoB,EACpB,eAAe,EACf,sBAAsB,EACtB,sBAAsB,GACvB,CAAA"}
+{"version":3,"file":"dropdown-menu.d.ts","sourceRoot":"","sources":["../../../src/components/ui/dropdown-menu.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/dropdown-menu.js

@@ -2,50 +2,132 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';
-import { cn } from '../../lib/utils';
-function DropdownMenu({ ...props }) {
-    return _jsx(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
+import * as React from 'react';
+import { cn } from '../../lib/utils.js';
+import { MenuItemContents, hasMenuContentChild, useDeclarativeMenuState, withoutMenuContentChild, } from './menu-items.js';
+const DropdownMenuItemsContext = React.createContext(null);
+function DeclarativeDropdownMenu({ items, onSelectItem, children, open, defaultOpen, onOpenChange, ...props }) {
+    const hasContent = hasMenuContentChild(children, DropdownMenuContent);
+    const menu = useDeclarativeMenuState({
+        items,
+        onSelectItem,
+        open,
+        defaultOpen,
+        onOpenChange,
+    });
+    React.useEffect(() => {
+        if (process.env.NODE_ENV !== 'production' && hasContent) {
+            console.error('DropdownMenu received both items and DropdownMenuContent children. The items prop wins.');
+        }
+    }, [hasContent]);
+    const { requestNativeMenu } = menu;
+    const contextValue = React.useMemo(() => ({
+        requestNativeMenu: (anchor) => requestNativeMenu({ anchor }),
+    }), [requestNativeMenu]);
+    return (_jsx(DropdownMenuItemsContext.Provider, { value: contextValue, children: _jsxs(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", open: menu.portableOpen, onOpenChange: menu.onPortableOpenChange, ...props, children: [withoutMenuContentChild(children, DropdownMenuContent), menu.nativeOpen ? null : (_jsx(DropdownMenuContent, { children: _jsx(DropdownMenuGeneratedItems, { items: items, onSelectItem: onSelectItem }) }))] }) }));
+}
+function DropdownMenu(props) {
+    if (props.items) {
+        return _jsx(DeclarativeDropdownMenu, { ...props, items: props.items });
+    }
+    const { items: _items, onSelectItem: _onSelectItem, ...rootProps } = props;
+    return _jsx(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...rootProps });
 }
 function DropdownMenuPortal({ ...props }) {
     return (_jsx(DropdownMenuPrimitive.Portal, { "data-slot": "dropdown-menu-portal", ...props }));
 }
-function DropdownMenuTrigger({ ...props }) {
-    return (_jsx(DropdownMenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props }));
+function DropdownMenuTrigger({ onClick, onKeyDown, onPointerDown, ...props }) {
+    const menu = React.useContext(DropdownMenuItemsContext);
+    const suppressClickRef = React.useRef(false);
+    return (_jsx(DropdownMenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", onPointerDown: (event) => {
+            onPointerDown?.(event);
+            if (!event.defaultPrevented &&
+                event.button === 0 &&
+                !event.ctrlKey &&
+                menu?.requestNativeMenu(event.currentTarget)) {
+                suppressClickRef.current = true;
+                event.preventDefault();
+            }
+        }, onKeyDown: (event) => {
+            onKeyDown?.(event);
+            if (!event.defaultPrevented &&
+                !event.repeat &&
+                (event.key === 'Enter' ||
+                    event.key === ' ' ||
+                    event.key === 'ArrowDown') &&
+                menu?.requestNativeMenu(event.currentTarget)) {
+                if (event.key !== 'ArrowDown')
+                    suppressClickRef.current = true;
+                event.preventDefault();
+            }
+        }, onClick: (event) => {
+            onClick?.(event);
+            if (event.defaultPrevented)
+                return;
+            if (suppressClickRef.current) {
+                suppressClickRef.current = false;
+                event.preventDefault();
+                return;
+            }
+            if (menu?.requestNativeMenu(event.currentTarget)) {
+                event.preventDefault();
+            }
+        }, ...props }));
 }
 function DropdownMenuContent({ className, sideOffset = 4, ...props }) {
-    return (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { "data-slot": "dropdown-menu-content", sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-h-(--radix-dropdown-menu-content-available-height) origin-(--radix-dropdown-menu-content-transform-origin) z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border p-1 shadow-md', className), ...props }) }));
+    return (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { "data-slot": "dropdown-menu-content", sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground shadow-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 max-h-(--radix-dropdown-menu-content-available-height) origin-(--radix-dropdown-menu-content-transform-origin) rounded-overlay z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden border p-1', className), ...props }) }));
 }
 function DropdownMenuGroup({ ...props }) {
     return (_jsx(DropdownMenuPrimitive.Group, { "data-slot": "dropdown-menu-group", ...props }));
 }
 function DropdownMenuItem({ className, inset, variant = 'default', ...props }) {
-    return (_jsx(DropdownMenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props }));
+    return (_jsx(DropdownMenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden rounded-control text-ui-body relative flex cursor-default select-none items-center gap-2 px-2 py-1.5 data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props }));
 }
-function DropdownMenuCheckboxItem({ className, children, checked, ...props }) {
-    return (_jsxs(DropdownMenuPrimitive.CheckboxItem, { "data-slot": "dropdown-menu-checkbox-item", className: cn("focus:bg-accent focus:text-accent-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pl-8 pr-2 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), checked: checked, ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4" }) }) }), children] }));
+function DropdownMenuCheckboxItem({ className, children, checked, variant = 'default', ...props }) {
+    return (_jsxs(DropdownMenuPrimitive.CheckboxItem, { "data-slot": "dropdown-menu-checkbox-item", "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive outline-hidden rounded-control text-ui-body relative flex cursor-default select-none items-center gap-2 py-1.5 pl-8 pr-2 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), checked: checked, ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4" }) }) }), children] }));
 }
 function DropdownMenuRadioGroup({ ...props }) {
     return (_jsx(DropdownMenuPrimitive.RadioGroup, { "data-slot": "dropdown-menu-radio-group", ...props }));
 }
-function DropdownMenuRadioItem({ className, children, ...props }) {
-    return (_jsxs(DropdownMenuPrimitive.RadioItem, { "data-slot": "dropdown-menu-radio-item", className: cn("focus:bg-accent focus:text-accent-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pl-8 pr-2 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
+function DropdownMenuRadioItem({ className, children, variant = 'default', ...props }) {
+    return (_jsxs(DropdownMenuPrimitive.RadioItem, { "data-slot": "dropdown-menu-radio-item", "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive outline-hidden rounded-control text-ui-body relative flex cursor-default select-none items-center gap-2 py-1.5 pl-8 pr-2 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CircleIcon, { className: "size-2 fill-current" }) }) }), children] }));
 }
 function DropdownMenuLabel({ className, inset, ...props }) {
-    return (_jsx(DropdownMenuPrimitive.Label, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn('px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', className), ...props }));
+    return (_jsx(DropdownMenuPrimitive.Label, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn('text-ui-body px-2 py-1.5 font-medium data-[inset]:pl-8', className), ...props }));
 }
 function DropdownMenuSeparator({ className, ...props }) {
     return (_jsx(DropdownMenuPrimitive.Separator, { "data-slot": "dropdown-menu-separator", className: cn('bg-border -mx-1 my-1 h-px', className), ...props }));
 }
 function DropdownMenuShortcut({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "dropdown-menu-shortcut", className: cn('text-muted-foreground ml-auto text-xs tracking-widest', className), ...props }));
+    return (_jsx("span", { "data-slot": "dropdown-menu-shortcut", className: cn('text-muted-foreground text-ui-caption ml-auto tracking-widest', className), ...props }));
 }
 function DropdownMenuSub({ ...props }) {
     return _jsx(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
 }
-function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
-    return (_jsxs(DropdownMenuPrimitive.SubTrigger, { "data-slot": "dropdown-menu-sub-trigger", "data-inset": inset, className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto size-4" })] }));
+function DropdownMenuSubTrigger({ className, inset, children, variant = 'default', ...props }) {
+    return (_jsxs(DropdownMenuPrimitive.SubTrigger, { "data-slot": "dropdown-menu-sub-trigger", "data-inset": inset, "data-variant": variant, className: cn("focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden rounded-control text-ui-body flex cursor-default select-none items-center gap-2 px-2 py-1.5 data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto size-4" })] }));
 }
 function DropdownMenuSubContent({ className, ...props }) {
-    return (_jsx(DropdownMenuPrimitive.SubContent, { "data-slot": "dropdown-menu-sub-content", className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-dropdown-menu-content-transform-origin) z-50 min-w-[8rem] overflow-hidden rounded-md border p-1 shadow-lg', className), ...props }));
+    return (_jsx(DropdownMenuPrimitive.SubContent, { "data-slot": "dropdown-menu-sub-content", className: cn('bg-popover text-popover-foreground shadow-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-(--radix-dropdown-menu-content-transform-origin) rounded-overlay z-50 min-w-[8rem] overflow-hidden border p-1', className), ...props }));
+}
+function DropdownMenuGeneratedItems({ items, onSelectItem, }) {
+    return items.map((item) => {
+        if (item.kind === 'separator') {
+            return _jsx(DropdownMenuSeparator, {}, item.id);
+        }
+        const contents = (_jsx(MenuItemContents, { item: item, shortcutSlot: "dropdown-menu-shortcut" }));
+        const handleSelect = () => onSelectItem?.(item.id);
+        const variant = item.destructive ? 'destructive' : 'default';
+        if (item.kind === 'checkbox') {
+            return (_jsx(DropdownMenuCheckboxItem, { checked: item.checked === 'mixed' ? 'indeterminate' : item.checked, disabled: item.enabled === false, variant: variant, onSelect: handleSelect, children: contents }, item.id));
+        }
+        if (item.kind === 'radio') {
+            return (_jsx(DropdownMenuRadioGroup, { value: item.checked ? item.id : '', children: _jsx(DropdownMenuRadioItem, { value: item.id, disabled: item.enabled === false, variant: variant, onSelect: handleSelect, children: contents }) }, item.id));
+        }
+        if (item.submenu) {
+            return (_jsxs(DropdownMenuSub, { children: [_jsx(DropdownMenuSubTrigger, { disabled: item.enabled === false, variant: variant, children: contents }), _jsx(DropdownMenuSubContent, { children: _jsx(DropdownMenuGeneratedItems, { items: item.submenu, onSelectItem: onSelectItem }) })] }, item.id));
+        }
+        return (_jsx(DropdownMenuItem, { disabled: item.enabled === false, variant: variant, onSelect: handleSelect, children: contents }, item.id));
+    });
 }
 export { DropdownMenu, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, };

package/dist/components/ui/edge-fade.js

@@ -1,6 +1,6 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from '../../lib/utils';
+import { cn } from '../../lib/utils.js';
 import { cva } from 'class-variance-authority';
 const edgeFadeVariants = cva('from-background pointer-events-none absolute z-10', {
     variants: {