@optiaxiom/react 1.2.3 → 1.2.5

package/dist/esm/packages/react/src/indicator/Indicator-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/indicator/Indicator.css.ts.vanilla-CW_8j1pA.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/indicator/Indicator.css.ts.vanilla-Dv1nMsUG.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var badge = recipeRuntime({base:'_3j0gwr',variants:{offset:{false:{px:'0',py:'0'},true:[{px:'4',py:'0'},'fj48g7']},ping:{false:{},true:[{animation:'ping',color:'transparent',pointerEvents:'none'},'_1di58km']}}});
-var floating = recipeRuntime({base:[{display:'inline-flex',pointerEvents:'none',z:'10'},'f6vzqj'],variants:{offset:{false:'_14c1uxl',true:{}},position:{'bottom-right':'f4kg8h','top-right':'_1ldzw28'}}});
-var indicator = recipeRuntime({base:[{display:'inline-flex'},'_48qnyw']});
+var badge = recipeRuntime({base:'_115upev',variants:{offset:{false:{px:'0',py:'0'},true:[{px:'4',py:'0'},'_1g9m2ac']},ping:{false:{},true:[{animation:'ping',color:'transparent',pointerEvents:'none'},'gaemk9']}}});
+var floating = recipeRuntime({base:[{display:'inline-flex',pointerEvents:'none',z:'10'},'_1nmx4ld'],variants:{offset:{false:'_1n6a8zf',true:{}},position:{'bottom-right':'_1r4nvrk','top-right':'_1cndnyv'}}});
+var indicator = recipeRuntime({base:[{display:'inline-flex'},'cv4jvm']});
 
 export { badge, floating, indicator };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/inline-input/InlineInput.css.ts.vanilla-O7l92lAs.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/inline-input/InlineInput.css.ts.vanilla-BdKXpj1z.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var editor = recipeRuntime({base:'zujuet',variants:{empty:{false:{},true:'irh2h9'}}});
-var input = recipeRuntime({base:'snpcyt'});
+var editor = recipeRuntime({base:'_7a7gm',variants:{empty:{false:{},true:'v0acjn'}}});
+var input = recipeRuntime({base:'w0lpc1'});
 
 export { editor, input };

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

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var addon = recipeRuntime({base:{display:'flex',flex:'none'}});

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-BNGYKXQt.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-BlFqBxdI.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:['_12g6pku',{bg:'transparent',flex:'auto',w:'full'},'m20oq9','_19zfrfn'],variants:{size:{md:{},lg:{},xl:['_1k53om5']}}});
+var control = recipeRuntime({base:['_152nqr0',{bg:'transparent',flex:'auto',w:'full'},'_1olm5l3','w62arz'],variants:{size:{md:{},lg:{},xl:['_394fta']}}});
 
 export { control };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-BSjn-Kas.css';
-import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-BNGYKXQt.css';
-import './../../../../assets/src/input-root/InputRoot.css.ts.vanilla-Dd_H_S8U.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-CjfwYd9Q.css';
+import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-BlFqBxdI.css';
+import './../../../../assets/src/input-root/InputRoot.css.ts.vanilla-I6c00poA.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'pmpe7r']});
+var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'_12tdzht']});
 
 export { root };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-BrGLD7BH.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-BEL6gmdd.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var kbd = recipeRuntime({base:[{alignItems:'center',bg:'bg.secondary',display:'inline-flex',flexDirection:'row',px:'4',rounded:'sm',whiteSpace:'nowrap'},'_1vbyan'],variants:{variant:{outline:{border:'1',borderB:'2',borderColor:'border.tertiary',fontWeight:'600',gap:'4'},subtle:{bg:'transparent',color:'fg.secondary',fontFamily:'sans',gap:'2',px:'0'}}}});
-var keys = recipeRuntime({base:'bq59ec',variants:{variant:{outline:'_1yexzm',subtle:{}}}});
+var kbd = recipeRuntime({base:[{alignItems:'center',bg:'bg.secondary',display:'inline-flex',flexDirection:'row',px:'4',rounded:'sm',whiteSpace:'nowrap'},'_1yy0pq4'],variants:{variant:{outline:{border:'1',borderB:'2',borderColor:'border.tertiary',fontWeight:'600',gap:'4'},subtle:{bg:'transparent',color:'fg.secondary',fontFamily:'sans',gap:'2',px:'0'}}}});
+var keys = recipeRuntime({base:'_1inpw87',variants:{variant:{outline:'_6n7pn7',subtle:{}}}});
 
 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-BeSAdLYi.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-BSjn-Kas.css';
-import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-myHxMctj.css';
-import './../../../../assets/src/label-menu-button/LabelMenuButton.css.ts.vanilla-5X080pPs.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-CjfwYd9Q.css';
+import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-Cnjh6ZE6.css';
+import './../../../../assets/src/label-menu-button/LabelMenuButton.css.ts.vanilla-D7RfKeTc.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{justifyContent:'space-between'},'m9re08']});
+var button = recipeRuntime({base:[{justifyContent:'space-between'},'k31rlt']});
 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-BeSAdLYi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
 
 var axiom = 'optiaxiom';
 var base = 'optiaxiom.base';
-var components = 'optiaxiom._78rlm9';
-var reset = 'optiaxiom.iiehqz';
+var components = 'optiaxiom._1t5zyt3';
+var reset = 'optiaxiom._1c78t6j';
 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-BeSAdLYi.css';
-import './../../../../assets/src/layout/Layouts.css.ts.vanilla-2_2fjsst.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/layout/Layouts.css.ts.vanilla-4_F9ttVI.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var layout = recipeRuntime({base:[{bg:'bg.page',display:'flex',flexDirection:'column',fontSize:'md'},'_1biy5g3']});
+var layout = recipeRuntime({base:[{bg:'bg.page',display:'flex',flexDirection:'column',fontSize:'md'},'ikdrzs']});
 
 export { layout };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/link/Link.css.ts.vanilla-TKnv0NLW.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/link/Link.css.ts.vanilla-DsprUWN_.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'_12ngo0c']});
-var link = recipeRuntime({base:['_9ruatd','efcfqr'],variants:{appearance:{'default':'mn8ovf',inverse:'zynvll',subtle:'_1quia90'}}});
+var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'jmprfc']});
+var link = recipeRuntime({base:['_187j224','_1wtz7j8'],variants:{appearance:{'default':'_1tp7wbl',inverse:'_1qnop3f',subtle:'_1swzwoc'}}});
 
 export { icon, link };

package/dist/esm/packages/react/src/listbox-empty/ListboxEmpty.js

@@ -6,7 +6,7 @@ import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 
 const ListboxEmpty = forwardRef(
-  ({ children, ...props }, ref) => {
+  ({ children = "No results found.", ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       Box,
       {
@@ -18,7 +18,7 @@ const ListboxEmpty = forwardRef(
         p: "16",
         ref,
         ...props,
-        children: children || "No options"
+        children
       }
     );
   }

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/listbox-item/ListboxItem.css.ts.vanilla-0HPKoojU.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/listbox-item/ListboxItem.css.ts.vanilla-CKKVEFPs.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var description = recipeRuntime({base:[{fontSize:'sm'},'_18r4oz3']});
-var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'hqwj4v'],variants:{intent:{danger:'_15z0jzo',neutral:'_189z6vn'}}});
-var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'dwbafh']});
+var description = recipeRuntime({base:[{fontSize:'sm'},'_1o86o6j']});
+var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'ukks11'],variants:{intent:{danger:'kgkofb',neutral:'_2xu524'}}});
+var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'_1aayy9q']});
 
 export { description, item, title };

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

@@ -22,7 +22,6 @@ const ListboxItem = forwardRef(
     asChild,
     children,
     className,
-    "data-highlighted": dataHighlighted,
     description: description$1,
     icon,
     intent = "neutral",
@@ -38,11 +37,11 @@ const ListboxItem = forwardRef(
         "aria-labelledby": labelId,
         asChild: true,
         ref,
-        ...isHoverSupported && dataHighlighted !== void 0 && {
-          "data-highlighted": dataHighlighted
-        },
         ...item({ intent }, className),
         ...props,
+        ...!isHoverSupported && {
+          "data-highlighted": void 0
+        },
         children: /* @__PURE__ */ jsx(Comp, { children: decorateChildren({ asChild, children }, (children2) => /* @__PURE__ */ jsxs(Fragment, { children: [
           addonBefore ? addonBefore : icon ? /* @__PURE__ */ jsx(Icon, { asChild: true, children: icon }) : null,
           /* @__PURE__ */ jsxs(Flex, { flex: "1", gap: "0", children: [

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

@@ -0,0 +1,7 @@
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/listbox-item-indicator/ListboxItemIndicator.css.ts.vanilla-dIk7ESAB.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var indicator = recipeRuntime({base:['_69uzj'],variants:{active:{false:{},true:'ld4sk9'}}});
+
+export { indicator };

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

@@ -2,17 +2,21 @@
 import { jsx } from 'react/jsx-runtime';
 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 { IconCheck } from '../icons/IconCheck.js';
+import { indicator } from './ListboxItemIndicator-css.js';
 
 const ListboxItemIndicator = forwardRef(({ active, children, className, ...props }, ref) => {
-  const { boxProps, restProps } = extractBoxProps(props);
-  if (!active) {
-    return /* @__PURE__ */ jsx(Box, { asChild: true, className, h: "0", w: "xs", ...boxProps, children: /* @__PURE__ */ jsx("svg", { ref, ...restProps }) });
-  }
-  return (
-    // @ts-expect-error -- too complex
-    /* @__PURE__ */ jsx(Box, { asChild: true, className, ref, ...props, children: children ?? /* @__PURE__ */ jsx(IconCheck, {}) })
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      asChild: true,
+      ref,
+      ...indicator({ active }, className),
+      ...props,
+      children: children ?? /* @__PURE__ */ jsx(IconCheck, {})
+    }
   );
 });
 ListboxItemIndicator.displayName = "@optiaxiom/react/ListboxItemIndicator";

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

@@ -2,11 +2,12 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
 import { useVirtualizer } from '@tanstack/react-virtual';
-import { forwardRef, useRef, useState, useEffect, useMemo } from 'react';
+import { forwardRef, useRef, useState, useEffect, useContext, useMemo } from 'react';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 import { Listbox } from '../listbox/Listbox.js';
+import { TransitionGroupContext } from '../transition-group-context/TransitionGroupContext.js';
 
 const ListboxVirtualized = forwardRef(({ children, highlightedItem, items, ...props }, outerRef) => {
   const innerRef = useRef(null);
@@ -15,6 +16,7 @@ const ListboxVirtualized = forwardRef(({ children, highlightedItem, items, ...pr
   useEffect(() => {
     requestAnimationFrame(() => setEnabled(true));
   }, []);
+  const { presence } = useContext(TransitionGroupContext) ?? {};
   const rowVirtualizer = useVirtualizer({
     count: items.length,
     enabled,
@@ -27,11 +29,11 @@ const ListboxVirtualized = forwardRef(({ children, highlightedItem, items, ...pr
   );
   useEffect(() => {
     const index = itemToIndexMap.get(highlightedItem);
-    if (!enabled || typeof index !== "number") {
+    if (!presence || typeof index !== "number" || rowVirtualizer.isScrolling) {
       return;
     }
     rowVirtualizer.scrollToIndex(index);
-  }, [enabled, highlightedItem, itemToIndexMap, rowVirtualizer]);
+  }, [presence, highlightedItem, itemToIndexMap, rowVirtualizer]);
   const virtualItems = rowVirtualizer.getVirtualItems();
   const [paddingTop, paddingBottom] = virtualItems.length > 0 ? [
     Math.max(0, virtualItems[0].start),

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/menu-listbox/MenuListbox.css.ts.vanilla-iUHuX3BC.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/menu-listbox/MenuListbox.css.ts.vanilla-Cqb0w2i5.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'_4tbatu'],variants:{maxH:{xs:'w75y6g',sm:'_4olg70',md:'_15l3fyj',lg:'_1s27qhm',full:{}},minW:{'0':{},trigger:'c6b1zd'},provider:{'dropdown-menu':'_1l5dx4o',popover:'y1acmi',popper:'_1gjjlkh'}}});
+var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'e20gf3'],variants:{maxH:{xs:'_1mgt5qr',sm:'_1ffp4kl',md:'_1xzh3k2',lg:'_1r1n84h',full:{}},minW:{'0':{},trigger:'_60sn9m'},provider:{'dropdown-menu':'_197re6x',popover:'_10za79z',popper:'qyen7r'}}});
 
 export { listbox };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/nav/Nav.css.ts.vanilla-k_NX91J6.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/nav/Nav.css.ts.vanilla-CcQI-qaQ.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'},'ih0v60']});
+var nav = recipeRuntime({base:[{bg:'bg.default',flex:'1',gap:'0',overflow:'hidden',pb:'8',pt:'16'},'aee0f8']});
 
 export { nav };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/nav-account-item/NavAccountItem.css.ts.vanilla-B7d7O2m4.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/nav-account-item/NavAccountItem.css.ts.vanilla-BPtAVSY9.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:'_14nhb14',true:'_72dlep'}}});
+var item = recipeRuntime({base:{flex:'1',flexDirection:'row',fontSize:'md',gap:'8',overflowX:'hidden',transition:'opacity'},variants:{expanded:{false:'_65v5js',true:'_1apdk5x'}}});
 
 export { item };

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

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.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-item/NavItem-css.js

@@ -1,10 +1,10 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-BSjn-Kas.css';
-import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-myHxMctj.css';
-import './../../../../assets/src/nav-item/NavItem.css.ts.vanilla-C8BRUtaY.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-CjfwYd9Q.css';
+import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-Cnjh6ZE6.css';
+import './../../../../assets/src/nav-item/NavItem.css.ts.vanilla-D5cxyXcF.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'},'x86hap']});
-var label = recipeRuntime({base:[{alignItems:'center',display:'flex',flex:'1',gap:'10',justifyContent:'space-between',mr:'10',overflow:'hidden'},'m156vt'],variants:{expanded:{false:'_18ghumw',true:'_8j3rta'}}});
+var item = recipeRuntime({base:[{alignItems:'center',display:'flex',fontSize:'md',fontWeight:'500',h:'lg',justifyContent:'flex-start',rounded:'md',textAlign:'start',transition:'colors'},'_1153d11']});
+var label = recipeRuntime({base:[{alignItems:'center',display:'flex',flex:'1',gap:'10',justifyContent:'space-between',mr:'10',overflow:'hidden'},'nekkti'],variants:{expanded:{false:'_1g7h9l9',true:'_1fzgk6w'}}});
 
 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-BeSAdLYi.css';
-import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-Bx7HYaRZ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-xLDa2Hwh.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{justifyContent:'center'},'u07k4x']});
-var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'_1ptypqc'],variants:{animation:{false:{},true:{transition:'transform'}}}});
-var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'_155l7i1']});
+var button = recipeRuntime({base:[{justifyContent:'center'},'_1ch3nh8']});
+var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'drutx3'],variants:{animation:{false:{},true:{transition:'transform'}}}});
+var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'qtifxk']});
 
 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-BeSAdLYi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.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-BeSAdLYi.css';
-import './../../../../assets/src/pill/Pill.css.ts.vanilla-CrBIVGRY.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/pill/Pill.css.ts.vanilla-DKrCo1ZD.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'},'mpq5u7'],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'},'_18b6ch8'],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-BeSAdLYi.css';
-import './../../../../assets/src/progress/Progress.css.ts.vanilla-2OVTuk2l.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/progress/Progress.css.ts.vanilla-DJKvvyRC.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'},'fznfgk']});
+var progress = recipeRuntime({base:[{bg:'bg.tertiary',overflow:'hidden',rounded:'full'},'_17wpzqk']});
 
 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-BeSAdLYi.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-BSjn-Kas.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-NI15o5dX.css';
-import './../../../../assets/src/radio/Radio.css.ts.vanilla-BlN8MviH.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-CjfwYd9Q.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-DNCCDGec.css';
+import './../../../../assets/src/radio/Radio.css.ts.vanilla-DNj1iOwo.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'_1r4ez37'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'_1r3wccs']});
-var input = recipeRuntime({base:'_1ucjqbz'});
-var radio = recipeRuntime({base:'_1k0mmbn'});
+var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'bu2ojk'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'ni8g6q']});
+var input = recipeRuntime({base:'_1y8b4eb'});
+var radio = recipeRuntime({base:'_1rdxo6u'});
 
 export { control, indicator, input, radio };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-ClJJhlvO.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-TCOQpsRY.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var clear = recipeRuntime({base:[{size:'sm'},'_14uis7q']});
-var search = recipeRuntime({base:'slplp3'});
+var clear = recipeRuntime({base:[{size:'sm'},'_1h55pt5']});
+var search = recipeRuntime({base:'mz15w6'});
 
 export { clear, search };

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

@@ -8,6 +8,7 @@ import { forwardRef, useRef, useMemo } from 'react';
 import { usePortalPatch } from '../downshift/usePortalPatch.js';
 import { SelectProvider } from '../select-context/SelectContext.js';
 import { SelectHiddenSelect } from '../select-hidden-select/SelectHiddenSelect.js';
+import { useEffectEvent } from '../use-event/useEffectEvent.js';
 import { useObserveValue } from '../use-observe-value/useObserveValue.js';
 import { useObserveReset } from './useObserveReset.js';
 
@@ -20,7 +21,7 @@ const Select = forwardRef(
     isItemDisabled = () => false,
     items,
     itemToLabel = (value2) => value2 ? String(value2) : "",
-    itemToValue = (item) => typeof item === "string" ? item : void 0,
+    itemToValue = (item) => item,
     name,
     onBlur,
     onChange,
@@ -37,11 +38,12 @@ const Select = forwardRef(
       onChange: onValueChange,
       prop: value
     });
-    useObserveValue(innerRef, setShadowValue);
+    const forceValueChange = useObserveValue(innerRef, setShadowValue);
     useObserveReset(innerRef, setShadowValue);
+    const itemToValueStable = useEffectEvent(itemToValue);
     const selectedItem = useMemo(
-      () => shadowValue ? items.find((item) => itemToValue(item) === shadowValue) : void 0,
-      [itemToValue, items, shadowValue]
+      () => shadowValue !== void 0 ? items.find((item) => itemToValueStable(item) === shadowValue) : void 0,
+      [itemToValueStable, items, shadowValue]
     );
     const [isOpen, setIsOpen] = useControllableState({
       defaultProp: defaultOpen,
@@ -57,9 +59,10 @@ const Select = forwardRef(
       highlightedIndex,
       isItemDisabled,
       isOpen: placed,
+      // @ts-expect-error -- no harm in supporting read only arrays
       items,
-      itemToKey: itemToValue,
-      itemToString: itemToLabel,
+      itemToKey: (item) => item !== null ? itemToValue(item) : item,
+      itemToString: (item) => item !== null ? itemToLabel(item) : "",
       onHighlightedIndexChange(changes) {
         if ((changes.type === useSelect.stateChangeTypes.ItemMouseMove || changes.type === useSelect.stateChangeTypes.MenuMouseLeave) && isOpen || changes.isOpen) {
           setHighlightedIndex(changes.highlightedIndex);
@@ -69,9 +72,7 @@ const Select = forwardRef(
         setIsOpen(isOpen2);
       },
       onSelectedItemChange({ selectedItem: selectedItem2 }) {
-        if (innerRef.current) {
-          innerRef.current.value = itemToValue(selectedItem2) ?? "";
-        }
+        forceValueChange(itemToValue(selectedItem2) ?? "");
       },
       selectedItem: selectedItem ?? null
     });
@@ -95,6 +96,7 @@ const Select = forwardRef(
             SelectHiddenSelect,
             {
               defaultValue,
+              disabled,
               name,
               onChange: (event) => {
                 setShadowValue(event.target.value);

package/dist/esm/packages/react/src/select-content/SelectContent-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/select-content/SelectContent.css.ts.vanilla-hnKiMBLN.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/select-content/SelectContent.css.ts.vanilla-DXggbRTQ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var content = recipeRuntime({base:['_1hoc702']});
+var content = recipeRuntime({base:['fwayxp']});
 
 export { content };

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

@@ -43,7 +43,6 @@ const SelectContent = forwardRef(
           }
         },
         open: isOpen,
-        presence: placed,
         children: /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(ModalLayer, { asChild: true, children: /* @__PURE__ */ jsx(
           MenuListbox,
           {

package/dist/esm/packages/react/src/select-hidden-select/SelectHiddenSelect.js

@@ -1,13 +1,19 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
-import { forwardRef } from 'react';
+import { forwardRef, useMemo } from 'react';
 import { useSelectContext } from '../select-context/SelectContext.js';
+import { useEffectEvent } from '../use-event/useEffectEvent.js';
 
 const SelectHiddenSelect = forwardRef(({ defaultValue, disabled, name, onChange, required, value }, ref) => {
-  const { items, itemToLabel, itemToValue } = useSelectContext(
+  const { items, itemToValue } = useSelectContext(
     "@optiaxiom/react/SelectHiddenSelect"
   );
+  const itemToValueStable = useEffectEvent(itemToValue);
+  const options = useMemo(
+    () => items.map((item) => /* @__PURE__ */ jsx("option", { value: itemToValueStable(item), children: itemToValueStable(item) }, itemToValueStable(item))),
+    [itemToValueStable, items]
+  );
   return /* @__PURE__ */ jsx(VisuallyHidden, { "aria-hidden": true, children: /* @__PURE__ */ jsxs(
     "select",
     {
@@ -21,7 +27,7 @@ const SelectHiddenSelect = forwardRef(({ defaultValue, disabled, name, onChange,
       value,
       children: [
         /* @__PURE__ */ jsx("option", { value: "" }),
-        items.map((item) => /* @__PURE__ */ jsx("option", { value: itemToValue(item), children: itemToLabel(item) }, itemToValue(item)))
+        options
       ]
     }
   ) });

package/dist/esm/packages/react/src/select-trigger/SelectTrigger.js

@@ -34,7 +34,7 @@ const SelectTrigger = forwardRef(
       },
       [focusOnOpen]
     );
-    const value = selectedItem ? itemToLabel(selectedItem) : placeholder;
+    const value = selectedItem ? itemToLabel(selectedItem) || placeholder : placeholder;
     return /* @__PURE__ */ jsx(
       PopperAnchor,
       {

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/separator/Separator.css.ts.vanilla-hMhU56Ah.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/separator/Separator.css.ts.vanilla-Bj8DiXwJ.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:'_1oe604p',md:'_1ll109g',base:'spsrex'},defaultClass:'spsrex'},vertical:{conditions:{sm:'hm04m5',md:'iihrhz',base:'zk4v2k'},defaultClass:'zk4v2k'}},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:'k9zn0b',md:'_1ozwfb8',base:'_1fxw0rj'},defaultClass:'_1fxw0rj'},vertical:{conditions:{sm:'_1bsx7g7',md:'_1540kc0',base:'_7qixax'},defaultClass:'_7qixax'}},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-BeSAdLYi.css';
-import './../../../../assets/src/skeleton/Skeleton.css.ts.vanilla-Dzc94FcN.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/skeleton/Skeleton.css.ts.vanilla-R1bNynwK.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var skeleton = recipeRuntime({base:[{animation:'pulse',bg:'bg.avatar.neutral',color:'fg.default.inverse',display:'block'},'_9pob9']});
+var skeleton = recipeRuntime({base:[{animation:'pulse',bg:'bg.avatar.neutral',color:'fg.default.inverse',display:'block'},'pm17t0']});
 
 export { skeleton };

package/dist/esm/packages/react/src/spinner/Spinner-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-BeSAdLYi.css';
-import './../../../../assets/src/spinner/Spinner.css.ts.vanilla-D_Ki3sbG.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-BIlp7Els.css';
+import './../../../../assets/src/spinner/Spinner.css.ts.vanilla-BGvCoOzl.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var track = recipeRuntime({variants:{appearance:{'default':'dnhoj7',inverse:'_106dlxn'}}});
+var track = recipeRuntime({variants:{appearance:{'default':'_1xj3xdc',inverse:'_1740v1w'}}});
 
 export { track };