@optiaxiom/react 1.5.9 → 1.5.11

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

@@ -1,7 +1,7 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
-import { forwardRef, useState, useRef, useEffect } from 'react';
+import { forwardRef, useRef, useEffect } from 'react';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
@@ -22,18 +22,17 @@ const MenuInput = forwardRef(
       "@optiaxiom/react/MenuInput"
     );
     const ref = useComposedRefs(inputRef, outerRef);
-    const [minWidth, setMinWidth] = useState(160);
     const containerRef = useRef(null);
     useEffect(() => {
       if (!containerRef.current) {
         return;
       }
       const rect = containerRef.current.getBoundingClientRect();
-      if (open && rect.width > minWidth) {
-        setMinWidth(rect.width);
+      if (open) {
+        containerRef.current.style.minWidth = `${rect.width}px`;
       }
-    }, [downshift.inputValue, minWidth, open]);
-    return /* @__PURE__ */ jsx(Box, { ref: containerRef, style: { minWidth }, children: /* @__PURE__ */ jsx(
+    }, [downshift.inputValue, open]);
+    return /* @__PURE__ */ jsx(Box, { ref: containerRef, style: { minWidth: 160 }, children: /* @__PURE__ */ jsx(
       CommandInput,
       {
         onKeyDown: (event) => {

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

@@ -5,6 +5,7 @@ import '../command/Command.js';
 import '../command/CommandInput.js';
 import { CommandItem } from '../command/CommandItem.js';
 import '../command/CommandListbox.js';
+import { useCommandContext, resolveItemProperty } from '../command/CommandContext.js';
 import '../listbox/Listbox.js';
 import '../listbox/ListboxCheckboxItem.js';
 import '../listbox/ListboxEmpty.js';
@@ -20,12 +21,15 @@ import '../listbox/ListboxSwitchItem.js';
 const MenuItem = forwardRef(
   ({ children, ...props }, ref) => {
     const Comp = props.item.href ? "a" : "div";
+    const { inputValue } = useCommandContext("@optiaxiom/react/MenuItem");
     return /* @__PURE__ */ jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(
       ListboxItem,
       {
-        addonBefore: props.item.addon,
+        addonBefore: resolveItemProperty(props.item.addon, { inputValue }),
         asChild: true,
-        description: props.item.description,
+        description: resolveItemProperty(props.item.description, {
+          inputValue
+        }),
         intent: props.item.intent,
         children: /* @__PURE__ */ jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
       }

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

@@ -6,7 +6,7 @@ import '../popover/PopoverContent.js';
 import '../popover/PopoverTrigger.js';
 
 function MenuPopover(props) {
-  return /* @__PURE__ */ jsx(Popover, { modal: true, ...props });
+  return /* @__PURE__ */ jsx(Popover, { ...props });
 }
 MenuPopover.displayName = "@optiaxiom/react/MenuPopover";
 

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

@@ -1,5 +1,5 @@
 "use client";
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useId } from '@radix-ui/react-id';
 import clsx from 'clsx';
 import { forwardRef } from 'react';
@@ -10,7 +10,6 @@ import { PopoverContent } from '../popover/PopoverContent.js';
 import '../popover/PopoverTrigger.js';
 import { VisuallyHidden } from '../visually-hidden/VisuallyHidden.js';
 import { useMenuContext } from './MenuContext.js';
-import { MenuPopoverContentImpl } from './MenuPopoverContentImpl.js';
 
 const MenuPopoverContent = forwardRef(({ "aria-label": ariaLabel, children, ...props }, ref) => {
   const { labelId: fieldLabelId } = useFieldContext(
@@ -18,17 +17,16 @@ const MenuPopoverContent = forwardRef(({ "aria-label": ariaLabel, children, ...p
   );
   const { triggerRef } = useMenuContext("@optiaxiom/react/MenuPopoverContent");
   const labelId = useId();
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     PopoverContent,
     {
       "aria-labelledby": clsx(fieldLabelId ?? triggerRef.current?.id, labelId),
-      asChild: true,
       ref,
       ...props,
-      children: /* @__PURE__ */ jsxs(MenuPopoverContentImpl, { children: [
+      children: [
         /* @__PURE__ */ jsx(VisuallyHidden, { id: labelId, children: ariaLabel || "Menu" }),
         children
-      ] })
+      ]
     }
   );
 });

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

@@ -5,6 +5,7 @@ import '../command/Command.js';
 import '../command/CommandInput.js';
 import { CommandItem } from '../command/CommandItem.js';
 import '../command/CommandListbox.js';
+import { useCommandContext, resolveItemProperty } from '../command/CommandContext.js';
 import '../listbox/Listbox.js';
 import '../listbox/ListboxCheckboxItem.js';
 import '../listbox/ListboxEmpty.js';
@@ -20,12 +21,15 @@ import '../listbox/ListboxSwitchItem.js';
 const MenuRadioItem = forwardRef(
   ({ children, ...props }, ref) => {
     const Comp = props.item.href ? "a" : "div";
+    const { inputValue } = useCommandContext("@optiaxiom/react/MenuRadioItem");
     return /* @__PURE__ */ jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(
       ListboxRadioItem,
       {
-        addonBefore: props.item.addon,
+        addonBefore: resolveItemProperty(props.item.addon, { inputValue }),
         asChild: true,
-        description: props.item.description,
+        description: resolveItemProperty(props.item.description, {
+          inputValue
+        }),
         children: /* @__PURE__ */ jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
       }
     ) });

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

@@ -13,6 +13,7 @@ import '../popover/Popover.js';
 import { PopoverAnchor } from '../popover/PopoverAnchor.js';
 import { PopoverContent } from '../popover/PopoverContent.js';
 import '../popover/PopoverTrigger.js';
+import '../popover/PopoverContentContext.js';
 import { usePopoverContext } from '../popover/PopoverContext.js';
 import { VisuallyHidden } from '../visually-hidden/VisuallyHidden.js';
 import { useMenuContext } from './MenuContext.js';

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

@@ -25,9 +25,11 @@ const MenuSwitchItem = forwardRef(
     return /* @__PURE__ */ jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsx(
       ListboxSwitchItem,
       {
-        addonBefore: props.item.addon,
+        addonBefore: resolveItemProperty(props.item.addon, { inputValue }),
         asChild: true,
-        description: props.item.description,
+        description: resolveItemProperty(props.item.description, {
+          inputValue
+        }),
         onCheckedChange: () => !resolveItemProperty(props.item.disabledReason) && props.item.execute?.({ dismiss: false, inputValue }),
         children: /* @__PURE__ */ jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
       }

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

@@ -49,6 +49,7 @@ const MenuTrigger = forwardRef(
           }
           switch (event.key) {
             case "ArrowDown":
+              event.preventDefault();
               setOpen(true);
           }
         },

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/modal/ModalListbox.css.ts.vanilla-vJ4ibcUx.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/modal/ModalListbox.css.ts.vanilla-e3sz6wmn.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'_1gth1ez'],variants:{maxH:{xs:'_56kqvx',sm:'_1dt456q',md:'s5wk4w',lg:'_1d4jumh',full:{}},minW:{'0':{},trigger:'_13cs2w3'}}});
+var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'_1kalb2g'],variants:{maxH:{xs:'y6hxhm',sm:'accc2a',md:'_10t1qaa',lg:'_1fdcuso',full:{}},minW:{'0':{},trigger:'_8nwyat'}}});
 
 export { listbox };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/nav/Nav.css.ts.vanilla-Dv6yb2Y9.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/nav/Nav.css.ts.vanilla-CT6DsdT2.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'},'_17f43xk']});
+var nav = recipeRuntime({base:[{bg:'bg.default',flex:'1',gap:'0',overflow:'hidden',pb:'8',pt:'16'},'_157b4o1']});
 
 export { nav };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/nav/NavAccountItem.css.ts.vanilla-DJRmqqAr.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/nav/NavAccountItem.css.ts.vanilla-B-uXPJtz.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:'u0b104',true:'ci8c87'}}});
+var item = recipeRuntime({base:{flex:'1',flexDirection:'row',fontSize:'md',gap:'8',overflowX:'hidden',transition:'opacity'},variants:{expanded:{false:'_1ggzyxb',true:'_7rhccp'}}});
 
 export { item };

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

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

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

@@ -1,10 +1,10 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-BGkDreBM.css';
-import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-BZilmyUD.css';
-import './../../../../assets/src/nav/NavItem.css.ts.vanilla-CYJdJuW3.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-BvhDwVOk.css';
+import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-CysUCjqr.css';
+import './../../../../assets/src/nav/NavItem.css.ts.vanilla-Cogbf2CQ.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'},'olkitg']});
-var label = recipeRuntime({base:[{alignItems:'center',display:'flex',flex:'1',gap:'10',justifyContent:'space-between',mr:'10',overflow:'hidden'},'n272zu'],variants:{expanded:{false:'bhr6jj',true:'_7lrpo4'}}});
+var item = recipeRuntime({base:[{alignItems:'center',display:'flex',fontSize:'md',fontWeight:'500',h:'lg',justifyContent:'flex-start',rounded:'md',textAlign:'start',transition:'colors'},'_2e7syz']});
+var label = recipeRuntime({base:[{alignItems:'center',display:'flex',flex:'1',gap:'10',justifyContent:'space-between',mr:'10',overflow:'hidden'},'eic0o5'],variants:{expanded:{false:'_97k8aj',true:'hip0yw'}}});
 
 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-Bn_VRXY4.css';
-import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-PckXtUsk.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-DSm3whmt.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:[{justifyContent:'center'},'_1r9tdp8']});
-var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'qde4yw'],variants:{animation:{false:{},true:{transition:'transform'}}}});
-var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'etot4y']});
+var button = recipeRuntime({base:[{justifyContent:'center'},'_1cxx9i8']});
+var cursor = recipeRuntime({base:[{justifyContent:'center',z:'10'},'_1amaf09'],variants:{animation:{false:{},true:{transition:'transform'}}}});
+var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'j9mr09']});
 
 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-Bn_VRXY4.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.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-Bn_VRXY4.css';
-import './../../../../assets/src/pill/Pill.css.ts.vanilla-DF8TRDwX.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/pill/Pill.css.ts.vanilla-D2eo1Hbx.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'},'yjgp0o'],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'},'dndar'],variants:{size:{xs:{h:'xs'},sm:{h:'sm'}}}});
 
 export { pill };

package/dist/esm/packages/react/src/popover/Popover.js

@@ -4,6 +4,7 @@ import * as RadixPopover from '@radix-ui/react-popover';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { useState } from 'react';
 import { PopoverProvider } from './PopoverContext.js';
+import { usePopoverScope } from './usePopoverScope.js';
 
 function Popover({
   children,
@@ -19,16 +20,24 @@ function Popover({
     prop: openProp
   });
   const [presence, setPresence] = useState(false);
-  return /* @__PURE__ */ jsx(RadixPopover.Root, { modal, onOpenChange: setOpen, open, children: /* @__PURE__ */ jsx(
-    PopoverProvider,
+  return /* @__PURE__ */ jsx(
+    RadixPopover.Root,
     {
       modal,
+      onOpenChange: setOpen,
       open,
-      presence,
-      setPresence,
-      children
+      ...usePopoverScope(void 0),
+      children: /* @__PURE__ */ jsx(
+        PopoverProvider,
+        {
+          open,
+          presence,
+          setPresence,
+          children
+        }
+      )
     }
-  ) });
+  );
 }
 Popover.displayName = "@optiaxiom/react/Popover";
 

package/dist/esm/packages/react/src/popover/PopoverAnchor.js

@@ -1,14 +1,16 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import * as RadixPopover from '@radix-ui/react-popover';
+import * as RadixPopper from '@radix-ui/react-popper';
 import { forwardRef } from 'react';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
+import { usePopoverScope } from './usePopoverScope.js';
 
 const PopoverAnchor = forwardRef(
-  ({ asChild, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Box, { asChild: true, ...props, children: /* @__PURE__ */ jsx(RadixPopover.Anchor, { asChild, ref, children }) });
+  ({ children, ...props }, ref) => {
+    const { __scopePopover } = usePopoverScope(void 0);
+    return /* @__PURE__ */ jsx(Box, { asChild: true, ref, ...props, ...{ __scopePopper: __scopePopover }, children: /* @__PURE__ */ jsx(RadixPopper.Anchor, { children }) });
   }
 );
 PopoverAnchor.displayName = "@optiaxiom/react/PopoverAnchor";

package/dist/esm/packages/react/src/popover/PopoverContent.js

@@ -11,6 +11,7 @@ import '../utils/isHoverSupported.js';
 import { onReactSelectInputBlur } from '../utils/onReactSelectInputBlur.js';
 import { PopoverContentImpl } from './PopoverContentImpl.js';
 import { usePopoverContext } from './PopoverContext.js';
+import { usePopoverScope } from './usePopoverScope.js';
 
 const PopoverContent = forwardRef(
   ({
@@ -21,7 +22,7 @@ const PopoverContent = forwardRef(
     sideOffset = 4,
     ...props
   }, ref) => {
-    const { modal, open, presence, setPresence } = usePopoverContext(
+    const { open, presence, setPresence } = usePopoverContext(
       "@optiaxiom/react/PopoverContent"
     );
     return /* @__PURE__ */ jsx(
@@ -50,12 +51,13 @@ const PopoverContent = forwardRef(
                   if (event.defaultPrevented) {
                     return;
                   }
-                  if (modal && document.activeElement !== document.body) {
+                  if (document.activeElement !== document.body) {
                     event.preventDefault();
                   }
                 },
                 ref,
                 sideOffset,
+                ...usePopoverScope(void 0),
                 children: /* @__PURE__ */ jsx(PopoverContentImpl, { asChild, children })
               }
             )

package/dist/esm/packages/react/src/popover/PopoverTrigger.js

@@ -1,22 +1,17 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
 import * as RadixPopover from '@radix-ui/react-popover';
-import { forwardRef, useState, useEffect } from 'react';
+import { forwardRef } from 'react';
 import { Button } from '../button/Button.js';
 import '../button/ButtonGroup.js';
 import { usePopoverContext } from './PopoverContext.js';
+import { usePopoverScope } from './usePopoverScope.js';
 
-const PopoverTrigger = forwardRef(({ asChild, children, hasCustomAnchor, ...props }, ref) => {
+const PopoverTrigger = forwardRef(({ asChild, children, ...props }, ref) => {
   const { open, presence } = usePopoverContext(
     "@optiaxiom/react/PopoverTrigger"
   );
-  const [shouldRender, setShouldRender] = useState(!hasCustomAnchor);
-  useEffect(() => {
-    if (!shouldRender) {
-      setShouldRender(true);
-    }
-  }, [shouldRender]);
-  return shouldRender && /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(
     RadixPopover.Trigger,
     {
       "aria-expanded": open || presence,
@@ -24,6 +19,7 @@ const PopoverTrigger = forwardRef(({ asChild, children, hasCustomAnchor, ...prop
       "data-state": open || presence ? "open" : "closed",
       ref,
       ...props,
+      ...usePopoverScope(void 0),
       children: asChild ? children : /* @__PURE__ */ jsx(Button, { children })
     }
   );

package/dist/esm/packages/react/src/popover/usePopoverScope.js

@@ -0,0 +1,5 @@
+import * as RadixPopover from '@radix-ui/react-popover';
+
+const usePopoverScope = RadixPopover.createPopoverScope();
+
+export { usePopoverScope };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/progress/Progress.css.ts.vanilla-DnfSCDeY.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/progress/Progress.css.ts.vanilla-Ci_vCTKp.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'},'_412l73']});
+var progress = recipeRuntime({base:[{bg:'bg.tertiary',overflow:'hidden',rounded:'full'},'_1t2di19']});
 
 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-Bn_VRXY4.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-BGkDreBM.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-C3Eyp63O.css';
-import './../../../../assets/src/radio/Radio.css.ts.vanilla-8thMEsOS.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-BvhDwVOk.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-CikxaUsf.css';
+import './../../../../assets/src/radio/Radio.css.ts.vanilla-swt-alER.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'_1h6msx6'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'_1cis57h']});
-var input = recipeRuntime({base:'kvfutf'});
-var radio = recipeRuntime({base:'j72sz9'});
+var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'c1e9x2'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'h3z1f2']});
+var input = recipeRuntime({base:'tfbpkf'});
+var radio = recipeRuntime({base:'_1emryug'});
 
 export { control, indicator, input, radio };

package/dist/esm/packages/react/src/resizable/Resizable.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import * as ResizablePrimitive from 'react-resizable-panels';
+
+const Resizable = ({ ...props }) => {
+  return /* @__PURE__ */ jsx(ResizablePrimitive.PanelGroup, { ...props });
+};
+Resizable.displayName = "@optiaxiom/react/Resizable";
+
+export { Resizable };

package/dist/esm/packages/react/src/resizable/ResizableHandle-css.js

@@ -0,0 +1,8 @@
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/resizable/ResizableHandle.css.ts.vanilla-DCz6w2ER.css';
+import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
+
+var handle = recipeRuntime({base:[{border:'1',h:'56',rounded:'sm',w:'12'},'_1apiukx']});
+var root = recipeRuntime({base:[{justifyContent:'center',rounded:'sm',z:'10'},'ev5hya']});
+
+export { handle, root };

package/dist/esm/packages/react/src/resizable/ResizableHandle.js

@@ -0,0 +1,15 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import * as ResizablePrimitive from 'react-resizable-panels';
+import { Box } from '../box/Box.js';
+import '../sprinkles/sprinkles.js';
+import '../sprinkles/sprinklesMerge.js';
+import { Flex } from '../flex/Flex.js';
+import { root, handle } from './ResizableHandle-css.js';
+
+const ResizableHandle = (props) => {
+  return /* @__PURE__ */ jsx(Flex, { asChild: true, ...root(), children: /* @__PURE__ */ jsx(ResizablePrimitive.PanelResizeHandle, { ...props, children: /* @__PURE__ */ jsx(Box, { ...handle() }) }) });
+};
+ResizableHandle.displayName = "@optiaxiom/react/ResizableHandle";
+
+export { ResizableHandle };

package/dist/esm/packages/react/src/resizable/ResizablePanel.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import * as ResizablePrimitive from 'react-resizable-panels';
+
+const ResizablePanel = ({ ...props }) => {
+  return /* @__PURE__ */ jsx(ResizablePrimitive.Panel, { ...props });
+};
+ResizablePanel.displayName = "@optiaxiom/react/ResizablePanel";
+
+export { ResizablePanel };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-CY0VF-F6.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-55aB77DH.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var clear = recipeRuntime({base:[{size:'sm'},'e8ccmq']});
-var input = recipeRuntime({base:'_1yszh6y'});
-var search = recipeRuntime({base:'_1fg27jb'});
+var clear = recipeRuntime({base:[{size:'sm'},'_17j7f2k']});
+var input = recipeRuntime({base:'_5gaq00'});
+var search = recipeRuntime({base:'_1mbd432'});
 
 export { clear, input, search };

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

@@ -80,6 +80,7 @@ const SelectContent = forwardRef(
           {
             align,
             "aria-labelledby": clsx(fieldLabelId, labelId),
+            collisionPadding: 16,
             side,
             sideOffset: 4,
             children: /* @__PURE__ */ jsx(

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/separator/Separator.css.ts.vanilla-Bysb5ICL.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/separator/Separator.css.ts.vanilla-D0x0PqKS.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 import { createSprinkles } from '../../../../node_modules/.pnpm/@vanilla-extract_sprinkles@1.6.4_patch_hash_eh2tyazhmaumpwivglvpekok3e_@vanilla-extract_css@1_asf7eqp3jdj5gfnzqmvududbgm/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:'_1sk1dpx',md:'_11sv6s6',base:'_1jrpb6p'},defaultClass:'_1jrpb6p'},vertical:{conditions:{sm:'_1tfcrjf',md:'_10cioqb',base:'_1e0sthn'},defaultClass:'_1e0sthn'}},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:'_1izac6',md:'_1ch0y5l',base:'_1gbgbpc'},defaultClass:'_1gbgbpc'},vertical:{conditions:{sm:'gxpkis',md:'_1r7sd8q',base:'_1v124kt'},defaultClass:'_1v124kt'}},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-Bn_VRXY4.css';
-import './../../../../assets/src/skeleton/Skeleton.css.ts.vanilla-DKfCsVm2.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/skeleton/Skeleton.css.ts.vanilla-CI6KnK9v.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var skeleton = recipeRuntime({base:[{animation:'pulse',bg:'bg.avatar.neutral',color:'fg.default.inverse',display:'block'},'_115wwny']});
+var skeleton = recipeRuntime({base:[{animation:'pulse',bg:'bg.avatar.neutral',color:'fg.default.inverse',display:'block'},'hm5j9a']});
 
 export { skeleton };

package/dist/esm/packages/react/src/sortable/SortableHandle-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/sortable/SortableHandle.css.ts.vanilla-DSLCmr1W.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/sortable/SortableHandle.css.ts.vanilla-DE_EDSIF.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var handle = recipeRuntime({base:'_6s2cl5'});
+var handle = recipeRuntime({base:'_1ed9v3y'});
 
 export { handle };

package/dist/esm/packages/react/src/sortable/SortableItem-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/sortable/SortableItem.css.ts.vanilla-DrojkcgI.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/sortable/SortableItem.css.ts.vanilla-DE8GJGgy.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:'t995ym',variants:{handle:{false:{},true:'sk3r4u'}}});
+var item = recipeRuntime({base:'s0uqsp',variants:{handle:{false:{},true:'_40m1sf'}}});
 
 export { item };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-Bn_VRXY4.css';
-import './../../../../assets/src/spinner/Spinner.css.ts.vanilla-C9Tu4ZkQ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-gSAv9Bvn.css';
+import './../../../../assets/src/spinner/Spinner.css.ts.vanilla-BRdUFAB2.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var track = recipeRuntime({variants:{appearance:{'default':'snuykg',inverse:'jlfsi1'}}});
+var track = recipeRuntime({variants:{appearance:{'default':'_11gi09v',inverse:'_166tdwx'}}});
 
 export { track };