@optiaxiom/react 1.4.1 → 1.4.3

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/input/InputControl.css.ts.vanilla-DbwVhapt.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/input/InputControl.css.ts.vanilla-Wa1_QyF_.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:['o227hd',{bg:'transparent',flex:'auto',w:'full'},'l0v3bk','_196o9e0'],variants:{size:{md:{},lg:{},xl:['jbs18c']}}});
+var control = recipeRuntime({base:['_1vktm88',{bg:'transparent',flex:'auto',w:'full'},'_1lll19f','zoudb2'],variants:{size:{md:{},lg:{},xl:['q25nzi']}}});
 
 export { control };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-CbMg3mAn.css';
-import './../../../../assets/src/input/InputControl.css.ts.vanilla-DbwVhapt.css';
-import './../../../../assets/src/input/InputRoot.css.ts.vanilla-DM6baKq4.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-IBpgBir4.css';
+import './../../../../assets/src/input/InputControl.css.ts.vanilla-Wa1_QyF_.css';
+import './../../../../assets/src/input/InputRoot.css.ts.vanilla-Dy7oEZeq.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'iz3m8b']});
+var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'_1432uh5']});
 
 export { root };

package/dist/esm/packages/react/src/kbd/Kbd-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-EtR-xQEZ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-DFjOPmaR.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var kbd = recipeRuntime({base:{alignItems:'center',color:'fg.secondary',display:'inline-flex',flexDirection:'row',fontFamily:'sans',gap:'2',whiteSpace:'nowrap'},variants:{variant:{outline:[{bg:'bg.secondary',border:'1',borderB:'2',borderColor:'border.secondary',px:'6',rounded:'sm'},'_1iwluyt'],subtle:{}}}});
-var keys = recipeRuntime({base:'_1wday1q'});
+var kbd = recipeRuntime({base:{alignItems:'center',color:'fg.secondary',display:'inline-flex',flexDirection:'row',fontFamily:'sans',gap:'2',whiteSpace:'nowrap'},variants:{variant:{outline:[{bg:'bg.secondary',border:'1',borderB:'2',borderColor:'border.secondary',px:'6',rounded:'sm'},'_2nyqbw'],subtle:{}}}});
+var keys = recipeRuntime({base:'_1d3g38i'});
 
 export { kbd, keys };

package/dist/esm/packages/react/src/label-menu-button/LabelMenuButton-css.js

@@ -1,10 +1,10 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-CbMg3mAn.css';
-import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-BSPjnfiO.css';
-import './../../../../assets/src/label-menu-button/LabelMenuButton.css.ts.vanilla-BAbMKRAc.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-IBpgBir4.css';
+import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-IgsbjOjl.css';
+import './../../../../assets/src/label-menu-button/LabelMenuButton.css.ts.vanilla-U1vqNEPQ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{justifyContent:'space-between'},'_1kpuxgi']});
+var button = recipeRuntime({base:[{justifyContent:'space-between'},'_1uenckb']});
 var content = recipeRuntime({base:[{fontSize:'sm',transition:'all'}],variants:{filled:{false:{h:'0'},true:{h:'16'}}}});
 var label = recipeRuntime({base:[{color:'fg.secondary',cursor:'pointer',maxW:'full',transition:'all'}],variants:{filled:{false:{fontSize:'md'},true:{fontSize:'xs'}}}});
 

package/dist/esm/packages/react/src/layers/layers-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
 
 var axiom = 'optiaxiom';
 var base = 'optiaxiom.base';
-var components = 'optiaxiom._1oq02a0';
-var reset = 'optiaxiom.sltn0y';
+var components = 'optiaxiom.kej491';
+var reset = 'optiaxiom._1u1itbv';
 var theme = 'optiaxiom.theme';
 
 export { axiom, base, components, reset, theme };

package/dist/esm/packages/react/src/layout/Layouts-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/layout/Layouts.css.ts.vanilla-T359hyuu.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/layout/Layouts.css.ts.vanilla-8_-PISER.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var layout = recipeRuntime({base:[{bg:'bg.page',display:'flex',flexDirection:'column',fontSize:'md'},'_1gxoz83']});
+var layout = recipeRuntime({base:[{bg:'bg.page',display:'flex',flexDirection:'column',fontSize:'md'},'_7x85lh']});
 
 export { layout };

package/dist/esm/packages/react/src/link/Link-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/link/Link.css.ts.vanilla-DRwyALER.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/link/Link.css.ts.vanilla-DCcetJvT.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'_1ea4j17']});
-var link = recipeRuntime({base:['_1kprz7b','wog1xa'],variants:{appearance:{'default':'_1cpd9vv',inverse:'_1ws5xze',subtle:'_6ooxou'}}});
+var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'_1frfg1']});
+var link = recipeRuntime({base:['kx44qz','bp38et'],variants:{appearance:{'default':'_15bsmyh',inverse:'iz044i',subtle:'tzft97'}}});
 
 export { icon, link };

package/dist/esm/packages/react/src/listbox/ListboxCheckboxItem-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/listbox/ListboxCheckboxItem.css.ts.vanilla-Dp-MSd5L.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/listbox/ListboxCheckboxItem.css.ts.vanilla-cqYDOJN9.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var checkbox = recipeRuntime({base:[{display:'inline-flex'},'_59yv9z']});
+var checkbox = recipeRuntime({base:[{display:'inline-flex'},'m86koj']});
 
 export { checkbox };

package/dist/esm/packages/react/src/listbox/ListboxItem-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/listbox/ListboxItem.css.ts.vanilla-7MEw3am_.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/listbox/ListboxItem.css.ts.vanilla-DfYre0Yx.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var description = recipeRuntime({base:[{fontSize:'sm'},'_98fj3n']});
-var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'e9o9d5'],variants:{intent:{danger:'tin24',neutral:'i26mnj'}}});
-var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'pdoxcm']});
+var description = recipeRuntime({base:[{fontSize:'sm'},'e8o4gf']});
+var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'_141e5ud'],variants:{intent:{danger:'zrlky0',neutral:'vson0'}}});
+var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'gioeys']});
 
 export { description, item, title };

package/dist/esm/packages/react/src/listbox/ListboxItemIndicator-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/listbox/ListboxItemIndicator.css.ts.vanilla-CeKd3eGS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/listbox/ListboxItemIndicator.css.ts.vanilla--HSsA9eL.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var indicator = recipeRuntime({base:['_186kg55'],variants:{active:{false:{},true:'_19f07po'}}});
+var indicator = recipeRuntime({base:['_16c3aep'],variants:{active:{false:{},true:'_8cecnh'}}});
 
 export { indicator };

package/dist/esm/packages/react/src/listbox/ListboxItemized.js

@@ -45,7 +45,7 @@ const ListboxItemized = forwardRef(
             children: /* @__PURE__ */ jsx(Skeleton, {})
           },
           item
-        )) }) : typeof children === "function" ? items.length > VIRTUALIZE_THRESHOLD ? /* @__PURE__ */ jsx(ListboxVirtualized, { highlightedItem, items, children }) : items.length > 0 ? items.map((item, index) => /* @__PURE__ */ jsx(Fragment$1, { children: children(item, index) }, itemToKey(item))) : /* @__PURE__ */ jsx(ListboxEmpty, { children: empty }) : items.length > 0 ? children : /* @__PURE__ */ jsx(ListboxEmpty, { children: empty })
+        )) }) : typeof children === "function" ? items.length > VIRTUALIZE_THRESHOLD ? /* @__PURE__ */ jsx(ListboxVirtualized, { highlightedItem, items, children }) : items.length > 0 ? items.map((item, index) => /* @__PURE__ */ jsx(Fragment$1, { children: children(item, items[index - 1]) }, itemToKey(item))) : /* @__PURE__ */ jsx(ListboxEmpty, { children: empty }) : items.length > 0 ? children : /* @__PURE__ */ jsx(ListboxEmpty, { children: empty })
       }
     );
   }

package/dist/esm/packages/react/src/listbox/ListboxVirtualized.js

@@ -73,7 +73,7 @@ const ListboxVirtualized = forwardRef(({ children, highlightedItem, items, ...pr
         {
           "data-index": virtualItem.index,
           ref: rowVirtualizer.measureElement,
-          children: children(items[virtualItem.index], virtualItem.index)
+          children: children(items[virtualItem.index], items[virtualItem.index - 1])
         },
         virtualItem.key
       ))

package/dist/esm/packages/react/src/listbox/utils.js

@@ -0,0 +1,16 @@
+const shouldShowSeparator = (group, prevItem) => {
+  const isFirstItem = !prevItem;
+  return !isFirstItem && !isSameGroup(group, prevItem?.group) && (group?.separator || prevItem?.group?.separator);
+};
+const shouldShowGroup = (group, prevItem) => {
+  const show = !isSameGroup(group, prevItem?.group);
+  return show && !!group && !group.hidden;
+};
+const isSameGroup = (group1, group2) => {
+  if (group1 === group2) {
+    return true;
+  }
+  return group1?.label === group2?.label;
+};
+
+export { shouldShowGroup, shouldShowSeparator };

package/dist/esm/packages/react/src/menu/Menu.js

@@ -109,9 +109,9 @@ function Menu({
     {
       inputRef,
       inputVisible,
-      onSelect: (item, { close }) => {
-        item.execute?.({ inputValue });
-        if (typeof openProp === "undefined" && close) {
+      onSelect: (item, { dismiss }) => {
+        item.execute?.({ dismiss, inputValue });
+        if (typeof openProp === "undefined" && dismiss) {
           setOpen(false);
         }
       },
@@ -127,7 +127,7 @@ function Menu({
             setSubMenuOpen(!!item.subOptions?.length);
           },
           onInputValueChange: setInputValue,
-          onSelect: (item, { close }) => {
+          onSelect: (item, { dismiss }) => {
             if (item.subOptions?.length) {
               if (size === "lg") {
                 setActiveItems(item.subOptions);
@@ -135,8 +135,8 @@ function Menu({
                 setSubMenuOpen(true);
               }
             } else {
-              item.execute?.({ inputValue });
-              if (typeof openProp === "undefined" && close) {
+              item.execute?.({ dismiss, inputValue });
+              if (typeof openProp === "undefined" && dismiss) {
                 setOpen(false);
               }
             }

package/dist/esm/packages/react/src/menu/MenuCheckboxItem.js

@@ -28,7 +28,7 @@ const MenuCheckboxItem = forwardRef(({ children, ...props }, ref) => {
       addonBefore: props.item.addon,
       asChild: true,
       description: props.item.description,
-      onCheckedChange: () => !resolveItemProperty(props.item.disabledReason) && props.item.execute?.({ inputValue }),
+      onCheckedChange: () => !resolveItemProperty(props.item.disabledReason) && props.item.execute?.({ dismiss: false, inputValue }),
       children: /* @__PURE__ */ jsx(Comp, { ...props.item.link && { href: props.item.link }, children })
     }
   ) });

package/dist/esm/packages/react/src/menu/MenuContent.js

@@ -12,7 +12,7 @@ import { MenuPopoverContent } from './MenuPopoverContent.js';
 import { useMenuSubContext } from './MenuSubContext.js';
 
 const MenuContent = forwardRef(
-  ({ children, ...props }, ref) => {
+  ({ children, onPointerDown, ...props }, ref) => {
     const { labelId } = useFieldContext("@optiaxiom/react/MenuContent");
     const { inputVisible, placeholder, size } = useMenuContext(
       "@optiaxiom/react/MenuContent"
@@ -26,6 +26,16 @@ const MenuContent = forwardRef(
       Comp,
       {
         "aria-labelledby": labelId,
+        onPointerDown: (event) => {
+          onPointerDown?.(event);
+          if (event.defaultPrevented) {
+            return;
+          }
+          if (event.target instanceof HTMLElement && event.target.closest('[role="option"]')) {
+            return;
+          }
+          event.preventDefault();
+        },
         overflow: "hidden",
         p: size === "sm" ? "4" : "0",
         ref,

package/dist/esm/packages/react/src/menu/MenuInput-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/menu/MenuInput.css.ts.vanilla-qciwAS7G.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/menu/MenuInput.css.ts.vanilla-ALP4hTWK.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var input = recipeRuntime({variants:{size:{sm:{m:'4'},lg:[{border:'0',borderB:'1',borderColor:'border.secondary',rounded:'none'},'bnzhx9']}}});
+var input = recipeRuntime({variants:{size:{sm:{m:'4'},lg:[{border:'0',borderB:'1',borderColor:'border.secondary',rounded:'none'},'_18i5kkb']}}});
 
 export { input };

package/dist/esm/packages/react/src/menu/MenuListbox.js

@@ -18,6 +18,7 @@ import { ListboxLabel } from '../listbox/ListboxLabel.js';
 import '../listbox/ListboxRadioItem.js';
 import { ListboxSeparator } from '../listbox/ListboxSeparator.js';
 import '../listbox/ListboxSwitchItem.js';
+import { shouldShowSeparator, shouldShowGroup } from '../listbox/utils.js';
 import { Tooltip } from '../tooltip/Tooltip.js';
 import '../tooltip/TooltipContent.js';
 import '../tooltip/TooltipProvider.js';
@@ -32,28 +33,12 @@ import { MenuSub } from './MenuSub.js';
 const MenuListbox = forwardRef(
   ({ children, ...props }, ref) => {
     const { size } = useMenuContext("@optiaxiom/react/MenuListbox");
-    let isFirstItem = true;
-    let lastGroup = void 0;
-    const shouldShowSeparator = (group) => {
-      const show = !isFirstItem;
-      isFirstItem = false;
-      return show && group !== lastGroup && (group?.separator || lastGroup?.separator);
-    };
-    const shouldShowGroup = (group) => {
-      const show = group !== lastGroup;
-      lastGroup = group;
-      return show && !!group && !group?.hidden;
-    };
-    return /* @__PURE__ */ jsx(CommandListbox, { ref, ...props, children: children ?? ((item, index) => {
-      if (index === 0) {
-        isFirstItem = true;
-        lastGroup = void 0;
-      }
+    return /* @__PURE__ */ jsx(CommandListbox, { ref, ...props, children: children ?? ((item, prevItem) => {
       const Comp = item.subOptions?.length ? size === "sm" ? MenuSub : MenuItem : "selected" in item ? item.multi ? MenuCheckboxItem : MenuRadioItem : MenuItem;
       const group = item.group;
       return /* @__PURE__ */ jsxs(Fragment, { children: [
-        shouldShowSeparator(group) && /* @__PURE__ */ jsx(ListboxSeparator, {}),
-        shouldShowGroup(group) && /* @__PURE__ */ jsx(ListboxLabel, { children: group.name }),
+        shouldShowSeparator(group, prevItem) && /* @__PURE__ */ jsx(ListboxSeparator, {}),
+        shouldShowGroup(group, prevItem) && /* @__PURE__ */ jsx(ListboxLabel, { children: group.label }),
         Comp === MenuSub ? /* @__PURE__ */ jsx(Comp, { item }) : /* @__PURE__ */ jsx(Tooltip, { content: resolveItemProperty(item.disabledReason), children: /* @__PURE__ */ jsx(Comp, { item }) })
       ] });
     }) });

package/dist/esm/packages/react/src/menu/MenuSubContent.js

@@ -53,6 +53,15 @@ const MenuSubContent = forwardRef(
           parentInputRef.current?.focus();
         },
         onEscapeKeyDown: () => setRootMenuOpen(false),
+        onPointerDown: (event) => {
+          if (event.defaultPrevented) {
+            return;
+          }
+          if (event.target instanceof HTMLElement && event.target.closest('[role="option"]')) {
+            return;
+          }
+          event.preventDefault();
+        },
         onPointerEnter: () => {
           if (item.subOptionsInputVisible) {
             inputRef.current?.focus();
@@ -82,11 +91,11 @@ const MenuSubContent = forwardRef(
               parentInputRef.current?.focus();
               setInputValue(inputValue);
             },
-            onSelect: (item2, { close }) => {
+            onSelect: (item2, { dismiss }) => {
               if (item2.subOptions?.length) {
                 setSubMenuOpen(true);
               } else {
-                onSelect(item2, { close });
+                onSelect(item2, { dismiss });
               }
             },
             open: true,

package/dist/esm/packages/react/src/menu/MenuSubTrigger.js

@@ -12,7 +12,15 @@ import { usePopoverContext } from '../popover/PopoverContext.js';
 import { MenuItem } from './MenuItem.js';
 
 const MenuSubTrigger = forwardRef(
-  ({ children, contentRef, item, onPointerDown, ...props }, ref) => {
+  ({
+    children,
+    contentRef,
+    item,
+    onPointerDown,
+    onPointerEnter,
+    onPointerLeave,
+    ...props
+  }, ref) => {
     const { downshift, highlightedItem, pauseInteractionRef } = useCommandContext("@optiaxiom/react/MenuSubTrigger");
     const { open } = usePopoverContext("@optiaxiom/react/MenuSubTrigger");
     return /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(FilteredSlot, { exclude: "type", children: /* @__PURE__ */ jsx(
@@ -26,13 +34,15 @@ const MenuSubTrigger = forwardRef(
             event.preventDefault();
           }
         },
-        onPointerEnter: () => {
+        onPointerEnter: (event) => {
+          onPointerEnter?.(event);
           if (highlightedItem !== item) {
             return;
           }
           downshift.selectItem(item);
         },
         onPointerLeave: (event) => {
+          onPointerLeave?.(event);
           const box = contentRef.current?.getBoundingClientRect();
           if (!box) {
             return;

package/dist/esm/packages/react/src/modal/ModalListbox-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/modal/ModalListbox.css.ts.vanilla-BhmlfHSo.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/modal/ModalListbox.css.ts.vanilla--BNwNv-w.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'hawas2'],variants:{maxH:{xs:'jwvftg',sm:'_3s5dg8',md:'_12wvsun',lg:'baa4ym',full:{}},minW:{'0':{},trigger:'_1s9qhgp'},provider:{'dropdown-menu':'n5n7bc',popover:'w6l9o8',popper:'_1r441ge'}}});
+var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'jcy4i4'],variants:{maxH:{xs:'_31x040',sm:'_18jp6a3',md:'_123m2u1',lg:'_1bj3884',full:{}},minW:{'0':{},trigger:'j5i0o4'},provider:{'dropdown-menu':'vzx5qq',popover:'_97s4ak',popper:'dnd2wx'}}});
 
 export { listbox };

package/dist/esm/packages/react/src/nav/Nav-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/nav/Nav.css.ts.vanilla-CA3M5RMi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/nav/Nav.css.ts.vanilla-B1FDIQBm.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var nav = recipeRuntime({base:[{bg:'bg.default',flex:'1',gap:'0',overflow:'hidden',pb:'8',pt:'16'},'_90mwug']});
+var nav = recipeRuntime({base:[{bg:'bg.default',flex:'1',gap:'0',overflow:'hidden',pb:'8',pt:'16'},'z912e2']});
 
 export { nav };

package/dist/esm/packages/react/src/nav/NavAccountItem-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/nav/NavAccountItem.css.ts.vanilla-DkOGnUhV.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/nav/NavAccountItem.css.ts.vanilla-BhP4ypVY.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:{flex:'1',flexDirection:'row',fontSize:'md',gap:'8',overflowX:'hidden',transition:'opacity'},variants:{expanded:{false:'_1w1lfph',true:'wwsj29'}}});
+var item = recipeRuntime({base:{flex:'1',flexDirection:'row',fontSize:'md',gap:'8',overflowX:'hidden',transition:'opacity'},variants:{expanded:{false:'ny579n',true:'_1cw7px8'}}});
 
 export { item };

package/dist/esm/packages/react/src/nav/NavBody-css.js

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var body = recipeRuntime({base:[{flex:'1',gap:'4',justifyContent:'flex-start',overflowX:'hidden',py:'8',w:'full'}],variants:{expanded:{false:{overflowY:'hidden'},true:{overflowY:'auto'}}}});

package/dist/esm/packages/react/src/nav/NavItem-css.js

@@ -1,10 +1,10 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-CbMg3mAn.css';
-import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-BSPjnfiO.css';
-import './../../../../assets/src/nav/NavItem.css.ts.vanilla-BmhlgdcD.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-IBpgBir4.css';
+import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-IgsbjOjl.css';
+import './../../../../assets/src/nav/NavItem.css.ts.vanilla-xe-6pOni.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:[{alignItems:'center',display:'flex',fontSize:'md',fontWeight:'500',h:'lg',justifyContent:'flex-start',rounded:'md',textAlign:'start',transition:'colors'},'h0tdfa']});
-var label = recipeRuntime({base:[{alignItems:'center',display:'flex',flex:'1',gap:'10',justifyContent:'space-between',mr:'10',overflow:'hidden'},'_3lvnig'],variants:{expanded:{false:'_1ty8ba',true:'_64rvma'}}});
+var item = recipeRuntime({base:[{alignItems:'center',display:'flex',fontSize:'md',fontWeight:'500',h:'lg',justifyContent:'flex-start',rounded:'md',textAlign:'start',transition:'colors'},'_8tg77p']});
+var label = recipeRuntime({base:[{alignItems:'center',display:'flex',flex:'1',gap:'10',justifyContent:'space-between',mr:'10',overflow:'hidden'},'_1afxijo'],variants:{expanded:{false:'acooeg',true:'_6iin3r'}}});
 
 export { item, label };

package/dist/esm/packages/react/src/pagination/Pagination-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-BQVW2oFL.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-DISVIxXO.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{justifyContent:'center'},'hawvpe']});
-var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'rxh5kv'],variants:{animation:{false:{},true:{transition:'transform'}}}});
-var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'_11vt49a']});
+var button = recipeRuntime({base:[{justifyContent:'center'},'_1ntb1np']});
+var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'lrdxd0'],variants:{animation:{false:{},true:{transition:'transform'}}}});
+var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'j4knir']});
 
 export { button, cursor, list };

package/dist/esm/packages/react/src/paper/Paper-css.js

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var paper = recipeRuntime({base:{bg:'bg.default',color:'fg.default',shadow:'md',z:'popover'},variants:{elevation:{dialog:{rounded:'lg'},menu:{border:'1',borderColor:'border.secondary',rounded:'lg'},screen:{}}}});

package/dist/esm/packages/react/src/pill/Pill-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/pill/Pill.css.ts.vanilla-DpualKyi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/pill/Pill.css.ts.vanilla-Bw1DRUCB.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var pill = recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'sm',gap:'4',px:'6',rounded:'md',whiteSpace:'nowrap'},'_60mbxn'],variants:{size:{xs:{h:'xs'},sm:{h:'sm'}}}});
+var pill = recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'sm',gap:'4',px:'6',rounded:'md',whiteSpace:'nowrap'},'df5s95'],variants:{size:{xs:{h:'xs'},sm:{h:'sm'}}}});
 
 export { pill };

package/dist/esm/packages/react/src/progress/Progress-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/progress/Progress.css.ts.vanilla-D-NgPzhe.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/progress/Progress.css.ts.vanilla-r1fPZXy2.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var indicator = recipeRuntime({base:[{h:'full',transition:'all'}],variants:{intent:{danger:{bg:'bg.error'},primary:{bg:'bg.accent'},success:{bg:'bg.success'}}}});
-var progress = recipeRuntime({base:[{bg:'bg.tertiary',overflow:'hidden',rounded:'full'},'_1nn21mo']});
+var progress = recipeRuntime({base:[{bg:'bg.tertiary',overflow:'hidden',rounded:'full'},'a9951i']});
 
 export { indicator, progress };

package/dist/esm/packages/react/src/radio/Radio-css.js

@@ -1,12 +1,12 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-CbMg3mAn.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-tPLFf0il.css';
-import './../../../../assets/src/radio/Radio.css.ts.vanilla-CZ_lX4GP.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/avatar/AvatarGroup.css.ts.vanilla-IBpgBir4.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-Bai1BKi_.css';
+import './../../../../assets/src/radio/Radio.css.ts.vanilla-CIKmqAFj.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'wud470'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'_1tbg9c3']});
-var input = recipeRuntime({base:'_1lwhhnc'});
-var radio = recipeRuntime({base:'zaxvr5'});
+var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'wqhv52'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'ifvgdw']});
+var input = recipeRuntime({base:'_1or3eh8'});
+var radio = recipeRuntime({base:'_1g4dcek'});
 
 export { control, indicator, input, radio };

package/dist/esm/packages/react/src/search-input/SearchInput-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-loiT8Xp2.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-BsXnzjHx.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var clear = recipeRuntime({base:[{size:'sm'},'_4bo8f0']});
-var input = recipeRuntime({base:'o6vhxh'});
-var search = recipeRuntime({base:'ucu5bx'});
+var clear = recipeRuntime({base:[{size:'sm'},'j3l9dy']});
+var input = recipeRuntime({base:'_5psc06'});
+var search = recipeRuntime({base:'y0poiv'});
 
 export { clear, input, search };

package/dist/esm/packages/react/src/select/SelectContent.js

@@ -14,6 +14,7 @@ import { ListboxLabel } from '../listbox/ListboxLabel.js';
 import '../listbox/ListboxRadioItem.js';
 import { ListboxSeparator } from '../listbox/ListboxSeparator.js';
 import '../listbox/ListboxSwitchItem.js';
+import { shouldShowSeparator, shouldShowGroup } from '../listbox/utils.js';
 import '../modal/ModalContext.js';
 import { ModalLayer } from '../modal/ModalLayer.js';
 import { ModalListbox } from '../modal/ModalListbox.js';
@@ -32,18 +33,6 @@ const SelectContent = forwardRef(
   ({ align = "start", children, side = "bottom", size, ...props }, ref) => {
     const { downshift, highlightedItem, isOpen, items, loading } = useSelectContext("@optiaxiom/react/SelectContent");
     const [placed, setPlaced] = useState(false);
-    let isFirstItem = true;
-    let lastGroup = void 0;
-    const shouldShowSeparator = (group) => {
-      const show = !isFirstItem;
-      isFirstItem = false;
-      return show && group !== lastGroup && (group?.separator || lastGroup?.separator);
-    };
-    const shouldShowGroup = (group) => {
-      const show = group !== lastGroup;
-      lastGroup = group;
-      return show && !!group && !group?.hidden;
-    };
     return /* @__PURE__ */ jsx(TransitionGroup, { open: isOpen, children: /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(ModalLayer, { asChild: true, children: /* @__PURE__ */ jsx(
       ModalListbox,
       {
@@ -64,15 +53,11 @@ const SelectContent = forwardRef(
             loading,
             onPlacedChange: setPlaced,
             ...downshift.getMenuProps({}, { suppressRefError: !placed }),
-            children: children ?? ((item, index) => {
-              if (index === 0) {
-                isFirstItem = true;
-                lastGroup = void 0;
-              }
+            children: children ?? ((item, prevItem) => {
               const group = item.group;
               return /* @__PURE__ */ jsxs(Fragment, { children: [
-                shouldShowSeparator(group) && /* @__PURE__ */ jsx(ListboxSeparator, {}),
-                shouldShowGroup(group) && /* @__PURE__ */ jsx(ListboxLabel, { children: group.label }),
+                shouldShowSeparator(group, prevItem) && /* @__PURE__ */ jsx(ListboxSeparator, {}),
+                shouldShowGroup(group, prevItem) && /* @__PURE__ */ jsx(ListboxLabel, { children: group.label }),
                 /* @__PURE__ */ jsx(Tooltip, { content: item.disabledReason, children: /* @__PURE__ */ jsx(
                   SelectRadioItem,
                   {

package/dist/esm/packages/react/src/separator/Separator-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/separator/Separator.css.ts.vanilla-BJyGakBV.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/separator/Separator.css.ts.vanilla-D7AI5WS1.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 import { createSprinkles } from '../../../../node_modules/.pnpm/@vanilla-extract_sprinkles@1.6.3_patch_hash_eh2tyazhmaumpwivglvpekok3e_@vanilla-extract_css@1_h2fokeqwgislkw3fqntlep77qq/node_modules/@vanilla-extract/sprinkles/createRuntimeSprinkles/dist/vanilla-extract-sprinkles-createRuntimeSprinkles.esm.js';
 
 var base = recipeRuntime({base:{borderColor:'border.secondary'}});
-var separator = createSprinkles((function(){var x={conditions:{defaultCondition:'base',conditionNames:['sm','md','base'],responsiveArray:['base','sm','md']},styles:{orientation:{values:{horizontal:{conditions:{sm:'ai4hhe',md:'_1uganhr',base:'_8usbam'},defaultClass:'_8usbam'},vertical:{conditions:{sm:'t7t7n8',md:'_168mt3f',base:'_1h4qui9'},defaultClass:'_1h4qui9'}},responsiveArray:undefined}}};x.styles.orientation.responsiveArray=x.conditions.responsiveArray;return x;}()));
+var separator = createSprinkles((function(){var x={conditions:{defaultCondition:'base',conditionNames:['sm','md','base'],responsiveArray:['base','sm','md']},styles:{orientation:{values:{horizontal:{conditions:{sm:'iuy614',md:'mctabj',base:'_1f10yy2'},defaultClass:'_1f10yy2'},vertical:{conditions:{sm:'k03hn6',md:'vu7v16',base:'_18dd440'},defaultClass:'_18dd440'}},responsiveArray:undefined}}};x.styles.orientation.responsiveArray=x.conditions.responsiveArray;return x;}()));
 
 export { base, separator };

package/dist/esm/packages/react/src/skeleton/Skeleton-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CN-ptlpS.css';
-import './../../../../assets/src/skeleton/Skeleton.css.ts.vanilla-C-wdgTK4.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-IRSHqbpU.css';
+import './../../../../assets/src/skeleton/Skeleton.css.ts.vanilla-CDgH9kUf.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var skeleton = recipeRuntime({base:[{animation:'pulse',bg:'bg.avatar.neutral',color:'fg.default.inverse',display:'block'},'_3edepd']});
+var skeleton = recipeRuntime({base:[{animation:'pulse',bg:'bg.avatar.neutral',color:'fg.default.inverse',display:'block'},'_11rrmh1']});
 
 export { skeleton };