@optiaxiom/react 0.8.1 → 0.9.0

package/dist/packages/react/src/highlight/Highlight-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/highlight/Highlight.css.ts.vanilla-Dj_t0SVY.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/highlight/Highlight.css.ts.vanilla-CpDqZsEX.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var mark = recipeRuntime({base:'fbh2gj'});
+var mark = recipeRuntime({base:'jjk0rt'});
 
 export { mark };

package/dist/packages/react/src/highlight/Highlight.js

@@ -1,21 +1,18 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { Fragment } from 'react';
+import { forwardRef, Fragment } from 'react';
 import { Box } from '../box/Box.js';
 import { mark } from './Highlight-css.js';
 import { useHighlightedChunks } from './useHighlightedChunks.js';
 
-function Highlight({
-  children = (chunk) => chunk,
-  content,
-  query,
-  ...props
-}) {
-  const chunks = useHighlightedChunks(content || "", query);
-  return /* @__PURE__ */ jsx(Box, { ...props, children: chunks.map(({ chunk, highlighted }, index) => /* @__PURE__ */ jsx(Fragment, { children: highlighted ? children(
-    /* @__PURE__ */ jsx(Box, { asChild: true, ...mark(), children: /* @__PURE__ */ jsx("mark", { children: chunk }) })
-  ) : chunk }, index)) });
-}
+const Highlight = forwardRef(
+  ({ children = (chunk) => chunk, content, query, ...props }, ref) => {
+    const chunks = useHighlightedChunks(content || "", query);
+    return /* @__PURE__ */ jsx(Box, { ref, ...props, children: chunks.map(({ chunk, highlighted }, index) => /* @__PURE__ */ jsx(Fragment, { children: highlighted ? children(
+      /* @__PURE__ */ jsx(Box, { asChild: true, ...mark(), children: /* @__PURE__ */ jsx("mark", { children: chunk }) })
+    ) : chunk }, index)) });
+  }
+);
 Highlight.displayName = "@optiaxiom/react/Highlight";
 
 export { Highlight };

package/dist/packages/react/src/icon/Icon.js

@@ -5,7 +5,7 @@ import { Box } from '../box/Box.js';
 
 const Icon = forwardRef(
   ({ children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Box, { h: "2xs", ref, w: "auto", ...props, children });
+    return /* @__PURE__ */ jsx(Box, { flex: "none", h: "2xs", ref, w: "auto", ...props, children });
   }
 );
 Icon.displayName = "@optiaxiom/react/Icon";

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/indicator/Indicator.css.ts.vanilla-0CCBLcJo.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/indicator/Indicator.css.ts.vanilla-yqyoXdGL.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var badge = recipeRuntime({base:'_6kjr2u',variants:{offset:{false:{px:'0',py:'0'},true:[{px:'4',py:'0'},'_130yz1g']},ping:{false:{},true:[{animation:'ping',color:'transparent',pointerEvents:'none'},'c5uput']}}});
-var floating = recipeRuntime({base:[{display:'inline-flex',pointerEvents:'none',z:'10'},'_3jf64z'],variants:{offset:{false:'nfth7h',true:{}},position:{'bottom-right':'_1jycj44','top-right':'_1rfwv8q'}}});
-var indicator = recipeRuntime({base:[{display:'inline-flex'},'sjywuc']});
+var badge = recipeRuntime({base:'s0expt',variants:{offset:{false:{px:'0',py:'0'},true:[{px:'4',py:'0'},'ri30ci']},ping:{false:{},true:[{animation:'ping',color:'transparent',pointerEvents:'none'},'_1564ksv']}}});
+var floating = recipeRuntime({base:[{display:'inline-flex',pointerEvents:'none',z:'10'},'x6rbai'],variants:{offset:{false:'_9vt5wx',true:{}},position:{'bottom-right':'_13pgvmx','top-right':'q5qxcz'}}});
+var indicator = recipeRuntime({base:[{display:'inline-flex'},'bfkrx5']});
 
 export { badge, floating, indicator };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/inline-input/InlineInput.css.ts.vanilla-DNsMpw9g.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/inline-input/InlineInput.css.ts.vanilla-7r8ut9Qk.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var editor = recipeRuntime({base:'_5h5fi5',variants:{empty:{false:{},true:'i08j0'}}});
-var input = recipeRuntime({base:'_1mo88jg'});
+var editor = recipeRuntime({base:'_125fmoe',variants:{empty:{false:{},true:'y3898q'}}});
+var input = recipeRuntime({base:'j3b0sz'});
 
 export { editor, input };

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

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

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-DM573qEj.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-CjU2Rdxm.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:['nl8aub',{bg:'transparent',flex:'auto',w:'full'},'_1chqvqj','_19wr919'],variants:{size:{md:{},lg:{},xl:['_7q38up']}}});
+var control = recipeRuntime({base:['iuyhkq',{bg:'transparent',flex:'auto',w:'full'},'_16cm039','_138lpna'],variants:{size:{md:{},lg:{},xl:['_1e3q0yw']}}});
 
 export { control };

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

@@ -14,7 +14,7 @@ import '../sprinkles/sprinklesMerge.js';
 import { control } from './InputControl-css.js';
 
 const InputControl = forwardRef(
-  ({ asChild, children, error: errorProp, size = "md", ...props }, outerRef) => {
+  ({ asChild, children, className, error: errorProp, size = "md", ...props }, outerRef) => {
     const Comp = asChild ? Slot : "input";
     const disabled = props.disabled;
     const readOnly = props.readOnly;
@@ -27,14 +27,14 @@ const InputControl = forwardRef(
     return /* @__PURE__ */ jsx(
       Box,
       {
-        "aria-describedby": errorId || descriptionId ? clsx(errorId, descriptionId) : void 0,
+        "aria-describedby": errorId || descriptionId ? clsx(errorId, descriptionId) : undefined,
         "aria-disabled": disabled,
-        "aria-invalid": error ? true : void 0,
+        "aria-invalid": error ? true : undefined,
         asChild: true,
-        "data-disabled": disabled ? "" : void 0,
-        "data-invalid": error ? "" : void 0,
-        "data-readonly": readOnly ? "" : void 0,
-        ...control({ size }),
+        "data-disabled": disabled ? "" : undefined,
+        "data-invalid": error ? "" : undefined,
+        "data-readonly": readOnly ? "" : undefined,
+        ...control({ size }, className),
         ...sprinkleProps,
         children: /* @__PURE__ */ jsx(Comp, { id: inputId, ref, ...restProps, children })
       }

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/table-row/TableRow.css.ts.vanilla-BYiv5uy5.css';
-import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-DM573qEj.css';
-import './../../../../assets/src/input-root/InputRoot.css.ts.vanilla-C18fyIEl.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-BbzMTUzd.css';
+import './../../../../assets/src/input-control/InputControl.css.ts.vanilla-CjU2Rdxm.css';
+import './../../../../assets/src/input-root/InputRoot.css.ts.vanilla-Bn2BA_ZM.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'qhwhum']});
+var root = recipeRuntime({base:[{flexDirection:'row',gap:'0'},'_2z60i2']});
 
 export { root };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-DiiuMl2I.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/kbd/Kbd.css.ts.vanilla-CA_kba1R.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var kbd = recipeRuntime({base:{alignItems:'center',display:'inline-flex',flexDirection:'row',whiteSpace:'nowrap'},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:'_11rqh9c',variants:{variant:{outline:'np97jf',subtle:{}}}});
+var kbd = recipeRuntime({base:[{alignItems:'center',bg:'bg.secondary',display:'inline-flex',flexDirection:'row',px:'4',rounded:'sm',whiteSpace:'nowrap'},'_1tq5h90'],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:'e1jixi',variants:{variant:{outline:'_1rsd830',subtle:{}}}});
 
 export { kbd, keys };

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

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
-import { Code } from '../code/Code.js';
+import { Box } from '../box/Box.js';
 import { kbd, keys } from './Kbd-css.js';
 
 const mapKeyToCode = {
@@ -21,7 +21,7 @@ const mapKeyToCode = {
 };
 const Kbd = forwardRef(
   ({ children, className, keys: keys$1, variant = "outline", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Code, { asChild: true, ...kbd({ variant }, className), ...props, children: /* @__PURE__ */ jsxs("kbd", { ref, children: [
+    return /* @__PURE__ */ jsx(Box, { asChild: true, ...kbd({ variant }, className), ...props, children: /* @__PURE__ */ jsxs("kbd", { ref, children: [
       keys$1 && (Array.isArray(keys$1) ? keys$1 : [keys$1]).map((key) => /* @__PURE__ */ jsx("abbr", { title: key, ...keys({ variant }), children: mapKeyToCode[key] }, key)),
       children
     ] }) });

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
 
 var axiom = 'optiaxiom';
 var base = 'optiaxiom.base';
-var components = 'optiaxiom._1no99yr';
-var reset = 'optiaxiom._1qc7hop';
+var components = 'optiaxiom._1lcqm4m';
+var reset = 'optiaxiom._1bcsvj8';
 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-CXVxxEDz.css';
-import './../../../../assets/src/link/Link.css.ts.vanilla-D97z3o__.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/link/Link.css.ts.vanilla-DkFNs5hx.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'_1bs3fnw']});
-var link = recipeRuntime({base:['_1lp5822'],variants:{appearance:{'default':'_83x6dq',inverse:'r2rajd',subtle:'_1ppd82y'}}});
+var icon = recipeRuntime({base:[{display:'inline-flex',ml:'4'},'nyjylt']});
+var link = recipeRuntime({base:['_1tdt4wh'],variants:{appearance:{'default':'txjd8f',inverse:'c1vsyt',subtle:'d6ng0i'},overlay:{false:{},true:'_1h796r2'}}});
 
 export { icon, link };

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

@@ -20,6 +20,7 @@ const Link = forwardRef(
     disabled,
     external,
     href,
+    overlay,
     ...props
   }, ref) => {
     const Comp = asChild ? Slot : "a";
@@ -28,19 +29,19 @@ const Link = forwardRef(
       Box,
       {
         asChild: true,
-        ...link({ appearance }, className),
+        ...link({ appearance, overlay }, className),
         ...sprinkleProps,
         children: /* @__PURE__ */ jsx(
           Comp,
           {
             "aria-disabled": disabled,
-            "data-disabled": disabled ? "" : void 0,
+            "data-disabled": disabled ? "" : undefined,
             href,
             ref,
             ...external && { rel: "noopener noreferrer", target: "_blank" },
             ...restProps,
             ...disabled && {
-              href: void 0,
+              href: undefined,
               role: "link"
             },
             children: decorateChildren({ asChild, children }, (children2) => /* @__PURE__ */ jsxs(Fragment, { children: [

package/dist/packages/react/src/listbox-group/ListboxGroup.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import { useId } from '../../../../node_modules/.pnpm/@reach_auto-id@0.18.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@reach/auto-id/dist/reach-auto-id.js';
+import { useId } from '@radix-ui/react-id';
 import { forwardRef } from 'react';
 import { Box } from '../box/Box.js';
 import { ListboxGroupContextProvider } from '../listbox-group-context/ListboxGroupContext.js';

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

@@ -1,5 +1,5 @@
 import { createContext } from '@radix-ui/react-context';
 
-const [ListboxGroupContextProvider, useListboxGroupContext] = createContext("ListboxGroup", { id: void 0 });
+const [ListboxGroupContextProvider, useListboxGroupContext] = createContext("ListboxGroup", { id: undefined });
 
 export { ListboxGroupContextProvider, useListboxGroupContext };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/listbox-item/ListboxItem.css.ts.vanilla-C5c9qoKI.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/listbox-item/ListboxItem.css.ts.vanilla-DTvaLDR_.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var description = recipeRuntime({base:[{fontSize:'sm'},'ctnut7']});
-var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'g07y79'],variants:{intent:{danger:'d50mrn',neutral:'lake4s'}}});
-var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'qy92ot']});
+var description = recipeRuntime({base:[{fontSize:'sm'},'xx38ut']});
+var item = recipeRuntime({base:[{flexDirection:'row',fontSize:'md',gap:'8',p:'8',rounded:'sm',transition:'colors'},'g6xtmy'],variants:{intent:{danger:'_25b9kq',neutral:'_1s7ijnt'}}});
+var title = recipeRuntime({base:[{alignItems:'center',flexDirection:'row',gap:'8'},'a0lnme']});
 
 export { description, item, title };

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

@@ -1,7 +1,7 @@
 "use client";
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useId } from '@radix-ui/react-id';
 import { Slot } from '@radix-ui/react-slot';
-import { useId } from '../../../../node_modules/.pnpm/@reach_auto-id@0.18.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@reach/auto-id/dist/reach-auto-id.js';
 import { forwardRef } from 'react';
 import { Box } from '../box/Box.js';
 import { Flex } from '../flex/Flex.js';
@@ -30,7 +30,7 @@ const ListboxItem = forwardRef(
     return /* @__PURE__ */ jsx(
       Flex,
       {
-        "aria-describedby": description$1 ? descriptionId : void 0,
+        "aria-describedby": description$1 ? descriptionId : undefined,
         "aria-labelledby": labelId,
         asChild: true,
         ref,

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

@@ -7,12 +7,15 @@ import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 
-const ListboxItemIndicator = forwardRef(({ active, children, ...props }, ref) => {
+const ListboxItemIndicator = forwardRef(({ active, children, className, ...props }, ref) => {
   const { restProps, sprinkleProps } = extractSprinkles(props);
   if (!active) {
-    return /* @__PURE__ */ jsx(Box, { asChild: true, h: "0", w: "xs", ...sprinkleProps, children: /* @__PURE__ */ jsx("svg", { ref, ...restProps }) });
+    return /* @__PURE__ */ jsx(Box, { asChild: true, className, h: "0", w: "xs", ...sprinkleProps, children: /* @__PURE__ */ jsx("svg", { ref, ...restProps }) });
   }
-  return /* @__PURE__ */ jsx(Box, { asChild: true, ...sprinkleProps, children: children ?? /* @__PURE__ */ jsx(IconCheck, { ref, ...restProps }) });
+  return (
+    // @ts-expect-error -- too complex
+    /* @__PURE__ */ jsx(Box, { asChild: true, className, ref, ...props, children: children ?? /* @__PURE__ */ jsx(IconCheck, {}) })
+  );
 });
 ListboxItemIndicator.displayName = "@optiaxiom/react/ListboxItemIndicator";
 

package/dist/packages/react/src/listbox-separator/ListboxSeparator.js

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Separator } from '../separator/Separator.js';
 
-const ListboxSeparator = forwardRef((props, ref) => /* @__PURE__ */ jsx(Separator, { bg: "bg.tertiary", flex: "none", mx: "8", my: "4", ref, ...props }));
+const ListboxSeparator = forwardRef((props, ref) => /* @__PURE__ */ jsx(Separator, { flex: "none", mx: "8", my: "4", ref, ...props }));
 ListboxSeparator.displayName = "@optiaxiom/react/ListboxSeparator";
 
 export { ListboxSeparator };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/menu-listbox/MenuListbox.css.ts.vanilla-BMfTjUuG.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/menu-listbox/MenuListbox.css.ts.vanilla-Co9Ao69E.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'ir5v3d'],variants:{minW:{'0':{},trigger:'_595kqk'},provider:{'dropdown-menu':'igz5d5',popover:'_1jgqvbi',popper:'we31z5'}}});
+var listbox = recipeRuntime({base:[{maxW:'xs',p:'4'},'shjgtc'],variants:{maxH:{xs:'d6qili',sm:'_195073f',md:'_1bbyut7',lg:'_1s5b0i0',full:{}},minW:{'0':{},trigger:'_1p67vq3'},provider:{'dropdown-menu':'_10td287',popover:'_9djrke',popper:'n69kl9'}}});
 
 export { listbox };

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

@@ -7,11 +7,11 @@ import { Transition } from '../transition/Transition.js';
 import { listbox } from './MenuListbox-css.js';
 
 const MenuListbox = forwardRef(
-  ({ children, className, minW, provider = "popover", ...props }, ref) => /* @__PURE__ */ jsx(Transition, { duration: "sm", type: "pop", children: /* @__PURE__ */ jsx(Paper, { asChild: true, children: /* @__PURE__ */ jsx(
+  ({ children, className, maxH, minW, provider = "popover", ...props }, ref) => /* @__PURE__ */ jsx(Transition, { duration: "sm", type: "pop", children: /* @__PURE__ */ jsx(Paper, { asChild: true, children: /* @__PURE__ */ jsx(
     Listbox,
     {
       ref,
-      ...listbox({ minW, provider }, className),
+      ...listbox({ maxH, minW, provider }, className),
       ...props,
       children
     }

package/dist/packages/react/src/modal-layer/ModalLayer.js

@@ -6,20 +6,22 @@ import { Slot } from '@radix-ui/react-slot';
 import { forwardRef, useState } from 'react';
 import { RemoveScroll } from 'react-remove-scroll';
 
-const ModalLayer = forwardRef(({ asChild, children, ...props }, ref) => {
-  let result = /* @__PURE__ */ jsx(DismissableLayer, { asChild, ref, ...props, children });
-  const [locked] = useState(() => document.body.dataset.scrollLocked);
-  if (locked) {
-    result = /* @__PURE__ */ jsx(RemoveScroll, { allowPinchZoom: true, as: Slot, children: result });
+const ModalLayer = forwardRef(
+  ({ asChild, children, ...props }, ref) => {
+    let result = /* @__PURE__ */ jsx(DismissableLayer, { asChild, ref, ...props, children });
+    const [locked] = useState(() => document.body.dataset.scrollLocked);
+    if (locked) {
+      result = /* @__PURE__ */ jsx(RemoveScroll, { allowPinchZoom: true, as: Slot, children: result });
+    }
+    const [guards] = useState(
+      () => document.querySelector("[data-radix-focus-guard]")
+    );
+    if (guards) {
+      result = /* @__PURE__ */ jsx(FocusGuards, { children: result });
+    }
+    return result;
   }
-  const [guards] = useState(
-    () => document.querySelector("[data-radix-focus-guard]")
-  );
-  if (guards) {
-    result = /* @__PURE__ */ jsx(FocusGuards, { children: result });
-  }
-  return result;
-});
+);
 ModalLayer.displayName = "@optiaxiom/react/ModalLayer";
 
 export { ModalLayer };

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

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

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

@@ -0,0 +1,17 @@
+import { useState, useEffect } from 'react';
+import { useNestedDialogContext } from './NestedDialogContext.js';
+
+function useNestedDialogCount(name, open) {
+  const { onCountChange } = useNestedDialogContext(name) ?? {};
+  const [nestedDialogCount, setNestedDialogCount] = useState(0);
+  useEffect(() => {
+    if (!onCountChange) {
+      return;
+    }
+    onCountChange(open ? nestedDialogCount + 1 : 0);
+  }, [nestedDialogCount, onCountChange, open]);
+  const isRootDialog = !onCountChange;
+  return [isRootDialog, nestedDialogCount, setNestedDialogCount];
+}
+
+export { useNestedDialogCount };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-CeVy3QBJ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/pagination/Pagination.css.ts.vanilla-CoU68RuL.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var button = recipeRuntime({base:'_12t0w0p'});
-var cursor = recipeRuntime({base:[{z:'10'},'_1ldqfi1'],variants:{animation:{false:{},true:{transition:'transform'}}}});
-var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'_149a92t']});
+var button = recipeRuntime({base:'_15srxn2'});
+var cursor = recipeRuntime({base:[{z:'10'},'kz8ilx'],variants:{animation:{false:{},true:{transition:'transform'}}}});
+var list = recipeRuntime({base:[{flexDirection:'row',gap:'2'},'_58i2vo']});
 
 export { button, cursor, list };

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

@@ -13,7 +13,7 @@ import { IconAngleRight } from '../icons/IconAngleRight.js';
 import { IconEllipsis } from '../icons/IconEllipsis.js';
 import { Tooltip } from '../tooltip/Tooltip.js';
 import { list, cursor, button } from './Pagination-css.js';
-import { usePagination } from '../../../../node_modules/.pnpm/@mantine_hooks@7.14.3_react@18.3.1/node_modules/@mantine/hooks/esm/use-pagination/use-pagination.js';
+import { usePagination } from '../../../../node_modules/.pnpm/@mantine_hooks@7.15.3_react@18.3.1/node_modules/@mantine/hooks/esm/use-pagination/use-pagination.js';
 
 const Pagination = forwardRef(
   ({ defaultPage, disabled, onPageChange, page: pageProp, total, ...props }, ref) => {
@@ -89,10 +89,10 @@ const Pagination = forwardRef(
             ButtonBase,
             {
               appearance: "subtle",
-              "aria-current": active === page ? "page" : void 0,
+              "aria-current": active === page ? "page" : undefined,
               disabled,
               onClick: () => setPage(page),
-              ref: active === page ? activeRef : void 0,
+              ref: active === page ? activeRef : undefined,
               ...button(),
               children: [
                 /* @__PURE__ */ jsx(VisuallyHidden, { children: "page" }),

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

@@ -1,4 +1,4 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.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-CXVxxEDz.css';
-import './../../../../assets/src/pill/Pill.css.ts.vanilla-BvPwO-kb.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/pill/Pill.css.ts.vanilla-RBtt5el_.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var pill = recipeRuntime({base:[{bg:'bg.secondary',border:'0',fontSize:'sm',rounded:'md'},'ac4j4y'],variants:{size:{md:{h:'xs'},lg:{h:'sm'}}}});
+var pill = recipeRuntime({base:[{bg:'bg.secondary',border:'0',fontSize:'sm',rounded:'md'},'ctetf0'],variants:{size:{md:{h:'xs'},lg:{h:'sm'}}}});
 
 export { pill };

package/dist/packages/react/src/popover-content/PopoverContent.js

@@ -3,9 +3,9 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { theme } from '@optiaxiom/globals';
 import * as RadixPopover from '@radix-ui/react-popover';
 import { forwardRef } from 'react';
-import { AnimatePresence } from '../animate-presence/AnimatePresence.js';
 import { MenuListbox } from '../menu-listbox/MenuListbox.js';
 import { usePopoverContext } from '../popover-context/PopoverContext.js';
+import { TransitionGroup } from '../transition-group/TransitionGroup.js';
 import '../utils/conditions.js';
 import '@radix-ui/react-slot';
 import { onReactSelectInputBlur } from '../utils/onReactSelectInputBlur.js';
@@ -13,7 +13,7 @@ import { onReactSelectInputBlur } from '../utils/onReactSelectInputBlur.js';
 const PopoverContent = forwardRef(
   ({ align = "start", children, sideOffset = 2, withArrow, ...props }, ref) => {
     const { open } = usePopoverContext("PopoverContent");
-    return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsx(RadixPopover.Portal, { forceMount: true, children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(TransitionGroup, { open, children: /* @__PURE__ */ jsx(RadixPopover.Portal, { forceMount: true, children: /* @__PURE__ */ jsx(
       MenuListbox,
       {
         asChild: true,

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/progress/Progress.css.ts.vanilla-CMLkfTv3.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/progress/Progress.css.ts.vanilla-qTUYSPcJ.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'},'_1yxgpg2']});
+var progress = recipeRuntime({base:[{bg:'bg.tertiary',overflow:'hidden',rounded:'full'},'_1khq1uk']});
 
 export { indicator, progress };

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

@@ -1,12 +1,12 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/table-row/TableRow.css.ts.vanilla-BYiv5uy5.css';
-import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-nCXOMbJx.css';
-import './../../../../assets/src/radio/Radio.css.ts.vanilla-BoLXP1mQ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-BbzMTUzd.css';
+import './../../../../assets/src/toggle-input/ToggleInput.css.ts.vanilla-BgMgylht.css';
+import './../../../../assets/src/radio/Radio.css.ts.vanilla-Bf_vmx1L.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'_3yt6i7'],variants:{shift:{false:{},true:{mt:'2'}}}});
-var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full'},'fxgzi9']});
-var input = recipeRuntime({base:'_9nwo0e'});
-var radio = recipeRuntime({base:'_1qdkt2b'});
+var control = recipeRuntime({base:[{bg:'bg.default',border:'1',p:'2',rounded:'full',size:'2xs'},'kqja35'],variants:{shift:{false:{},true:{mt:'2'}}}});
+var indicator = recipeRuntime({base:[{rounded:'inherit',size:'full',transition:'transform'},'_1auzo3c']});
+var input = recipeRuntime({base:'_1c2z87c'});
+var radio = recipeRuntime({base:'_18iebar'});
 
 export { control, indicator, input, radio };

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

@@ -33,7 +33,7 @@ const Radio = forwardRef(
           `Cannot use \`checked\` prop when \`Radio\` is used within \`RadioGroup\``
         );
       }
-      if (props.value === void 0) {
+      if (props.value === undefined) {
         throw new Error(
           `Must use \`value\` prop when \`Radio\` is used within \`RadioGroup\``
         );
@@ -49,8 +49,8 @@ const Radio = forwardRef(
           /* @__PURE__ */ jsx(
             ToggleInputHiddenInput,
             {
-              checked: groupContext?.value !== void 0 ? groupContext.value === props.value : void 0,
-              defaultChecked: groupContext?.defaultValue !== void 0 ? groupContext.defaultValue === props.value : void 0,
+              checked: groupContext?.value !== undefined ? groupContext.value === props.value : undefined,
+              defaultChecked: groupContext?.defaultValue !== undefined ? groupContext.defaultValue === props.value : undefined,
               disabled: groupContext?.disabled ?? disabled,
               name: groupContext?.name ?? name,
               onBlur: groupContext?.onBlur ?? onBlur,

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-BjKRj4Vq.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/search-input/SearchInput.css.ts.vanilla-0wrAu85G.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var clear = recipeRuntime({base:[{size:'sm'},'_1a5ry96']});
-var search = recipeRuntime({base:'jco4j2'});
+var clear = recipeRuntime({base:[{size:'sm'},'_1653kw8']});
+var search = recipeRuntime({base:'_1bm2w5q'});
 
 export { clear, search };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/select-content/SelectContent.css.ts.vanilla-B71XWAVM.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/select-content/SelectContent.css.ts.vanilla-qjS_JoqW.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var content = recipeRuntime({base:['_1j6bhf3']});
+var content = recipeRuntime({base:['_1n9daq4']});
 
 export { content };