@optiaxiom/react 1.6.5 → 1.6.7

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

@@ -1,53 +1,24 @@
 "use client";
-import { jsx, jsxs } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
-import { useControllableState } from '@radix-ui/react-use-controllable-state';
-import { useState } from 'react';
-import '../focus-bookmark/FocusBookmarkProvider.js';
-import { FocusBookmarkRestore } from '../focus-bookmark/FocusBookmarkRestore.js';
-import { NestedDialogProvider } from '../nested-dialog-context/NestedDialogContext.js';
-import { useNestedDialogCount } from '../nested-dialog-context/useNestedDialogCount.js';
-import { AlertDialogProvider } from './AlertDialogContext.js';
+import { jsx } from 'react/jsx-runtime';
+import { useContext } from 'react';
+import { Dialog } from '../dialog/Dialog.js';
+import '../dialog/DialogBody.js';
+import '../dialog/DialogClose.js';
+import '../dialog/DialogContent.js';
+import '../dialog/DialogFooter.js';
+import '../dialog/DialogForm.js';
+import '../dialog/DialogHeader.js';
+import '../dialog/DialogTrigger.js';
+import { DialogKitContext } from '../dialog-kit/DialogKitContext.js';
+import '../dialog-kit/DialogKitProvider.js';
 
-function AlertDialog({
-  children,
-  defaultOpen = false,
-  onOpenChange,
-  open: openProp,
-  ...props
-}) {
-  const [open, setOpen] = useControllableState({
-    caller: "@optiaxiom/react/AlertDialog",
-    defaultProp: defaultOpen,
-    onChange: onOpenChange,
-    prop: openProp
-  });
-  const [presence, setPresence] = useState(false);
-  const [nestedDialogCount, setNestedDialogCount] = useNestedDialogCount(
-    "AlertDialog",
-    open
-  );
-  return /* @__PURE__ */ jsx(NestedDialogProvider, { onCountChange: setNestedDialogCount, children: /* @__PURE__ */ jsx(
-    RadixAlertDialog.Root,
-    {
-      onOpenChange: setOpen,
-      open: open || presence,
-      ...props,
-      children: /* @__PURE__ */ jsxs(
-        AlertDialogProvider,
-        {
-          nestedDialogCount,
-          open,
-          presence,
-          setPresence,
-          children: [
-            /* @__PURE__ */ jsx(RadixAlertDialog.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(FocusBookmarkRestore, {}) }),
-            children
-          ]
-        }
-      )
-    }
-  ) });
+function AlertDialog(props) {
+  if (useContext(DialogKitContext)) {
+    throw new Error(
+      "`@optiaxiom/react/AlertDialog` should not be used explicitly in managed mode.\n\nPlease remove it and only use `@optiaxiom/react/AlertDialogContent` instead."
+    );
+  }
+  return /* @__PURE__ */ jsx(Dialog, { ...props });
 }
 AlertDialog.displayName = "@optiaxiom/react/AlertDialog";
 

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

@@ -1,12 +1,32 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
-import { forwardRef } from 'react';
+import * as RadixDialog from '@radix-ui/react-dialog';
+import { forwardRef, useContext } from 'react';
 import { Button } from '../button/Button.js';
 import '../button/ButtonGroup.js';
+import { DialogKitContext } from '../dialog-kit/DialogKitContext.js';
+import '../dialog-kit/DialogKitProvider.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, onClick, ...props }, ref) => {
+  const { onDismiss } = useContext(DialogKitContext) ?? {};
+  return /* @__PURE__ */ jsx(
+    RadixDialog.Close,
+    {
+      asChild: true,
+      onClick: (event) => {
+        if (onDismiss) {
+          onDismiss(event, "action");
+          if (event.defaultPrevented) {
+            return;
+          }
+        }
+        onClick?.(event);
+      },
+      ref,
+      ...props,
+      children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, children })
+    }
+  );
 });
 AlertDialogAction.displayName = "@optiaxiom/react/AlertDialogAction";
 

package/dist/esm/packages/react/src/alert-dialog/AlertDialogBody.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
+import * as RadixDialog from '@radix-ui/react-dialog';
 import { forwardRef } from 'react';
 import { Flex } from '../flex/Flex.js';
 
@@ -16,7 +16,7 @@ const AlertDialogBody = forwardRef(
       ref,
       z: "0",
       ...props,
-      children: /* @__PURE__ */ jsx(RadixAlertDialog.Description, { asChild: true, children: /* @__PURE__ */ jsx("div", { children }) })
+      children: /* @__PURE__ */ jsx(RadixDialog.Description, { asChild: true, children: /* @__PURE__ */ jsx("div", { children }) })
     }
   )
 );

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

@@ -1,13 +1,41 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
-import { forwardRef } from 'react';
+import { useComposedRefs } from '@radix-ui/react-compose-refs';
+import * as RadixDialog from '@radix-ui/react-dialog';
+import { forwardRef, useContext } from 'react';
 import { Button } from '../button/Button.js';
 import '../button/ButtonGroup.js';
+import { DialogKitContext } from '../dialog-kit/DialogKitContext.js';
+import '../dialog-kit/DialogKitProvider.js';
+import { useAlertDialogContext } from './AlertDialogContext.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", onClick, ...props }, outerRef) => {
+    const { cancelRef } = useAlertDialogContext(
+      "@optiaxiom/react/AlertDialogCancel"
+    );
+    const { onDismiss } = useContext(DialogKitContext) ?? {};
+    const ref = useComposedRefs(cancelRef, outerRef);
+    return /* @__PURE__ */ jsx(
+      RadixDialog.Close,
+      {
+        asChild: true,
+        onClick: (event) => {
+          if (onDismiss) {
+            onDismiss(event, "cancel");
+            if (event.defaultPrevented) {
+              return;
+            }
+          }
+          onClick?.(event);
+        },
+        ref,
+        ...props,
+        children: asChild ? children : /* @__PURE__ */ jsx(Button, { appearance, children })
+      }
+    );
+  }
+);
 AlertDialogCancel.displayName = "@optiaxiom/react/AlertDialogCancel";
 
 export { AlertDialogCancel };

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

@@ -1,10 +1,10 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/alert-dialog/AlertDialogContent.css.ts.vanilla-Pvwtt340.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/alert-dialog/AlertDialogContent.css.ts.vanilla-BayzTPkH.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var backdrop = recipeRuntime({variants:{hidden:{false:{},true:'_182f10j'}}});
-var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column',overflow:'auto'},'_1uykyht'],variants:{size:{sm:'j32bzg',md:'_1xxqy3x',lg:'xeaj3m'}}});
-var nestedDialogCountVar = 'var(--_1m7p06l)';
-var root = recipeRuntime({base:[{alignItems:'center',gap:'0',z:'popover'},'_1bzd0zk']});
+var backdrop = recipeRuntime({variants:{hidden:{false:{},true:'t2x2pe'}}});
+var content = recipeRuntime({base:[{color:'fg.default',display:'flex',flexDirection:'column',overflow:'auto'},'_1xk37xv'],variants:{size:{sm:'_1ahdgh4',md:'_1g3wwqf',lg:'_13c0al3'}}});
+var nestedDialogCountVar = 'var(--_1xq8bo4)';
+var root = recipeRuntime({base:[{alignItems:'center',gap:'0',z:'popover'},'_1dbitmy']});
 
 export { backdrop, content, nestedDialogCountVar, root };

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

@@ -1,13 +1,15 @@
 "use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
+import * as RadixDialog from '@radix-ui/react-dialog';
 import { assignInlineVars } from '@vanilla-extract/dynamic';
-import { forwardRef, useRef } from 'react';
+import { forwardRef, useContext, useRef } from 'react';
 import { Backdrop } from '../backdrop/Backdrop.js';
 import { Box } from '../box/Box.js';
 import '../sprinkles/sprinkles.js';
 import '../sprinkles/sprinklesMerge.js';
+import { DialogKitContext } from '../dialog-kit/DialogKitContext.js';
+import '../dialog-kit/DialogKitProvider.js';
 import { Flex } from '../flex/Flex.js';
 import { FocusBookmarkProvider } from '../focus-bookmark/FocusBookmarkProvider.js';
 import '../focus-bookmark/FocusBookmarkRestore.js';
@@ -20,61 +22,103 @@ import { TransitionGroup } from '../transition/TransitionGroup.js';
 import { backdrop, root, content, nestedDialogCountVar } from './AlertDialogContent-css.js';
 import { useAlertDialogContext } from './AlertDialogContext.js';
 
-const AlertDialogContent = forwardRef(({ children, size = "sm", style, ...props }, outerRef) => {
-  const { nestedDialogCount, open, presence, setPresence } = useAlertDialogContext("@optiaxiom/react/AlertDialogContent");
-  const innerRef = useRef(null);
-  const ref = useComposedRefs(innerRef, outerRef);
-  return /* @__PURE__ */ jsx(
-    TransitionGroup,
-    {
-      onPresenceChange: setPresence,
-      open,
-      presence,
-      children: /* @__PURE__ */ jsxs(Portal, { children: [
-        /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(
-          Backdrop,
-          {
-            asChild: true,
-            onClick: () => {
-              innerRef.current?.animate(
-                [
-                  { translate: "6px" },
-                  { translate: "-4px" },
-                  { translate: "4px" }
-                ],
-                {
-                  duration: 150
-                }
-              );
-            },
-            ...backdrop({ hidden: nestedDialogCount > 0 }),
-            children: /* @__PURE__ */ jsx(RadixAlertDialog.Overlay, {})
-          }
-        ) }),
-        /* @__PURE__ */ jsxs(Flex, { ...root(), children: [
-          /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" }),
-          /* @__PURE__ */ jsx(Transition, { type: "pop", children: /* @__PURE__ */ jsx(
-            Paper,
+const AlertDialogContent = forwardRef(
+  ({
+    children,
+    onCloseAutoFocus,
+    onEscapeKeyDown,
+    onOpenAutoFocus,
+    size = "sm",
+    style,
+    ...props
+  }, outerRef) => {
+    const { cancelRef, nestedDialogCount, open, presence, setPresence } = useAlertDialogContext("@optiaxiom/react/AlertDialogContent");
+    const { onClose, onDismiss } = useContext(DialogKitContext) ?? {};
+    const innerRef = useRef(null);
+    const ref = useComposedRefs(innerRef, outerRef);
+    return /* @__PURE__ */ jsx(
+      TransitionGroup,
+      {
+        onPresenceChange: setPresence,
+        open,
+        presence,
+        children: /* @__PURE__ */ jsxs(Portal, { children: [
+          /* @__PURE__ */ jsx(Transition, { children: /* @__PURE__ */ jsx(
+            Backdrop,
             {
               asChild: true,
-              elevation: "dialog",
-              style: {
-                ...assignInlineVars({
-                  [nestedDialogCountVar]: `${nestedDialogCount}`
-                }),
-                ...style
+              onClick: () => {
+                innerRef.current?.animate(
+                  [
+                    { translate: "6px" },
+                    { translate: "-4px" },
+                    { translate: "4px" }
+                  ],
+                  {
+                    duration: 150
+                  }
+                );
               },
-              ...content({ size }),
-              children: /* @__PURE__ */ jsx(RadixAlertDialog.Content, { ref, ...props, children: /* @__PURE__ */ jsx(ModalProvider, { shardRef: innerRef, children: /* @__PURE__ */ jsx(FocusBookmarkProvider, { containerRef: innerRef, children }) }) })
+              ...backdrop({ hidden: nestedDialogCount > 0 }),
+              children: /* @__PURE__ */ jsx(RadixDialog.Overlay, {})
             }
           ) }),
-          /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" }),
-          /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" })
+          /* @__PURE__ */ jsxs(Flex, { ...root(), children: [
+            /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" }),
+            /* @__PURE__ */ jsx(Transition, { type: "pop", children: /* @__PURE__ */ jsx(
+              Paper,
+              {
+                asChild: true,
+                elevation: "dialog",
+                style: {
+                  ...assignInlineVars({
+                    [nestedDialogCountVar]: `${nestedDialogCount}`
+                  }),
+                  ...style
+                },
+                ...content({ size }),
+                children: /* @__PURE__ */ jsx(
+                  RadixDialog.Content,
+                  {
+                    onCloseAutoFocus: (event) => {
+                      onCloseAutoFocus?.(event);
+                      onClose?.();
+                    },
+                    onEscapeKeyDown: (event) => {
+                      if (onDismiss) {
+                        onDismiss(event, "cancel");
+                        if (event.defaultPrevented) {
+                          return;
+                        }
+                      }
+                      onEscapeKeyDown?.(event);
+                    },
+                    onOpenAutoFocus: (event) => {
+                      onOpenAutoFocus?.(event);
+                      if (event.defaultPrevented) {
+                        return;
+                      }
+                      event.preventDefault();
+                      cancelRef.current?.focus({ preventScroll: true });
+                    },
+                    ref,
+                    role: "alertdialog",
+                    ...props,
+                    onInteractOutside: (event) => event.preventDefault(),
+                    onPointerDownOutside: (event) => event.preventDefault(),
+                    children: /* @__PURE__ */ jsx(ModalProvider, { shardRef: innerRef, children: /* @__PURE__ */ jsx(FocusBookmarkProvider, { containerRef: innerRef, children }) })
+                  }
+                )
+              }
+            ) }),
+            /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" }),
+            /* @__PURE__ */ jsx(Box, { flex: "1", pointerEvents: "none" })
+          ] })
         ] })
-      ] })
-    }
-  );
-});
+      }
+    );
+  }
+);
 AlertDialogContent.displayName = "@optiaxiom/react/AlertDialogContent";
 
 export { AlertDialogContent };

package/dist/esm/packages/react/src/alert-dialog/AlertDialogContext.js

@@ -1,6 +1,6 @@
 "use client";
-import { createContext } from '@radix-ui/react-context';
+import { useDialogContext } from '../dialog/DialogContext.js';
 
-const [AlertDialogProvider, useAlertDialogContext] = createContext("@optiaxiom/react/AlertDialog");
+const useAlertDialogContext = useDialogContext;
 
-export { AlertDialogProvider, useAlertDialogContext };
+export { useAlertDialogContext };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/alert-dialog/AlertDialogFooter.css.ts.vanilla-n7IkRL5h.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/alert-dialog/AlertDialogFooter.css.ts.vanilla-Cwbnt2Mx.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var footer = recipeRuntime({base:[{bg:'bg.default',flexDirection:'row',gap:'16',justifyContent:'flex-end',px:'24',py:'20'},'_35bha7']});
+var footer = recipeRuntime({base:[{bg:'bg.default',flexDirection:'row',gap:'16',justifyContent:'flex-end',px:'24',py:'20'},'_1or7hwr']});
 
 export { footer };

package/dist/esm/packages/react/src/alert-dialog/AlertDialogHeader-css.js

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/alert-dialog/AlertDialogHeader.css.ts.vanilla-CWh_y92u.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/alert-dialog/AlertDialogHeader.css.ts.vanilla-IbSC8r81.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var header = recipeRuntime({base:[{bg:'bg.default',flexDirection:'row',gap:'8',p:'24',pb:'16',z:'10'},'iejjuq']});
+var header = recipeRuntime({base:[{bg:'bg.default',flexDirection:'row',gap:'8',p:'24',pb:'16',z:'10'},'usxknk']});
 
 export { header };

package/dist/esm/packages/react/src/alert-dialog/AlertDialogHeader.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
+import * as RadixDialog from '@radix-ui/react-dialog';
 import { forwardRef } from 'react';
 import { Flex } from '../flex/Flex.js';
 import { Heading } from '../heading/Heading.js';
@@ -13,7 +13,7 @@ import { header } from './AlertDialogHeader-css.js';
 const AlertDialogHeader = forwardRef(({ addonBefore, children, className, ...props }, ref) => {
   return /* @__PURE__ */ jsxs(Flex, { ref, ...header({}, className), ...props, children: [
     /* @__PURE__ */ jsx(Icon, { asChild: true, color: "fg.error", children: addonBefore && fallbackSpan(addonBefore) }),
-    /* @__PURE__ */ jsx(Heading, { asChild: true, color: "fg.default", fontWeight: "500", level: "3", children: /* @__PURE__ */ jsx(RadixAlertDialog.Title, { children }) })
+    /* @__PURE__ */ jsx(Heading, { asChild: true, color: "fg.default", fontWeight: "500", level: "3", children: /* @__PURE__ */ jsx(RadixDialog.Title, { children }) })
   ] });
 });
 AlertDialogHeader.displayName = "@optiaxiom/react/AlertDialogHeader";

package/dist/esm/packages/react/src/alert-dialog/AlertDialogTrigger.js

@@ -1,12 +1,12 @@
 "use client";
 import { jsx } from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
+import * as RadixDialog from '@radix-ui/react-dialog';
 import { forwardRef } from 'react';
 import { Button } from '../button/Button.js';
 import '../button/ButtonGroup.js';
 
 const AlertDialogTrigger = forwardRef(({ asChild, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(RadixAlertDialog.Trigger, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { children }) });
+  return /* @__PURE__ */ jsx(RadixDialog.Trigger, { asChild: true, ref, ...props, children: asChild ? children : /* @__PURE__ */ jsx(Button, { children }) });
 });
 AlertDialogTrigger.displayName = "@optiaxiom/react/AlertDialogTrigger";
 

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-DCAitvuu.css';
-import './../../../../assets/src/avatar/Avatar.css.ts.vanilla-DZoTmtPc.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-a23vAAu3.css';
+import './../../../../assets/src/avatar/Avatar.css.ts.vanilla-B7hQyNcp.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden',rounded:'full'},'j4hcfo'],variants:{colorScheme:{neutral:{bg:'bg.avatar.neutral',color:'fg.avatar.neutral'},purple:{bg:'bg.avatar.purple',color:'fg.avatar.purple'}},size:{'2xs':[{fontWeight:'400',size:'2xs'},'_1yv7g4k'],xs:[{fontWeight:'400',size:'xs'},'_156auoh'],sm:[{size:'sm'},'_1t0hggt'],md:[{size:'md'},'_1le7bhj'],lg:[{size:'lg'},'_1kj2f7r'],xl:[{size:'xl'},'_5bnb7e'],'3xl':[{size:'3xl'},'_1dnmijv']}}});
+var avatar = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',fontWeight:'500',justifyContent:'center',overflow:'hidden',rounded:'full'},'_12lnx55'],variants:{colorScheme:{neutral:{bg:'bg.avatar.neutral',color:'fg.avatar.neutral'},purple:{bg:'bg.avatar.purple',color:'fg.avatar.purple'}},size:{'2xs':[{fontWeight:'400',size:'2xs'},'yiuho5'],xs:[{fontWeight:'400',size:'xs'},'scx9gj'],sm:[{size:'sm'},'ju6bg4'],md:[{size:'md'},'_1mh46l1'],lg:[{size:'lg'},'_1a7gs7n'],xl:[{size:'xl'},'_3s3a56'],'3xl':[{size:'3xl'},'_22pcks']}}});
 var fallback = recipeRuntime({base:{alignItems:'center',display:'flex',justifyContent:'center',rounded:'inherit',size:'full',textTransform:'uppercase'}});
 var icon = recipeRuntime({base:[{w:'auto'}],variants:{size:{'2xs':{h:'10'},xs:{h:'10'},sm:{h:'12'},md:{h:'12'},lg:{h:'2xs'},xl:{h:'2xs'},'3xl':{h:'sm'}}}});
 

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-DCAitvuu.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-a23vAAu3.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var avatarGroup = recipeRuntime({base:['ggftbv',{display:'flex'}]});
+var avatarGroup = recipeRuntime({base:['_18s3c9j',{display:'flex'}]});
 
 export { avatarGroup };

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

@@ -3,6 +3,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { AxiomVersionContext } from '@optiaxiom/globals';
 import { useContext } from 'react';
 import { version } from '../../package.json.js';
+import '../dialog-kit/DialogKitContext.js';
+import { DialogKitProvider } from '../dialog-kit/DialogKitProvider.js';
 import { FocusBookmarkProvider } from '../focus-bookmark/FocusBookmarkProvider.js';
 import '../focus-bookmark/FocusBookmarkRestore.js';
 import { ThemeProvider } from '../theme-provider/ThemeProvider.js';
@@ -28,7 +30,10 @@ function AxiomProvider({
       /* @__PURE__ */ jsx(ToastProvider, { ...toast })
     ] });
   }
-  return /* @__PURE__ */ jsx(AxiomVersionContext.Provider, { value: version, children: /* @__PURE__ */ jsx(TooltipProvider, { ...tooltip, children: /* @__PURE__ */ jsx(FocusBookmarkProvider, { children }) }) });
+  return /* @__PURE__ */ jsx(AxiomVersionContext.Provider, { value: version, children: /* @__PURE__ */ jsx(TooltipProvider, { ...tooltip, children: /* @__PURE__ */ jsxs(FocusBookmarkProvider, { children: [
+    children,
+    /* @__PURE__ */ jsx(DialogKitProvider, {})
+  ] }) }) });
 }
 AxiomProvider.displayName = "@optiaxiom/react/AxiomProvider";
 

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/backdrop/Backdrop.css.ts.vanilla-Dex-9adz.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/backdrop/Backdrop.css.ts.vanilla-D4lJwpWf.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var backdrop = recipeRuntime({base:[{bg:'bg.overlay',z:'popover'},'a1h1pa']});
+var backdrop = recipeRuntime({base:[{bg:'bg.overlay',z:'popover'},'_1t6jedr']});
 
 export { backdrop };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/badge/Badge.css.ts.vanilla-D2-ZM6fl.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/badge/Badge.css.ts.vanilla-xWBK9hvX.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'6',py:'2',rounded:'full'},'_13fq5pp'],variants:{intent:{danger:'_1tu5mjh',information:'_9prqx8',neutral:'_12nr42i',primary:'j2gfq4',success:'_6onwzw',warning:'mx91pm'},variant:{strong:'fbgfeh',subtle:'qjnhba'}}});
+var badge = recipeRuntime({base:[{display:'inline-flex',fontSize:'sm',fontWeight:'500',justifyContent:'center',px:'6',py:'2',rounded:'full'},'_1qezjb3'],variants:{intent:{danger:'m6f93a',information:'uqcx0g',neutral:'s0nq0m',primary:'h7q1i1',success:'_6gok74',warning:'_114y6ch'},variant:{strong:'hndbn2',subtle:'_1xk6se9'}}});
 
 export { badge };

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

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

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/sprinkles/properties.css.ts.vanilla-DSnZ2p-5.css';
-import './../../../../assets/src/box/Box.css.ts.vanilla-Qc6lEHZB.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/sprinkles/properties.css.ts.vanilla-Cr7Kkr-z.css';
+import './../../../../assets/src/box/Box.css.ts.vanilla-Dzvlvq-p.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var box = recipeRuntime({base:'_8rv6ac'});
+var box = recipeRuntime({base:'_1a5vhyd'});
 
 export { box };

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

@@ -1,8 +1,8 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/breadcrumb/Breadcrumb.css.ts.vanilla-BrAHXnMK.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/breadcrumb/Breadcrumb.css.ts.vanilla-DNuqJGax.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var link = recipeRuntime({base:'r6dqt2'});
-var list = recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'md',gap:'8'},'pqbds2']});
+var link = recipeRuntime({base:'_15x3fde'});
+var list = recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'md',gap:'8'},'p4f3va']});
 
 export { link, list };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/breadcrumb/BreadcrumbNode.css.ts.vanilla-Cbxmr543.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/breadcrumb/BreadcrumbNode.css.ts.vanilla-DsU_9DG0.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var item = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',gap:'4',whiteSpace:'nowrap'},'_4lcfkv']});
+var item = recipeRuntime({base:[{alignItems:'center',display:'inline-flex',gap:'4',whiteSpace:'nowrap'},'_1oohjpc']});
 
 export { item };

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

@@ -1,7 +1,7 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-DCAitvuu.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-a23vAAu3.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var buttonGroup = recipeRuntime({base:'_1kfpa3x'});
+var buttonGroup = recipeRuntime({base:'nce9zf'});
 
 export { buttonGroup };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-DCAitvuu.css';
-import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-CviSytiE.css';
-import './../../../../assets/src/button/ButtonLoadable.css.ts.vanilla-BqtAQKqc.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-a23vAAu3.css';
+import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-RM21OaIQ.css';
+import './../../../../assets/src/button/ButtonLoadable.css.ts.vanilla-BLkPbEpv.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var loadable = recipeRuntime({base:[{transition:'opacity'},'_156tjqc']});
+var loadable = recipeRuntime({base:[{transition:'opacity'},'_1ruun16']});
 
 export { loadable };

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

@@ -1,9 +1,9 @@
-import './../../../../assets/src/layers/layers.css.ts.vanilla-D_rF7ERt.css';
-import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-DCAitvuu.css';
-import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-CviSytiE.css';
+import './../../../../assets/src/layers/layers.css.ts.vanilla-C4q1Lh94.css';
+import './../../../../assets/src/dialog/DialogBody.css.ts.vanilla-a23vAAu3.css';
+import './../../../../assets/src/button/ButtonRoot.css.ts.vanilla-RM21OaIQ.css';
 import { recipeRuntime } from '../vanilla-extract/recipeRuntime.js';
 
-var buttonBase = recipeRuntime({base:['mkdftk',{alignItems:'center',display:'inline-flex',flexDirection:'row',justifyContent:'flex-start',transition:'colors'},'isluzl'],variants:{intent:{danger:'j60eec',neutral:'_4k3gy5',primary:'_15cp3fh'},size:{sm:{fontSize:'sm',h:'sm'},md:{fontSize:'md',gap:'2',h:'md'},lg:{fontSize:'md',gap:'4',h:'lg'}},square:{false:{},true:{}},variant:{opal:'_1in6zdb',outline:'no9h9w',strong:'_195oql4',subtle:'_1olorm8'}},variantsCompounded:[{style:{w:'sm'},variants:{size:'sm',square:true}},{style:'xkvpha',variants:{size:'sm',square:false}},{style:{w:'md'},variants:{size:'md',square:true}},{style:'hodtgp',variants:{size:'md',square:false}},{style:{w:'lg'},variants:{size:'lg',square:true}},{style:'yljd4e',variants:{size:'lg',square:false}}]});
-var spinner = recipeRuntime({base:[{size:'2xs'},'_13aar79']});
+var buttonBase = recipeRuntime({base:['_1wpazru',{alignItems:'center',display:'inline-flex',flexDirection:'row',justifyContent:'flex-start',transition:'colors'},'t1681q'],variants:{intent:{danger:'_1aob6wg',neutral:'_1fzsnlk',primary:'_72fdkd'},size:{sm:{fontSize:'sm',h:'sm'},md:{fontSize:'md',gap:'2',h:'md'},lg:{fontSize:'md',gap:'4',h:'lg'}},square:{false:{},true:{}},variant:{outline:'_1b39dp1','outline-opal':'_5xlgtm',strong:'_1aqaa97','strong-opal':'_64m0lj',subtle:'_1ijjk2q'}},variantsCompounded:[{style:'_1y6193z',variants:{size:['sm','md'],variant:['outline-opal','strong-opal']}},{style:{w:'sm'},variants:{size:'sm',square:true}},{style:'_18m45l4',variants:{size:'sm',square:false,variant:['outline','strong','subtle']}},{style:'_1eqd7dq',variants:{size:'sm',square:false,variant:['outline-opal','strong-opal']}},{style:{w:'md'},variants:{size:'md',square:true}},{style:'_1s3zyxp',variants:{size:'md',square:false}},{style:{w:'lg'},variants:{size:'lg',square:true}},{style:'_1kpnyqx',variants:{size:'lg',square:false}}]});
+var spinner = recipeRuntime({base:[{size:'2xs'},'_1yzmyk3']});
 
 export { buttonBase, spinner };