@optiaxiom/react 0.12.3 → 0.13.1

package/dist/esm/packages/react/src/data-table-header-cell/DataTableHeaderCell-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/data-table-header-cell/DataTableHeaderCell.css.ts.vanilla-BKGyXxhT.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/data-table-header-cell/DataTableHeaderCell.css.ts.vanilla-D8iEaYLp.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{alignItems:'center',display:'flex',gap:'4',justifyContent:'start',textAlign:'start',transition:'colors',w:'full'},'_1gf6pup','_10zqnqr']});
-var icon = recipeRuntime({base:[{h:'12',mx:'2',transition:'opacity'},'_1ahff16'],variants:{active:{false:'yjcsxq',true:'_1m4um4t'},muted:{false:{},true:'_1ghi170'}}});
+var button = recipeRuntime({base:[{alignItems:'center',display:'flex',gap:'4',justifyContent:'start',textAlign:'start',transition:'colors',w:'full'},'_1i01mwe','_14nbm67']});
+var icon = recipeRuntime({base:[{h:'12',mx:'2',transition:'opacity'},'mn8317'],variants:{active:{false:'_1sj8xtf',true:'_1edduah'},muted:{false:{},true:'_37lpdj'}}});
 
 export { button, icon };

package/dist/esm/packages/react/src/data-table-header-cell/DataTableHeaderCell.js

@@ -18,7 +18,7 @@ const DataTableHeaderCell = forwardRef(({ children, header, ...props }, ref) =>
   return /* @__PURE__ */ jsx(
     TableHeaderCell,
     {
-      "aria-sort": header.column.columnDef.enableSorting ? sortDir === false ? "none" : sortDir === "asc" ? "ascending" : "descending" : undefined,
+      "aria-sort": header.column.columnDef.enableSorting ? sortDir === false ? "none" : sortDir === "asc" ? "ascending" : "descending" : void 0,
       colSpan: header.colSpan,
       ref,
       ...props,

package/dist/esm/packages/react/src/date-input/DateInput-css.js

@@ -0,0 +1,7 @@
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/date-input/DateInput.css.ts.vanilla-BOZIK-Va.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var picker = recipeRuntime({base:'_1p2euk6'});
+
+export { picker };

package/dist/esm/packages/react/src/date-input/DateInput.js

@@ -1,9 +1,11 @@
 "use client";
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { forwardRef, useState, useRef } from 'react';
+import { Button } from '../button/Button.js';
 import { Calendar } from '../calendar/Calendar.js';
+import { Flex } from '../flex/Flex.js';
 import { IconCalendar } from '../icons/IconCalendar.js';
 import { Input } from '../input/Input.js';
 import { Popover } from '../popover/Popover.js';
@@ -13,8 +15,8 @@ import { PopoverTrigger } from '../popover-trigger/PopoverTrigger.js';
 import '../utils/conditions.js';
 import '@radix-ui/react-slot';
 import { forceValueChange } from '../utils/forceValueChange.js';
-import { useCalendarSupported } from './useCalendarSupported.js';
-import { format, parse } from './utils.js';
+import { picker } from './DateInput-css.js';
+import { parse, format } from './utils.js';
 
 const DateInput = forwardRef(
   ({ disabled, max, min, onChange, ...props }, outerRef) => {
@@ -25,25 +27,8 @@ const DateInput = forwardRef(
     });
     const innerRef = useRef(null);
     const ref = useComposedRefs(innerRef, outerRef);
-    const maxDate = max ? new Date(max) : undefined;
-    const minDate = min ? new Date(min) : undefined;
-    const supported = useCalendarSupported();
-    if (supported === null) {
-      return null;
-    } else if (!supported) {
-      return /* @__PURE__ */ jsx(
-        Input,
-        {
-          disabled,
-          max,
-          min,
-          onChange,
-          ref,
-          type: "date",
-          ...props
-        }
-      );
-    }
+    const maxDate = max ? new Date(max) : void 0;
+    const minDate = min ? new Date(min) : void 0;
     return /* @__PURE__ */ jsxs(Popover, { onOpenChange: setOpen, open: !disabled && open, children: [
       /* @__PURE__ */ jsx(PopoverAnchor, { children: /* @__PURE__ */ jsx(
         Input,
@@ -53,8 +38,10 @@ const DateInput = forwardRef(
             {
               appearance: "subtle",
               "aria-label": "Show date picker",
+              hasCustomAnchor: true,
               icon: /* @__PURE__ */ jsx(IconCalendar, {}),
-              size: "sm"
+              size: "sm",
+              ...picker()
             }
           ),
           disabled,
@@ -68,7 +55,7 @@ const DateInput = forwardRef(
             e.preventDefault();
           },
           onKeyDown: (e) => {
-            if (e.key === " ") {
+            if (e.key === " " && CSS.supports("selector(::-webkit-datetime-edit)")) {
               e.preventDefault();
               setOpen(true);
             }
@@ -78,30 +65,46 @@ const DateInput = forwardRef(
           ...props
         }
       ) }),
-      /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsxs(
         PopoverContent,
         {
+          gap: "8",
           onCloseAutoFocus: (event) => {
             event.preventDefault();
             innerRef.current?.focus();
           },
-          children: /* @__PURE__ */ jsx(
-            Calendar,
-            {
-              max: maxDate,
-              min: minDate,
-              onValueChange: (date) => {
-                if (!date) {
-                  return;
-                }
-                if (innerRef.current) {
-                  forceValueChange(innerRef?.current, format(date));
-                }
-                setOpen(false);
-              },
-              value: parse(value)
-            }
-          )
+          children: [
+            /* @__PURE__ */ jsx(
+              Calendar,
+              {
+                max: maxDate,
+                min: minDate,
+                onValueChange: (date) => {
+                  if (!date) {
+                    return;
+                  }
+                  if (innerRef.current) {
+                    forceValueChange(innerRef?.current, format(date));
+                  }
+                  setOpen(false);
+                },
+                value: parse(value)
+              }
+            ),
+            /* @__PURE__ */ jsx(Flex, { flexDirection: "row", children: /* @__PURE__ */ jsx(
+              Button,
+              {
+                appearance: "subtle",
+                onClick: () => {
+                  if (innerRef.current) {
+                    forceValueChange(innerRef.current, "");
+                  }
+                  setOpen(false);
+                },
+                children: "Clear"
+              }
+            ) })
+          ]
         }
       )
     ] });

package/dist/esm/packages/react/src/date-input/utils.js

@@ -2,8 +2,8 @@ function format(date) {
   return new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate())).toISOString().split("T")[0];
 }
 function parse(str) {
-  const rawDate = str && typeof str === "string" ? new Date(str) : undefined;
-  return isValidDate(rawDate) ? new Date(rawDate.getTime() + (/* @__PURE__ */ new Date()).getTimezoneOffset() * 60 * 1e3) : undefined;
+  const rawDate = str && typeof str === "string" ? new Date(str) : void 0;
+  return isValidDate(rawDate) ? new Date(rawDate.getTime() + (/* @__PURE__ */ new Date()).getTimezoneOffset() * 60 * 1e3) : void 0;
 }
 const isValidDate = (date) => date ? !isNaN(+date) : false;
 

package/dist/esm/packages/react/src/dialog-close/DialogClose.js

@@ -5,8 +5,8 @@ import { forwardRef } from 'react';
 import { Button } from '../button/Button.js';
 
 const DialogClose = forwardRef(
-  ({ appearance = "subtle", asChild, children, size = "lg", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(RadixDialog.Close, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, size, children }) });
+  ({ appearance = "subtle", asChild, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(RadixDialog.Close, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, children }) });
   }
 );
 DialogClose.displayName = "@optiaxiom/react/DialogClose";

package/dist/esm/packages/react/src/dialog-content/DialogContent-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/dialog-content/DialogContent.css.ts.vanilla-CSiw9TKj.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/dialog-content/DialogContent.css.ts.vanilla-Ddt9KOuM.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var backdrop = recipeRuntime({variants:{hidden:{false:{},true:'o6hni'}}});
-var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column'},'oghsik'],variants:{size:{sm:'_1rems6o',md:'_30z100',lg:'nzwz4i',fullscreen:'_1e4c3at'}}});
-var nestedDialogCountVar = 'var(--hps9xu)';
+var backdrop = recipeRuntime({variants:{hidden:{false:{},true:'_98xec9'}}});
+var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column'},'_15c5b99'],variants:{size:{sm:'_70z7xj',md:'_1gwenpx',lg:'_1y7ad04',fullscreen:'tep9ar'}}});
+var nestedDialogCountVar = 'var(--_11v06c2)';
 
 export { backdrop, content, nestedDialogCountVar };

package/dist/esm/packages/react/src/dialog-content/DialogContent.js

@@ -11,7 +11,7 @@ import { TransitionGroup } from '../transition-group/TransitionGroup.js';
 import '../utils/conditions.js';
 import '@radix-ui/react-slot';
 import { onReactSelectInputBlur } from '../utils/onReactSelectInputBlur.js';
-import { backdrop, nestedDialogCountVar, content } from './DialogContent-css.js';
+import { backdrop, content, nestedDialogCountVar } from './DialogContent-css.js';
 
 const DialogContent = forwardRef(
   ({

package/dist/esm/packages/react/src/dialog-footer/DialogFooter-css.js

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var footer = recipeRuntime({base:[{borderColor:'border.secondary',borderT:'1',flexDirection:'row',gap:'16',justifyContent:'end',px:'24',py:'20'}]});

package/dist/esm/packages/react/src/dialog-footer/DialogFooter.js

@@ -1,12 +1,13 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
+import { ButtonContextProvider } from '../button-context/ButtonContext.js';
 import { Flex } from '../flex/Flex.js';
 import { footer } from './DialogFooter-css.js';
 
 const DialogFooter = forwardRef(
   ({ children, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Flex, { ref, ...footer({}, className), ...props, children });
+    return /* @__PURE__ */ jsx(Flex, { ref, ...footer({}, className), ...props, children: /* @__PURE__ */ jsx(ButtonContextProvider, { size: "lg", children }) });
   }
 );
 DialogFooter.displayName = "@optiaxiom/react/DialogFooter";

package/dist/esm/packages/react/src/dialog-header/DialogHeader-css.js

@@ -1,10 +1,10 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/dialog-header/DialogHeader.css.ts.vanilla-DorISkI5.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/dialog-header/DialogHeader.css.ts.vanilla-G61u2gKQ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var actions = recipeRuntime({base:[{flexDirection:'row',gap:'8'},'_51nurq']});
-var close = recipeRuntime({base:['bckwzr']});
-var description = recipeRuntime({base:[{color:'fg.secondary',fontWeight:'400',w:'full'},'_1a380nf']});
-var title = recipeRuntime({base:[{flex:'1',fontWeight:'500'},'_72pyld']});
+var actions = recipeRuntime({base:[{flexDirection:'row',gap:'8'},'kquq0r']});
+var close = recipeRuntime({base:['_1aqk4ee']});
+var description = recipeRuntime({base:[{color:'fg.secondary',fontWeight:'400',w:'full'},'_1l1wphh']});
+var title = recipeRuntime({base:[{flex:'1',fontWeight:'500'},'_1ubbx9m']});
 
 export { actions, close, description, title };

package/dist/esm/packages/react/src/disclosure-content/DisclosureContent-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/disclosure-content/DisclosureContent.css.ts.vanilla-pVEbtdvl.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/disclosure-content/DisclosureContent.css.ts.vanilla-Csj_lgJn.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var inner = recipeRuntime({base:['g8pr1r']});
-var outer = recipeRuntime({base:[{display:'grid'},'_1gzndpv']});
+var inner = recipeRuntime({base:['dup0ry']});
+var outer = recipeRuntime({base:[{display:'grid'},'_2lyiss']});
 
 export { inner, outer };

package/dist/esm/packages/react/src/disclosure-content/DisclosureContent.js

@@ -10,7 +10,7 @@ import { Transition } from '../transition/Transition.js';
 import { TransitionGroup } from '../transition-group/TransitionGroup.js';
 import { outer, inner } from './DisclosureContent-css.js';
 
-const DisclosureContent = forwardRef(({ children, ...props }, ref) => {
+const DisclosureContent = forwardRef(({ children, transitionType = "slide", ...props }, ref) => {
   const { open } = useDisclosureContext("DisclosureContent");
   const [skipAnimations, setSkipAnimations] = useState(Boolean(open));
   useEffect(() => {
@@ -23,8 +23,8 @@ const DisclosureContent = forwardRef(({ children, ...props }, ref) => {
     {
       "data-side": "bottom",
       skipAnimations,
-      type: "slide",
-      children: /* @__PURE__ */ jsx(Box, { ...outer(), children: /* @__PURE__ */ jsx(Box, { asChild: true, ...inner(), children: /* @__PURE__ */ jsx(RadixCollapsible.Content, { forceMount: true, children: /* @__PURE__ */ jsx(Box, { p: "8", pt: "0", ref, ...props, children }) }) }) })
+      type: transitionType,
+      children: /* @__PURE__ */ jsx(Box, { ...outer(), children: /* @__PURE__ */ jsx(Box, { asChild: true, ...inner(), children: /* @__PURE__ */ jsx(RadixCollapsible.Content, { forceMount: true, children: /* @__PURE__ */ jsx(Box, { p: "8", ref, ...props, children }) }) }) })
     }
   ) });
 });

package/dist/esm/packages/react/src/disclosure-trigger/DisclosureTrigger-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/disclosure-trigger/DisclosureTrigger.css.ts.vanilla-BXvVttwC.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/disclosure-trigger/DisclosureTrigger.css.ts.vanilla-CPpShJkA.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var icon = recipeRuntime({base:[{transition:'transform'}],variants:{chevronPosition:{end:'u6a9lp',start:'_1jb6nw8'}}});
-var trigger = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',fontWeight:'500',gap:'4',p:'8',px:'4',rounded:'md',textAlign:'start',w:'full',z:'10'},'_190hddc']});
+var icon = recipeRuntime({base:[{transition:'transform'}],variants:{chevronPosition:{end:'_8jjarh',start:'_1krvtd4'}}});
+var trigger = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',fontWeight:'500',gap:'8',h:'lg',px:'8',transition:'colors'},'_1bhnclw']});
 
 export { icon, trigger };

package/dist/esm/packages/react/src/disclosure-trigger/DisclosureTrigger.js

@@ -1,12 +1,14 @@
 "use client";
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import * as RadixCollapsible from '@radix-ui/react-collapsible';
 import { forwardRef } from 'react';
 import { Box } from '../box/Box.js';
-import { extractBoxProps } from '../box/extractBoxProps.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+import { Cover } from '../cover/Cover.js';
 import { useDisclosureContext } from '../disclosure-context/DisclosureContext.js';
 import { Flex } from '../flex/Flex.js';
-import { IconAngleDown } from '../icons/IconAngleDown.js';
+import { IconAngleLeft } from '../icons/IconAngleLeft.js';
 import { IconAngleRight } from '../icons/IconAngleRight.js';
 import { trigger, icon } from './DisclosureTrigger-css.js';
 
@@ -20,14 +22,27 @@ const DisclosureTrigger = forwardRef(
     ...props
   }, ref) => {
     useDisclosureContext("DisclosureTrigger");
-    const { boxProps, restProps } = extractBoxProps(props);
-    const startIcon = addonBefore || chevronPosition === "start" && !addonAfter && /* @__PURE__ */ jsx(IconAngleRight, {});
-    const endIcon = addonAfter || chevronPosition === "end" && /* @__PURE__ */ jsx(IconAngleDown, {});
-    return /* @__PURE__ */ jsx(Flex, { asChild: true, ...trigger({}, className), ...boxProps, children: /* @__PURE__ */ jsxs(RadixCollapsible.Trigger, { ref, ...restProps, children: [
-      startIcon && /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ chevronPosition }), children: startIcon }),
-      /* @__PURE__ */ jsx(Box, { flex: "1", px: "4", children }),
-      endIcon && /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ chevronPosition }), children: endIcon })
-    ] }) });
+    return /* @__PURE__ */ jsxs(Flex, { ref, ...trigger({}, className), ...props, children: [
+      addonBefore,
+      /* @__PURE__ */ jsx(
+        Flex,
+        {
+          asChild: true,
+          flexDirection: "row",
+          fontWeight: "inherit",
+          gap: "4",
+          rounded: "md",
+          textAlign: "start",
+          w: "full",
+          children: /* @__PURE__ */ jsx(Cover, { asChild: true, overlay: true, children: /* @__PURE__ */ jsxs(RadixCollapsible.Trigger, { children: [
+            chevronPosition === "start" && /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ chevronPosition }), children: /* @__PURE__ */ jsx(IconAngleRight, {}) }),
+            /* @__PURE__ */ jsx(Box, { flex: "1", children }),
+            chevronPosition === "end" && /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ chevronPosition }), children: /* @__PURE__ */ jsx(IconAngleLeft, {}) })
+          ] }) })
+        }
+      ),
+      addonAfter
+    ] });
   }
 );
 DisclosureTrigger.displayName = "@optiaxiom/react/DisclosureTrigger";

package/dist/esm/packages/react/src/drawer-actions/DrawerActions-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/drawer-actions/DrawerActions.css.ts.vanilla-DAILLjBX.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/drawer-actions/DrawerActions.css.ts.vanilla-CTcFfMDy.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var actions = recipeRuntime({base:[{flexDirection:'row-reverse',gap:'8'},'_1c1u2v4']});
+var actions = recipeRuntime({base:[{flexDirection:'row-reverse',gap:'8'},'szdg3n']});
 
 export { actions };

package/dist/esm/packages/react/src/drawer-content/DrawerContent-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/drawer-content/DrawerContent.css.ts.vanilla-ChTEpkKe.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/drawer-content/DrawerContent.css.ts.vanilla-DwoG5d6e.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column'},'xao5jf'],variants:{position:{bottom:[{borderT:'1'},'_1eq3db4'],left:[{borderR:'1',h:'full',maxW:['full','lg'],w:['full','3/4']},'_1vi5t70'],right:[{borderL:'1',h:'full',maxW:['full','lg'],w:['full','3/4']},'_10qpio6']}}});
+var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column'},'_1clxqmh'],variants:{position:{bottom:[{borderT:'1'},'_1pqtk9t'],left:[{borderR:'1',h:'full',maxW:['full','lg'],w:['full','3/4']},'_36isd0'],right:[{borderL:'1',h:'full',maxW:['full','lg'],w:['full','3/4']},'_1npfroe']}}});
 
 export { content };

package/dist/esm/packages/react/src/drawer-description/DrawerDescription-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/drawer-description/DrawerDescription.css.ts.vanilla-ltxoq8Jd.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/drawer-description/DrawerDescription.css.ts.vanilla-BmdcM6zv.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var description = recipeRuntime({base:[{color:'fg.secondary',fontWeight:'400',w:'full'},'_1bh55qh']});
+var description = recipeRuntime({base:[{color:'fg.secondary',fontWeight:'400',w:'full'},'_1n4r38c']});
 
 export { description };

package/dist/esm/packages/react/src/drawer-title/DrawerTitle-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Cd9ocVF0.css';
-import './../../../../assets/src/drawer-title/DrawerTitle.css.ts.vanilla-CEIDs9yR.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BapI6-Q5.css';
+import './../../../../assets/src/drawer-title/DrawerTitle.css.ts.vanilla-CM3wsGna.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var title = recipeRuntime({base:[{flex:'1'},'_1i5fu7q']});
+var title = recipeRuntime({base:[{flex:'1'},'_17m27gc']});
 
 export { title };

package/dist/esm/packages/react/src/dropdown-menu/DropdownMenu.js

@@ -2,6 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
+import { useState } from 'react';
 import { DropdownMenuContextProvider } from '../dropdown-menu-context/DropdownMenuContext.js';
 
 function DropdownMenu({
@@ -16,7 +17,16 @@ function DropdownMenu({
     onChange: onOpenChange,
     prop: openProp
   });
-  return /* @__PURE__ */ jsx(RadixMenu.Root, { onOpenChange: setOpen, open, ...props, children: /* @__PURE__ */ jsx(DropdownMenuContextProvider, { open, children }) });
+  const [presence, setPresence] = useState();
+  return /* @__PURE__ */ jsx(RadixMenu.Root, { onOpenChange: setOpen, open, ...props, children: /* @__PURE__ */ jsx(
+    DropdownMenuContextProvider,
+    {
+      open,
+      presence,
+      setPresence,
+      children
+    }
+  ) });
 }
 DropdownMenu.displayName = "@optiaxiom/react/DropdownMenu";
 

package/dist/esm/packages/react/src/dropdown-menu-checkbox-item/DropdownMenuCheckboxItem.js

@@ -2,10 +2,10 @@
 import { jsx } from 'react/jsx-runtime';
 import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import { forwardRef } from 'react';
-import { ListboxCheckboxItem } from '../listbox-checkbox-item/ListboxCheckboxItem.js';
+import { ListboxSwitchItem } from '../listbox-switch-item/ListboxSwitchItem.js';
 
 const DropdownMenuCheckboxItem = forwardRef(({ children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(RadixMenu.CheckboxItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(ListboxCheckboxItem, { children }) });
+  return /* @__PURE__ */ jsx(RadixMenu.CheckboxItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(ListboxSwitchItem, { children }) });
 });
 DropdownMenuCheckboxItem.displayName = "@optiaxiom/react/DropdownMenuCheckboxItem";
 

package/dist/esm/packages/react/src/dropdown-menu-content/DropdownMenuContent.js

@@ -11,17 +11,40 @@ import { Spinner } from '../spinner/Spinner.js';
 import { TransitionGroup } from '../transition-group/TransitionGroup.js';
 
 const DropdownMenuContent = forwardRef(({ align = "start", children, loading, ...props }, ref) => {
-  const { open } = useDropdownMenuContext("DropdownMenuContent");
-  return /* @__PURE__ */ jsx(TransitionGroup, { open, children: /* @__PURE__ */ jsx(RadixMenu.Portal, { forceMount: true, children: /* @__PURE__ */ jsx(
-    MenuListbox,
+  const { open, presence, setPresence } = useDropdownMenuContext(
+    "DropdownMenuContent"
+  );
+  return /* @__PURE__ */ jsx(
+    TransitionGroup,
     {
-      asChild: true,
-      minW: loading ? "trigger" : undefined,
-      provider: "dropdown-menu",
-      ...props,
-      children: /* @__PURE__ */ jsx(RadixMenu.Content, { align, ref, sideOffset: 4, children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children })
+      onPresenceChange: setPresence,
+      open,
+      presence,
+      children: /* @__PURE__ */ jsx(RadixMenu.Portal, { forceMount: true, children: /* @__PURE__ */ jsx(
+        MenuListbox,
+        {
+          asChild: true,
+          minW: loading ? "trigger" : void 0,
+          provider: "dropdown-menu",
+          ...props,
+          children: /* @__PURE__ */ jsx(
+            RadixMenu.Content,
+            {
+              align,
+              onPointerMove: (event) => {
+                if (!open) {
+                  event.preventDefault();
+                }
+              },
+              ref,
+              sideOffset: 4,
+              children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children
+            }
+          )
+        }
+      ) })
     }
-  ) }) });
+  );
 });
 DropdownMenuContent.displayName = "@optiaxiom/react/DropdownMenuContent";
 

package/dist/esm/packages/react/src/dropdown-menu-item/DropdownMenuItem.js

@@ -2,10 +2,29 @@
 import { jsx } from 'react/jsx-runtime';
 import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import { forwardRef } from 'react';
+import { useDropdownMenuContext } from '../dropdown-menu-context/DropdownMenuContext.js';
 import { ListboxItem } from '../listbox-item/ListboxItem.js';
 
 const DropdownMenuItem = forwardRef(({ asChild, children, onSelect, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(ListboxItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(RadixMenu.Item, { asChild, onSelect, children }) });
+  const { open } = useDropdownMenuContext("DropdownMenuItem");
+  return /* @__PURE__ */ jsx(ListboxItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(
+    RadixMenu.Item,
+    {
+      asChild,
+      onPointerLeave: (event) => {
+        if (!open) {
+          event.preventDefault();
+        }
+      },
+      onPointerMove: (event) => {
+        if (!open) {
+          event.preventDefault();
+        }
+      },
+      onSelect,
+      children
+    }
+  ) });
 });
 DropdownMenuItem.displayName = "@optiaxiom/react/DropdownMenuItem";
 

package/dist/esm/packages/react/src/dropdown-menu-trigger/DropdownMenuTrigger.js

@@ -3,9 +3,20 @@ import { jsx } from 'react/jsx-runtime';
 import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import { forwardRef } from 'react';
 import { AngleMenuButton } from '../angle-menu-button/AngleMenuButton.js';
+import { useDropdownMenuContext } from '../dropdown-menu-context/DropdownMenuContext.js';
 
 const DropdownMenuTrigger = forwardRef(({ asChild, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(RadixMenu.Trigger, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(AngleMenuButton, { children }) });
+  const { presence } = useDropdownMenuContext("DropdownMenuTrigger");
+  return /* @__PURE__ */ jsx(
+    RadixMenu.Trigger,
+    {
+      asChild: true,
+      "data-expanded": presence ? "" : void 0,
+      ref,
+      ...props,
+      children: asChild ? children : /* @__PURE__ */ jsx(AngleMenuButton, { children })
+    }
+  );
 });
 DropdownMenuTrigger.displayName = "@optiaxiom/react/DropdownMenuTrigger";
 

package/dist/esm/packages/react/src/field/Field.js

@@ -44,11 +44,11 @@ const Field = forwardRef(
         FieldContext.Provider,
         {
           value: {
-            descriptionId: description ? descriptionId : undefined,
+            descriptionId: description ? descriptionId : void 0,
             error: !!error,
-            errorId: error ? errorId : undefined,
+            errorId: error ? errorId : void 0,
             inputId,
-            labelId: label ? labelId : undefined
+            labelId: label ? labelId : void 0
           },
           children
         }

package/dist/esm/packages/react/src/field-context/FieldContext.js

@@ -1,6 +1,6 @@
 "use client";
 import { createContext } from 'react';
 
-const FieldContext = createContext(undefined);
+const FieldContext = createContext(void 0);
 
 export { FieldContext };

package/dist/esm/packages/react/src/heading/Heading.js

@@ -8,22 +8,18 @@ const mapLevelToTag = {
   "1": "h1",
   "2": "h2",
   "3": "h3",
-  "4": "h4",
-  "5": "h5",
-  "6": "h6"
+  "4": "h4"
 };
 const mapLevelToFontSize = {
-  "1": "5xl",
-  "2": "4xl",
-  "3": "3xl",
-  "4": "2xl",
-  "5": "xl",
-  "6": "md"
+  "1": "4xl",
+  "2": "3xl",
+  "3": "2xl",
+  "4": "xl"
 };
 const Heading = forwardRef(
   ({ asChild, children, level = "1", ...props }, ref) => {
-    const Comp = asChild ? Slot : mapLevelToTag[level];
-    const fontSize = mapLevelToFontSize[level];
+    const Comp = asChild ? Slot : mapLevelToTag[level] ?? "h1";
+    const fontSize = mapLevelToFontSize[level] ?? "4xl";
     return /* @__PURE__ */ jsx(Text, { asChild: true, fontSize, fontWeight: "700", ref, ...props, children: /* @__PURE__ */ jsx(Comp, { children }) });
   }
 );