@saas-ui/react 3.0.0-alpha.14 → 3.0.0-alpha.16

package/dist/index.cjs

@@ -66,7 +66,7 @@ __export(src_exports, {
   Switch: () => Switch,
   Toaster: () => Toaster,
   Tooltip: () => Tooltip,
-  createSystem: () => import_react162.createSystem,
+  createSystem: () => import_react161.createSystem,
   defaultConfig: () => defaultConfig,
   defaultPresenceOptions: () => defaultPresenceOptions,
   defaultSystem: () => defaultSystem,
@@ -557,6 +557,7 @@ var commandRecipe = (0, import_react6.defineRecipe)({
     colorPalette: "gray",
     display: "inline-flex",
     gap: 1,
+    color: "fg.muted",
     "[role=tooltip] > &": {
       ms: 1,
       _before: {
@@ -565,6 +566,22 @@ var commandRecipe = (0, import_react6.defineRecipe)({
         fontSize: "xs"
       }
     }
+  },
+  variants: {
+    size: {
+      sm: {
+        fontSize: "xs"
+      },
+      md: {
+        fontSize: "sm"
+      },
+      lg: {
+        fontSize: "md"
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md"
   }
 });
 
@@ -1010,7 +1027,7 @@ var kbdRecipe = (0, import_react16.defineRecipe)({
     display: "inline-flex",
     alignItems: "center",
     fontWeight: "medium",
-    fontFamily: "mono",
+    fontFamily: "body",
     flexShrink: "0",
     whiteSpace: "nowrap",
     wordSpacing: "-0.5em",
@@ -1045,18 +1062,18 @@ var kbdRecipe = (0, import_react16.defineRecipe)({
         height: "4.5"
       },
       md: {
-        textStyle: "sm",
+        textStyle: "xs",
         height: "5"
       },
       lg: {
-        textStyle: "md",
+        textStyle: "sm",
         height: "6"
       }
     }
   },
   defaultVariants: {
     size: "md",
-    variant: "raised"
+    variant: "subtle"
   }
 });
 
@@ -2585,6 +2602,7 @@ var personaSlotRecipe = (0, import_react32.defineSlotRecipe)({
   ],
   base: {
     root: {
+      "--presence-border-color": "var(--bg-currentcolor)",
       display: "flex",
       flexDirection: "row",
       alignItems: "center"
@@ -2596,11 +2614,11 @@ var personaSlotRecipe = (0, import_react32.defineSlotRecipe)({
       position: "absolute",
       bottom: 0,
       right: 0,
-      boxSize: "1em",
-      transform: "translate(15%, 15%)",
-      borderWidth: "0.15em",
+      boxSize: "calc(var(--avatar-size) / 3)",
+      transform: "translate(12%, 12%)",
+      borderWidth: "0.10em",
       borderRadius: "50%",
-      borderColor: "bg.panel",
+      borderColor: "var(--presence-border-color)",
       bg: "var(--persona-presence)"
     },
     details: {
@@ -2621,8 +2639,14 @@ var personaSlotRecipe = (0, import_react32.defineSlotRecipe)({
   },
   variants: {
     size: {
+      "2xs": {
+        details: { ms: 1 },
+        label: { fontSize: "2xs" },
+        secondaryLabel: { display: "none" },
+        tertiaryLabel: { display: "none" }
+      },
       xs: {
-        details: { ms: 2 },
+        details: { ms: 1.5 },
         label: { fontSize: "xs" },
         secondaryLabel: { display: "none" },
         tertiaryLabel: { display: "none" }
@@ -2650,6 +2674,12 @@ var personaSlotRecipe = (0, import_react32.defineSlotRecipe)({
         label: { fontSize: "lg" },
         secondaryLabel: { fontSize: "md" },
         tertiaryLabel: { fontSize: "md" }
+      },
+      "2xl": {
+        details: { ms: 4 },
+        label: { fontSize: "xl" },
+        secondaryLabel: { fontSize: "lg" },
+        tertiaryLabel: { fontSize: "lg" }
       }
     }
   },
@@ -3332,6 +3362,7 @@ var avatarSlotRecipe = (0, import_react38.defineSlotRecipe)({
   className: "chakra-avatar",
   base: {
     root: {
+      "--avatar-font-size": "calc(var(--avatar-size) / 2)",
       display: "inline-flex",
       alignItems: "center",
       justifyContent: "center",
@@ -3373,44 +3404,38 @@ var avatarSlotRecipe = (0, import_react38.defineSlotRecipe)({
       },
       "2xs": {
         root: {
-          "--avatar-font-size": "fontSizes.2xs",
-          "--avatar-size": "sizes.6"
+          "--avatar-size": "sizes.5"
         }
       },
       xs: {
         root: {
-          "--avatar-font-size": "fontSizes.xs",
-          "--avatar-size": "sizes.8"
+          "--avatar-size": "sizes.6"
         }
       },
       sm: {
         root: {
-          "--avatar-font-size": "fontSizes.sm",
           "--avatar-size": "sizes.9"
         }
       },
       md: {
         root: {
-          "--avatar-font-size": "fontSizes.md",
-          "--avatar-size": "sizes.10"
+          "--avatar-size": "sizes.12"
         }
       },
       lg: {
         root: {
-          "--avatar-font-size": "fontSizes.md",
-          "--avatar-size": "sizes.11"
+          "--avatar-size": "sizes.14"
         }
       },
       xl: {
         root: {
-          "--avatar-font-size": "fontSizes.lg",
-          "--avatar-size": "sizes.12"
+          "--avatar-size": "sizes.16"
         }
       },
       "2xl": {
         root: {
-          "--avatar-font-size": "fontSizes.xl",
-          "--avatar-size": "sizes.16"
+          "--avatar-font-size": "calc(var(--avatar-size) / 2)",
+          "--avatar-size": "sizes.20"
         }
       }
     },
@@ -7933,9 +7958,11 @@ var tooltipSlotRecipe = (0, import_react76.defineSlotRecipe)({
   className: "chakra-tooltip",
   base: {
     content: {
-      "--tooltip-bg": "colors.bg.inverted",
+      "--tooltip-bg": "colors.bg",
+      display: "flex",
+      alignItems: "center",
       bg: "var(--tooltip-bg)",
-      color: "fg.inverted",
+      color: "fg",
       px: "2.5",
       py: "1",
       borderRadius: "l2",
@@ -7956,13 +7983,24 @@ var tooltipSlotRecipe = (0, import_react76.defineSlotRecipe)({
     },
     arrow: {
       "--arrow-size": "sizes.2",
-      "--arrow-background": "var(--tooltip-bg)"
+      "--arrow-background": "var(--tooltip-bg)",
+      zIndex: "-1"
     },
     arrowTip: {
       borderTopWidth: "1px",
       borderInlineStartWidth: "1px",
       borderColor: "var(--tooltip-bg)"
     }
+  },
+  variants: {
+    variant: {
+      inverted: {
+        content: {
+          "--tooltip-bg": "colors.bg.inverted",
+          color: "fg.inverted"
+        }
+      }
+    }
   }
 });
 
@@ -8464,20 +8502,20 @@ var easings = import_react85.defineTokens.easings({
 // src/theme/tokens/font-sizes.ts
 var import_react86 = require("@chakra-ui/react");
 var fontSizes = import_react86.defineTokens.fontSizes({
-  "2xs": { value: scaleToken("0.75rem") },
-  xs: { value: scaleToken("0.8125rem") },
-  sm: { value: scaleToken("0.875rem") },
-  md: { value: scaleToken("1rem") },
-  lg: { value: scaleToken("1.125rem") },
-  xl: { value: scaleToken("1.25rem") },
-  "2xl": { value: scaleToken("1.5rem") },
-  "3xl": { value: scaleToken("1.875rem") },
-  "4xl": { value: scaleToken("2.25rem") },
-  "5xl": { value: scaleToken("3rem") },
-  "6xl": { value: scaleToken("3.75rem") },
-  "7xl": { value: scaleToken("4.5rem") },
-  "8xl": { value: scaleToken("6rem") },
-  "9xl": { value: scaleToken("8rem") }
+  "2xs": { value: scaleToken("0.625rem") },
+  xs: { value: scaleToken("0.75rem") },
+  sm: { value: scaleToken("0.8125rem") },
+  md: { value: scaleToken("0.875rem") },
+  lg: { value: scaleToken("1rem") },
+  xl: { value: scaleToken("1.125rem") },
+  "2xl": { value: scaleToken("1.25rem") },
+  "3xl": { value: scaleToken("1.5rem") },
+  "4xl": { value: scaleToken("1.875rem") },
+  "5xl": { value: scaleToken("2.25rem") },
+  "6xl": { value: scaleToken("3rem") },
+  "7xl": { value: scaleToken("3.75rem") },
+  "8xl": { value: scaleToken("4.5rem") },
+  "9xl": { value: scaleToken("6rem") }
 });
 
 // src/theme/tokens/font-weights.ts
@@ -8901,7 +8939,7 @@ var defaultConfig = (0, import_react97.mergeConfigs)(import_react97.defaultBaseC
 var defaultSystem = (0, import_react97.createSystem)(defaultConfig);
 
 // src/index.ts
-var import_react162 = require("@chakra-ui/react");
+var import_react161 = require("@chakra-ui/react");
 
 // src/provider/sui-provider.tsx
 var React = __toESM(require("react"), 1);
@@ -9197,29 +9235,29 @@ var CloseButton = (0, import_react111.forwardRef)(
 
 // src/components/command/command.tsx
 var import_react113 = require("@chakra-ui/react");
-var import_react114 = require("@chakra-ui/react");
 var import_jsx_runtime9 = require("react/jsx-runtime");
-var { withContext: withContext2 } = (0, import_react114.createRecipeContext)({
+var { withContext: withContext2 } = (0, import_react113.createRecipeContext)({
   key: "suiCommand"
 });
-var Key = ({ children }) => {
+var Command = (props) => {
+  const { children, modifiers, ...rest } = props;
   if (typeof children !== "string") {
     return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children });
   }
-  if (["then", "or", "+"].includes(children)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children });
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react113.Kbd, { children });
+  const keys = children.split(/\s|\+/);
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StyledCommand, { ...rest, children: keys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Key, { modifiers, size: props.size, children: key }, key)) });
 };
-var Command = (props) => {
-  const { children, ...rest } = props;
+var StyledCommand = withContext2("span");
+var Key = (props) => {
+  const { modifiers = ["then", "or", "+"], children, ...rest } = props;
   if (typeof children !== "string") {
     return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children });
   }
-  const keys = children.split(/\s|\+/);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(CommandRoot, { ...rest, children: keys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Key, { children: key }, key)) });
+  if (modifiers.includes(children)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react113.Kbd, { ...rest, children });
 };
-var CommandRoot = withContext2("span");
 
 // src/components/dialog/namespace.ts
 var namespace_exports = {};
@@ -9239,11 +9277,11 @@ __export(namespace_exports, {
 });
 
 // src/components/dialog/dialog.tsx
-var import_react115 = require("react");
-var import_react116 = require("@chakra-ui/react");
+var import_react114 = require("react");
+var import_react115 = require("@chakra-ui/react");
 var import_dialog2 = require("@ark-ui/react/dialog");
 var import_jsx_runtime10 = require("react/jsx-runtime");
-var DialogContent = (0, import_react115.forwardRef)(
+var DialogContent = (0, import_react114.forwardRef)(
   function DialogContent2(props, ref) {
     const {
       children,
@@ -9252,15 +9290,15 @@ var DialogContent = (0, import_react115.forwardRef)(
       backdrop = true,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react116.Portal, { disabled: !portalled, container: portalRef, children: [
-      backdrop && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react116.Dialog.Backdrop, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react116.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react116.Dialog.Content, { ref, ...rest, asChild: false, children }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react115.Portal, { disabled: !portalled, container: portalRef, children: [
+      backdrop && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react115.Dialog.Backdrop, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react115.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react115.Dialog.Content, { ref, ...rest, asChild: false, children }) })
     ] });
   }
 );
-var DialogCloseTrigger = (0, import_react115.forwardRef)(function DialogCloseTrigger2(props, ref) {
+var DialogCloseTrigger = (0, import_react114.forwardRef)(function DialogCloseTrigger2(props, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-    import_react116.Dialog.CloseTrigger,
+    import_react115.Dialog.CloseTrigger,
     {
       position: "absolute",
       top: "2",
@@ -9271,15 +9309,15 @@ var DialogCloseTrigger = (0, import_react115.forwardRef)(function DialogCloseTri
     }
   );
 });
-var DialogRoot = import_react116.Dialog.Root;
-var DialogFooter = import_react116.Dialog.Footer;
-var DialogHeader = import_react116.Dialog.Header;
-var DialogBody = import_react116.Dialog.Body;
-var DialogBackdrop = import_react116.Dialog.Backdrop;
-var DialogTitle = import_react116.Dialog.Title;
-var DialogDescription = import_react116.Dialog.Description;
-var DialogTrigger = import_react116.Dialog.Trigger;
-var DialogActionTrigger = import_react116.Dialog.ActionTrigger;
+var DialogRoot = import_react115.Dialog.Root;
+var DialogFooter = import_react115.Dialog.Footer;
+var DialogHeader = import_react115.Dialog.Header;
+var DialogBody = import_react115.Dialog.Body;
+var DialogBackdrop = import_react115.Dialog.Backdrop;
+var DialogTitle = import_react115.Dialog.Title;
+var DialogDescription = import_react115.Dialog.Description;
+var DialogTrigger = import_react115.Dialog.Trigger;
+var DialogActionTrigger = import_react115.Dialog.ActionTrigger;
 
 // src/components/drawer/namespace.ts
 var namespace_exports2 = {};
@@ -9299,19 +9337,19 @@ __export(namespace_exports2, {
 });
 
 // src/components/drawer/drawer.tsx
-var import_react117 = require("react");
+var import_react116 = require("react");
 var import_dialog4 = require("@ark-ui/react/dialog");
-var import_react118 = require("@chakra-ui/react");
+var import_react117 = require("@chakra-ui/react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
-var DrawerContent = (0, import_react117.forwardRef)(
+var DrawerContent = (0, import_react116.forwardRef)(
   function DrawerContent2(props, ref) {
     const { children, portalled = true, portalRef, offset, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react118.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react118.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react118.Drawer.Content, { ref, ...rest, asChild: false, children }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react117.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react117.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react117.Drawer.Content, { ref, ...rest, asChild: false, children }) }) });
   }
 );
-var DrawerCloseTrigger = (0, import_react117.forwardRef)(function DrawerCloseTrigger2(props, ref) {
+var DrawerCloseTrigger = (0, import_react116.forwardRef)(function DrawerCloseTrigger2(props, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    import_react118.Drawer.CloseTrigger,
+    import_react117.Drawer.CloseTrigger,
     {
       position: "absolute",
       top: "2",
@@ -9322,30 +9360,30 @@ var DrawerCloseTrigger = (0, import_react117.forwardRef)(function DrawerCloseTri
     }
   );
 });
-var DrawerTrigger = import_react118.Drawer.Trigger;
-var DrawerRoot = import_react118.Drawer.Root;
-var DrawerFooter = import_react118.Drawer.Footer;
-var DrawerHeader = import_react118.Drawer.Header;
-var DrawerBody = import_react118.Drawer.Body;
-var DrawerBackdrop = import_react118.Drawer.Backdrop;
-var DrawerDescription = import_react118.Drawer.Description;
-var DrawerTitle = import_react118.Drawer.Title;
-var DrawerActionTrigger = import_react118.Drawer.ActionTrigger;
+var DrawerTrigger = import_react117.Drawer.Trigger;
+var DrawerRoot = import_react117.Drawer.Root;
+var DrawerFooter = import_react117.Drawer.Footer;
+var DrawerHeader = import_react117.Drawer.Header;
+var DrawerBody = import_react117.Drawer.Body;
+var DrawerBackdrop = import_react117.Drawer.Backdrop;
+var DrawerDescription = import_react117.Drawer.Description;
+var DrawerTitle = import_react117.Drawer.Title;
+var DrawerActionTrigger = import_react117.Drawer.ActionTrigger;
 var DrawerContext = import_dialog4.DialogContext;
 
 // src/components/empty-state/empty-state.tsx
-var import_react119 = require("@chakra-ui/react");
-var import_react120 = require("react");
+var import_react118 = require("@chakra-ui/react");
+var import_react119 = require("react");
 var import_jsx_runtime12 = require("react/jsx-runtime");
-var EmptyState = (0, import_react120.forwardRef)(
+var EmptyState = (0, import_react119.forwardRef)(
   function EmptyState2(props, ref) {
     const { title, description, icon, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react119.EmptyState.Content, { children: [
-      icon && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Indicator, { children: icon }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react119.VStack, { textAlign: "center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Title, { children: title }),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Description, { children: description })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Title, { children: title }),
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react118.EmptyState.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react118.EmptyState.Content, { children: [
+      icon && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react118.EmptyState.Indicator, { children: icon }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react118.VStack, { textAlign: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react118.EmptyState.Title, { children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react118.EmptyState.Description, { children: description })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react118.EmptyState.Title, { children: title }),
       children
     ] }) });
   }
@@ -9362,12 +9400,12 @@ __export(grid_list_exports, {
 var import_grid_list = require("@saas-ui/core/grid-list");
 
 // src/components/grid-list/grid-list.context.ts
-var import_react121 = require("@chakra-ui/react");
+var import_react120 = require("@chakra-ui/react");
 var {
   withProvider: withProvider2,
   withContext: withContext3,
   useStyles: useGridListStyles
-} = (0, import_react121.createSlotRecipeContext)({
+} = (0, import_react120.createSlotRecipeContext)({
   key: "suiGridList"
 });
 
@@ -9391,23 +9429,23 @@ var GridListCell = withContext3(
 
 // src/components/icon-badge/icon-badge.tsx
 var React2 = __toESM(require("react"), 1);
-var import_react122 = require("react");
-var import_react123 = require("@chakra-ui/react");
+var import_react121 = require("react");
+var import_react122 = require("@chakra-ui/react");
 var import_utils7 = require("@saas-ui/core/utils");
 var import_jsx_runtime13 = require("react/jsx-runtime");
 var IconBadge = React2.forwardRef(
   (props, ref) => {
     const { icon, children, ...rest } = props;
-    const recipe = (0, import_react123.useRecipe)({ key: "suiIconBadge", recipe: props.recipe });
+    const recipe = (0, import_react122.useRecipe)({ key: "suiIconBadge", recipe: props.recipe });
     const [variantProps, localProps] = recipe.splitVariantProps(rest);
     const styles = recipe(variantProps);
     const element = icon || children;
-    const _children = (0, import_react122.isValidElement)(element) ? (0, import_react122.cloneElement)(element, {
+    const _children = (0, import_react121.isValidElement)(element) ? (0, import_react121.cloneElement)(element, {
       "aria-hidden": true,
       focusable: false
     }) : null;
     return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-      import_react123.chakra.div,
+      import_react122.chakra.div,
       {
         ref,
         ...localProps,
@@ -9420,10 +9458,10 @@ var IconBadge = React2.forwardRef(
 );
 
 // src/components/input-group/input-group.tsx
-var import_react124 = require("react");
-var import_react125 = require("@chakra-ui/react");
+var import_react123 = require("react");
+var import_react124 = require("@chakra-ui/react");
 var import_jsx_runtime14 = require("react/jsx-runtime");
-var InputGroup = (0, import_react124.forwardRef)(
+var InputGroup = (0, import_react123.forwardRef)(
   function InputGroup2(props, ref) {
     const {
       startElement,
@@ -9433,26 +9471,26 @@ var InputGroup = (0, import_react124.forwardRef)(
       children,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react125.Group, { ref, display: "flex", ...rest, children: [
-      startElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react125.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
-      (0, import_react124.isValidElement)(children) && (0, import_react124.cloneElement)(children, {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react124.Group, { ref, display: "flex", ...rest, children: [
+      startElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react124.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
+      (0, import_react123.isValidElement)(children) && (0, import_react123.cloneElement)(children, {
         ...startElement && { ps: "calc(var(--input-height) - 6px)" },
         ...endElement && { pe: "calc(var(--input-height) - 6px)" },
         ...children.props
       }),
-      endElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react125.InputElement, { placement: "end", ...endElementProps, children: endElement })
+      endElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react124.InputElement, { placement: "end", ...endElementProps, children: endElement })
     ] });
   }
 );
 
 // src/components/link/link.tsx
-var import_react126 = __toESM(require("react"), 1);
-var import_react127 = require("@chakra-ui/react");
+var import_react125 = __toESM(require("react"), 1);
+var import_react126 = require("@chakra-ui/react");
 var import_jsx_runtime15 = require("react/jsx-runtime");
-var Link = import_react126.default.forwardRef(
+var Link = import_react125.default.forwardRef(
   (props, ref) => {
     const LinkComponent = useLink();
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react127.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(LinkComponent, { ref, ...props }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react126.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(LinkComponent, { ref, ...props }) });
   }
 );
 Link.displayName = "Link";
@@ -9465,29 +9503,29 @@ __export(loading_overlay_exports, {
   Text: () => LoadingOverlayText
 });
 var import_presence = require("@ark-ui/react/presence");
-var import_react131 = require("@chakra-ui/react");
+var import_react130 = require("@chakra-ui/react");
 
 // src/components/spinner/spinner.tsx
-var import_react128 = require("react");
-var import_react129 = require("@chakra-ui/react");
+var import_react127 = require("react");
+var import_react128 = require("@chakra-ui/react");
 var import_jsx_runtime16 = require("react/jsx-runtime");
-var Spinner2 = (0, import_react128.forwardRef)(
+var Spinner2 = (0, import_react127.forwardRef)(
   function Spinner3(props, ref) {
     const { loading, children, ...rest } = props;
     if (loading === false) {
       return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react129.Spinner, { ref, ...rest });
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react128.Spinner, { ref, ...rest });
   }
 );
 
 // src/components/loading-overlay/loading-overlay.context.ts
-var import_react130 = require("@chakra-ui/react");
+var import_react129 = require("@chakra-ui/react");
 var {
   useStyles: useLoadingOverlayStyles,
   withContext: withContext4,
   withProvider: withProvider3
-} = (0, import_react130.createSlotRecipeContext)({
+} = (0, import_react129.createSlotRecipeContext)({
   key: "suiLoadingOverlay"
 });
 
@@ -9496,7 +9534,7 @@ var import_jsx_runtime17 = require("react/jsx-runtime");
 var LoadingOverlay = (props) => {
   const { children, loading = true, ...rest } = props;
   const [presenceProps, rootProps] = (0, import_presence.splitPresenceProps)(rest);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react131.chakra.div, { ...rootProps, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react130.chakra.div, { ...rootProps, children }) });
 };
 var LoadingOverlayRoot = withProvider3(
   LoadingOverlay,
@@ -9518,16 +9556,16 @@ __export(navbar_exports, {
   Link: () => NavbarLink,
   Root: () => NavbarRoot
 });
-var import_react133 = require("react");
+var import_react132 = require("react");
 var import_navbar = require("@saas-ui/core/navbar");
 
 // src/components/navbar/navbar.context.ts
-var import_react132 = require("@chakra-ui/react");
+var import_react131 = require("@chakra-ui/react");
 var {
   withProvider: withProvider4,
   withContext: withContext5,
   useStyles: useNavbarStyles
-} = (0, import_react132.createSlotRecipeContext)({
+} = (0, import_react131.createSlotRecipeContext)({
   key: "suiNavbar"
 });
 
@@ -9550,7 +9588,7 @@ var NavbarItem = withContext5(
   "item"
 );
 var NavbarLink = withContext5(
-  (0, import_react133.forwardRef)((props, ref) => {
+  (0, import_react132.forwardRef)((props, ref) => {
     const Link2 = useLink();
     const { active, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_navbar.Navbar.Link, { asChild: true, ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Link2, { "data-active": active ? "" : void 0, ...props }) });
@@ -9562,10 +9600,10 @@ var NavbarLink = withContext5(
 );
 
 // src/components/number-input/number-input.tsx
-var import_react134 = require("react");
-var import_react135 = require("@chakra-ui/react");
+var import_react133 = require("react");
+var import_react134 = require("@chakra-ui/react");
 var import_jsx_runtime19 = require("react/jsx-runtime");
-var NumberInput = (0, import_react134.forwardRef)(
+var NumberInput = (0, import_react133.forwardRef)(
   function NumberInput2(props, ref) {
     const {
       hideControls,
@@ -9575,11 +9613,11 @@ var NumberInput = (0, import_react134.forwardRef)(
       rootRef,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react135.NumberInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(InputGroup, { startElement, endElement, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react135.NumberInput.Input, { ref, ...inputProps }) }),
-      !hideControls && !endElement ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react135.NumberInput.Control, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react135.NumberInput.IncrementTrigger, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react135.NumberInput.DecrementTrigger, {})
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react134.NumberInput.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(InputGroup, { startElement, endElement, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react134.NumberInput.Input, { ref, ...inputProps }) }),
+      !hideControls && !endElement ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react134.NumberInput.Control, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react134.NumberInput.IncrementTrigger, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react134.NumberInput.DecrementTrigger, {})
       ] }) : null
     ] });
   }
@@ -9605,78 +9643,78 @@ __export(menu_exports, {
   Trigger: () => MenuTrigger,
   TriggerItem: () => MenuTriggerItem
 });
-var import_react136 = require("react");
-var import_react137 = require("@chakra-ui/react");
+var import_react135 = require("react");
+var import_react136 = require("@chakra-ui/react");
 var import_jsx_runtime20 = require("react/jsx-runtime");
-var MenuContent = (0, import_react136.forwardRef)(
+var MenuContent = (0, import_react135.forwardRef)(
   function MenuContent2(props, ref) {
     const { portalled = true, portalRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.Content, { ref, ...rest }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.Content, { ref, ...rest }) }) });
   }
 );
-var MenuArrow = (0, import_react136.forwardRef)(
+var MenuArrow = (0, import_react135.forwardRef)(
   function MenuArrow2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ArrowTip, {}) });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.ArrowTip, {}) });
   }
 );
-var MenuCheckboxItem = (0, import_react136.forwardRef)(function MenuCheckboxItem2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.CheckboxItem, { ref, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemIndicator, { hidden: false, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckIcon, {}) }),
+var MenuCheckboxItem = (0, import_react135.forwardRef)(function MenuCheckboxItem2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react136.Menu.CheckboxItem, { ref, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.ItemIndicator, { hidden: false, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckIcon, {}) }),
     props.children
   ] });
 });
-var MenuRadioItem = (0, import_react136.forwardRef)(
+var MenuRadioItem = (0, import_react135.forwardRef)(
   function MenuRadioItem2(props, ref) {
     const { children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.RadioItem, { ps: "8", ref, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.AbsoluteCenter, { axis: "horizontal", left: "4", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckIcon, {}) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemText, { children })
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react136.Menu.RadioItem, { ps: "8", ref, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.AbsoluteCenter, { axis: "horizontal", left: "4", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CheckIcon, {}) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.ItemText, { children })
     ] });
   }
 );
-var MenuItemGroup = (0, import_react136.forwardRef)(
+var MenuItemGroup = (0, import_react135.forwardRef)(
   function MenuItemGroup2(props, ref) {
     const { title, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.ItemGroup, { ref, ...rest, children: [
-      title && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react137.Menu.ItemGroupLabel, { userSelect: "none", children: title }),
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react136.Menu.ItemGroup, { ref, ...rest, children: [
+      title && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react136.Menu.ItemGroupLabel, { userSelect: "none", children: title }),
       children
     ] });
   }
 );
-var MenuTriggerItem = (0, import_react136.forwardRef)(
+var MenuTriggerItem = (0, import_react135.forwardRef)(
   function MenuTriggerItem2(props, ref) {
     const { startIcon, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react137.Menu.TriggerItem, { ref, ...rest, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react136.Menu.TriggerItem, { ref, ...rest, children: [
       startIcon,
       children,
       /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronRightIcon, {})
     ] });
   }
 );
-var MenuButton = (0, import_react136.forwardRef)(
+var MenuButton = (0, import_react135.forwardRef)(
   function MenuButton2(props, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuTrigger, { ref, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Button, { ...props }) });
   }
 );
-var MenuRadioItemGroup = import_react137.Menu.RadioItemGroup;
-var MenuContextTrigger = import_react137.Menu.ContextTrigger;
-var MenuRoot = import_react137.Menu.Root;
-var MenuSeparator = import_react137.Menu.Separator;
-var MenuContext = import_react137.Menu.Context;
-var MenuItem = import_react137.Menu.Item;
-var MenuItemText = import_react137.Menu.ItemText;
-var MenuItemCommand = import_react137.Menu.ItemCommand;
-var MenuTrigger = import_react137.Menu.Trigger;
+var MenuRadioItemGroup = import_react136.Menu.RadioItemGroup;
+var MenuContextTrigger = import_react136.Menu.ContextTrigger;
+var MenuRoot = import_react136.Menu.Root;
+var MenuSeparator = import_react136.Menu.Separator;
+var MenuContext = import_react136.Menu.Context;
+var MenuItem = import_react136.Menu.Item;
+var MenuItemText = import_react136.Menu.ItemText;
+var MenuItemCommand = import_react136.Menu.ItemCommand;
+var MenuTrigger = import_react136.Menu.Trigger;
 
 // src/components/password-input/password-input.tsx
-var import_react140 = require("react");
-var import_react141 = require("@chakra-ui/react");
+var import_react139 = require("react");
+var import_react140 = require("@chakra-ui/react");
 
 // ../../node_modules/react-icons/lib/iconBase.mjs
-var import_react139 = __toESM(require("react"), 1);
+var import_react138 = __toESM(require("react"), 1);
 
 // ../../node_modules/react-icons/lib/iconContext.mjs
-var import_react138 = __toESM(require("react"), 1);
+var import_react137 = __toESM(require("react"), 1);
 var DefaultContext = {
   color: void 0,
   size: void 0,
@@ -9684,7 +9722,7 @@ var DefaultContext = {
   style: void 0,
   attr: void 0
 };
-var IconContext = import_react138.default.createContext && /* @__PURE__ */ import_react138.default.createContext(DefaultContext);
+var IconContext = import_react137.default.createContext && /* @__PURE__ */ import_react137.default.createContext(DefaultContext);
 
 // ../../node_modules/react-icons/lib/iconBase.mjs
 var _excluded = ["attr", "size", "title"];
@@ -9773,12 +9811,12 @@ function _toPrimitive(t, r) {
   return ("string" === r ? String : Number)(t);
 }
 function Tree2Element(tree) {
-  return tree && tree.map((node, i) => /* @__PURE__ */ import_react139.default.createElement(node.tag, _objectSpread({
+  return tree && tree.map((node, i) => /* @__PURE__ */ import_react138.default.createElement(node.tag, _objectSpread({
     key: i
   }, node.attr), Tree2Element(node.child)));
 }
 function GenIcon(data) {
-  return (props) => /* @__PURE__ */ import_react139.default.createElement(IconBase, _extends({
+  return (props) => /* @__PURE__ */ import_react138.default.createElement(IconBase, _extends({
     attr: _objectSpread({}, data.attr)
   }, props), Tree2Element(data.child));
 }
@@ -9793,7 +9831,7 @@ function IconBase(props) {
     var className;
     if (conf.className) className = conf.className;
     if (props.className) className = (className ? className + " " : "") + props.className;
-    return /* @__PURE__ */ import_react139.default.createElement("svg", _extends({
+    return /* @__PURE__ */ import_react138.default.createElement("svg", _extends({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
@@ -9805,9 +9843,9 @@ function IconBase(props) {
       height: computedSize,
       width: computedSize,
       xmlns: "http://www.w3.org/2000/svg"
-    }), title && /* @__PURE__ */ import_react139.default.createElement("title", null, title), props.children);
+    }), title && /* @__PURE__ */ import_react138.default.createElement("title", null, title), props.children);
   };
-  return IconContext !== void 0 ? /* @__PURE__ */ import_react139.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
+  return IconContext !== void 0 ? /* @__PURE__ */ import_react138.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
 }
 
 // ../../node_modules/react-icons/lu/index.mjs
@@ -9820,7 +9858,7 @@ function LuEye(props) {
 
 // src/components/password-input/password-input.tsx
 var import_jsx_runtime21 = require("react/jsx-runtime");
-var PasswordInput = (0, import_react140.forwardRef)(
+var PasswordInput = (0, import_react139.forwardRef)(
   function PasswordInput2(props, ref) {
     const {
       rootProps,
@@ -9830,12 +9868,12 @@ var PasswordInput = (0, import_react140.forwardRef)(
       visibilityIcon = { on: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LuEye, {}), off: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LuEyeOff, {}) },
       ...rest
     } = props;
-    const [visible, setVisible] = (0, import_react141.useControllableState)({
+    const [visible, setVisible] = (0, import_react140.useControllableState)({
       value: visibleProp,
       defaultValue: defaultVisible || false,
       onChange: onVisibleChange
     });
-    const inputRef = (0, import_react140.useRef)(null);
+    const inputRef = (0, import_react139.useRef)(null);
     return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       InputGroup,
       {
@@ -9855,10 +9893,10 @@ var PasswordInput = (0, import_react140.forwardRef)(
         ),
         ...rootProps,
         children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-          import_react141.Input,
+          import_react140.Input,
           {
             ...rest,
-            ref: (0, import_react141.mergeRefs)(ref, inputRef),
+            ref: (0, import_react140.mergeRefs)(ref, inputRef),
             type: visible ? "text" : "password"
           }
         )
@@ -9866,10 +9904,10 @@ var PasswordInput = (0, import_react140.forwardRef)(
     );
   }
 );
-var VisibilityTrigger = (0, import_react140.forwardRef)(
+var VisibilityTrigger = (0, import_react139.forwardRef)(
   function VisibilityTrigger2(props, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-      import_react141.IconButton,
+      import_react140.IconButton,
       {
         tabIndex: -1,
         ref,
@@ -9890,27 +9928,27 @@ var VisibilityTrigger = (0, import_react140.forwardRef)(
 var React7 = __toESM(require("react"), 1);
 
 // src/components/persona/persona-primitive.tsx
-var import_react143 = require("react");
-var import_react144 = require("@chakra-ui/react");
+var import_react142 = require("react");
+var import_react143 = require("@chakra-ui/react");
 var import_utils8 = require("@saas-ui/core/utils");
 
 // src/components/persona/persona.context.ts
-var import_react142 = require("@chakra-ui/react");
+var import_react141 = require("@chakra-ui/react");
 var {
   useStyles: usePersonaStyles,
   withProvider: withProvider5,
   withContext: withContext6
-} = (0, import_react142.createSlotRecipeContext)({
+} = (0, import_react141.createSlotRecipeContext)({
   key: "suiPersona"
 });
 
 // src/components/persona/persona-primitive.tsx
 var import_jsx_runtime22 = require("react/jsx-runtime");
 var PersonaRoot = withProvider5(
-  (0, import_react143.forwardRef)((props, ref) => {
+  (0, import_react142.forwardRef)((props, ref) => {
     const { outOfOffice, presence, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      import_react144.chakra.div,
+      import_react143.chakra.div,
       {
         ref,
         ...rest,
@@ -9927,7 +9965,7 @@ var PersonaRoot = withProvider5(
   }),
   "root"
 );
-var PersonaAvatar = (0, import_react143.forwardRef)(
+var PersonaAvatar = (0, import_react142.forwardRef)(
   (props, ref) => {
     const {
       name,
@@ -9940,10 +9978,10 @@ var PersonaAvatar = (0, import_react143.forwardRef)(
       children,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_react144.Avatar.Root, { ref, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react144.Avatar.Fallback, { children: getInitials2(name) }),
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_react143.Avatar.Root, { ref, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react143.Avatar.Fallback, { children: getInitials2(name) }),
       /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-        import_react144.Avatar.Image,
+        import_react143.Avatar.Image,
         {
           src,
           srcSet,
@@ -10004,6 +10042,7 @@ var Persona = React7.forwardRef(
         ref,
         outOfOffice: isOutOfOffice,
         presence,
+        size,
         ...rest,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
@@ -10017,7 +10056,7 @@ var Persona = React7.forwardRef(
               onError,
               src,
               srcSet,
-              children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PersonaPresenceBadge, { children: presenceIcon })
+              children: presence ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PersonaPresenceBadge, { children: presenceIcon }) : null
             }
           ),
           !hideDetails && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(PersonaDetails, { children: [
@@ -10061,10 +10100,10 @@ var defaultPresenceOptions = {
 };
 
 // src/components/pin-input/pin-input.tsx
-var import_react145 = require("react");
-var import_react146 = require("@chakra-ui/react");
+var import_react144 = require("react");
+var import_react145 = require("@chakra-ui/react");
 var import_jsx_runtime24 = require("react/jsx-runtime");
-var PinInput = (0, import_react145.forwardRef)(
+var PinInput = (0, import_react144.forwardRef)(
   function PinInput2(props, ref) {
     const {
       pinLength = 4,
@@ -10074,35 +10113,35 @@ var PinInput = (0, import_react145.forwardRef)(
       gap = attached ? 0 : 2,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react146.PinInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react146.PinInput.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react146.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react146.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react146.PinInput.Input, { index }, index)) }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react145.PinInput.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react145.PinInput.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react145.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react145.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react145.PinInput.Input, { index }, index)) }) })
     ] });
   }
 );
 
 // src/components/radio/radio.tsx
-var import_react147 = require("react");
-var import_react148 = require("@chakra-ui/react");
+var import_react146 = require("react");
+var import_react147 = require("@chakra-ui/react");
 var import_jsx_runtime25 = require("react/jsx-runtime");
-var Radio = (0, import_react147.forwardRef)(
+var Radio = (0, import_react146.forwardRef)(
   function Radio2(props, ref) {
     const { children, inputProps, rootRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react148.RadioGroup.Item, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.RadioGroup.ItemIndicator, {}),
-      children && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react148.RadioGroup.ItemText, { children })
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react147.RadioGroup.Item, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react147.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react147.RadioGroup.ItemIndicator, {}),
+      children && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react147.RadioGroup.ItemText, { children })
     ] });
   }
 );
-var RadioGroup = import_react148.RadioGroup.Root;
+var RadioGroup = import_react147.RadioGroup.Root;
 
 // src/components/search-input/search-input.tsx
-var import_react149 = __toESM(require("react"), 1);
-var import_react150 = require("@chakra-ui/react");
+var import_react148 = __toESM(require("react"), 1);
+var import_react149 = require("@chakra-ui/react");
 var import_utils9 = require("@saas-ui/core/utils");
 var import_jsx_runtime26 = require("react/jsx-runtime");
-var SearchInput = (0, import_react149.forwardRef)(
+var SearchInput = (0, import_react148.forwardRef)(
   (props, ref) => {
     const {
       placeholder = "Search",
@@ -10120,18 +10159,18 @@ var SearchInput = (0, import_react149.forwardRef)(
       disabled,
       ...inputProps
     } = props;
-    const inputRef = import_react149.default.useRef(null);
-    const [value, setValue] = (0, import_react150.useControllableState)({
+    const inputRef = import_react148.default.useRef(null);
+    const [value, setValue] = (0, import_react149.useControllableState)({
       value: valueProp,
       defaultValue: defaultValueProp
     });
-    const onChange = import_react149.default.useCallback(
+    const onChange = import_react148.default.useCallback(
       (e) => {
         setValue(e.target.value);
       },
       [setValue]
     );
-    const onKeyDown = import_react149.default.useCallback(
+    const onKeyDown = import_react148.default.useCallback(
       (event) => {
         if (event.key === "Escape") {
           setValue("");
@@ -10148,9 +10187,9 @@ var SearchInput = (0, import_react149.forwardRef)(
     };
     const showReset = value && !props.disabled;
     const endElement = showReset ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SearchInputResetButton, { size, children: resetIcon }) : endElementProp;
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react150.Group, { width, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react149.Group, { width, children: [
       /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-        import_react150.InputElement,
+        import_react149.InputElement,
         {
           placement: "start",
           px: "0",
@@ -10160,7 +10199,7 @@ var SearchInput = (0, import_react149.forwardRef)(
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-        import_react150.Input,
+        import_react149.Input,
         {
           type: "text",
           placeholder,
@@ -10168,7 +10207,7 @@ var SearchInput = (0, import_react149.forwardRef)(
           size,
           value,
           disabled,
-          ref: (0, import_react150.mergeRefs)(ref, inputRef),
+          ref: (0, import_react149.mergeRefs)(ref, inputRef),
           onChange: (0, import_utils9.callAll)(onChange, onChangeProp),
           onKeyDown: (0, import_utils9.callAll)(onKeyDown, onKeyDownProp),
           ps: "calc(var(--input-height) - var(--input-height) / 10)",
@@ -10176,15 +10215,15 @@ var SearchInput = (0, import_react149.forwardRef)(
           ...inputProps
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react150.InputElement, { placement: "end", children: endElement })
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react149.InputElement, { placement: "end", children: endElement })
     ] });
   }
 );
-var SearchInputResetButton = (0, import_react149.forwardRef)(
+var SearchInputResetButton = (0, import_react148.forwardRef)(
   (props, ref) => {
     const { children = /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(CloseIcon, {}), ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-      import_react150.IconButton,
+      import_react149.IconButton,
       {
         ref,
         variant: "ghost",
@@ -10214,23 +10253,23 @@ __export(namespace_exports3, {
 });
 
 // src/components/select/select.tsx
-var import_react151 = require("react");
-var import_react152 = require("@chakra-ui/react");
+var import_react150 = require("react");
+var import_react151 = require("@chakra-ui/react");
 var import_jsx_runtime27 = require("react/jsx-runtime");
-var SelectTrigger = (0, import_react151.forwardRef)(
+var SelectTrigger = (0, import_react150.forwardRef)(
   function SelectTrigger2(props, ref) {
     const { children, clearable, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react152.Select.Control, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.Trigger, { ref, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react152.Select.IndicatorGroup, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react151.Select.Control, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.Trigger, { ref, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react151.Select.IndicatorGroup, { children: [
         clearable && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SelectClearTrigger, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.Indicator, {})
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.Indicator, {})
       ] })
     ] });
   }
 );
-var SelectClearTrigger = (0, import_react151.forwardRef)(function SelectClearTrigger2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+var SelectClearTrigger = (0, import_react150.forwardRef)(function SelectClearTrigger2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     CloseButton,
     {
       size: "xs",
@@ -10241,24 +10280,24 @@ var SelectClearTrigger = (0, import_react151.forwardRef)(function SelectClearTri
     }
   ) });
 });
-var SelectContent = (0, import_react151.forwardRef)(
+var SelectContent = (0, import_react150.forwardRef)(
   function SelectContent2(props, ref) {
     const { portalled = true, portalRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.Content, { ...rest, ref }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.Content, { ...rest, ref }) }) });
   }
 );
-var SelectItem = (0, import_react151.forwardRef)(
+var SelectItem = (0, import_react150.forwardRef)(
   function SelectItem2(props, ref) {
     const { item, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react152.Select.Item, { item, ...rest, ref, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react151.Select.Item, { item, ...rest, ref, children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.ItemIndicator, {})
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.ItemIndicator, {})
     ] }, item.value);
   }
 );
-var SelectValueText = (0, import_react151.forwardRef)(function SelectValueText2(props, ref) {
+var SelectValueText = (0, import_react150.forwardRef)(function SelectValueText2(props, ref) {
   const { children, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.ValueText, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.Context, { children: (select) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.ValueText, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.Context, { children: (select) => {
     const items = select.selectedItems;
     if (items.length === 0) return props.placeholder;
     if (children) return children(items);
@@ -10267,9 +10306,9 @@ var SelectValueText = (0, import_react151.forwardRef)(function SelectValueText2(
     return `${items.length} selected`;
   } }) });
 });
-var SelectRoot = (0, import_react151.forwardRef)(function SelectRoot2(props, ref) {
+var SelectRoot = (0, import_react150.forwardRef)(function SelectRoot2(props, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-    import_react152.Select.Root,
+    import_react151.Select.Root,
     {
       ...props,
       ref,
@@ -10277,21 +10316,21 @@ var SelectRoot = (0, import_react151.forwardRef)(function SelectRoot2(props, ref
     }
   );
 });
-var SelectItemGroup = (0, import_react151.forwardRef)(
+var SelectItemGroup = (0, import_react150.forwardRef)(
   function SelectItemGroup2(props, ref) {
     const { children, label, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react152.Select.ItemGroup, { ...rest, ref, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react152.Select.ItemGroupLabel, { children: label }),
+    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react151.Select.ItemGroup, { ...rest, ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react151.Select.ItemGroupLabel, { children: label }),
       children
     ] });
   }
 );
-var SelectLabel = import_react152.Select.Label;
-var SelectItemText = import_react152.Select.ItemText;
+var SelectLabel = import_react151.Select.Label;
+var SelectItemText = import_react151.Select.ItemText;
 
 // src/components/segmented-control/segmented-control.tsx
-var import_react153 = require("react");
-var import_react154 = require("@chakra-ui/react");
+var import_react152 = require("react");
+var import_react153 = require("@chakra-ui/react");
 var import_jsx_runtime28 = require("react/jsx-runtime");
 function normalize(items) {
   return items.map((item) => {
@@ -10299,19 +10338,19 @@ function normalize(items) {
     return item;
   });
 }
-var SegmentedControl = (0, import_react153.forwardRef)(function SegmentedControl2(props, ref) {
+var SegmentedControl = (0, import_react152.forwardRef)(function SegmentedControl2(props, ref) {
   const { items, ...rest } = props;
-  const data = (0, import_react153.useMemo)(() => normalize(items), [items]);
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react154.SegmentGroup.Root, { ref, ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.SegmentGroup.Indicator, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.For, { each: data, children: (item) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
-      import_react154.SegmentGroup.Item,
+  const data = (0, import_react152.useMemo)(() => normalize(items), [items]);
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react153.SegmentGroup.Root, { ref, ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react153.SegmentGroup.Indicator, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react153.For, { each: data, children: (item) => /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
+      import_react153.SegmentGroup.Item,
       {
         value: item.value,
         disabled: item.disabled,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.SegmentGroup.ItemText, { children: item.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react154.SegmentGroup.ItemHiddenInput, {})
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react153.SegmentGroup.ItemText, { children: item.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react153.SegmentGroup.ItemHiddenInput, {})
         ]
       },
       item.value
@@ -10343,21 +10382,21 @@ __export(sidebar_exports, {
 var import_sidebar = require("@saas-ui/core/sidebar");
 
 // src/components/sidebar/sidebar.context.ts
-var import_react155 = require("@chakra-ui/react");
+var import_react154 = require("@chakra-ui/react");
 var {
   withContext: withContext7,
   useRecipeResult,
   StylesProvider,
   ClassNamesProvider,
   useStyles: useSidebarStyles
-} = (0, import_react155.createSlotRecipeContext)({
+} = (0, import_react154.createSlotRecipeContext)({
   key: "suiSidebar"
 });
 var {
   withProvider: withItemProvider,
   withContext: withItemContext,
   useStyles: useSidebarItemStyles
-} = (0, import_react155.createSlotRecipeContext)({
+} = (0, import_react154.createSlotRecipeContext)({
   key: "suiSidebarNavItem"
 });
 
@@ -10460,99 +10499,99 @@ __export(steps_exports, {
   NextTrigger: () => StepsNextTrigger,
   PrevTrigger: () => StepsPrevTrigger,
   Root: () => StepsRoot,
-  useContext: () => import_react156.useStepsContext
+  useContext: () => import_react155.useStepsContext
 });
-var import_react156 = require("@chakra-ui/react");
+var import_react155 = require("@chakra-ui/react");
 var import_jsx_runtime30 = require("react/jsx-runtime");
 var StepsItem = (props) => {
   const { title, description, completedIcon, icon, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react156.Steps.Item, { ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react156.Steps.Trigger, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
-        import_react156.Steps.Status,
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react155.Steps.Item, { ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react155.Steps.Trigger, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        import_react155.Steps.Status,
         {
           complete: completedIcon || /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CheckIcon, {}),
-          incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Number, {})
+          incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Number, {})
         }
       ) }),
       /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(StepInfo, { title, description })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Separator, {})
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Separator, {})
   ] });
 };
 var StepInfo = (props) => {
   const { title, description } = props;
   if (title && description) {
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react156.Box, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Title, { children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Description, { children: description })
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react155.Box, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Title, { children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Description, { children: description })
     ] });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Title, { children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Description, { children: description })
+    title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Title, { children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Description, { children: description })
   ] });
 };
 var StepsIndicator = (props) => {
-  const { icon = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Number, {}), completedIcon } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Status, { complete: completedIcon, incomplete: icon }) });
+  const { icon = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Number, {}), completedIcon } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.Status, { complete: completedIcon, incomplete: icon }) });
 };
-var StepsList = import_react156.Steps.List;
-var StepsRoot = import_react156.Steps.Root;
-var StepsContent = import_react156.Steps.Content;
-var StepsCompletedContent = import_react156.Steps.CompletedContent;
+var StepsList = import_react155.Steps.List;
+var StepsRoot = import_react155.Steps.Root;
+var StepsContent = import_react155.Steps.Content;
+var StepsCompletedContent = import_react155.Steps.CompletedContent;
 var StepsNextTrigger = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.NextTrigger, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.NextTrigger, { ...props });
 };
 var StepsPrevTrigger = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.PrevTrigger, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react155.Steps.PrevTrigger, { ...props });
 };
 
 // src/components/switch/switch.tsx
-var import_react157 = require("@chakra-ui/react");
-var import_react158 = require("react");
+var import_react156 = require("@chakra-ui/react");
+var import_react157 = require("react");
 var import_jsx_runtime31 = require("react/jsx-runtime");
-var Switch = (0, import_react158.forwardRef)(
+var Switch = (0, import_react157.forwardRef)(
   function Switch2(props, ref) {
     const { inputProps, children, rootRef, trackLabel, thumbLabel, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react157.Switch.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react157.Switch.Control, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
-        trackLabel && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
+    return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react156.Switch.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react156.Switch.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react156.Switch.Control, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react156.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react156.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
+        trackLabel && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react156.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
       ] }),
-      children != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.Label, { children })
+      children != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react156.Switch.Label, { children })
     ] });
   }
 );
 
 // src/components/toaster/toaster.tsx
-var import_react159 = require("@chakra-ui/react");
+var import_react158 = require("@chakra-ui/react");
 var import_jsx_runtime32 = require("react/jsx-runtime");
-var toast = (0, import_react159.createToaster)({
+var toast = (0, import_react158.createToaster)({
   placement: "bottom-end",
   pauseOnPageIdle: true
 });
 var Toaster = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Toaster, { toaster: toast, insetInline: { mdDown: "4" }, children: (toast2) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Toaster, { toaster: toast, insetInline: { mdDown: "4" }, children: (toast2) => {
     var _a7;
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react159.Toast.Root, { width: { md: "sm" }, children: [
-      toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Spinner, { size: "sm", color: "colorPalette.solid" }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Toast.Indicator, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react159.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
-        toast2.title && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Toast.Title, { children: toast2.title }),
-        toast2.description && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Toast.Description, { children: toast2.description })
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react158.Toast.Root, { width: { md: "sm" }, children: [
+      toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Spinner, { size: "sm", color: "colorPalette.solid" }) : /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Toast.Indicator, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react158.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
+        toast2.title && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Toast.Title, { children: toast2.title }),
+        toast2.description && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Toast.Description, { children: toast2.description })
       ] }),
-      toast2.action && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Toast.ActionTrigger, { children: toast2.action.label }),
-      ((_a7 = toast2.meta) == null ? void 0 : _a7.closable) && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react159.Toast.CloseTrigger, {})
+      toast2.action && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Toast.ActionTrigger, { children: toast2.action.label }),
+      ((_a7 = toast2.meta) == null ? void 0 : _a7.closable) && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react158.Toast.CloseTrigger, {})
     ] });
   } }) });
 };
 
 // src/components/tooltip/tooltip.tsx
-var import_react160 = require("react");
-var import_react161 = require("@chakra-ui/react");
+var import_react159 = require("react");
+var import_react160 = require("@chakra-ui/react");
 var import_jsx_runtime33 = require("react/jsx-runtime");
-var Tooltip = (0, import_react160.forwardRef)(
+var Tooltip = (0, import_react159.forwardRef)(
   function Tooltip2(props, ref) {
     const {
       showArrow,
@@ -10565,10 +10604,10 @@ var Tooltip = (0, import_react160.forwardRef)(
       ...rest
     } = props;
     if (disabled) return children;
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react161.Tooltip.Root, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Tooltip.Trigger, { asChild: true, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react161.Tooltip.Content, { ref, ...contentProps, children: [
-        showArrow && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react161.Tooltip.ArrowTip, {}) }),
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react160.Tooltip.Root, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react160.Tooltip.Trigger, { asChild: true, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react160.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react160.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react160.Tooltip.Content, { ref, ...contentProps, children: [
+        showArrow && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react160.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react160.Tooltip.ArrowTip, {}) }),
         content
       ] }) }) })
     ] });