@optiaxiom/react 1.1.2 → 1.2.0

package/dist/esm/packages/react/src/avatar/Avatar-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-DOVkqqxM.css';
-import './../../../../assets/src/avatar/Avatar.css.ts.vanilla-B3I9McEi.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-ReU4Msyb.css';
+import './../../../../assets/src/avatar/Avatar.css.ts.vanilla-hZvMlKxa.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden',rounded:'full'},'btytj8'],variants:{colorScheme:{neutral:{bg:'bg.avatar.neutral',color:'fg.avatar.neutral'},purple:{bg:'bg.avatar.purple',color:'fg.avatar.purple'}},size:{'2xs':[{fontWeight:'400',size:'2xs'},'_1r5l289'],xs:[{fontWeight:'400',size:'xs'},'_1ryq0o5'],sm:[{size:'sm'},'_74nnyn'],md:[{size:'md'},'_1y5kodk'],lg:[{size:'lg'},'_1n1oj3'],xl:[{size:'xl'},'_51olth'],'3xl':[{size:'3xl'},'zusn6o']}}});
+var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden',rounded:'full'},'_18qf1g1'],variants:{colorScheme:{neutral:{bg:'bg.avatar.neutral',color:'fg.avatar.neutral'},purple:{bg:'bg.avatar.purple',color:'fg.avatar.purple'}},size:{'2xs':[{fontWeight:'400',size:'2xs'},'l3b6sp'],xs:[{fontWeight:'400',size:'xs'},'o17pib'],sm:[{size:'sm'},'ejm3tf'],md:[{size:'md'},'mr714s'],lg:[{size:'lg'},'p54524'],xl:[{size:'xl'},'_1ygj73l'],'3xl':[{size:'3xl'},'_1l57sb8']}}});
 var fallback = recipeRuntime({base:{alignItems:'center',display:'flex',justifyContent:'center',rounded:'inherit',size:'full',textTransform:'uppercase'}});
 var icon = recipeRuntime({base:[{w:'auto'}],variants:{size:{'2xs':{h:'10'},xs:{h:'10'},sm:{h:'12'},md:{h:'12'},lg:{h:'2xs'},xl:{h:'2xs'},'3xl':{h:'sm'}}}});
 

package/dist/esm/packages/react/src/avatar-group/AvatarGroup-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-DOVkqqxM.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-ReU4Msyb.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var avatarGroup = recipeRuntime({base:['_1tkye9q',{display:'flex'}]});
+var avatarGroup = recipeRuntime({base:['fngw8i',{display:'flex'}]});
 
 export { avatarGroup };

package/dist/esm/packages/react/src/backdrop/Backdrop-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/backdrop/Backdrop.css.ts.vanilla-55ImrQ3T.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/backdrop/Backdrop.css.ts.vanilla-0iT0kvSy.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var backdrop = recipeRuntime({base:[{bg:'bg.overlay',z:'popover'},'o52oic']});
+var backdrop = recipeRuntime({base:[{bg:'bg.overlay',z:'popover'},'_17bcttz']});
 
 export { backdrop };

package/dist/esm/packages/react/src/badge/Badge-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/badge/Badge.css.ts.vanilla-CCadKz2l.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/badge/Badge.css.ts.vanilla-DThc8q2A.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'6',py:'2',rounded:'full'},'_98u0ng'],variants:{intent:{danger:'_1qrztln',information:'sk5zu5',neutral:'_1saa64f',primary:'_19uqn8k',success:'tfku0h',warning:'_1by1l55'},variant:{strong:'_1p3na8i',subtle:'_1px3qo4'}}});
+var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'6',py:'2',rounded:'full'},'_1bqyaks'],variants:{intent:{danger:'yamna2',information:'_16r3hro',neutral:'v8h2dx',primary:'xwv15f',success:'_17ok0n2',warning:'_114modb'},variant:{strong:'_1uhp65d',subtle:'_1mm7t2v'}}});
 
 export { badge };

package/dist/esm/packages/react/src/banner/Banner-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/banner/Banner.css.ts.vanilla-CvFbO22G.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/banner/Banner.css.ts.vanilla-CdghyGBZ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
 var banner = recipeRuntime({base:[{alignItems:'start',color:'fg.default',flexDirection:'row',fontSize:'md',fontWeight:'500',gap:'12',justifyContent:'space-between',px:'24',py:'12'}],variants:{intent:{danger:{bg:'bg.error.light'},information:{bg:'bg.information.light'},neutral:{bg:'bg.tertiary'},success:{bg:'bg.success.light'},warning:{bg:'bg.warning.light'}}}});
-var content = recipeRuntime({base:[{flex:'1',gap:'8'},'_1hq0u3y']});
+var content = recipeRuntime({base:[{flex:'1',gap:'8'},'_1av29dz']});
 var icon = recipeRuntime({base:[{mt:'4'}],variants:{intent:{danger:{color:'fg.error.strong'},information:{color:'fg.information.strong'},neutral:{color:'fg.tertiary'},success:{color:'fg.success.strong'},warning:{color:'fg.warning.strong'}}}});
 
 export { banner, content, icon };

package/dist/esm/packages/react/src/box/Box-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/sprinkles/properties.css.ts.vanilla-B2ogcDh4.css';
-import './../../../../assets/src/box/Box.css.ts.vanilla-Ait8fGaR.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/sprinkles/properties.css.ts.vanilla-Bl6ojI1O.css';
+import './../../../../assets/src/box/Box.css.ts.vanilla-BctltUpK.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var box = recipeRuntime({base:'_1dmk7r0'});
+var box = recipeRuntime({base:'_1st1xjm'});
 
 export { box };

package/dist/esm/packages/react/src/breadcrumb-item/BreadcrumbItem-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/breadcrumb-item/BreadcrumbItem.css.ts.vanilla-BuZ-JvFo.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/breadcrumb-item/BreadcrumbItem.css.ts.vanilla-DFWY95lC.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:[{alignItems:'center',display:'inline-flex'},'_17jugq0']});
+var item = recipeRuntime({base:[{alignItems:'center',display:'inline-flex'},'_1nxy7wn']});
 
 export { item };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/breadcrumb-link/BreadcrumbLink.css.ts.vanilla-Dz-zKWXE.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/breadcrumb-link/BreadcrumbLink.css.ts.vanilla-C7uBeQxj.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var link = recipeRuntime({base:[{alignItems:'center',display:'flex',fontSize:'md',h:'md',rounded:'md'},'yczz8v']});
+var link = recipeRuntime({base:[{alignItems:'center',display:'flex',fontSize:'md',h:'md',rounded:'md'},'_1kmvymj']});
 
 export { link };

package/dist/esm/packages/react/src/button-base/ButtonBase-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-DOVkqqxM.css';
-import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-BUmRo4aJ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-ReU4Msyb.css';
+import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-0KfIDBKX.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var buttonBase = recipeRuntime({base:['_1hnxgcm',{alignItems:'center',display:'inline-flex',flexDirection:'row',justifyContent:'flex-start',transition:'colors'},'_1rh6g3l'],variants:{intent:{danger:'va58qp',neutral:'_1x8nr7n',primary:'bkx0ir'},size:{sm:{fontSize:'sm',h:'sm'},md:{fontSize:'md',gap:'2',h:'md'},lg:{fontSize:'md',gap:'4',h:'lg'}},square:{false:'_1mctf6k',true:{}},variant:{outline:'_162vpq6',strong:'_1pdt77r',subtle:'_7hkhyf'}},variantsCompounded:[{style:{w:'sm'},variants:{size:'sm',square:true}},{style:'_16h2tkt',variants:{size:'sm',square:false}},{style:{w:'md'},variants:{size:'md',square:true}},{style:'y3yub1',variants:{size:'md',square:false}},{style:{w:'lg'},variants:{size:'lg',square:true}},{style:'_1yi4e82',variants:{size:'lg',square:false}}]});
-var spinner = recipeRuntime({base:[{size:'2xs'},'_136wjl9']});
+var buttonBase = recipeRuntime({base:['_10mki2q',{alignItems:'center',display:'inline-flex',flexDirection:'row',justifyContent:'flex-start',transition:'colors'},'_16b4620'],variants:{intent:{danger:'_16opqiu',neutral:'_1bffwst',primary:'l7hxid'},size:{sm:{fontSize:'sm',h:'sm'},md:{fontSize:'md',gap:'2',h:'md'},lg:{fontSize:'md',gap:'4',h:'lg'}},square:{false:'_2pne6n',true:{}},variant:{outline:'wl1i9c',strong:'_1dl97b3',subtle:'xlqd2h'}},variantsCompounded:[{style:{w:'sm'},variants:{size:'sm',square:true}},{style:'_1jieuhp',variants:{size:'sm',square:false}},{style:{w:'md'},variants:{size:'md',square:true}},{style:'_1wirqwt',variants:{size:'md',square:false}},{style:{w:'lg'},variants:{size:'lg',square:true}},{style:'_18dj035',variants:{size:'lg',square:false}}]});
+var spinner = recipeRuntime({base:[{size:'2xs'},'_1ci76wa']});
 
 export { buttonBase, spinner };

package/dist/esm/packages/react/src/button-group/ButtonGroup-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-DOVkqqxM.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-ReU4Msyb.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var buttonGroup = recipeRuntime({base:'_7clb99'});
+var buttonGroup = recipeRuntime({base:'_1wk2ir2'});
 
 export { buttonGroup };

package/dist/esm/packages/react/src/button-loadable/ButtonLoadable-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-DOVkqqxM.css';
-import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-BUmRo4aJ.css';
-import './../../../../assets/src/button-loadable/ButtonLoadable.css.ts.vanilla-DTzsmAmp.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-ReU4Msyb.css';
+import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-0KfIDBKX.css';
+import './../../../../assets/src/button-loadable/ButtonLoadable.css.ts.vanilla-KMgGUkhp.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var loadable = recipeRuntime({base:[{transition:'opacity'},'_1skm6af']});
+var loadable = recipeRuntime({base:[{transition:'opacity'},'ktae6d']});
 
 export { loadable };

package/dist/esm/packages/react/src/calendar/CalendarDayButton-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/calendar/CalendarDayButton.css.ts.vanilla-DOd1W67d.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/calendar/CalendarDayButton.css.ts.vanilla-Icumfr0J.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{color:'fg.default',fontSize:'md',mt:'2',size:'md',transition:'colors'},'_1oahx7i'],variants:{appearance:{'default':'c764yz',holiday:[{color:'fg.error'},'_1v1fsjw'],range_middle:'_1cpixf1',selected:[{color:'fg.white'},'yovy1w'],weekend:[{color:'fg.tertiary'},'mm9b0c']},range:{end:['_8pn763'],middle:['_1ikmlcu'],start:['ogusyl']}}});
-var today = recipeRuntime({base:[{bg:'current',mx:'auto',rounded:'full'},'_1e712vp']});
+var button = recipeRuntime({base:[{color:'fg.default',fontSize:'md',mt:'2',size:'md',transition:'colors'},'_1p3fkuf'],variants:{appearance:{'default':'_1nuodwu',holiday:[{color:'fg.error'},'ji15eh'],range_middle:'_1nw6fym',selected:[{color:'fg.white'},'_1f5kbnb'],weekend:[{color:'fg.tertiary'},'_1i22qvz']},range:{end:['drh9tj'],middle:['_1nyq3is'],start:['_1uxvupt']}}});
+var today = recipeRuntime({base:[{bg:'current',mx:'auto',rounded:'full'},'_1cm47zf']});
 
 export { button, today };

package/dist/esm/packages/react/src/calendar/CalendarMonths-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/calendar/CalendarMonths.css.ts.vanilla-dMCxe0RH.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/calendar/CalendarMonths.css.ts.vanilla-DqdufC4L.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var months = recipeRuntime({base:[{alignItems:'start',flexDirection:'row'},'_8500ov']});
+var months = recipeRuntime({base:[{alignItems:'start',flexDirection:'row'},'_1f1tm4n']});
 
 export { months };

package/dist/esm/packages/react/src/calendar/CalendarNav-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/calendar/CalendarNav.css.ts.vanilla-CtlsNHo0.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/calendar/CalendarNav.css.ts.vanilla-DSWRZO2S.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var nav = recipeRuntime({base:[{display:'flex',justifyContent:'space-between',w:'full'},'_1291tfk']});
+var nav = recipeRuntime({base:[{display:'flex',justifyContent:'space-between',w:'full'},'d7vmhi']});
 
 export { nav };

package/dist/esm/packages/react/src/card/Card-css.js

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/cover/Cover.css.ts.vanilla-Bvqxc98d.css';
-import './../../../../assets/src/link/Link.css.ts.vanilla-DZSy83rt.css';
-import './../../../../assets/src/card/Card.css.ts.vanilla-Bk8xNuO_.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/cover/Cover.css.ts.vanilla-DICSzzhV.css';
+import './../../../../assets/src/link/Link.css.ts.vanilla-D3T-_vwR.css';
+import './../../../../assets/src/card/Card.css.ts.vanilla-CkZ2wEBj.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var card = recipeRuntime({base:['_1lu5hhh',{border:'1',borderColor:'border.tertiary',color:'fg.default',gap:'12',p:'16',transition:'transform'},'vek2p9']});
+var card = recipeRuntime({base:['_1r9eow6',{border:'1',borderColor:'border.tertiary',color:'fg.default',gap:'12',p:'16',transition:'transform'},'svfyj0']});
 
 export { card };

package/dist/esm/packages/react/src/card-action/CardAction-css.js

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/card-overflow/CardOverflow.css.ts.vanilla-CMyRgnbw.css';
-import './../../../../assets/src/card-action/CardAction.css.ts.vanilla-BVXcWJV3.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/card-overflow/CardOverflow.css.ts.vanilla-DW3GHIR3.css';
+import './../../../../assets/src/card-action/CardAction.css.ts.vanilla-Dl6LCsxq.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var action = recipeRuntime({base:['_5196qe']});
+var action = recipeRuntime({base:['_1c9bl1w']});
 
 export { action };

package/dist/esm/packages/react/src/card-image/CardImage-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/card-image/CardImage.css.ts.vanilla-DJyAg1Rq.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/card-image/CardImage.css.ts.vanilla-D_zEzxvb.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var cardImage = recipeRuntime({base:[{h:'full',rounded:'inherit'},'_7z4478'],variants:{orientation:{horizontal:[{w:'auto'},'_1ft13ar'],vertical:[{w:'full'},'_12jps2']}}});
+var cardImage = recipeRuntime({base:[{h:'full',rounded:'inherit'},'wmtb4u'],variants:{orientation:{horizontal:[{w:'auto'},'_19qpoqo'],vertical:[{w:'full'},'_1318w25']}}});
 
 export { cardImage };

package/dist/esm/packages/react/src/card-overflow/CardOverflow-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/card-overflow/CardOverflow.css.ts.vanilla-CMyRgnbw.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/card-overflow/CardOverflow.css.ts.vanilla-DW3GHIR3.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var cardOverflow = recipeRuntime({base:['_53fif0',{alignSelf:'stretch'},'_1lvnzow'],variants:{orientation:{horizontal:['l83yu4'],vertical:['_559t87']}}});
+var cardOverflow = recipeRuntime({base:['_14j5qr8',{alignSelf:'stretch'},'vv5agy'],variants:{orientation:{horizontal:['_1hcao1h'],vertical:['_126vo25']}}});
 
 export { cardOverflow };

package/dist/esm/packages/react/src/checkbox-control/CheckboxControl-css.js

@@ -1,11 +1,11 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-DOVkqqxM.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-DkD0kjT5.css';
-import './../../../../assets/src/checkbox-control/CheckboxControl.css.ts.vanilla-FRFXVpL5.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/actions-root/ActionsRoot.css.ts.vanilla-ReU4Msyb.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-SvMQoK1u.css';
+import './../../../../assets/src/checkbox-control/CheckboxControl.css.ts.vanilla-CFdKIFN4.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{color:'fg.default.inverse',display:'grid',rounded:'xs',size:'2xs'},'_1gwz9in'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var icon = recipeRuntime({base:[{transition:'all'},'fwtk22']});
+var control = recipeRuntime({base:[{color:'fg.default.inverse',display:'grid',rounded:'xs',size:'2xs'},'_17u51v8'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var icon = recipeRuntime({base:[{transition:'all'},'h7xdtn']});
 var indicator = recipeRuntime({base:[{alignItems:'center',display:'flex',justifyContent:'center',p:'2',size:'full'}]});
 
 export { control, icon, indicator };

package/dist/esm/packages/react/src/code/Code-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/code/Code.css.ts.vanilla-4QfWwldC.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/code/Code.css.ts.vanilla-CBp6dmyG.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var code = recipeRuntime({base:[{fontWeight:'600'},'a6g75l']});
+var code = recipeRuntime({base:[{fontWeight:'600'},'cpqhc8']});
 
 export { code };

package/dist/esm/packages/react/src/combobox/Combobox.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
-import { useMemo, useEffect } from 'react';
+import { useEffect } from 'react';
 import { ComboboxProvider } from '../combobox-context/ComboboxContext.js';
 import { ComboboxDialogContent } from '../combobox-dialog-content/ComboboxDialogContent.js';
 import { ComboboxPopover } from '../combobox-popover/ComboboxPopover.js';
@@ -17,14 +17,13 @@ function Combobox({
   defaultOpen = false,
   inputValue,
   isItemDisabled = () => false,
+  isItemSelected = () => false,
   items,
-  itemToKey = (value) => value,
-  itemToString = (value) => value ? String(value) : "",
+  itemToLabel = (value) => value ? String(value) : "",
   onInputValueChange,
   onItemSelect,
   onOpenChange,
-  open: openProp,
-  value: valueProp
+  open: openProp
 }) {
   const components = useResponsiveMatches({
     base: {
@@ -38,10 +37,6 @@ function Combobox({
       Trigger: PopoverTrigger
     }
   });
-  const value = useMemo(
-    () => Array.isArray(valueProp) ? new Set(valueProp) : valueProp,
-    [valueProp]
-  );
   const [open, setOpen] = useControllableState({
     defaultProp: defaultOpen,
     onChange: onOpenChange,
@@ -62,14 +57,13 @@ function Combobox({
       components,
       inputValue,
       isItemDisabled,
+      isItemSelected,
       items,
-      itemToKey,
-      itemToString,
+      itemToLabel,
       onInputValueChange,
       onItemSelect,
       open,
       setOpen,
-      value,
       children
     }
   ) });

package/dist/esm/packages/react/src/combobox-content/ComboboxContent.js

@@ -1,8 +1,11 @@
 "use client";
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useCombobox } from 'downshift';
 import { forwardRef } from 'react';
 import { useComboboxContext } from '../combobox-context/ComboboxContext.js';
+import { ComboboxEmpty } from '../combobox-empty/ComboboxEmpty.js';
+import { ComboboxInput } from '../combobox-input/ComboboxInput.js';
+import { ComboboxScrollArea } from '../combobox-scroll-area/ComboboxScrollArea.js';
 import { Command } from '../command/Command.js';
 import { CommandListbox } from '../command-listbox/CommandListbox.js';
 import '../field-context/FieldContext.js';
@@ -20,12 +23,11 @@ const ComboboxContent = forwardRef(
       components,
       inputValue,
       isItemDisabled,
+      isItemSelected,
       items,
-      itemToKey,
-      itemToString,
+      itemToLabel,
       onInputValueChange,
-      onItemSelect,
-      value
+      onItemSelect
     } = useComboboxContext("@optiaxiom/react/ComboboxContent");
     return /* @__PURE__ */ jsx(
       components.Content,
@@ -40,13 +42,11 @@ const ComboboxContent = forwardRef(
           {
             inputValue,
             isItemDisabled,
+            isItemSelected,
             items,
-            itemToKey,
-            itemToString,
+            itemToLabel,
             onInputValueChange,
             onItemSelect,
-            open: true,
-            selectedItem: null,
             stateReducer: (state, actionAndChanges) => {
               const { changes, type } = actionAndChanges;
               switch (type) {
@@ -63,8 +63,11 @@ const ComboboxContent = forwardRef(
                   return changes;
               }
             },
-            value,
-            children: /* @__PURE__ */ jsx(CommandListbox, { children })
+            children: /* @__PURE__ */ jsx(CommandListbox, { children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(ComboboxInput, { placeholder: "Search..." }),
+              /* @__PURE__ */ jsx(ComboboxScrollArea, {}),
+              items.length === 0 && /* @__PURE__ */ jsx(ComboboxEmpty, { children: "No result found" })
+            ] }) })
           }
         )
       }

package/dist/esm/packages/react/src/combobox-input/ComboboxInput.js

@@ -31,7 +31,10 @@ const ComboboxInput = forwardRef(
         htmlSize: 1,
         m: "4",
         onKeyDown: (event) => {
-          if (event.key === " " && highlightedItem) {
+          if (!(event.target instanceof HTMLInputElement)) {
+            return;
+          }
+          if (event.key === " " && !event.target.value) {
             event.preventDefault();
             downshift.selectItem(highlightedItem);
           }

package/dist/esm/packages/react/src/combobox-scroll-area/ComboboxScrollArea.js

@@ -4,11 +4,32 @@ import { forwardRef } from 'react';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
+import { ComboboxRadioItem } from '../combobox-radio-item/ComboboxRadioItem.js';
+import { useCommandContext } from '../command-context/CommandContext.js';
 import { ListboxScrollArea } from '../listbox-scroll-area/ListboxScrollArea.js';
+import { ListboxVirtualized } from '../listbox-virtualized/ListboxVirtualized.js';
 import { Spinner } from '../spinner/Spinner.js';
 
-const ComboboxScrollArea = forwardRef(({ children, loading, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(ListboxScrollArea, { ref, ...props, children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children });
+const ComboboxScrollArea = forwardRef(({ children, items: itemsProp, loading, ...props }, ref) => {
+  const { highlightedItem, items } = useCommandContext(
+    "@optiaxiom/react/ComboboxScrollArea"
+  );
+  return /* @__PURE__ */ jsx(
+    ListboxScrollArea,
+    {
+      asChild: !loading && typeof children === "function",
+      ref,
+      ...props,
+      children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children ? typeof children === "function" ? /* @__PURE__ */ jsx(
+        ListboxVirtualized,
+        {
+          highlightedItem,
+          items: itemsProp ?? items,
+          children
+        }
+      ) : children : items.map((item) => /* @__PURE__ */ jsx(ComboboxRadioItem, { item, children: item }, item))
+    }
+  );
 });
 ComboboxScrollArea.displayName = "@optiaxiom/react/ComboboxScrollArea";
 

package/dist/esm/packages/react/src/combobox-trigger/ComboboxTrigger.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
-import { forwardRef, useMemo, useRef } from 'react';
+import { forwardRef, useRef } from 'react';
 import { AngleMenuButton } from '../angle-menu-button/AngleMenuButton.js';
 import { useComboboxContext } from '../combobox-context/ComboboxContext.js';
 import { useFieldLabelTrigger } from '../use-field-label-trigger/useFieldLabelTrigger.js';
@@ -14,16 +14,8 @@ const ComboboxTrigger = forwardRef(
     placeholder,
     ...props
   }, outerRef) => {
-    const {
-      components,
-      itemToString,
-      setOpen,
-      value: valueContext
-    } = useComboboxContext("@optiaxiom/react/ComboboxTrigger");
-    const value = useMemo(
-      () => valueContext instanceof Set ? [...valueContext] : valueContext,
-      [valueContext]
-    );
+    const { components, isItemSelected, items, itemToLabel, setOpen } = useComboboxContext("@optiaxiom/react/ComboboxTrigger");
+    const value = items.filter((item, index) => isItemSelected(item, index));
     const buttonRef = useRef(null);
     const ref = useComposedRefs(outerRef, buttonRef);
     const labelId = useFieldLabelTrigger(buttonRef, ariaLabelledBy);
@@ -42,7 +34,7 @@ const ComboboxTrigger = forwardRef(
         ref,
         role: "combobox",
         ...props,
-        children: asChild ? children : /* @__PURE__ */ jsx(AngleMenuButton, { children: Array.isArray(value) && value.length > 0 ? children ?? /* @__PURE__ */ jsx(Fragment, { children: value.length === 1 ? itemToString(value[0]) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        children: asChild ? children : /* @__PURE__ */ jsx(AngleMenuButton, { children: Array.isArray(value) && value.length > 0 ? children ?? /* @__PURE__ */ jsx(Fragment, { children: value.length === 1 ? itemToLabel(value[0]) : /* @__PURE__ */ jsxs(Fragment, { children: [
           value.length,
           " selected"
         ] }) }) : placeholder })

package/dist/esm/packages/react/src/command/Command.js

@@ -2,31 +2,22 @@
 import { jsx } from 'react/jsx-runtime';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { useCombobox } from 'downshift';
-import { useMemo, useState } from 'react';
+import { useState } from 'react';
 import { CommandProvider } from '../command-context/CommandContext.js';
 import { usePortalPatch } from '../downshift/usePortalPatch.js';
 
-const isHoverSupported = typeof window !== "undefined" && window.matchMedia("(hover: hover)").matches;
 function Command({
   children,
   inputValue: inputValueProp,
   isItemDisabled = () => false,
+  isItemSelected = () => false,
   items,
-  itemToKey = (value) => value,
-  itemToString = (value) => value ? String(value) : "",
+  itemToLabel = (value) => value ? String(value) : "",
   itemToSubItems,
   onInputValueChange,
   onItemSelect,
-  onOpenChange,
-  open,
-  selectedItem,
-  value: valueProp,
   ...props
 }) {
-  const value = useMemo(
-    () => Array.isArray(valueProp) ? new Set(valueProp) : valueProp,
-    [valueProp]
-  );
   const [inputValue, setInputValue] = useControllableState({
     defaultProp: "",
     onChange: onInputValueChange,
@@ -34,19 +25,17 @@ function Command({
   });
   const [lastInteractionSource, setLastInteractionSource] = useState("pointer");
   const [highlightedIndex, setHighlightedIndex, placed, setPlaced] = usePortalPatch(
-    open,
-    selectedItem ? items.findIndex((item) => itemToKey(selectedItem) === itemToKey(item)) : -1
+    () => items.findIndex((item, index) => isItemSelected(item, index))
   );
   const [highlightedSubIndex, setHighlightedSubIndex] = useState(-1);
   const downshift = useCombobox({
     ...props,
-    highlightedIndex: highlightedIndex === -1 && isHoverSupported ? items.findIndex((item, index) => !isItemDisabled(item, index)) : highlightedIndex,
+    highlightedIndex: highlightedIndex === -1 ? items.findIndex((item, index) => !isItemDisabled(item, index)) : highlightedIndex,
     inputValue,
     isItemDisabled,
     isOpen: placed,
     items,
-    itemToKey,
-    itemToString,
+    itemToString: itemToLabel,
     onHighlightedIndexChange({ highlightedIndex: highlightedIndex2, type }) {
       if (type !== useCombobox.stateChangeTypes.MenuMouseLeave) {
         setHighlightedIndex(highlightedIndex2);
@@ -63,7 +52,6 @@ function Command({
       }
     },
     onIsOpenChange({ isOpen, type }) {
-      onOpenChange?.(isOpen);
       if (isOpen) {
         if (type === useCombobox.stateChangeTypes.InputClick || type === useCombobox.stateChangeTypes.ToggleButtonClick) {
           setLastInteractionSource("pointer");
@@ -72,12 +60,12 @@ function Command({
         }
       }
     },
-    onSelectedItemChange({ selectedItem: selectedItem2, type }) {
-      if (type !== useCombobox.stateChangeTypes.InputBlur && selectedItem2) {
-        onItemSelect?.(selectedItem2);
+    onSelectedItemChange({ selectedItem, type }) {
+      if (type !== useCombobox.stateChangeTypes.InputBlur && selectedItem) {
+        onItemSelect?.(selectedItem);
       }
     },
-    selectedItem
+    selectedItem: null
   });
   downshift.getMenuProps({}, { suppressRefError: true });
   return /* @__PURE__ */ jsx(
@@ -87,6 +75,7 @@ function Command({
       highlightedItem: items[downshift.highlightedIndex],
       highlightedSubIndex: highlightedSubIndex === -1 && items[downshift.highlightedIndex] && itemToSubItems?.(items[downshift.highlightedIndex])?.length ? 0 : highlightedSubIndex,
       isItemDisabled,
+      isItemSelected,
       items,
       itemToSubItems,
       lastInteractionSource,
@@ -100,7 +89,6 @@ function Command({
       },
       setInputValue,
       setPlaced,
-      value,
       children
     }
   );

package/dist/esm/packages/react/src/command-focusable-item/CommandFocusableItem-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-DpowjLes.css';
-import './../../../../assets/src/command-focusable-item/CommandFocusableItem.css.ts.vanilla-BZ6G7a3_.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B8dEEUcR.css';
+import './../../../../assets/src/command-focusable-item/CommandFocusableItem.css.ts.vanilla-CCIi7Mm1.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:'_1lis389'});
+var item = recipeRuntime({base:'oipfcl'});
 
 export { item };

package/dist/esm/packages/react/src/command-item/CommandItem.js

@@ -6,11 +6,9 @@ import { CommandFocusableItem } from '../command-focusable-item/CommandFocusable
 
 const CommandItem = forwardRef(
   ({ children, item, selected, size, ...props }, ref) => {
-    const { downshift, highlightedItem, value } = useCommandContext(
-      "@optiaxiom/react/CommandItem"
-    );
+    const { downshift, highlightedItem, isItemSelected, items } = useCommandContext("@optiaxiom/react/CommandItem");
     const itemProps = downshift.getItemProps({
-      "aria-selected": selected ?? value?.has(item),
+      "aria-selected": selected ?? isItemSelected(item, items.indexOf(item)),
       item,
       ref,
       ...props