@optiaxiom/react 0.11.1 → 0.12.0

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/inline-input/InlineInput.css.ts.vanilla-XKmjiNx0.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/inline-input/InlineInput.css.ts.vanilla-DQEAby9t.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var editor = recipeRuntime({base:'_1qi0kiq',variants:{empty:{false:{},true:'_1424im'}}});
-var input = recipeRuntime({base:'_9lxc7'});
+var editor = recipeRuntime({base:'_13zq4ll',variants:{empty:{false:{},true:'tvrgci'}}});
+var input = recipeRuntime({base:'_1r1kto8'});
 
 export { editor, input };

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

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

package/dist/packages/react/src/input-context/InputContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [InputContextProvider, useInputContext] = createContext("InputRoot");

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-Xh4Joc5P.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-D0ivfH9I.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:['_186wod6',{bg:'transparent',flex:'auto',w:'full'},'_1p7prbr','_1tbyc9r'],variants:{size:{md:{},lg:{},xl:['_1cidawl']}}});
+var control = recipeRuntime({base:['dfoyyk',{bg:'transparent',flex:'auto',w:'full'},'_6489ma','_1e3qepf'],variants:{size:{md:{},lg:{},xl:['_1rslxar']}}});
 
 export { control };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-Vo2OEHTD.css';
-import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-Xh4Joc5P.css';
-import './../../../../assets/src/input-root/InputRoot.css.ts.vanilla-KLJIi8F-.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-BxCgGwKO.css';
+import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-D0ivfH9I.css';
+import './../../../../assets/src/input-root/InputRoot.css.ts.vanilla-BBF49P4Q.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'qr6mzc']});
+var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'ed6meb']});
 
 export { root };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-D__K_Wn9.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-CcgEcPxm.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'},'_69s5kk'],variants:{variant:{outline:{border:'1',borderB:'2',fontWeight:'600',gap:'4'},subtle:{bg:'transparent',color:'fg.secondary',fontFamily:'sans',gap:'2',px:'0'}}}});
-var keys = recipeRuntime({base:'_1p19sdp',variants:{variant:{outline:'_6xi1ru',subtle:{}}}});
+var kbd = recipeRuntime({base:[{alignItems:'center',bg:'bg.secondary',display:'inline-flex',flexDirection:'row',px:'4',rounded:'sm',whiteSpace:'nowrap'},'_1by386q'],variants:{variant:{outline:{border:'1',borderB:'2',fontWeight:'600',gap:'4'},subtle:{bg:'transparent',color:'fg.secondary',fontFamily:'sans',gap:'2',px:'0'}}}});
+var keys = recipeRuntime({base:'_1hb1nzj',variants:{variant:{outline:'i69vkc',subtle:{}}}});
 
 export { kbd, keys };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
 
 var axiom = 'optiaxiom';
 var base = 'optiaxiom.base';
-var components = 'optiaxiom._11qbkaq';
-var reset = 'optiaxiom._1n442qx';
+var components = 'optiaxiom._5obs4g';
+var reset = 'optiaxiom._16i5hvn';
 var theme = 'optiaxiom.theme';
 
 export { axiom, base, components, reset, theme };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/link/Link.css.ts.vanilla-DJuQfe6I.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/link/Link.css.ts.vanilla-D0s7UoMe.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'njq8hh']});
-var link = recipeRuntime({base:['_1awgg80'],variants:{appearance:{'default':'_1lbm7h7',inverse:'_17si5be',subtle:'_8342sx'},overlay:{false:{},true:'_1erhngb'}}});
+var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'_1terp0f']});
+var link = recipeRuntime({base:['ijn6p0'],variants:{appearance:{'default':'pshqeh',inverse:'_1nf1ju9',subtle:'_1a7h5r4'},overlay:{false:{},true:'_14de5d7'}}});
 
 export { icon, link };

package/dist/packages/react/src/listbox-checkbox-item/ListboxCheckboxItem.js

@@ -14,7 +14,9 @@ const ListboxCheckboxItem = forwardRef(({ addonBefore, icon, ...props }, ref) =>
         /* @__PURE__ */ jsx(
           Checkbox,
           {
-            checked: Boolean(props["aria-selected"]),
+            checked: Boolean(
+              props[props["role"] === "option" ? "aria-selected" : "aria-checked"]
+            ),
             disabled: Boolean(props["aria-disabled"]),
             pointerEvents: "none",
             tabIndex: -1

package/dist/packages/react/src/listbox-group-context/ListboxGroupContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [ListboxGroupContextProvider, useListboxGroupContext] = createContext("ListboxGroup", { id: undefined });

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/listbox-item/ListboxItem.css.ts.vanilla-53sn-tfO.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/listbox-item/ListboxItem.css.ts.vanilla-WI-slBQP.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var description = recipeRuntime({base:[{fontSize:'sm'},'_15yfbtf']});
-var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'_4snb2l'],variants:{intent:{danger:'_1c27g08',neutral:'vbhw30'}}});
-var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'_1uu0o08']});
+var description = recipeRuntime({base:[{fontSize:'sm'},'ssf5qa']});
+var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'qlyxbd'],variants:{intent:{danger:'_1omnrqy',neutral:'xntdf9'}}});
+var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'_1vlxegp']});
 
 export { description, item, title };

package/dist/packages/react/src/listbox-radio-item/ListboxRadioItem.js

@@ -11,7 +11,14 @@ const ListboxRadioItem = forwardRef(({ addonAfter, ...props }, ref) => {
     {
       addonAfter: /* @__PURE__ */ jsxs(Flex, { flexDirection: "row", gap: "8", children: [
         addonAfter,
-        /* @__PURE__ */ jsx(ListboxItemIndicator, { active: Boolean(props["aria-selected"]) })
+        /* @__PURE__ */ jsx(
+          ListboxItemIndicator,
+          {
+            active: Boolean(
+              props[props["role"] === "option" ? "aria-selected" : "aria-checked"]
+            )
+          }
+        )
       ] }),
       ref,
       ...props

package/dist/packages/react/src/menu-button/MenuButton.js

@@ -6,17 +6,7 @@ import { IconAngleDown } from '../icons/IconAngleDown.js';
 
 const MenuButton = forwardRef(
   ({ children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      Button,
-      {
-        icon: /* @__PURE__ */ jsx(IconAngleDown, {}),
-        iconPosition: "end",
-        justifyContent: "space-between",
-        ref,
-        ...props,
-        children
-      }
-    );
+    return /* @__PURE__ */ jsx(Button, { icon: /* @__PURE__ */ jsx(IconAngleDown, {}), iconPosition: "end", ref, ...props, children });
   }
 );
 MenuButton.displayName = "@optiaxiom/react/MenuButton";

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/menu-listbox/MenuListbox.css.ts.vanilla-BraALMiH.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/menu-listbox/MenuListbox.css.ts.vanilla-BXN-FR8J.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'_14njr86'],variants:{maxH:{xs:'kqadsq',sm:'_7us88',md:'g7gctj',lg:'csxzda',full:{}},minW:{'0':{},trigger:'pkwjuk'},provider:{'dropdown-menu':'sgtiup',popover:'ojc9ko',popper:'_1gh8y0i'}}});
+var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'rdl8hv'],variants:{maxH:{xs:'g1416y',sm:'_1ecsz61',md:'_1a46pry',lg:'er6hrh',full:{}},minW:{'0':{},trigger:'_1wef7yr'},provider:{'dropdown-menu':'cvfi0h',popover:'_1agmc19',popper:'_192s0id'}}});
 
 export { listbox };

package/dist/packages/react/src/nav/Nav.js

@@ -0,0 +1,29 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { Flex } from '../flex/Flex.js';
+import { useSidebarContext } from '../sidebar-context/SidebarContext.js';
+
+const Nav = forwardRef(
+  ({ children, ...props }, ref) => {
+    const { animations, expanded } = useSidebarContext("Nav");
+    return /* @__PURE__ */ jsx(Flex, { borderR: "1", h: "full", ref, w: "fit", ...props, children: /* @__PURE__ */ jsx(
+      Flex,
+      {
+        asChild: true,
+        bg: "bg.default",
+        flex: "1",
+        gap: "0",
+        overflow: "hidden",
+        pb: "8",
+        pt: "16",
+        transition: animations ? "all" : undefined,
+        w: expanded ? "224" : "56",
+        children: /* @__PURE__ */ jsx("nav", { "aria-label": "Main", children })
+      }
+    ) });
+  }
+);
+Nav.displayName = "@optiaxiom/react/Nav";
+
+export { Nav };

package/dist/packages/react/src/{sidenav-account-item/SidenavAccountItem.js → nav-account-item/NavAccountItem.js}

@@ -7,12 +7,12 @@ import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 import { Flex } from '../flex/Flex.js';
 import { IconEllipsis } from '../icons/IconEllipsis.js';
-import { useSidenavContext } from '../sidenav-context/SidenavContext.js';
+import { useSidebarContext } from '../sidebar-context/SidebarContext.js';
 import { Text } from '../text/Text.js';
 import { Transition } from '../transition/Transition.js';
 
-const SidenavAccountItem = forwardRef(({ name, organization, src, ...props }, ref) => {
-  const { animations, expanded } = useSidenavContext("SidenavAccountItem");
+const NavAccountItem = forwardRef(({ name, organization, src, ...props }, ref) => {
+  const { animations, expanded } = useSidebarContext("NavAccountItem");
   return /* @__PURE__ */ jsx(Flex, { my: "8", role: "listitem", children: /* @__PURE__ */ jsx(
     Flex,
     {
@@ -46,6 +46,6 @@ const SidenavAccountItem = forwardRef(({ name, organization, src, ...props }, re
     }
   ) });
 });
-SidenavAccountItem.displayName = "@optiaxiom/react/SidenavAccountItem";
+NavAccountItem.displayName = "@optiaxiom/react/NavAccountItem";
 
-export { SidenavAccountItem };
+export { NavAccountItem };

package/dist/packages/react/src/{sidenav-body/SidenavBody.js → nav-body/NavBody.js}

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Flex } from '../flex/Flex.js';
 
-const SidenavBody = forwardRef(
+const NavBody = forwardRef(
   ({ children, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       Flex,
@@ -23,6 +23,6 @@ const SidenavBody = forwardRef(
     );
   }
 );
-SidenavBody.displayName = "@optiaxiom/react/SidenavBody";
+NavBody.displayName = "@optiaxiom/react/NavBody";
 
-export { SidenavBody };
+export { NavBody };

package/dist/packages/react/src/{sidenav-footer/SidenavFooter.js → nav-footer/NavFooter.js}

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Flex } from '../flex/Flex.js';
 
-const SidenavFooter = forwardRef(
+const NavFooter = forwardRef(
   ({ children, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       Flex,
@@ -20,6 +20,6 @@ const SidenavFooter = forwardRef(
     );
   }
 );
-SidenavFooter.displayName = "@optiaxiom/react/SidenavFooter";
+NavFooter.displayName = "@optiaxiom/react/NavFooter";
 
-export { SidenavFooter };
+export { NavFooter };

package/dist/packages/react/src/{sidenav-header/SidenavHeader.js → nav-header/NavHeader.js}

@@ -3,11 +3,11 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Flex } from '../flex/Flex.js';
 
-const SidenavHeader = forwardRef(
+const NavHeader = forwardRef(
   ({ children, ...props }, ref) => {
     return /* @__PURE__ */ jsx(Flex, { ref, role: "list", ...props, children });
   }
 );
-SidenavHeader.displayName = "@optiaxiom/react/SidenavHeader";
+NavHeader.displayName = "@optiaxiom/react/NavHeader";
 
-export { SidenavHeader };
+export { NavHeader };

package/dist/packages/react/src/{sidenav-item/SidenavItem-css.js → nav-item/NavItem-css.js}

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-Vo2OEHTD.css';
-import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-Dazay9tw.css';
-import './../../../../assets/src/sidenav-item/SidenavItem.css.ts.vanilla-BB_G4vIW.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-BxCgGwKO.css';
+import './../../../../assets/src/button-base/ButtonBase.css.ts.vanilla-DasptH10.css';
+import './../../../../assets/src/nav-item/NavItem.css.ts.vanilla-VGI0LCrr.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:[{fontWeight:'500',mx:'8',textAlign:'start'},'_13vfxbx']});
+var item = recipeRuntime({base:[{fontWeight:'500',mx:'8',textAlign:'start'},'_1qewzk1']});
 
 export { item };

package/dist/packages/react/src/{sidenav-item/SidenavItem.js → nav-item/NavItem.js}

@@ -6,17 +6,16 @@ import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 import { Button } from '../button/Button.js';
 import { Flex } from '../flex/Flex.js';
-import { useSidenavContext } from '../sidenav-context/SidenavContext.js';
+import { useSidebarContext } from '../sidebar-context/SidebarContext.js';
 import { Tooltip } from '../tooltip/Tooltip.js';
 import { Transition } from '../transition/Transition.js';
 import '../utils/conditions.js';
 import { decorateChildren } from '../utils/decorateChildren.js';
-import { fallbackSpan } from '../utils/fallbackSpan.js';
-import { item } from './SidenavItem-css.js';
+import { item } from './NavItem-css.js';
 
-const SidenavItem = forwardRef(
+const NavItem = forwardRef(
   ({ active, addonAfter, asChild, children, className, ...props }, ref) => {
-    const { animations, expanded } = useSidenavContext("SidenavItem");
+    const { animations, expanded } = useSidebarContext("NavItem");
     let tooltip = null;
     children = decorateChildren({ asChild, children }, (children2) => {
       tooltip = children2;
@@ -30,7 +29,7 @@ const SidenavItem = forwardRef(
         children: /* @__PURE__ */ jsx(
           Button,
           {
-            addonAfter: expanded && /* @__PURE__ */ jsx(Box, { asChild: true, ml: "auto", children: fallbackSpan(addonAfter) }),
+            addonAfter: expanded && addonAfter,
             appearance: "subtle",
             asChild,
             "data-state": active ? "active" : undefined,
@@ -47,6 +46,6 @@ const SidenavItem = forwardRef(
     ) });
   }
 );
-SidenavItem.displayName = "@optiaxiom/react/SidenavItem";
+NavItem.displayName = "@optiaxiom/react/NavItem";
 
-export { SidenavItem };
+export { NavItem };

package/dist/packages/react/src/nested-dialog-context/NestedDialogContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [NestedDialogContextProvider, useNestedDialogContext] = createContext("NestedDialog", null);

package/dist/packages/react/src/nested-dialog-context/useNestedDialogCount.js

@@ -1,3 +1,4 @@
+"use client";
 import { useState, useEffect } from 'react';
 import { useNestedDialogContext } from './NestedDialogContext.js';
 

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-D-4aqA8_.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-DuMOgkJU.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:'_58nnzj'});
-var cursor = recipeRuntime({base:[{z:'10'},'_67p097'],variants:{animation:{false:{},true:{transition:'transform'}}}});
-var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'n7eukd']});
+var button = recipeRuntime({base:[{justifyContent:'center'},'_1whx4et']});
+var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'kh9cjw'],variants:{animation:{false:{},true:{transition:'transform'}}}});
+var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'_13r19y6']});
 
 export { button, cursor, list };

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

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.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'},drawer:{},menu:{border:'1',borderColor:'border.secondary',rounded:'lg'}}}});

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/pill/Pill.css.ts.vanilla-C_yhLXgb.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/pill/Pill.css.ts.vanilla-Q0Zz6YuQ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var pill = recipeRuntime({base:[{bg:'bg.secondary',border:'0',fontSize:'sm',rounded:'md'},'_13zbp75'],variants:{size:{md:{h:'xs'},lg:{h:'sm'}}}});
+var pill = recipeRuntime({base:[{bg:'bg.secondary',border:'0',fontSize:'sm',rounded:'md'},'_7gjdcd'],variants:{size:{md:{h:'xs'},lg:{h:'sm'}}}});
 
 export { pill };

package/dist/packages/react/src/popover-context/PopoverContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [PopoverContextProvider, usePopoverContext] = createContext("Popover");

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/progress/Progress.css.ts.vanilla-BQ3O1Qep.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/progress/Progress.css.ts.vanilla-CVYzx4Q6.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'},'r6xqw6']});
+var progress = recipeRuntime({base:[{bg:'bg.tertiary',overflow:'hidden',rounded:'full'},'sp4odo']});
 
 export { indicator, progress };

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

@@ -1,12 +1,12 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-Vo2OEHTD.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-CqmiPQWN.css';
-import './../../../../assets/src/radio/Radio.css.ts.vanilla-C9Ku1-cp.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-BxCgGwKO.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-BNzQxjeW.css';
+import './../../../../assets/src/radio/Radio.css.ts.vanilla-CizQZHjJ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'q4yvgl'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'_13wxlee']});
-var input = recipeRuntime({base:'_1s63i5y'});
-var radio = recipeRuntime({base:'_1i4kmy'});
+var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'_1d2axmm'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'_1fs0xae']});
+var input = recipeRuntime({base:'_24gsoc'});
+var radio = recipeRuntime({base:'zt5pz6'});
 
 export { control, indicator, input, radio };

package/dist/packages/react/src/radio-group-context/RadioGroupContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [RadioGroupContextProvider, useRadioGroupContext] = createContext("RadioGroup", null);

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-DZWNnJ45.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-BYToi99M.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var clear = recipeRuntime({base:[{size:'sm'},'_1o75jfr']});
-var search = recipeRuntime({base:'_1upqmhz'});
+var clear = recipeRuntime({base:[{size:'sm'},'xgqlsc']});
+var search = recipeRuntime({base:'sq5ap8'});
 
 export { clear, search };

package/dist/packages/react/src/segmented-control-context/SegmentedControlContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [SegmentedControlContextProvider, useSegmentedControlContext] = createContext("SegmentedControl");

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

@@ -30,11 +30,14 @@ function Select({
     onChange: onOpenChange,
     prop: open
   });
-  const [highlightedIndex, setHighlightedIndex] = usePortalPatch(isOpen);
+  const [highlightedIndex, setHighlightedIndex, placed, setPlaced] = usePortalPatch(
+    isOpen,
+    selectedItem ? items.findIndex((item) => itemToKey(selectedItem) === itemToKey(item)) : -1
+  );
   const downshift = useSelect({
     ...props,
     highlightedIndex,
-    isOpen,
+    isOpen: placed,
     items,
     itemToKey,
     itemToString,
@@ -55,12 +58,14 @@ function Select({
     {
       disabled,
       downshift,
-      highlightedItem: items[downshift.highlightedIndex],
-      isOpen: downshift.isOpen,
+      highlightedItem: items[highlightedIndex],
+      isOpen,
       items,
       itemToKey,
       itemToString,
+      placed,
       selectedItem,
+      setPlaced,
       children
     }
   ) });

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/select-content/SelectContent.css.ts.vanilla-DTscrtoE.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/select-content/SelectContent.css.ts.vanilla-DjIQ3r4s.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var content = recipeRuntime({base:['yzu8jn']});
+var content = recipeRuntime({base:['th63gn']});
 
 export { content };

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

@@ -21,7 +21,7 @@ const SelectContent = forwardRef(
     ...props
   }, ref) => {
     const { boxProps, restProps } = extractBoxProps(props);
-    const { downshift, isOpen } = useSelectContext("SelectContent");
+    const { downshift, isOpen, placed, setPlaced } = useSelectContext("SelectContent");
     return isOpen && /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(ModalLayer, { asChild: true, children: /* @__PURE__ */ jsx(
       MenuListbox,
       {
@@ -31,8 +31,20 @@ const SelectContent = forwardRef(
         provider: "popper",
         ...content({}, className),
         ...boxProps,
-        ...downshift.getMenuProps({ ref, ...restProps }),
-        children: /* @__PURE__ */ jsx(PopperContent, { align, side, sideOffset: 5, children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children })
+        ...downshift.getMenuProps(
+          { ref, ...restProps },
+          { suppressRefError: !placed }
+        ),
+        children: /* @__PURE__ */ jsx(
+          PopperContent,
+          {
+            align,
+            onPlaced: () => setPlaced(true),
+            side,
+            sideOffset: 5,
+            children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children
+          }
+        )
       }
     ) }) });
   }

package/dist/packages/react/src/select-context/SelectContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from '@radix-ui/react-context';
 
 const [SelectContextProvider, useSelectContext] = createContext("Select");

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

@@ -2,7 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { PopperAnchor } from '@radix-ui/react-popper';
 import { Slot } from '@radix-ui/react-slot';
-import { forwardRef, useRef, useEffect } from 'react';
+import { forwardRef, useRef, useEffect, useState } from 'react';
 import '../field-context/FieldContext.js';
 import { useFieldContext } from '../field-context/useFieldContext.js';
 import { MenuButton } from '../menu-button/MenuButton.js';
@@ -10,7 +10,7 @@ import { useSelectContext } from '../select-context/SelectContext.js';
 
 const SelectTrigger = forwardRef(
   ({ asChild, children, onKeyDown, ...props }, ref) => {
-    const { disabled, downshift } = useSelectContext("SelectTrigger");
+    const { disabled, downshift, isOpen } = useSelectContext("SelectTrigger");
     const { labelId } = useFieldContext();
     const buttonRef = useRef(null);
     useEffect(() => {
@@ -26,6 +26,15 @@ const SelectTrigger = forwardRef(
       label.addEventListener("click", onLabelClick);
       return () => label.removeEventListener("click", onLabelClick);
     }, [labelId]);
+    const [focusOnOpen] = useState(isOpen);
+    useEffect(
+      function() {
+        if (focusOnOpen && buttonRef.current) {
+          buttonRef.current.focus();
+        }
+      },
+      [focusOnOpen]
+    );
     return /* @__PURE__ */ jsx(
       PopperAnchor,
       {

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CUZzNcnS.css';
-import './../../../../assets/src/separator/Separator.css.ts.vanilla-BOUaQX-2.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-B-b4u8-T.css';
+import './../../../../assets/src/separator/Separator.css.ts.vanilla-Kk8LoraM.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_wcbutaohqjnkd6euht5r5xgz74/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:'zc19qr',md:'_4fc81x',base:'i5zaps'},defaultClass:'i5zaps'},vertical:{conditions:{sm:'_1ho925x',md:'_1xyfsgw',base:'tkgr'},defaultClass:'tkgr'}},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:'_15apq2v',md:'_7iuc6p',base:'_1dmjdrv'},defaultClass:'_1dmjdrv'},vertical:{conditions:{sm:'pcs7fg',md:'_1wkpvwl',base:'_1lakpj6'},defaultClass:'_1lakpj6'}},responsiveArray:undefined}}};x.styles.orientation.responsiveArray=x.conditions.responsiveArray;return x;}()));
 
 export { base, separator };