@optiaxiom/react 0.8.1 → 0.9.0

package/dist/index.js

@@ -6,10 +6,9 @@ export { AlertDialogBody } from './packages/react/src/alert-dialog-body/AlertDia
 export { AlertDialogCancel } from './packages/react/src/alert-dialog-cancel/AlertDialogCancel.js';
 export { AlertDialogContent } from './packages/react/src/alert-dialog-content/AlertDialogContent.js';
 export { AlertDialogFooter } from './packages/react/src/alert-dialog-footer/AlertDialogFooter.js';
-export { AlertDialogTitle } from './packages/react/src/alert-dialog-title/AlertDialogTitle.js';
+export { AlertDialogHeader } from './packages/react/src/alert-dialog-header/AlertDialogHeader.js';
 export { AlertDialogTrigger } from './packages/react/src/alert-dialog-trigger/AlertDialogTrigger.js';
 export { AlertTitle } from './packages/react/src/alert-title/AlertTitle.js';
-export { AnimatePresence } from './packages/react/src/animate-presence/AnimatePresence.js';
 export { Avatar } from './packages/react/src/avatar/Avatar.js';
 export { AvatarGroup } from './packages/react/src/avatar-group/AvatarGroup.js';
 export { AxiomProvider } from './packages/react/src/axiom-provider/AxiomProvider.js';
@@ -29,6 +28,7 @@ export { DialogClose } from './packages/react/src/dialog-close/DialogClose.js';
 export { DialogContent } from './packages/react/src/dialog-content/DialogContent.js';
 export { DialogDescription } from './packages/react/src/dialog-description/DialogDescription.js';
 export { DialogFooter } from './packages/react/src/dialog-footer/DialogFooter.js';
+export { DialogForm } from './packages/react/src/dialog-form/DialogForm.js';
 export { DialogHeader } from './packages/react/src/dialog-header/DialogHeader.js';
 export { DialogTitle } from './packages/react/src/dialog-title/DialogTitle.js';
 export { DialogTrigger } from './packages/react/src/dialog-trigger/DialogTrigger.js';
@@ -60,9 +60,6 @@ export { FieldLabel } from './packages/react/src/field-label/FieldLabel.js';
 export { Flex } from './packages/react/src/flex/Flex.js';
 export { Grid } from './packages/react/src/grid/Grid.js';
 export { Heading } from './packages/react/src/heading/Heading.js';
-export { HoverCard } from './packages/react/src/hover-card/HoverCard.js';
-export { HoverCardContent } from './packages/react/src/hover-card-content/HoverCardContent.js';
-export { HoverCardTrigger } from './packages/react/src/hover-card-trigger/HoverCardTrigger.js';
 export { Indicator } from './packages/react/src/indicator/Indicator.js';
 export { Input } from './packages/react/src/input/Input.js';
 export { InputAddon } from './packages/react/src/input-addon/InputAddon.js';
@@ -120,13 +117,15 @@ export { Textarea } from './packages/react/src/textarea/Textarea.js';
 export { ThemeProvider } from './packages/react/src/theme-provider/ThemeProvider.js';
 export { Toast } from './packages/react/src/toast/Toast.js';
 export { ToastAction } from './packages/react/src/toast-action/ToastAction.js';
-export { createToaster, toaster } from '@optiaxiom/globals';
 export { ToastProvider } from './packages/react/src/toast-provider/ToastProvider.js';
 export { ToastTitle } from './packages/react/src/toast-title/ToastTitle.js';
 export { ToggleButton } from './packages/react/src/toggle-button/ToggleButton.js';
 export { Tooltip } from './packages/react/src/tooltip/Tooltip.js';
 export { TooltipContent } from './packages/react/src/tooltip-content/TooltipContent.js';
+export { TooltipProvider } from './packages/react/src/tooltip-provider/TooltipProvider.js';
 export { TooltipRoot } from './packages/react/src/tooltip-root/TooltipRoot.js';
 export { TooltipTrigger } from './packages/react/src/tooltip-trigger/TooltipTrigger.js';
 export { Transition } from './packages/react/src/transition/Transition.js';
 export { TransitionGlobalConfig } from './packages/react/src/transition/TransitionGlobalConfig.js';
+export { TransitionGroup } from './packages/react/src/transition-group/TransitionGroup.js';
+export { createToaster, theme, toaster, tokens } from '@optiaxiom/globals';

package/dist/node_modules/.pnpm/{@mantine_hooks@7.14.3_react@18.3.1 → @mantine_hooks@7.15.3_react@18.3.1}/node_modules/@mantine/hooks/esm/use-media-query/use-media-query.js

@@ -21,14 +21,14 @@ function useMediaQuery(query, initialValue, { getInitialValueInEffect } = {
   const [matches, setMatches] = useState(
     getInitialValueInEffect ? initialValue : getInitialValue(query)
   );
-  const queryRef = useRef();
+  const queryRef = useRef(null);
   useEffect(() => {
     if ("matchMedia" in window) {
       queryRef.current = window.matchMedia(query);
       setMatches(queryRef.current.matches);
       return attachMediaListener(queryRef.current, (event) => setMatches(event.matches));
     }
-    return void 0;
+    return undefined;
   }, [query]);
   return matches;
 }

package/dist/node_modules/.pnpm/{@mantine_hooks@7.14.3_react@18.3.1 → @mantine_hooks@7.15.3_react@18.3.1}/node_modules/@mantine/hooks/esm/use-uncontrolled/use-uncontrolled.js

@@ -8,13 +8,13 @@ function useUncontrolled({
   }
 }) {
   const [uncontrolledValue, setUncontrolledValue] = useState(
-    defaultValue !== void 0 ? defaultValue : finalValue
+    defaultValue !== undefined ? defaultValue : finalValue
   );
   const handleUncontrolledChange = (val, ...payload) => {
     setUncontrolledValue(val);
     onChange?.(val, ...payload);
   };
-  if (value !== void 0) {
+  if (value !== undefined) {
     return [value, onChange, true];
   }
   return [uncontrolledValue, handleUncontrolledChange, false];

package/dist/node_modules/.pnpm/{@vanilla-extract_sprinkles@1.6.3_patch_hash_eh2tyazhmaumpwivglvpekok3e_@vanilla-extract_css@1_wytlbii6gxwkkass3c6wfp66jm → @vanilla-extract_sprinkles@1.6.3_patch_hash_eh2tyazhmaumpwivglvpekok3e_@vanilla-extract_css@1_wcbutaohqjnkd6euht5r5xgz74}/node_modules/@vanilla-extract/sprinkles/dist/createSprinkles-74286718.esm.js

@@ -1,7 +1,7 @@
 function toPrimitive(t, r) {
   if ("object" != typeof t || !t) return t;
   var e = t[Symbol.toPrimitive];
-  if (void 0 !== e) {
+  if (undefined !== e) {
     var i = e.call(t, r || "default");
     if ("object" != typeof i) return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
@@ -42,7 +42,7 @@ function ownKeys(e, r) {
 function _objectSpread2(e) {
   for (var r = 1; r < arguments.length; r++) {
     var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
+    r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
       _defineProperty(e, r, t[r]);
     }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
       Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));

package/dist/packages/react/package.json.js

@@ -1,3 +1,3 @@
-var version = "0.8.1";
+var version = "0.9.0";
 
 export { version };

package/dist/packages/react/src/alert/Alert-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 alert = recipeRuntime({base:[{alignItems:'start',color:'fg.default',flexDirection:'row',fontSize:'md',fontWeight:'500',gap:'8',justifyContent:'space-between',p:'12',pr:'16',rounded:'md'}],variants:{intent:{danger:{bg:'bg.error.subtle'},information:{bg:'bg.information.subtle'},neutral:{bg:'bg.secondary'},success:{bg:'bg.success.subtle'},warning:{bg:'bg.warning.subtle'}}}});

package/dist/packages/react/src/alert/Alert.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx, jsxs } 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, createElement } from 'react';
 import { AlertContextProvider } from '../alert-context/AlertContext.js';
 import { Button } from '../button/Button.js';

package/dist/packages/react/src/alert-dialog/AlertDialog.js

@@ -3,6 +3,8 @@ import { jsx } from 'react/jsx-runtime';
 import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
 import { useControllableState } from '@radix-ui/react-use-controllable-state';
 import { AlertDialogContextProvider } from '../alert-dialog-context/AlertDialogContext.js';
+import { NestedDialogContextProvider } from '../nested-dialog-context/NestedDialogContext.js';
+import { useNestedDialogCount } from '../nested-dialog-context/useNestedDialogCount.js';
 
 function AlertDialog({
   children,
@@ -16,7 +18,16 @@ function AlertDialog({
     onChange: onOpenChange,
     prop: openProp
   });
-  return /* @__PURE__ */ jsx(RadixAlertDialog.Root, { onOpenChange: setOpen, open, ...props, children: /* @__PURE__ */ jsx(AlertDialogContextProvider, { open, children }) });
+  const [isRootDialog, nestedDialogCount, setNestedDialogCount] = useNestedDialogCount("AlertDialog", open);
+  return /* @__PURE__ */ jsx(NestedDialogContextProvider, { onCountChange: setNestedDialogCount, children: /* @__PURE__ */ jsx(RadixAlertDialog.Root, { onOpenChange: setOpen, open, ...props, children: /* @__PURE__ */ jsx(
+    AlertDialogContextProvider,
+    {
+      isRootDialog,
+      nestedDialogCount,
+      open,
+      children
+    }
+  ) }) });
 }
 AlertDialog.displayName = "@optiaxiom/react/AlertDialog";
 

package/dist/packages/react/src/alert-dialog-action/AlertDialogAction.js

@@ -4,9 +4,11 @@ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
 import { forwardRef } from 'react';
 import { Button } from '../button/Button.js';
 
-const AlertDialogAction = forwardRef(({ appearance = "danger", asChild, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(RadixAlertDialog.Action, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, children }) });
-});
+const AlertDialogAction = forwardRef(
+  ({ appearance = "danger", asChild, children, size = "lg", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(RadixAlertDialog.Action, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, size, children }) });
+  }
+);
 AlertDialogAction.displayName = "@optiaxiom/react/AlertDialogAction";
 
 export { AlertDialogAction };

package/dist/packages/react/src/alert-dialog-body/AlertDialogBody-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 body = recipeRuntime({base:[{flex:'1',fontSize:'md',overflow:'auto',px:'24',py:'16'}]});

package/dist/packages/react/src/alert-dialog-cancel/AlertDialogCancel.js

@@ -4,9 +4,17 @@ import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
 import { forwardRef } from 'react';
 import { Button } from '../button/Button.js';
 
-const AlertDialogCancel = forwardRef(({ appearance = "subtle", asChild, children = "Cancel", ...props }, ref) => {
-  return /* @__PURE__ */ jsx(RadixAlertDialog.Cancel, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, children }) });
-});
+const AlertDialogCancel = forwardRef(
+  ({
+    appearance = "subtle",
+    asChild,
+    children = "Cancel",
+    size = "lg",
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsx(RadixAlertDialog.Cancel, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, size, children }) });
+  }
+);
 AlertDialogCancel.displayName = "@optiaxiom/react/AlertDialogCancel";
 
 export { AlertDialogCancel };

package/dist/packages/react/src/alert-dialog-content/AlertDialogContent-css.js

@@ -1,8 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/alert-dialog-content/AlertDialogContent.css.ts.vanilla-CeUSjGUj.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/alert-dialog-content/AlertDialogContent.css.ts.vanilla-BDjo6i31.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var container = recipeRuntime({base:[{alignItems:'center',gap:'0',z:'popover'},'_1x9mq8e']});
-var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column'},'_5hww0j'],variants:{size:{sm:'_1n0feip',md:'_1mhkx9b',lg:'ujorxm'}}});
+var container = recipeRuntime({base:[{alignItems:'center',gap:'0',z:'popover'},'_1ji87a3']});
+var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column'},'g9kf6a'],variants:{size:{sm:'_1c88878',md:'_1f0dhch',lg:'_1o7rduu'}}});
+var nestedDialogCountVar = 'var(--_10f9i7g)';
 
-export { container, content };
+export { container, content, nestedDialogCountVar };

package/dist/packages/react/src/alert-dialog-content/AlertDialogContent.js

@@ -1,23 +1,41 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
+import { assignInlineVars } from '@vanilla-extract/dynamic';
 import { forwardRef } from 'react';
-import { useAlertDialogContext, AlertDialogContextProvider } from '../alert-dialog-context/AlertDialogContext.js';
-import { AnimatePresence } from '../animate-presence/AnimatePresence.js';
+import { useAlertDialogContext } from '../alert-dialog-context/AlertDialogContext.js';
 import { Backdrop } from '../backdrop/Backdrop.js';
 import { Box } from '../box/Box.js';
 import { Flex } from '../flex/Flex.js';
 import { Paper } from '../paper/Paper.js';
 import { Transition } from '../transition/Transition.js';
-import { container, content } from './AlertDialogContent-css.js';
+import { TransitionGroup } from '../transition-group/TransitionGroup.js';
+import { container, nestedDialogCountVar, content } from './AlertDialogContent-css.js';
 
-const AlertDialogContent = forwardRef(({ children, size = "sm", ...props }, ref) => {
-  const { open } = useAlertDialogContext("AlertDialogContent");
-  return /* @__PURE__ */ jsx(AnimatePresence, { children: open && /* @__PURE__ */ jsxs(RadixAlertDialog.Portal, { forceMount: true, children: [
-    /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(Backdrop, { asChild: true, children: /* @__PURE__ */ jsx(RadixAlertDialog.Overlay, {}) }) }),
+const AlertDialogContent = forwardRef(({ children, size = "sm", style, ...props }, ref) => {
+  const { isRootDialog, nestedDialogCount, open } = useAlertDialogContext("AlertDialogContent");
+  return /* @__PURE__ */ jsx(TransitionGroup, { open, children: /* @__PURE__ */ jsxs(RadixAlertDialog.Portal, { forceMount: true, children: [
+    isRootDialog && /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(Backdrop, { asChild: true, children: /* @__PURE__ */ jsx(RadixAlertDialog.Overlay, {}) }) }),
     /* @__PURE__ */ jsxs(Flex, { ...container(), children: [
       /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" }),
-      /* @__PURE__ */ jsx(Transition, { "data-side": "bottom", type: "fade", children: /* @__PURE__ */ jsx(Paper, { asChild: true, elevation: "dialog", ...content({ size }), children: /* @__PURE__ */ jsx(RadixAlertDialog.Content, { ref, ...props, children: /* @__PURE__ */ jsx(AlertDialogContextProvider, { open, children }) }) }) }),
+      /* @__PURE__ */ jsx(Transition, { "data-side": "bottom", type: "fade", children: /* @__PURE__ */ jsx(
+        Paper,
+        {
+          asChild: true,
+          elevation: "dialog",
+          style: {
+            ...assignInlineVars({
+              [nestedDialogCountVar]: `${nestedDialogCount}`
+            }),
+            ...style
+          },
+          ...content({ size }),
+          children: /* @__PURE__ */ jsxs(RadixAlertDialog.Content, { ref, ...props, children: [
+            children,
+            nestedDialogCount > 0 && /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(Backdrop, { rounded: "inherit" }) })
+          ] })
+        }
+      ) }),
       /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" }),
       /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" })
     ] })

package/dist/packages/react/src/alert-dialog-footer/AlertDialogFooter-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/alert-dialog-footer/AlertDialogFooter.css.ts.vanilla-BiahfPUu.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/alert-dialog-footer/AlertDialogFooter.css.ts.vanilla-Cz2HvZMx.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var footer = recipeRuntime({base:[{flexDirection:['column-reverse','row'],gap:'16',justifyContent:'end',px:'24',py:'20'},'n1trzu']});
+var footer = recipeRuntime({base:[{flexDirection:['column-reverse','row'],gap:'16',justifyContent:'end',px:'24',py:'20'},'jc4512']});
 
 export { footer };

package/dist/packages/react/src/{alert-dialog-title/AlertDialogTitle.js → alert-dialog-header/AlertDialogHeader.js}

@@ -6,31 +6,16 @@ import { Flex } from '../flex/Flex.js';
 import { Heading } from '../heading/Heading.js';
 import { Icon } from '../icon/Icon.js';
 import { IconTriangleExclamationSolid } from '../icons/IconTriangleExclamationSolid.js';
-import { extractSprinkles } from '../sprinkles/extractSprinkles.js';
-import '../sprinkles/sprinkles.js';
-import '../sprinkles/sprinklesMerge.js';
 import '../utils/conditions.js';
 import '@radix-ui/react-slot';
 import { fallbackSpan } from '../utils/fallbackSpan.js';
 
-const AlertDialogTitle = forwardRef(({ addonBefore, children, ...props }, ref) => {
-  const { restProps, sprinkleProps } = extractSprinkles(props);
-  return /* @__PURE__ */ jsxs(Flex, { flexDirection: "row", gap: "8", p: "24", pb: "16", ...sprinkleProps, children: [
+const AlertDialogHeader = forwardRef(({ addonBefore, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsxs(Flex, { flexDirection: "row", gap: "8", p: "24", pb: "16", ref, ...props, children: [
     /* @__PURE__ */ jsx(Icon, { asChild: true, color: "fg.error", children: addonBefore ? fallbackSpan(addonBefore) : /* @__PURE__ */ jsx(IconTriangleExclamationSolid, {}) }),
-    /* @__PURE__ */ jsx(
-      Heading,
-      {
-        asChild: true,
-        color: "fg.default",
-        fontWeight: "500",
-        level: "3",
-        ref,
-        ...restProps,
-        children: /* @__PURE__ */ jsx(RadixAlertDialog.Title, { children })
-      }
-    )
+    /* @__PURE__ */ jsx(Heading, { asChild: true, color: "fg.default", fontWeight: "500", level: "3", children: /* @__PURE__ */ jsx(RadixAlertDialog.Title, { children }) })
   ] });
 });
-AlertDialogTitle.displayName = "@optiaxiom/react/AlertDialogTitle";
+AlertDialogHeader.displayName = "@optiaxiom/react/AlertDialogHeader";
 
-export { AlertDialogTitle };
+export { AlertDialogHeader };

package/dist/packages/react/src/autocomplete-content/AutocompleteContent-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/autocomplete-content/AutocompleteContent.css.ts.vanilla-Ayzt3WJF.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/autocomplete-content/AutocompleteContent.css.ts.vanilla-B_wb60Sc.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var content = recipeRuntime({base:[{p:'4'},'zmisds']});
+var content = recipeRuntime({base:[{p:'4'},'_157xutq']});
 
 export { content };

package/dist/packages/react/src/autocomplete-content/AutocompleteContent.js

@@ -1,22 +1,52 @@
 "use client";
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { PopperContent } from '@radix-ui/react-popper';
 import { Portal } from '@radix-ui/react-portal';
 import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
 import { forwardRef } from 'react';
 import { useAutocompleteContext } from '../autocomplete-context/AutocompleteContext.js';
 import { Box } from '../box/Box.js';
+import { CommandListbox } from '../command-listbox/CommandListbox.js';
 import { MenuListbox } from '../menu-listbox/MenuListbox.js';
 import { ModalLayer } from '../modal-layer/ModalLayer.js';
 import { Spinner } from '../spinner/Spinner.js';
-import { AutocompleteContentImpl } from './AutocompleteContentImpl.js';
+import { content } from './AutocompleteContent-css.js';
 
-const AutocompleteContent = forwardRef(({ children, loading, ...props }, ref) => {
-  const { isOpen, items } = useAutocompleteContext("AutocompleteContent");
-  return isOpen && /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Box, { role: "status", children: loading ? "Loading" : `${items.length} option${items.length === 1 ? "" : "s"} available` }) }) }),
-    /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(ModalLayer, { children: /* @__PURE__ */ jsx(MenuListbox, { asChild: true, minW: "trigger", provider: "popper", ...props, children: /* @__PURE__ */ jsx(AutocompleteContentImpl, { ref, children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children }) }) }) })
-  ] });
-});
+const AutocompleteContent = forwardRef(
+  ({
+    align = "center",
+    children,
+    className,
+    loading,
+    side = "bottom",
+    ...props
+  }, ref) => {
+    const { isOpen, items } = useAutocompleteContext("AutocompleteContent");
+    return isOpen && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Box, { role: "status", children: loading ? "Loading" : `${items.length} option${items.length === 1 ? "" : "s"} available` }) }) }),
+      /* @__PURE__ */ jsx(Portal, { asChild: true, children: /* @__PURE__ */ jsx(ModalLayer, { asChild: true, children: /* @__PURE__ */ jsx(
+        MenuListbox,
+        {
+          asChild: true,
+          maxH: "sm",
+          minW: "trigger",
+          provider: "popper",
+          ...props,
+          children: /* @__PURE__ */ jsx(
+            CommandListbox,
+            {
+              asChild: true,
+              ref,
+              ...content({}, className),
+              ...props,
+              children: /* @__PURE__ */ jsx(PopperContent, { align, side, sideOffset: 5, children: loading ? /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", p: "16", children: /* @__PURE__ */ jsx(Spinner, {}) }) : children })
+            }
+          )
+        }
+      ) }) })
+    ] });
+  }
+);
 AutocompleteContent.displayName = "@optiaxiom/react/AutocompleteContent";
 
 export { AutocompleteContent };

package/dist/packages/react/src/autocomplete-virtualized/AutocompleteVirtualized.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useComposedRefs } from '@radix-ui/react-compose-refs';
+import { useVirtualizer } from '@tanstack/react-virtual';
+import { forwardRef, useRef, useState, useEffect } from 'react';
+import { Box } from '../box/Box.js';
+import { useCommandContext } from '../command-context/CommandContext.js';
+import { ListboxScrollArea } from '../listbox-scroll-area/ListboxScrollArea.js';
+
+const AutocompleteVirtualized = forwardRef(({ children, items, ...props }, outerRef) => {
+  const innerRef = useRef(null);
+  const ref = useComposedRefs(outerRef, innerRef);
+  const [enabled, setEnabled] = useState(false);
+  useEffect(() => {
+    requestAnimationFrame(() => setEnabled(true));
+  }, []);
+  const rowVirtualizer = useVirtualizer({
+    count: items.length,
+    enabled,
+    estimateSize: () => 40,
+    getScrollElement: () => innerRef.current
+  });
+  const { downshift } = useCommandContext("AutocompleteVirtualized");
+  useEffect(() => {
+    rowVirtualizer.scrollToIndex(downshift.highlightedIndex);
+  }, [downshift.highlightedIndex, enabled, rowVirtualizer]);
+  return /* @__PURE__ */ jsx(ListboxScrollArea, { ref, ...props, children: /* @__PURE__ */ jsx(
+    Box,
+    {
+      display: "flex",
+      flex: "none",
+      flexDirection: "column",
+      gap: "2",
+      style: {
+        height: `${rowVirtualizer.getTotalSize()}px`,
+        position: "relative"
+      },
+      children: rowVirtualizer.getVirtualItems().map((virtualItem) => /* @__PURE__ */ jsx(
+        Box,
+        {
+          style: {
+            height: virtualItem.size,
+            left: 0,
+            position: "absolute",
+            top: 0,
+            transform: `translateY(${virtualItem.start}px)`
+          },
+          w: "full",
+          children: children(items[virtualItem.index])
+        },
+        virtualItem.key
+      ))
+    }
+  ) });
+});
+AutocompleteVirtualized.displayName = "@optiaxiom/react/AutocompleteVirtualized";
+
+export { AutocompleteVirtualized };

package/dist/packages/react/src/avatar/Avatar-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/avatar/Avatar.css.ts.vanilla-BgPUf0xd.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/avatar/Avatar.css.ts.vanilla-Cw1M_qyD.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden'},'b3w9pf'],variants:{colorScheme:{neutral:{bg:'bg.avatar.neutral',color:'fg.avatar.neutral'},purple:{bg:'bg.avatar.purple',color:'fg.avatar.purple'}},size:{xs:[{fontSize:'xs',fontWeight:'400',size:'xs'},'u5e0yo'],sm:[{fontSize:'xs',size:'sm'},'_1nnf3vl'],md:[{fontSize:'md',size:'md'},'_8xuka5'],lg:[{fontSize:'lg',size:'lg'},'faaei7'],xl:[{fontSize:'2xl',size:'xl'},'_1bulhpj'],'3xl':[{fontSize:'4xl',size:'3xl'},'wqjl91']}}});
+var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden',rounded:'full'},'miagcj'],variants:{colorScheme:{neutral:{bg:'bg.avatar.neutral',color:'fg.avatar.neutral'},purple:{bg:'bg.avatar.purple',color:'fg.avatar.purple'}},size:{xs:[{fontSize:'xs',fontWeight:'400',size:'xs'},'lzczfd'],sm:[{fontSize:'xs',size:'sm'},'_866w6t'],md:[{fontSize:'md',size:'md'},'lpnnh3'],lg:[{fontSize:'lg',size:'lg'},'_1w598n3'],xl:[{fontSize:'2xl',size:'xl'},'eb1g0p'],'3xl':[{fontSize:'4xl',size:'3xl'},'_10aiqxg']}}});
 var fallback = recipeRuntime({base:{alignItems:'center',display:'flex',justifyContent:'center',rounded:'inherit',size:'full',textTransform:'uppercase'}});
 var icon = recipeRuntime({base:[{w:'auto'}],variants:{size:{'2xs':{h:'10'},xs:{h:'10'},sm:{h:'12'},md:{h:'12'},lg:{h:'2xs'},xl:{h:'2xs'},'3xl':{h:'sm'}}}});
 

package/dist/packages/react/src/avatar/Avatar.js

@@ -24,7 +24,6 @@ const Avatar = forwardRef(
     className,
     colorScheme = "neutral",
     fallback: fallback$1 = "user",
-    icon: icon$1,
     name,
     size: sizeProp,
     src,
@@ -40,7 +39,7 @@ const Avatar = forwardRef(
         ...props,
         children: /* @__PURE__ */ jsxs(RadixAvatar.Root, { ref, children: [
           src && /* @__PURE__ */ jsx(Box, { asChild: true, objectFit: "cover", rounded: "inherit", size: "full", children: /* @__PURE__ */ jsx(RadixAvatar.Image, { alt: name, src }) }),
-          /* @__PURE__ */ jsx(Box, { asChild: true, ...fallback({}), children: /* @__PURE__ */ jsx(RadixAvatar.Fallback, { delayMs: src ? 600 : void 0, children: icon$1 ? /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ size }), children: icon$1 }) : name ? getInitialsFromName(name) : children || /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ size }), children: mapFallbackToIcon[fallback$1] }) }) })
+          /* @__PURE__ */ jsx(Box, { asChild: true, ...fallback({}), children: /* @__PURE__ */ jsx(RadixAvatar.Fallback, { delayMs: src ? 600 : undefined, children: (name ? getInitialsFromName(name) : children) || /* @__PURE__ */ jsx(Box, { asChild: true, ...icon({ size }), children: mapFallbackToIcon[fallback$1] }) }) })
         ] })
       }
     );

package/dist/packages/react/src/avatar-context/AvatarContext.js

@@ -2,7 +2,7 @@
 import { createContext } from 'react';
 
 const AvatarContext = createContext({
-  size: void 0
+  size: undefined
 });
 
 export { AvatarContext };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/table-row/TableRow.css.ts.vanilla-BYiv5uy5.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/avatar-group/AvatarGroup.css.ts.vanilla-BbzMTUzd.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var avatarGroup = recipeRuntime({base:['_1hc4noe',{display:'flex'}]});
+var avatarGroup = recipeRuntime({base:['_18ophdl',{display:'flex'}]});
 
 export { avatarGroup };

package/dist/packages/react/src/axiom-provider/AxiomProvider.js

@@ -1,11 +1,11 @@
 "use client";
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { AxiomVersionContext } from '@optiaxiom/globals';
-import * as RadixTooltip from '@radix-ui/react-tooltip';
 import { useContext } from 'react';
 import { version } from '../../package.json.js';
 import { ThemeProvider } from '../theme-provider/ThemeProvider.js';
 import { ToastProvider } from '../toast-provider/ToastProvider.js';
+import { TooltipProvider } from '../tooltip-provider/TooltipProvider.js';
 
 function AxiomProvider({
   children,
@@ -16,7 +16,7 @@ function AxiomProvider({
   if (axiom) {
     return /* @__PURE__ */ jsx(Fragment, { children });
   }
-  return /* @__PURE__ */ jsx(AxiomVersionContext.Provider, { value: version, children: /* @__PURE__ */ jsx(RadixTooltip.Provider, { ...tooltip, children: /* @__PURE__ */ jsxs(ThemeProvider, { children: [
+  return /* @__PURE__ */ jsx(AxiomVersionContext.Provider, { value: version, children: /* @__PURE__ */ jsx(TooltipProvider, { ...tooltip, children: /* @__PURE__ */ jsxs(ThemeProvider, { children: [
     children,
     /* @__PURE__ */ jsx(ToastProvider, { ...toast })
   ] }) }) });

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/backdrop/Backdrop.css.ts.vanilla-CgQ2BbGZ.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/backdrop/Backdrop.css.ts.vanilla-DirKW22r.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var backdrop = recipeRuntime({base:[{bg:'bg.overlay',z:'popover'},'hanvim']});
+var backdrop = recipeRuntime({base:[{bg:'bg.overlay',z:'popover'},'_1ghr6gz']});
 
 export { backdrop };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/badge/Badge.css.ts.vanilla-OwlF8UHd.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/badge/Badge.css.ts.vanilla-BvS_yf0c.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'8',py:'2',rounded:'full'},'_17phaut'],variants:{intent:{danger:'_61jumv',information:'uedkgj',neutral:'_6204yv',primary:'h2m6tu',success:'iba9ro',warning:'_9u2lvz'},variant:{light:'hihkr3',solid:'_9hi5ub'}}});
+var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'8',py:'2',rounded:'full'},'nt9omr'],variants:{intent:{danger:'ul9xdj',information:'_1wdecah',neutral:'_1f9wywo',primary:'f4qf85',success:'bcdgd2',warning:'_7ct7xi'},variant:{light:'pi4oim',solid:'hhpfmh'}}});
 
 export { badge };

package/dist/packages/react/src/banner/Banner-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 banner = recipeRuntime({base:[{alignItems:'start',color:'fg.default',flexDirection:'row',fontSize:'md',fontWeight:'500',gap:'12',justifyContent:'space-between',px:'24',py:'12'}],variants:{intent:{danger:{bg:'bg.error.light'},information:{bg:'bg.information.light'},neutral:{bg:'bg.tertiary'},success:{bg:'bg.success.light'},warning:{bg:'bg.warning.light'}}}});

package/dist/packages/react/src/banner/Banner.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx, jsxs } 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, createElement } from 'react';
 import { BannerContextProvider } from '../banner-context/BannerContext.js';
 import { Button } from '../button/Button.js';

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-CXVxxEDz.css';
-import './../../../../assets/src/box/Box.css.ts.vanilla-CV_xBQOM.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-DdXJhhdi.css';
+import './../../../../assets/src/box/Box.css.ts.vanilla-DIKXfgB7.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var box = recipeRuntime({base:'epp8j4'});
+var box = recipeRuntime({base:'uogfqd'});
 
 export { box };

package/dist/packages/react/src/breadcrumb/Breadcrumb.js

@@ -7,9 +7,9 @@ import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
 
 const Breadcrumb = forwardRef(
-  ({ children, ...props }, ref) => {
+  ({ children, className, ...props }, ref) => {
     const { restProps, sprinkleProps } = extractSprinkles(props);
-    return /* @__PURE__ */ jsx(Box, { asChild: true, ...sprinkleProps, children: /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", ref, ...restProps, children: /* @__PURE__ */ jsx(Box, { alignItems: "center", asChild: true, display: "flex", gap: "8", children: /* @__PURE__ */ jsx("ol", { children }) }) }) });
+    return /* @__PURE__ */ jsx(Box, { asChild: true, className, ...sprinkleProps, children: /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", ref, ...restProps, children: /* @__PURE__ */ jsx(Box, { alignItems: "center", asChild: true, display: "flex", gap: "8", children: /* @__PURE__ */ jsx("ol", { children }) }) }) });
   }
 );
 Breadcrumb.displayName = "@optiaxiom/react/Breadcrumb";