@saas-ui/react 3.0.0-next.0 → 3.0.0-next.2

package/dist/index.cjs

@@ -34,34 +34,51 @@ __export(index_exports, {
   ActionBar: () => action_bar_exports,
   Alert: () => Alert,
   AppShell: () => AppShell,
+  AspectRatio: () => import_aspect_ratio.AspectRatio,
   Avatar: () => Avatar,
   AvatarGroup: () => AvatarGroup,
+  BackButton: () => BackButton,
   Badge: () => import_badge3.Badge,
   BadgePropsProvider: () => import_badge3.BadgePropsProvider,
+  Bleed: () => import_bleed.Bleed,
   Blockquote: () => Blockquote,
+  Box: () => import_box3.Box,
   Breadcrumb: () => breadcrumb_exports,
   Button: () => import_button.Button,
   ButtonGroup: () => import_button3.ButtonGroup,
   Card: () => import_card.Card,
+  Center: () => import_center2.Center,
   Checkbox: () => Checkbox,
   CheckboxCard: () => CheckboxCard,
   Checkmark: () => import_checkmark3.Checkmark,
+  ClientOnly: () => import_client_only.ClientOnly,
   Clipboard: () => clipboard_exports,
   CloseButton: () => CloseButton,
   Code: () => import_code.Code,
   Collapsible: () => import_collapsible.Collapsible,
+  ColorPicker: () => import_color_picker.ColorPicker,
+  ColorSwatch: () => import_color_swatch.ColorSwatch,
   Command: () => Command,
   Container: () => import_container.Container,
   DataList: () => import_data_list.DataList,
   Dialog: () => dialog_exports,
   Drawer: () => drawer_exports,
   Editable: () => import_editable.Editable,
+  Em: () => import_typography4.Em,
   EmptyState: () => EmptyState,
+  EnvironmentProvider: () => import_env.EnvironmentProvider,
   Field: () => import_field.Field,
   Fieldset: () => import_fieldset.Fieldset,
   FileUpload: () => file_upload_exports,
+  Float: () => import_float.Float,
+  FocusTrap: () => import_focus_trap.FocusTrap,
+  FormatByte: () => import_format2.FormatByte,
+  FormatNumber: () => import_format2.FormatNumber,
+  Grid: () => import_grid.Grid,
   GridList: () => grid_list_exports,
+  Group: () => import_group3.Group,
   Heading: () => import_typography.Heading,
+  Highlight: () => import_highlight.Highlight,
   HoverCard: () => hover_card_exports,
   Icon: () => import_icon2.Icon,
   IconBadge: () => IconBadge,
@@ -71,10 +88,10 @@ __export(index_exports, {
   Input: () => import_input2.Input,
   InputAddon: () => import_input2.InputAddon,
   InputElement: () => import_input2.InputElement,
-  InputGroup: () => InputGroup,
+  InputGroup: () => import_input2.InputGroup,
   InputPropsProvider: () => import_input2.InputPropsProvider,
   Kbd: () => import_kbd.Kbd,
-  Link: () => Link2,
+  Link: () => Link,
   List: () => import_list.List,
   Loader: () => import_loader.Loader,
   LoadingOverlay: () => loading_overlay_exports,
@@ -83,22 +100,27 @@ __export(index_exports, {
   NativeSelect: () => NativeSelect,
   Navbar: () => navbar_exports,
   NumberInput: () => NumberInput,
+  Page: () => page_exports,
   Pagination: () => pagination_exports,
   PasswordInput: () => PasswordInput,
   Persona: () => Persona,
   PersonaAvatar: () => PersonaAvatar2,
   PinInput: () => PinInput,
   Popover: () => popover_exports,
+  Portal: () => import_portal9.Portal,
+  Presence: () => import_presence3.Presence,
   Progress: () => import_progress.Progress,
   ProgressCircle: () => import_progress_circle.ProgressCircle,
+  QrCode: () => import_qr_code.QrCode,
   Radio: () => Radio,
   RadioCard: () => radio_card_exports,
-  RadioGroup: () => RadioGroup,
+  RadioGroup: () => import_radio_group2.RadioGroup,
   RatingGroup: () => import_rating_group.RatingGroup,
   SearchInput: () => SearchInput,
   SegmentedControl: () => SegmentedControl,
   Select: () => namespace_exports,
   Separator: () => import_separator.Separator,
+  Show: () => import_show.Show,
   Sidebar: () => sidebar_exports,
   Skeleton: () => Skeleton,
   SkeletonCircle: () => SkeletonCircle,
@@ -106,32 +128,41 @@ __export(index_exports, {
   SkipNavContent: () => import_skip_nav.SkipNavContent,
   SkipNavLink: () => import_skip_nav.SkipNavLink,
   Slider: () => Slider,
+  Spacer: () => import_spacer.Spacer,
   Spinner: () => Spinner,
+  Stack: () => import_stack3.Stack,
   Stat: () => stat_exports,
   Status: () => Status,
   Steps: () => steps_exports,
+  Strong: () => import_typography4.Strong,
   SuiContext: () => SuiContext,
   SuiProvider: () => SuiProvider,
   Switch: () => Switch,
   Table: () => import_table.Table,
   Tabs: () => import_tabs.Tabs,
   Tag: () => Tag,
+  Text: () => import_typography4.Text,
   Textarea: () => import_textarea.Textarea,
   Timeline: () => import_timeline.Timeline,
   Toaster: () => Toaster,
+  Toggle: () => import_toggle.Toggle,
   ToggleTip: () => ToggleTip,
   Tooltip: () => Tooltip,
-  createSystem: () => import_react84.createSystem,
+  VisuallyHidden: () => import_visually_hidden.VisuallyHidden,
+  Wrap: () => import_wrap.Wrap,
+  createSystem: () => import_react88.createSystem,
   defaultConfig: () => defaultConfig,
-  defaultPresenceOptions: () => defaultPresenceOptions,
+  defaultPersonaPresenceOptions: () => defaultPersonaPresenceOptions,
   defaultSystem: () => defaultSystem,
   toast: () => toast,
   useDataListStyles: () => import_data_list.useDataListStyles,
+  useEnvironmentContext: () => import_env.useEnvironmentContext,
   useFieldContext: () => import_field.useFieldContext,
   useFieldStyles: () => import_field.useFieldStyles,
   useFieldsetContext: () => import_fieldset.useFieldsetContext,
   useFileUploadContext: () => import_file_upload2.useFileUploadContext,
   useLink: () => useLink,
+  usePageStyles: () => usePageStyles,
   useSidebar: () => import_sidebar2.useSidebar,
   useSidebarItemStyles: () => useSidebarItemStyles,
   useSidebarStyles: () => useSidebarStyles,
@@ -6140,7 +6171,7 @@ var radioCardSlotRecipe = (0, import_styled_system51.defineSlotRecipe)({
   }
 });
 
-// src/components/radio/radio-group.recipe.ts
+// src/components/radio-group/radio-group.recipe.ts
 var import_anatomy29 = require("@chakra-ui/react/anatomy");
 var import_styled_system52 = require("@chakra-ui/react/styled-system");
 var _a5, _b5, _c4, _d4, _e4, _f4, _g4, _h2, _i2, _j2, _k2, _l2, _m2, _n2;
@@ -9350,7 +9381,7 @@ defaultConfig.utilities = Object.assign(
 var defaultSystem = (0, import_react31.createSystem)(defaultConfig);
 
 // src/index.ts
-var import_react84 = require("@chakra-ui/react");
+var import_react88 = require("@chakra-ui/react");
 
 // src/provider/sui-provider.tsx
 var React = __toESM(require("react"), 1);
@@ -9511,6 +9542,13 @@ var InfoIcon = createIcon({
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 8h.01" })
   ] })
 });
+var ArrowLeftIcon = createIcon({
+  displayName: "ArrowLeftIcon",
+  path: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("line", { x1: "19", y1: "12", x2: "5", y2: "12" }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("polyline", { points: "12 19 5 12 12 5" })
+  ] })
+});
 
 // src/components/accordion/accordion.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
@@ -9718,20 +9756,59 @@ var AvatarGroup = (0, import_react39.forwardRef)(
 // src/components/badge/index.ts
 var import_badge3 = require("@chakra-ui/react/badge");
 
-// src/components/blockquote/blockquote.tsx
-var React3 = __toESM(require("react"), 1);
-var import_react40 = require("@chakra-ui/react");
+// src/components/back-button/back-button.tsx
+var import_react41 = require("react");
+var import_react42 = require("@chakra-ui/react");
+
+// src/components/link/link.tsx
+var import_react40 = __toESM(require("react"), 1);
+var import_link = require("@chakra-ui/react/link");
 var import_jsx_runtime10 = require("react/jsx-runtime");
-var Blockquote = React3.forwardRef(
+var Link = import_react40.default.forwardRef(
+  (props, ref) => {
+    const LinkComponent = useLink();
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_link.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(LinkComponent, { ref, ...props }) });
+  }
+);
+Link.displayName = "Link";
+
+// src/components/back-button/back-button.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var BackButton = (0, import_react41.forwardRef)(
+  (props, ref) => {
+    const { href, variant = "ghost", mr = 2, children, ...rest } = props;
+    let content = children || /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ArrowLeftIcon, {});
+    if (href) {
+      content = /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Link, { href, children: content });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      import_react42.IconButton,
+      {
+        ref,
+        "aria-label": "Go back",
+        variant,
+        mr,
+        ...rest,
+        children: content
+      }
+    );
+  }
+);
+
+// src/components/blockquote/blockquote.tsx
+var React4 = __toESM(require("react"), 1);
+var import_react43 = require("@chakra-ui/react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var Blockquote = React4.forwardRef(
   function Blockquote2(props, ref) {
     const { children, cite, citeUrl, showDash, icon, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react40.Blockquote.Root, { ref, ...rest, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react43.Blockquote.Root, { ref, ...rest, children: [
       icon,
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react40.Blockquote.Content, { cite: citeUrl, children }),
-      cite && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react40.Blockquote.Caption, { children: [
-        showDash ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx_runtime10.Fragment, { children: "\u2014" }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react43.Blockquote.Content, { cite: citeUrl, children }),
+      cite && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react43.Blockquote.Caption, { children: [
+        showDash ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_jsx_runtime12.Fragment, { children: "\u2014" }) : null,
         " ",
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("cite", { children: cite })
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("cite", { children: cite })
       ] })
     ] });
   }
@@ -9742,26 +9819,26 @@ var breadcrumb_exports = {};
 __export(breadcrumb_exports, {
   CurrentLink: () => CurrentLink,
   Ellipsis: () => Ellipsis,
-  Link: () => Link,
+  Link: () => Link2,
   Root: () => Root3
 });
-var import_react41 = require("react");
+var import_react44 = require("react");
 var import_breadcrumb = require("@chakra-ui/react/breadcrumb");
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var Root3 = (0, import_react41.forwardRef)(
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var Root3 = (0, import_react44.forwardRef)(
   function BreadcrumbRoot(props, ref) {
     const { separator = "/", separatorGap, children, ...rest } = props;
-    const validChildren = import_react41.Children.toArray(children).filter(import_react41.isValidElement);
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_breadcrumb.Breadcrumb.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_breadcrumb.Breadcrumb.List, { gap: separatorGap, children: validChildren.map((child, index) => {
+    const validChildren = import_react44.Children.toArray(children).filter(import_react44.isValidElement);
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_breadcrumb.Breadcrumb.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_breadcrumb.Breadcrumb.List, { gap: separatorGap, children: validChildren.map((child, index) => {
       const last = index === validChildren.length - 1;
-      return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react41.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_breadcrumb.Breadcrumb.Item, { children: child }),
-        !last && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_breadcrumb.Breadcrumb.Separator, { children: separator })
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_react44.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_breadcrumb.Breadcrumb.Item, { children: child }),
+        !last && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_breadcrumb.Breadcrumb.Separator, { children: separator })
       ] }, index);
     }) }) });
   }
 );
-var Link = import_breadcrumb.Breadcrumb.Link;
+var Link2 = import_breadcrumb.Breadcrumb.Link;
 var CurrentLink = import_breadcrumb.Breadcrumb.CurrentLink;
 var Ellipsis = import_breadcrumb.Breadcrumb.Ellipsis;
 
@@ -9772,16 +9849,16 @@ var import_button3 = require("@chakra-ui/react/button");
 var import_card = require("@chakra-ui/react/card");
 
 // src/components/checkbox/checkbox.tsx
-var import_react42 = require("react");
+var import_react45 = require("react");
 var import_checkbox = require("@chakra-ui/react/checkbox");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var Checkbox = (0, import_react42.forwardRef)(
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var Checkbox = (0, import_react45.forwardRef)(
   function Checkbox2(props, ref) {
     const { icon, children, inputProps, rootRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_checkbox.Checkbox.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_checkbox.Checkbox.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_checkbox.Checkbox.Control, { children: icon || /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_checkbox.Checkbox.Indicator, {}) }),
-      children != null && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_checkbox.Checkbox.Label, { children })
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_checkbox.Checkbox.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_checkbox.Checkbox.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_checkbox.Checkbox.Control, { children: icon || /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_checkbox.Checkbox.Indicator, {}) }),
+      children != null && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_checkbox.Checkbox.Label, { children })
     ] });
   }
 );
@@ -9790,10 +9867,10 @@ var Checkbox = (0, import_react42.forwardRef)(
 var import_checkmark3 = require("@chakra-ui/react/checkmark");
 
 // src/components/checkbox-card/checkbox-card.tsx
-var import_react43 = require("react");
+var import_react46 = require("react");
 var import_checkbox_card = require("@chakra-ui/react/checkbox-card");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var CheckboxCard = (0, import_react43.forwardRef)(
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var CheckboxCard = (0, import_react46.forwardRef)(
   function CheckboxCard2(props, ref) {
     const {
       inputProps,
@@ -9801,25 +9878,25 @@ var CheckboxCard = (0, import_react43.forwardRef)(
       description,
       icon,
       addon,
-      indicator = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_checkbox_card.CheckboxCard.Indicator, {}),
+      indicator = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_checkbox_card.CheckboxCard.Indicator, {}),
       indicatorPlacement = "end",
       ...rest
     } = props;
     const hasContent = label || description || icon;
-    const ContentWrapper = indicator ? import_checkbox_card.CheckboxCard.Content : import_react43.Fragment;
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_checkbox_card.CheckboxCard.Root, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_checkbox_card.CheckboxCard.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_checkbox_card.CheckboxCard.Control, { children: [
+    const ContentWrapper = indicator ? import_checkbox_card.CheckboxCard.Content : import_react46.Fragment;
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_checkbox_card.CheckboxCard.Root, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_checkbox_card.CheckboxCard.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_checkbox_card.CheckboxCard.Control, { children: [
         indicatorPlacement === "start" && indicator,
-        hasContent && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(ContentWrapper, { children: [
+        hasContent && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(ContentWrapper, { children: [
           icon,
-          label && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_checkbox_card.CheckboxCard.Label, { children: label }),
-          description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_checkbox_card.CheckboxCard.Description, { children: description }),
+          label && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_checkbox_card.CheckboxCard.Label, { children: label }),
+          description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_checkbox_card.CheckboxCard.Description, { children: description }),
           indicatorPlacement === "inside" && indicator
         ] }),
         indicatorPlacement === "end" && indicator
       ] }),
-      addon && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_checkbox_card.CheckboxCard.Addon, { children: addon })
+      addon && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_checkbox_card.CheckboxCard.Addon, { children: addon })
     ] });
   }
 );
@@ -9834,36 +9911,36 @@ __export(clipboard_exports, {
   Label: () => ClipboardLabel,
   Root: () => ClipboardRoot
 });
-var React4 = __toESM(require("react"), 1);
+var React5 = __toESM(require("react"), 1);
 var import_clipboard = require("@chakra-ui/react/clipboard");
 
 // src/components/input/index.ts
 var import_input2 = require("@chakra-ui/react/input");
 
 // src/components/clipboard/clipboard.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var ClipboardIcon = React4.forwardRef(function ClipboardIndicator(props, ref) {
-  const { children = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CopyIcon, {}), copied = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CheckIcon, {}), ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_clipboard.Clipboard.Indicator, { copied, ...rest, ref, children });
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var ClipboardIcon = React5.forwardRef(function ClipboardIndicator(props, ref) {
+  const { children = /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CopyIcon, {}), copied = /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CheckIcon, {}), ...rest } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_clipboard.Clipboard.Indicator, { copied, ...rest, ref, children });
 });
-var ClipboardCopyText = React4.forwardRef(function ClipboardCopyText2(props, ref) {
+var ClipboardCopyText = React5.forwardRef(function ClipboardCopyText2(props, ref) {
   const { children = "Copy", copied = "Copied", ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_clipboard.Clipboard.Indicator, { copied, ...rest, ref, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_clipboard.Clipboard.Indicator, { copied, ...rest, ref, children });
 });
-var ClipboardButton = React4.forwardRef(function ClipboardButton2(props, ref) {
+var ClipboardButton = React5.forwardRef(function ClipboardButton2(props, ref) {
   const { icon, copiedIcon, copied, children, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_clipboard.Clipboard.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_button.Button, { ref, ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ClipboardIcon, { copied: copiedIcon, children: icon }),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ClipboardCopyText, { copied, children })
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_clipboard.Clipboard.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_button.Button, { ref, ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ClipboardIcon, { copied: copiedIcon, children: icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ClipboardCopyText, { copied, children })
   ] }) });
 });
-var ClipboardIconButton = React4.forwardRef(function ClipboardIconButton2(props, ref) {
+var ClipboardIconButton = React5.forwardRef(function ClipboardIconButton2(props, ref) {
   const { icon, copiedIcon, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_clipboard.Clipboard.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(IconButton, { ref, size: "xs", ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ClipboardIcon, { copied: copiedIcon, children: icon }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_clipboard.Clipboard.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(IconButton, { ref, size: "xs", ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ClipboardIcon, { copied: copiedIcon, children: icon }) }) });
 });
-var ClipboardInput = React4.forwardRef(
+var ClipboardInput = React5.forwardRef(
   function ClipboardInputElement(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_clipboard.Clipboard.Input, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_input2.Input, { ref, ...props }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_clipboard.Clipboard.Input, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_input2.Input, { ref, ...props }) });
   }
 );
 var ClipboardRoot = import_clipboard.Clipboard.Root;
@@ -9885,28 +9962,28 @@ var import_styled_system68 = require("@chakra-ui/react/styled-system");
 var import_kbd = require("@chakra-ui/react/kbd");
 
 // src/components/command/command.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var { withContext: withContext2 } = (0, import_styled_system68.createRecipeContext)({
   key: "suiCommand"
 });
 var Command = (props) => {
   const { children, modifiers, ...rest } = props;
   if (typeof children !== "string") {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children });
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children });
   }
   const keys = children.split(/\s|\+/);
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(StyledCommand, { ...rest, children: keys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Key, { modifiers, size: props.size, children: key }, key)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(StyledCommand, { ...rest, children: keys.map((key) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Key, { modifiers, size: props.size, children: key }, key)) });
 };
 var StyledCommand = withContext2("span");
 var Key = (props) => {
   const { modifiers = ["then", "or", "+"], children, ...rest } = props;
   if (typeof children !== "string") {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children });
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children });
   }
   if (modifiers.includes(children)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { children });
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_kbd.Kbd, { ...rest, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_kbd.Kbd, { ...rest, children });
 };
 
 // src/components/data-list/index.ts
@@ -9930,12 +10007,12 @@ __export(dialog_exports, {
   Title: () => Title,
   Trigger: () => Trigger
 });
-var import_react44 = require("react");
+var import_react47 = require("react");
 var import_dialog = require("@chakra-ui/react/dialog");
 var import_portal2 = require("@chakra-ui/react/portal");
 var import_dialog2 = require("@ark-ui/react/dialog");
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var Content2 = (0, import_react44.forwardRef)(
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var Content2 = (0, import_react47.forwardRef)(
   function DialogContent(props, ref) {
     const {
       children,
@@ -9944,14 +10021,14 @@ var Content2 = (0, import_react44.forwardRef)(
       backdrop = true,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_portal2.Portal, { disabled: !portalled, container: portalRef, children: [
-      backdrop && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_dialog.Dialog.Backdrop, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_dialog.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_dialog.Dialog.Content, { ref, ...rest, asChild: false, children }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_portal2.Portal, { disabled: !portalled, container: portalRef, children: [
+      backdrop && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_dialog.Dialog.Backdrop, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_dialog.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_dialog.Dialog.Content, { ref, ...rest, asChild: false, children }) })
     ] });
   }
 );
-var CloseButton4 = (0, import_react44.forwardRef)(function DialogCloseTrigger(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_dialog.Dialog.CloseTrigger, { ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CloseButton, { size: "sm", ref, children: props.children }) });
+var CloseButton4 = (0, import_react47.forwardRef)(function DialogCloseTrigger(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_dialog.Dialog.CloseTrigger, { ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(CloseButton, { size: "sm", ref, children: props.children }) });
 });
 var CloseTrigger = import_dialog.Dialog.CloseTrigger;
 var Root4 = import_dialog.Dialog.Root;
@@ -9982,51 +10059,51 @@ __export(drawer_exports, {
   Title: () => Title2,
   Trigger: () => Trigger2
 });
-var import_react45 = require("react");
+var import_react48 = require("react");
 var import_dialog3 = require("@ark-ui/react/dialog");
-var import_react46 = require("@chakra-ui/react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var Content3 = (0, import_react45.forwardRef)(
+var import_react49 = require("@chakra-ui/react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var Content3 = (0, import_react48.forwardRef)(
   function DrawerContent(props, ref) {
     const { children, portalled = true, portalRef, offset, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react46.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react46.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react46.Drawer.Content, { ref, ...rest, asChild: false, children }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react49.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react49.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react49.Drawer.Content, { ref, ...rest, asChild: false, children }) }) });
   }
 );
-var CloseButton5 = (0, import_react45.forwardRef)(function DrawerCloseTrigger(props, ref) {
+var CloseButton5 = (0, import_react48.forwardRef)(function DrawerCloseTrigger(props, ref) {
   const { children, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react46.Drawer.CloseTrigger, { ...rest, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CloseButton, { size: "sm", ref, children }) });
-});
-var CloseTrigger2 = import_react46.Drawer.CloseTrigger;
-var Trigger2 = import_react46.Drawer.Trigger;
-var Root5 = import_react46.Drawer.Root;
-var Footer2 = import_react46.Drawer.Footer;
-var Header2 = import_react46.Drawer.Header;
-var Body2 = import_react46.Drawer.Body;
-var Backdrop2 = import_react46.Drawer.Backdrop;
-var Description2 = import_react46.Drawer.Description;
-var Title2 = import_react46.Drawer.Title;
-var ActionTrigger2 = import_react46.Drawer.ActionTrigger;
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react49.Drawer.CloseTrigger, { ...rest, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CloseButton, { size: "sm", ref, children }) });
+});
+var CloseTrigger2 = import_react49.Drawer.CloseTrigger;
+var Trigger2 = import_react49.Drawer.Trigger;
+var Root5 = import_react49.Drawer.Root;
+var Footer2 = import_react49.Drawer.Footer;
+var Header2 = import_react49.Drawer.Header;
+var Body2 = import_react49.Drawer.Body;
+var Backdrop2 = import_react49.Drawer.Backdrop;
+var Description2 = import_react49.Drawer.Description;
+var Title2 = import_react49.Drawer.Title;
+var ActionTrigger2 = import_react49.Drawer.ActionTrigger;
 var Context2 = import_dialog3.DialogContext;
 
 // src/components/editable/index.ts
 var import_editable = require("@chakra-ui/react/editable");
 
 // src/components/empty-state/empty-state.tsx
-var import_react47 = require("react");
-var import_react48 = require("@chakra-ui/react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_react50 = require("react");
+var import_react51 = require("@chakra-ui/react");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var EmptyStateActions = (props) => {
-  const { actions } = (0, import_react48.useEmptyStateStyles)();
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react48.Box, { ...props, css: [actions, props.css] });
+  const { actions } = (0, import_react51.useEmptyStateStyles)();
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react51.Box, { ...props, css: [actions, props.css] });
 };
-var EmptyState = (0, import_react47.forwardRef)(
+var EmptyState = (0, import_react50.forwardRef)(
   function EmptyState2(props, ref) {
     const { title, description, icon, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react48.EmptyState.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_react48.EmptyState.Content, { children: [
-      icon && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react48.EmptyState.Indicator, { children: icon }),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react48.EmptyState.Title, { children: title }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react48.EmptyState.Description, { children: description }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(EmptyStateActions, { children })
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react51.EmptyState.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react51.EmptyState.Content, { children: [
+      icon && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react51.EmptyState.Indicator, { children: icon }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react51.EmptyState.Title, { children: title }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react51.EmptyState.Description, { children: description }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EmptyStateActions, { children })
     ] }) });
   }
 );
@@ -10042,46 +10119,46 @@ __export(file_upload_exports, {
   Root: () => Root6,
   Trigger: () => Trigger3
 });
-var React5 = __toESM(require("react"), 1);
-var import_react49 = require("@chakra-ui/react");
+var React6 = __toESM(require("react"), 1);
+var import_react52 = require("@chakra-ui/react");
 var import_file_upload = require("@chakra-ui/react/file-upload");
 var import_styled_system69 = require("@chakra-ui/react/styled-system");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var Root6 = React5.forwardRef(
+var import_jsx_runtime21 = require("react/jsx-runtime");
+var Root6 = React6.forwardRef(
   function FileUploadRoot(props, ref) {
     const { children, inputProps, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_file_upload.FileUpload.Root, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.HiddenInput, { ref, ...inputProps }),
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_file_upload.FileUpload.Root, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.HiddenInput, { ref, ...inputProps }),
       children
     ] });
   }
 );
-var Dropzone = React5.forwardRef(
+var Dropzone = React6.forwardRef(
   function FileUploadDropzone(props, ref) {
     const { children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.Dropzone, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.DropzoneContent, { children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.Dropzone, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.DropzoneContent, { children }) });
   }
 );
-var Item2 = React5.forwardRef(
+var Item2 = React6.forwardRef(
   function FileUploadItem(props, ref) {
     const { file, showSize, icon, clearable } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_file_upload.FileUpload.Item, { file, ref, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.ItemPreview, { children: icon }),
-      showSize ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_file_upload.FileUpload.ItemContent, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.ItemName, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.ItemSizeText, {})
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.ItemName, { flex: "1" }),
-      clearable && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.ItemDeleteTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CloseButton, { size: "xs" }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_file_upload.FileUpload.Item, { file, ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.ItemPreview, { children: icon }),
+      showSize ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_file_upload.FileUpload.ItemContent, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.ItemName, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.ItemSizeText, {})
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.ItemName, { flex: "1" }),
+      clearable && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.ItemDeleteTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CloseButton, { size: "xs" }) })
     ] });
   }
 );
-var List = React5.forwardRef(
+var List = React6.forwardRef(
   function FileUploadList(props, ref) {
     const { showSize, clearable, files, ...rest } = props;
     const fileUpload = (0, import_file_upload.useFileUploadContext)();
     const acceptedFiles = files != null ? files : fileUpload.acceptedFiles;
     if (acceptedFiles.length === 0) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.ItemGroup, { ref, ...rest, children: acceptedFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.ItemGroup, { ref, ...rest, children: acceptedFiles.map((file) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       Item2,
       {
         file,
@@ -10092,12 +10169,12 @@ var List = React5.forwardRef(
     )) });
   }
 );
-var Input2 = React5.forwardRef(
+var Input2 = React6.forwardRef(
   function FileInput(props, ref) {
     const inputRecipe2 = (0, import_styled_system69.useRecipe)({ key: "input" });
     const [recipeProps, restProps] = inputRecipe2.splitVariantProps(props);
     const { placeholder = "Select file(s)", ...rest } = restProps;
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       import_button.Button,
       {
         unstyled: true,
@@ -10105,17 +10182,17 @@ var Input2 = React5.forwardRef(
         ref,
         ...rest,
         css: [inputRecipe2(recipeProps), props.css],
-        children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_file_upload.FileUpload.Context, { children: ({ acceptedFiles }) => {
+        children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_file_upload.FileUpload.Context, { children: ({ acceptedFiles }) => {
           if (acceptedFiles.length === 1) {
-            return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { children: acceptedFiles[0].name });
+            return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: acceptedFiles[0].name });
           }
           if (acceptedFiles.length > 1) {
-            return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { children: [
+            return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { children: [
               acceptedFiles.length,
               " files"
             ] });
           }
-          return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react49.Span, { color: "fg.subtle", children: placeholder });
+          return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react52.Span, { color: "fg.subtle", children: placeholder });
         } })
       }
     ) });
@@ -10183,19 +10260,19 @@ __export(hover_card_exports, {
   Root: () => Root7,
   Trigger: () => Trigger4
 });
-var React6 = __toESM(require("react"), 1);
+var React7 = __toESM(require("react"), 1);
 var import_hover_card = require("@chakra-ui/react/hover-card");
 var import_portal3 = require("@chakra-ui/react/portal");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var Content4 = React6.forwardRef(
+var import_jsx_runtime22 = require("react/jsx-runtime");
+var Content4 = React7.forwardRef(
   function HoverCardContent(props, ref) {
     const { portalled = true, portalRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_portal3.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_hover_card.HoverCard.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_hover_card.HoverCard.Content, { ref, ...rest }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_portal3.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_hover_card.HoverCard.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_hover_card.HoverCard.Content, { ref, ...rest }) }) });
   }
 );
-var Arrow = React6.forwardRef(
+var Arrow = React7.forwardRef(
   function HoverCardArrow(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_hover_card.HoverCard.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_hover_card.HoverCard.ArrowTip, {}) });
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_hover_card.HoverCard.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_hover_card.HoverCard.ArrowTip, {}) });
   }
 );
 var Root7 = import_hover_card.HoverCard.Root;
@@ -10205,23 +10282,23 @@ var Trigger4 = import_hover_card.HoverCard.Trigger;
 var import_icon2 = require("@chakra-ui/react/icon");
 
 // src/components/icon-badge/icon-badge.tsx
-var React7 = __toESM(require("react"), 1);
-var import_react50 = require("react");
+var React8 = __toESM(require("react"), 1);
+var import_react53 = require("react");
 var import_styled_system71 = require("@chakra-ui/react/styled-system");
 var import_utils6 = require("@saas-ui/core/utils");
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var IconBadge = React7.forwardRef(
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var IconBadge = React8.forwardRef(
   (props, ref) => {
     const { icon, children, ...rest } = props;
     const recipe = (0, import_styled_system71.useRecipe)({ key: "suiIconBadge", recipe: props.recipe });
     const [variantProps, localProps] = recipe.splitVariantProps(rest);
     const styles = recipe(variantProps);
     const element = icon || children;
-    const _children = (0, import_react50.isValidElement)(element) ? (0, import_react50.cloneElement)(element, {
+    const _children = (0, import_react53.isValidElement)(element) ? (0, import_react53.cloneElement)(element, {
       "aria-hidden": true,
       focusable: false
     }) : null;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       import_styled_system71.chakra.div,
       {
         ref,
@@ -10237,37 +10314,11 @@ var IconBadge = React7.forwardRef(
 // src/components/image/index.ts
 var import_image = require("@chakra-ui/react/image");
 
-// src/components/input-group/input-group.tsx
-var import_react51 = require("react");
-var import_group2 = require("@chakra-ui/react/group");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var InputGroup = (0, import_react51.forwardRef)(
-  function InputGroup2(props, ref) {
-    const {
-      startElement,
-      startElementProps,
-      endElement,
-      endElementProps,
-      children,
-      ...rest
-    } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_group2.Group, { ref, display: "flex", ...rest, children: [
-      startElement && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_input2.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
-      (0, import_react51.isValidElement)(children) && (0, import_react51.cloneElement)(children, {
-        ...startElement && { ps: "calc(var(--input-height) - 6px)" },
-        ...endElement && { pe: "calc(var(--input-height) - 6px)" },
-        ...children.props
-      }),
-      endElement && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_input2.InputElement, { placement: "end", ...endElementProps, children: endElement })
-    ] });
-  }
-);
-
 // src/components/info-tip/info-tip.tsx
-var React10 = __toESM(require("react"), 1);
+var React11 = __toESM(require("react"), 1);
 
 // src/components/toggle-tip/toggle-tip.tsx
-var React9 = __toESM(require("react"), 1);
+var React10 = __toESM(require("react"), 1);
 
 // src/components/popover/popover.tsx
 var popover_exports = {};
@@ -10284,23 +10335,23 @@ __export(popover_exports, {
   Title: () => Title3,
   Trigger: () => Trigger5
 });
-var React8 = __toESM(require("react"), 1);
+var React9 = __toESM(require("react"), 1);
 var import_popover = require("@chakra-ui/react/popover");
 var import_portal4 = require("@chakra-ui/react/portal");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-var Content5 = React8.forwardRef(
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var Content5 = React9.forwardRef(
   function PopoverContent(props, ref) {
     const { portalled = true, portalRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_portal4.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_popover.Popover.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_popover.Popover.Content, { ref, ...rest }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_portal4.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_popover.Popover.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_popover.Popover.Content, { ref, ...rest }) }) });
   }
 );
-var Arrow2 = React8.forwardRef(
+var Arrow2 = React9.forwardRef(
   function PopoverArrow(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_popover.Popover.Arrow, { ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_popover.Popover.ArrowTip, {}) });
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_popover.Popover.Arrow, { ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_popover.Popover.ArrowTip, {}) });
   }
 );
-var CloseButton6 = React8.forwardRef(function PopoverCloseTrigger(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+var CloseButton6 = React9.forwardRef(function PopoverCloseTrigger(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_popover.Popover.CloseTrigger,
     {
       position: "absolute",
@@ -10309,7 +10360,7 @@ var CloseButton6 = React8.forwardRef(function PopoverCloseTrigger(props, ref) {
       ...props,
       asChild: true,
       ref,
-      children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(CloseButton, { size: "sm" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CloseButton, { size: "sm" })
     }
   );
 });
@@ -10323,8 +10374,8 @@ var Body3 = import_popover.Popover.Body;
 var Trigger5 = import_popover.Popover.Trigger;
 
 // src/components/toggle-tip/toggle-tip.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var ToggleTip = React9.forwardRef(
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var ToggleTip = React10.forwardRef(
   function ToggleTip2(props, ref) {
     const {
       showArrow,
@@ -10334,9 +10385,9 @@ var ToggleTip = React9.forwardRef(
       portalRef,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(popover_exports.Root, { ...rest, positioning: { ...rest.positioning, gutter: 4 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(popover_exports.Trigger, { asChild: true, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(popover_exports.Root, { ...rest, positioning: { ...rest.positioning, gutter: 4 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(popover_exports.Trigger, { asChild: true, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
         popover_exports.Content,
         {
           width: "auto",
@@ -10347,7 +10398,7 @@ var ToggleTip = React9.forwardRef(
           portalled,
           ref,
           children: [
-            showArrow && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(popover_exports.Arrow, {}),
+            showArrow && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(popover_exports.Arrow, {}),
             content
           ]
         }
@@ -10357,25 +10408,13 @@ var ToggleTip = React9.forwardRef(
 );
 
 // src/components/info-tip/info-tip.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var InfoTip = React10.forwardRef(
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var InfoTip = React11.forwardRef(
   function InfoTip2(props, ref) {
     const { children, icon, "aria-label": ariaLabel = "Info", ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ToggleTip, { content: children, ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(IconButton, { variant: "ghost", "aria-label": ariaLabel, size: "2xs", children: icon != null ? icon : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(InfoIcon, {}) }) });
-  }
-);
-
-// src/components/link/link.tsx
-var import_react52 = __toESM(require("react"), 1);
-var import_link = require("@chakra-ui/react/link");
-var import_jsx_runtime26 = require("react/jsx-runtime");
-var Link2 = import_react52.default.forwardRef(
-  (props, ref) => {
-    const LinkComponent = useLink();
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_link.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(LinkComponent, { ref, ...props }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ToggleTip, { content: children, ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(IconButton, { variant: "ghost", "aria-label": ariaLabel, size: "2xs", children: icon != null ? icon : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(InfoIcon, {}) }) });
   }
 );
-Link2.displayName = "Link";
 
 // src/components/loader/index.ts
 var import_loader = require("@chakra-ui/react/loader");
@@ -10390,15 +10429,15 @@ __export(loading_overlay_exports, {
   Spinner: () => LoadingOverlaySpinner,
   Text: () => LoadingOverlayText
 });
-var import_react55 = require("react");
+var import_react56 = require("react");
 var import_presence = require("@ark-ui/react/presence");
-var import_react56 = require("@chakra-ui/react");
+var import_react57 = require("@chakra-ui/react");
 
 // src/components/spinner/spinner.tsx
-var import_react53 = require("react");
+var import_react54 = require("react");
 var import_spinner = require("@chakra-ui/react/spinner");
 var import_jsx_runtime27 = require("react/jsx-runtime");
-var Spinner = (0, import_react53.forwardRef)(
+var Spinner = (0, import_react54.forwardRef)(
   function Spinner2(props, ref) {
     const { loading, children, ...rest } = props;
     if (loading === false) {
@@ -10409,22 +10448,22 @@ var Spinner = (0, import_react53.forwardRef)(
 );
 
 // src/components/loading-overlay/loading-overlay.context.ts
-var import_react54 = require("@chakra-ui/react");
+var import_react55 = require("@chakra-ui/react");
 var {
   useStyles: useLoadingOverlayStyles,
   withContext: withContext4,
   withProvider: withProvider3
-} = (0, import_react54.createSlotRecipeContext)({
+} = (0, import_react55.createSlotRecipeContext)({
   key: "suiLoadingOverlay"
 });
 
 // src/components/loading-overlay/loading-overlay.tsx
 var import_jsx_runtime28 = require("react/jsx-runtime");
-var LoadingOverlay = (0, import_react55.forwardRef)(
+var LoadingOverlay = (0, import_react56.forwardRef)(
   (props, ref) => {
     const { children, loading = true, ...rest } = props;
     const [presenceProps, rootProps] = (0, import_presence.splitPresenceProps)(rest);
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react56.chakra.div, { ref, ...rootProps, children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react57.chakra.div, { ref, ...rootProps, children }) });
   }
 );
 var LoadingOverlayRoot = withProvider3(
@@ -10450,16 +10489,16 @@ __export(navbar_exports, {
   Link: () => NavbarLink,
   Root: () => NavbarRoot
 });
-var import_react58 = require("react");
+var import_react59 = require("react");
 var import_navbar = require("@saas-ui/core/navbar");
 
 // src/components/navbar/navbar.context.ts
-var import_react57 = require("@chakra-ui/react");
+var import_react58 = require("@chakra-ui/react");
 var {
   withProvider: withProvider4,
   withContext: withContext5,
   useStyles: useNavbarStyles
-} = (0, import_react57.createSlotRecipeContext)({
+} = (0, import_react58.createSlotRecipeContext)({
   key: "suiNavbar"
 });
 
@@ -10482,7 +10521,7 @@ var NavbarItem = withContext5(
   "item"
 );
 var NavbarLink = withContext5(
-  (0, import_react58.forwardRef)((props, ref) => {
+  (0, import_react59.forwardRef)((props, ref) => {
     const Link3 = useLink();
     const { active, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_navbar.Navbar.Link, { asChild: true, ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Link3, { "data-active": active ? "" : void 0, ...props }) });
@@ -10508,10 +10547,10 @@ var NativeSelect = React13.forwardRef(
 );
 
 // src/components/number-input/number-input.tsx
-var import_react59 = require("react");
+var import_react60 = require("react");
 var import_number_input = require("@chakra-ui/react/number-input");
 var import_jsx_runtime31 = require("react/jsx-runtime");
-var NumberInput = (0, import_react59.forwardRef)(
+var NumberInput = (0, import_react60.forwardRef)(
   function NumberInput2(props, ref) {
     const {
       hideControls,
@@ -10523,7 +10562,7 @@ var NumberInput = (0, import_react59.forwardRef)(
     } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_number_input.NumberInput.Root, { ref: rootRef, ...rest, children: [
       /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
-        InputGroup,
+        import_input2.InputGroup,
         {
           startElement,
           endElement,
@@ -10559,29 +10598,29 @@ __export(menu_exports, {
   Trigger: () => MenuTrigger,
   TriggerItem: () => MenuTriggerItem
 });
-var import_react60 = require("react");
+var import_react61 = require("react");
 var import_center = require("@chakra-ui/react/center");
 var import_menu = require("@chakra-ui/react/menu");
 var import_portal5 = require("@chakra-ui/react/portal");
 var import_jsx_runtime32 = require("react/jsx-runtime");
-var MenuContent = (0, import_react60.forwardRef)(
+var MenuContent = (0, import_react61.forwardRef)(
   function MenuContent2(props, ref) {
     const { portalled = true, portalRef, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_portal5.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_menu.Menu.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_menu.Menu.Content, { ref, ...rest }) }) });
   }
 );
-var MenuArrow = (0, import_react60.forwardRef)(
+var MenuArrow = (0, import_react61.forwardRef)(
   function MenuArrow2(props, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_menu.Menu.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_menu.Menu.ArrowTip, {}) });
   }
 );
-var MenuCheckboxItem = (0, import_react60.forwardRef)(function MenuCheckboxItem2(props, ref) {
+var MenuCheckboxItem = (0, import_react61.forwardRef)(function MenuCheckboxItem2(props, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_menu.Menu.CheckboxItem, { ref, ...props, children: [
     /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_menu.Menu.ItemIndicator, { hidden: false, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(CheckIcon, {}) }),
     props.children
   ] });
 });
-var MenuRadioItem = (0, import_react60.forwardRef)(
+var MenuRadioItem = (0, import_react61.forwardRef)(
   function MenuRadioItem2(props, ref) {
     const { children, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_menu.Menu.RadioItem, { ps: "8", ref, ...rest, children: [
@@ -10590,7 +10629,7 @@ var MenuRadioItem = (0, import_react60.forwardRef)(
     ] });
   }
 );
-var MenuItemGroup = (0, import_react60.forwardRef)(
+var MenuItemGroup = (0, import_react61.forwardRef)(
   function MenuItemGroup2(props, ref) {
     const { title, children, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_menu.Menu.ItemGroup, { ref, ...rest, children: [
@@ -10599,7 +10638,7 @@ var MenuItemGroup = (0, import_react60.forwardRef)(
     ] });
   }
 );
-var MenuTriggerItem = (0, import_react60.forwardRef)(
+var MenuTriggerItem = (0, import_react61.forwardRef)(
   function MenuTriggerItem2(props, ref) {
     const { startIcon, children, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_menu.Menu.TriggerItem, { ref, ...rest, children: [
@@ -10609,7 +10648,7 @@ var MenuTriggerItem = (0, import_react60.forwardRef)(
     ] });
   }
 );
-var MenuButton = (0, import_react60.forwardRef)(
+var MenuButton = (0, import_react61.forwardRef)(
   function MenuButton2(props, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(MenuTrigger, { ref, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_button.Button, { ...props }) });
   }
@@ -10624,6 +10663,105 @@ var MenuItemText = import_menu.Menu.ItemText;
 var MenuItemCommand = import_menu.Menu.ItemCommand;
 var MenuTrigger = import_menu.Menu.Trigger;
 
+// src/components/page/page.tsx
+var page_exports = {};
+__export(page_exports, {
+  Body: () => PageBody,
+  Description: () => PageDescription,
+  Header: () => PageHeader,
+  HeaderSection: () => PageHeaderSection,
+  Root: () => PageRoot,
+  Title: () => PageTitle
+});
+var import_react63 = __toESM(require("react"), 1);
+var import_react64 = require("@chakra-ui/react");
+
+// src/components/page/page.context.ts
+var import_react62 = require("@chakra-ui/react");
+var {
+  withProvider: withProvider5,
+  withContext: withContext6,
+  useStyles: usePageStyles,
+  useClassNames
+} = (0, import_react62.createSlotRecipeContext)({
+  key: "suiPage"
+});
+var [PageProvider, usePageContext] = (0, import_react62.createContext)();
+
+// src/components/page/page.tsx
+var import_jsx_runtime33 = require("react/jsx-runtime");
+var PageRoot = withProvider5(
+  (0, import_react63.forwardRef)(function PageRoot2(props, ref) {
+    const { loading, skeleton, children, ...containerProps } = props;
+    const context = {
+      loading,
+      skeleton
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PageProvider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react64.chakra.main, { ref, ...containerProps, children }) });
+  }),
+  "root"
+);
+var PageHeader = withContext6(
+  (0, import_react63.forwardRef)(function PageHeader2(props, ref) {
+    const { nav, title, description, actions, footer, css, ...rest } = props;
+    const styles = usePageStyles();
+    const classNames = useClassNames();
+    let heading;
+    if (title || description) {
+      heading = /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
+        import_react64.chakra.div,
+        {
+          gridArea: "heading",
+          className: classNames.heading,
+          css: styles.heading,
+          children: [
+            typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PageTitle, { children: title }) : title,
+            typeof description === "string" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PageDescription, { children: description }) : description
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react64.chakra.header, { ref, css, ...rest, className: props.className, children: [
+      import_react63.default.isValidElement(nav) ? import_react63.default.cloneElement(nav, {
+        gridArea: "nav"
+      }) : null,
+      heading,
+      import_react63.default.isValidElement(actions) ? import_react63.default.cloneElement(actions, {
+        gridArea: "actions"
+      }) : null,
+      import_react63.default.isValidElement(footer) ? import_react63.default.cloneElement(footer, {
+        gridArea: "footer"
+      }) : null
+    ] });
+  }),
+  "header"
+);
+var PageHeaderSection = withContext6(
+  "div",
+  "section"
+);
+var PageTitle = withContext6(
+  "h2",
+  "title"
+);
+var PageDescription = withContext6(
+  "div",
+  "description"
+);
+var PageBody = withContext6(
+  (0, import_react63.forwardRef)((props, ref) => {
+    const { children, ...rest } = props;
+    const { loading, skeleton } = usePageContext();
+    let content = children;
+    if (loading) {
+      content = skeleton || /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(loading_overlay_exports.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(loading_overlay_exports.Spinner, {}) });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react64.chakra.div, { ref, ...rest, children: content });
+  }),
+  "body"
+);
+PageBody.displayName = "PageBody";
+
 // src/components/pagination/pagination.tsx
 var pagination_exports = {};
 __export(pagination_exports, {
@@ -10638,11 +10776,11 @@ __export(pagination_exports, {
   PrevTrigger: () => PrevTrigger,
   Root: () => Root9
 });
-var import_react61 = require("react");
+var import_react65 = require("react");
 var import_pagination = require("@chakra-ui/react/pagination");
 var import_typography3 = require("@chakra-ui/react/typography");
 var import_utils7 = require("@saas-ui/core/utils");
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var [RootPropsProvider, useRootProps] = (0, import_utils7.createContext)({
   name: "RootPropsProvider"
 });
@@ -10651,51 +10789,51 @@ var variantMap = {
   solid: { default: "outline", ellipsis: "outline", current: "solid" },
   subtle: { default: "ghost", ellipsis: "plain", current: "subtle" }
 };
-var Root9 = (0, import_react61.forwardRef)(
+var Root9 = (0, import_react65.forwardRef)(
   function PaginationRoot(props, ref) {
     const { size = "sm", variant = "outline", ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(RootPropsProvider, { value: { size, variantMap: variantMap[variant] }, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_pagination.Pagination.Root, { ref, type: "button", ...rest }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RootPropsProvider, { value: { size, variantMap: variantMap[variant] }, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_pagination.Pagination.Root, { ref, type: "button", ...rest }) });
   }
 );
-var Ellipsis2 = (0, import_react61.forwardRef)(function PaginationEllipsis(props, ref) {
+var Ellipsis2 = (0, import_react65.forwardRef)(function PaginationEllipsis(props, ref) {
   var _a8;
   const { size, variantMap: variantMap2 } = useRootProps();
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_pagination.Pagination.Ellipsis, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_button.Button, { as: "span", variant: variantMap2.ellipsis, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(EllipsisIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_pagination.Pagination.Ellipsis, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_button.Button, { as: "span", variant: variantMap2.ellipsis, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(EllipsisIcon, {}) }) });
 });
-var Item3 = (0, import_react61.forwardRef)(
+var Item3 = (0, import_react65.forwardRef)(
   function PaginationItem(props, ref) {
     const { page } = (0, import_pagination.usePaginationContext)();
     const { size, variantMap: variantMap2 } = useRootProps();
     const current = page === props.value;
     const variant = current ? variantMap2.current : variantMap2.default;
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_pagination.Pagination.Item, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_button.Button, { variant, size, children: props.value }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_pagination.Pagination.Item, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_button.Button, { variant, size, children: props.value }) });
   }
 );
-var PrevButton = (0, import_react61.forwardRef)(function PaginationPrevTrigger(props, ref) {
+var PrevButton = (0, import_react65.forwardRef)(function PaginationPrevTrigger(props, ref) {
   var _a8;
   const { size, variantMap: variantMap2 } = useRootProps();
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_pagination.Pagination.PrevTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(IconButton, { variant: variantMap2.default, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ChevronLeftIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_pagination.Pagination.PrevTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(IconButton, { variant: variantMap2.default, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ChevronLeftIcon, {}) }) });
 });
-var NextButton = (0, import_react61.forwardRef)(function PaginationNextTrigger(props, ref) {
+var NextButton = (0, import_react65.forwardRef)(function PaginationNextTrigger(props, ref) {
   var _a8;
   const { size, variantMap: variantMap2 } = useRootProps();
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_pagination.Pagination.NextTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(IconButton, { variant: variantMap2.default, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ChevronRightIcon, {}) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_pagination.Pagination.NextTrigger, { ref, asChild: true, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(IconButton, { variant: variantMap2.default, size, children: (_a8 = props.children) != null ? _a8 : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ChevronRightIcon, {}) }) });
 });
 var Items = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_pagination.Pagination.Context, { children: ({ pages }) => pages.map((page, index) => {
-    return page.type === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Ellipsis2, { index, ...props }, index) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Item3, { type: "page", value: page.value, ...props }, index);
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_pagination.Pagination.Context, { children: ({ pages }) => pages.map((page, index) => {
+    return page.type === "ellipsis" ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Ellipsis2, { index, ...props }, index) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Item3, { type: "page", value: page.value, ...props }, index);
   }) });
 };
-var PageText = (0, import_react61.forwardRef)(
+var PageText = (0, import_react65.forwardRef)(
   function PaginationPageText(props, ref) {
     const { format = "compact", ...rest } = props;
     const { page, pages, pageRange, count } = (0, import_pagination.usePaginationContext)();
-    const content = (0, import_react61.useMemo)(() => {
+    const content = (0, import_react65.useMemo)(() => {
       if (format === "short") return `${page} / ${pages.length}`;
       if (format === "compact") return `${page} of ${pages.length}`;
       return `${pageRange.start + 1} - ${pageRange.end} of ${count}`;
     }, [format, page, pages.length, pageRange, count]);
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_typography3.Text, { fontWeight: "medium", ref, ...rest, children: content });
+    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_typography3.Text, { fontWeight: "medium", ref, ...rest, children: content });
   }
 );
 var PrevTrigger = import_pagination.Pagination.PrevTrigger;
@@ -10703,14 +10841,14 @@ var NextTrigger = import_pagination.Pagination.NextTrigger;
 var Context3 = import_pagination.Pagination.Context;
 
 // src/components/password-input/password-input.tsx
-var import_react64 = require("react");
-var import_react65 = require("@chakra-ui/react");
+var import_react68 = require("react");
+var import_react69 = require("@chakra-ui/react");
 
 // ../../node_modules/react-icons/lib/iconBase.mjs
-var import_react63 = __toESM(require("react"), 1);
+var import_react67 = __toESM(require("react"), 1);
 
 // ../../node_modules/react-icons/lib/iconContext.mjs
-var import_react62 = __toESM(require("react"), 1);
+var import_react66 = __toESM(require("react"), 1);
 var DefaultContext = {
   color: void 0,
   size: void 0,
@@ -10718,7 +10856,7 @@ var DefaultContext = {
   style: void 0,
   attr: void 0
 };
-var IconContext = import_react62.default.createContext && /* @__PURE__ */ import_react62.default.createContext(DefaultContext);
+var IconContext = import_react66.default.createContext && /* @__PURE__ */ import_react66.default.createContext(DefaultContext);
 
 // ../../node_modules/react-icons/lib/iconBase.mjs
 var _excluded = ["attr", "size", "title"];
@@ -10807,12 +10945,12 @@ function _toPrimitive(t, r) {
   return ("string" === r ? String : Number)(t);
 }
 function Tree2Element(tree) {
-  return tree && tree.map((node, i) => /* @__PURE__ */ import_react63.default.createElement(node.tag, _objectSpread({
+  return tree && tree.map((node, i) => /* @__PURE__ */ import_react67.default.createElement(node.tag, _objectSpread({
     key: i
   }, node.attr), Tree2Element(node.child)));
 }
 function GenIcon(data) {
-  return (props) => /* @__PURE__ */ import_react63.default.createElement(IconBase, _extends({
+  return (props) => /* @__PURE__ */ import_react67.default.createElement(IconBase, _extends({
     attr: _objectSpread({}, data.attr)
   }, props), Tree2Element(data.child));
 }
@@ -10827,7 +10965,7 @@ function IconBase(props) {
     var className;
     if (conf.className) className = conf.className;
     if (props.className) className = (className ? className + " " : "") + props.className;
-    return /* @__PURE__ */ import_react63.default.createElement("svg", _extends({
+    return /* @__PURE__ */ import_react67.default.createElement("svg", _extends({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
@@ -10839,9 +10977,9 @@ function IconBase(props) {
       height: computedSize,
       width: computedSize,
       xmlns: "http://www.w3.org/2000/svg"
-    }), title && /* @__PURE__ */ import_react63.default.createElement("title", null, title), props.children);
+    }), title && /* @__PURE__ */ import_react67.default.createElement("title", null, title), props.children);
   };
-  return IconContext !== void 0 ? /* @__PURE__ */ import_react63.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
+  return IconContext !== void 0 ? /* @__PURE__ */ import_react67.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
 }
 
 // ../../node_modules/react-icons/lu/index.mjs
@@ -10853,28 +10991,28 @@ function LuEye(props) {
 }
 
 // src/components/password-input/password-input.tsx
-var import_jsx_runtime34 = require("react/jsx-runtime");
-var PasswordInput = (0, import_react64.forwardRef)(
+var import_jsx_runtime35 = require("react/jsx-runtime");
+var PasswordInput = (0, import_react68.forwardRef)(
   function PasswordInput2(props, ref) {
     const {
       rootProps,
       defaultVisible,
       visible: visibleProp,
       onVisibleChange,
-      visibilityIcon = { on: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(LuEye, {}), off: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(LuEyeOff, {}) },
+      visibilityIcon = { on: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(LuEye, {}), off: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(LuEyeOff, {}) },
       ...rest
     } = props;
-    const [visible, setVisible] = (0, import_react65.useControllableState)({
+    const [visible, setVisible] = (0, import_react69.useControllableState)({
       value: visibleProp,
       defaultValue: defaultVisible || false,
       onChange: onVisibleChange
     });
-    const inputRef = (0, import_react64.useRef)(null);
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
-      InputGroup,
+    const inputRef = (0, import_react68.useRef)(null);
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+      import_input2.InputGroup,
       {
         width: "full",
-        endElement: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+        endElement: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           VisibilityTrigger,
           {
             disabled: rest.disabled,
@@ -10888,11 +11026,11 @@ var PasswordInput = (0, import_react64.forwardRef)(
           }
         ),
         ...rootProps,
-        children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           import_input2.Input,
           {
             ...rest,
-            ref: (0, import_react65.mergeRefs)(ref, inputRef),
+            ref: (0, import_react69.mergeRefs)(ref, inputRef),
             type: visible ? "text" : "password"
           }
         )
@@ -10900,9 +11038,9 @@ var PasswordInput = (0, import_react64.forwardRef)(
     );
   }
 );
-var VisibilityTrigger = (0, import_react64.forwardRef)(
+var VisibilityTrigger = (0, import_react68.forwardRef)(
   function VisibilityTrigger2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
       IconButton,
       {
         tabIndex: -1,
@@ -10921,30 +11059,30 @@ var VisibilityTrigger = (0, import_react64.forwardRef)(
 );
 
 // src/components/persona/persona.tsx
-var React17 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 
 // src/components/persona/persona-primitive.tsx
-var import_react67 = require("react");
-var import_react68 = require("@chakra-ui/react");
+var import_react71 = require("react");
+var import_react72 = require("@chakra-ui/react");
 var import_utils8 = require("@saas-ui/core/utils");
 
 // src/components/persona/persona.context.ts
-var import_react66 = require("@chakra-ui/react");
+var import_react70 = require("@chakra-ui/react");
 var {
   useStyles: usePersonaStyles,
-  withProvider: withProvider5,
-  withContext: withContext6
-} = (0, import_react66.createSlotRecipeContext)({
+  withProvider: withProvider6,
+  withContext: withContext7
+} = (0, import_react70.createSlotRecipeContext)({
   key: "suiPersona"
 });
 
 // src/components/persona/persona-primitive.tsx
-var import_jsx_runtime35 = require("react/jsx-runtime");
-var PersonaRoot = withProvider5(
-  (0, import_react67.forwardRef)((props, ref) => {
+var import_jsx_runtime36 = require("react/jsx-runtime");
+var PersonaRoot = withProvider6(
+  (0, import_react71.forwardRef)((props, ref) => {
     const { outOfOffice, presence, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
-      import_react68.chakra.div,
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+      import_react72.chakra.div,
       {
         ref,
         ...rest,
@@ -10961,7 +11099,7 @@ var PersonaRoot = withProvider5(
   }),
   "root"
 );
-var PersonaAvatar = (0, import_react67.forwardRef)(
+var PersonaAvatar = (0, import_react71.forwardRef)(
   (props, ref) => {
     const {
       name,
@@ -10974,31 +11112,31 @@ var PersonaAvatar = (0, import_react67.forwardRef)(
       children,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(Avatar, { ref, ...rest, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Avatar, { ref, ...rest, children });
   }
 );
-var PersonaPresenceBadge = withContext6("span", "presence");
-var PersonaDetails = withContext6(
+var PersonaPresenceBadge = withContext7("span", "presence");
+var PersonaDetails = withContext7(
   "div",
   "details"
 );
-var PersonaLabel = withContext6(
+var PersonaLabel = withContext7(
   "span",
   "label"
 );
 PersonaLabel.displayName = "PersonaLabel";
-var PersonaSecondaryLabel = withContext6(
+var PersonaSecondaryLabel = withContext7(
   "span",
   "secondaryLabel"
 );
-var PersonaTertiaryLabel = withContext6(
+var PersonaTertiaryLabel = withContext7(
   "span",
   "tertiaryLabel"
 );
 
 // src/components/persona/persona.tsx
-var import_jsx_runtime36 = require("react/jsx-runtime");
-var Persona = React17.forwardRef(
+var import_jsx_runtime37 = require("react/jsx-runtime");
+var Persona = React18.forwardRef(
   (props, ref) => {
     const {
       name,
@@ -11021,7 +11159,7 @@ var Persona = React17.forwardRef(
       fallback: fallback2,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
       PersonaRoot,
       {
         ref,
@@ -11030,7 +11168,7 @@ var Persona = React17.forwardRef(
         size,
         ...rest,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
             PersonaAvatar,
             {
               name,
@@ -11042,13 +11180,13 @@ var Persona = React17.forwardRef(
               src,
               srcSet,
               fallback: fallback2,
-              children: presence ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(PersonaPresenceBadge, { children: presenceIcon }) : null
+              children: presence ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(PersonaPresenceBadge, { children: presenceIcon }) : null
             }
           ),
-          !hideDetails && /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(PersonaDetails, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(PersonaLabel, { children: label || name }),
-            secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(PersonaSecondaryLabel, { children: secondaryLabel }),
-            tertiaryLabel && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(PersonaTertiaryLabel, { children: tertiaryLabel }),
+          !hideDetails && /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(PersonaDetails, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(PersonaLabel, { children: label || name }),
+            secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(PersonaSecondaryLabel, { children: secondaryLabel }),
+            tertiaryLabel && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(PersonaTertiaryLabel, { children: tertiaryLabel }),
             children
           ] })
         ]
@@ -11057,12 +11195,12 @@ var Persona = React17.forwardRef(
   }
 );
 Persona.displayName = "Persona";
-var PersonaAvatar2 = React17.forwardRef(function PersonaAvatar3(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Persona, { ref, ...props, hideDetails: true });
+var PersonaAvatar2 = React18.forwardRef(function PersonaAvatar3(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Persona, { ref, ...props, hideDetails: true });
 });
 
 // src/components/persona/presence.ts
-var defaultPresenceOptions = {
+var defaultPersonaPresenceOptions = {
   online: {
     label: "Online",
     color: "presence.online"
@@ -11086,11 +11224,11 @@ var defaultPresenceOptions = {
 };
 
 // src/components/pin-input/pin-input.tsx
-var import_react69 = require("react");
-var import_group3 = require("@chakra-ui/react/group");
+var import_react73 = require("react");
+var import_group2 = require("@chakra-ui/react/group");
 var import_pin_input = require("@chakra-ui/react/pin-input");
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var PinInput = (0, import_react69.forwardRef)(
+var import_jsx_runtime38 = require("react/jsx-runtime");
+var PinInput = (0, import_react73.forwardRef)(
   function PinInput2(props, ref) {
     const {
       pinLength = 4,
@@ -11100,9 +11238,9 @@ var PinInput = (0, import_react69.forwardRef)(
       gap = attached ? 0 : 2,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_pin_input.PinInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_pin_input.PinInput.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_pin_input.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_group3.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_pin_input.PinInput.Input, { index }, index)) }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_pin_input.PinInput.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_pin_input.PinInput.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_pin_input.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_group2.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_pin_input.PinInput.Input, { index }, index)) }) })
     ] });
   }
 );
@@ -11114,21 +11252,24 @@ var import_progress = require("@chakra-ui/react/progress");
 var import_progress_circle = require("@chakra-ui/react/progress-circle");
 
 // src/components/radio/radio.tsx
-var import_react70 = require("react");
+var import_react74 = require("react");
 var import_radio_group = require("@chakra-ui/react/radio-group");
-var import_jsx_runtime38 = require("react/jsx-runtime");
-var Radio = (0, import_react70.forwardRef)(
+var import_jsx_runtime39 = require("react/jsx-runtime");
+var Radio = (0, import_react74.forwardRef)(
   function Radio2(props, ref) {
     const { children, inputProps, rootRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_radio_group.RadioGroup.Item, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_radio_group.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_radio_group.RadioGroup.ItemIndicator, {}),
-      children && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_radio_group.RadioGroup.ItemText, { children })
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_radio_group.RadioGroup.Item, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_group.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_group.RadioGroup.ItemIndicator, {}),
+      children && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_group.RadioGroup.ItemText, { children })
     ] });
   }
 );
 var RadioGroup = import_radio_group.RadioGroup.Root;
 
+// src/components/radio-group/index.ts
+var import_radio_group2 = require("@chakra-ui/react/radio-group");
+
 // src/components/radio-card/radio-card.tsx
 var radio_card_exports = {};
 __export(radio_card_exports, {
@@ -11137,10 +11278,10 @@ __export(radio_card_exports, {
   Label: () => RadioCardLabel,
   Root: () => RadioCardRoot
 });
-var import_react71 = require("react");
+var import_react75 = require("react");
 var import_radio_card = require("@chakra-ui/react/radio-card");
-var import_jsx_runtime39 = require("react/jsx-runtime");
-var RadioCardItem = (0, import_react71.forwardRef)(
+var import_jsx_runtime40 = require("react/jsx-runtime");
+var RadioCardItem = (0, import_react75.forwardRef)(
   function RadioCardItem2(props, ref) {
     const {
       inputProps,
@@ -11148,25 +11289,25 @@ var RadioCardItem = (0, import_react71.forwardRef)(
       description,
       addon,
       icon,
-      indicator = /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_card.RadioCard.ItemIndicator, {}),
+      indicator = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_radio_card.RadioCard.ItemIndicator, {}),
       indicatorPlacement = "end",
       ...rest
     } = props;
     const hasContent = label || description || icon;
-    const ContentWrapper = indicator ? import_radio_card.RadioCard.ItemContent : import_react71.Fragment;
-    return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_radio_card.RadioCard.Item, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_card.RadioCard.ItemHiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(import_radio_card.RadioCard.ItemControl, { children: [
+    const ContentWrapper = indicator ? import_radio_card.RadioCard.ItemContent : import_react75.Fragment;
+    return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_radio_card.RadioCard.Item, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_radio_card.RadioCard.ItemHiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_radio_card.RadioCard.ItemControl, { children: [
         indicatorPlacement === "start" && indicator,
-        hasContent && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(ContentWrapper, { children: [
+        hasContent && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(ContentWrapper, { children: [
           icon,
-          label && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_card.RadioCard.ItemText, { children: label }),
-          description && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_card.RadioCard.ItemDescription, { children: description }),
+          label && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_radio_card.RadioCard.ItemText, { children: label }),
+          description && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_radio_card.RadioCard.ItemDescription, { children: description }),
           indicatorPlacement === "inside" && indicator
         ] }),
         indicatorPlacement === "end" && indicator
       ] }),
-      addon && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_radio_card.RadioCard.ItemAddon, { children: addon })
+      addon && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_radio_card.RadioCard.ItemAddon, { children: addon })
     ] });
   }
 );
@@ -11178,11 +11319,11 @@ var RadioCardItemIndicator = import_radio_card.RadioCard.ItemIndicator;
 var import_rating_group = require("@chakra-ui/react/rating-group");
 
 // src/components/search-input/search-input.tsx
-var import_react72 = __toESM(require("react"), 1);
-var import_react73 = require("@chakra-ui/react");
+var import_react76 = __toESM(require("react"), 1);
+var import_react77 = require("@chakra-ui/react");
 var import_utils9 = require("@saas-ui/core/utils");
-var import_jsx_runtime40 = require("react/jsx-runtime");
-var SearchInput = (0, import_react72.forwardRef)(
+var import_jsx_runtime41 = require("react/jsx-runtime");
+var SearchInput = (0, import_react76.forwardRef)(
   (props, ref) => {
     const {
       placeholder = "Search",
@@ -11191,7 +11332,7 @@ var SearchInput = (0, import_react72.forwardRef)(
       size,
       variant,
       width = "full",
-      icon = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SearchIcon, {}),
+      icon = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SearchIcon, {}),
       resetIcon,
       endElement: endElementProp,
       onChange: onChangeProp,
@@ -11200,18 +11341,18 @@ var SearchInput = (0, import_react72.forwardRef)(
       disabled,
       ...inputProps
     } = props;
-    const inputRef = import_react72.default.useRef(null);
-    const [value, setValue] = (0, import_react73.useControllableState)({
+    const inputRef = import_react76.default.useRef(null);
+    const [value, setValue] = (0, import_react77.useControllableState)({
       value: valueProp,
       defaultValue: defaultValueProp
     });
-    const onChange = import_react72.default.useCallback(
+    const onChange = import_react76.default.useCallback(
       (e) => {
         setValue(e.target.value);
       },
       [setValue]
     );
-    const onKeyDown = import_react72.default.useCallback(
+    const onKeyDown = import_react76.default.useCallback(
       (event) => {
         if (event.key === "Escape") {
           setValue("");
@@ -11227,10 +11368,10 @@ var SearchInput = (0, import_react72.forwardRef)(
       (_a8 = inputRef.current) == null ? void 0 : _a8.focus();
     };
     const showReset = value && !props.disabled;
-    const endElement = showReset ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SearchInputResetButton, { size, children: resetIcon }) : endElementProp;
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_react73.Group, { width, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
-        import_react73.InputElement,
+    const endElement = showReset ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SearchInputResetButton, { size, children: resetIcon }) : endElementProp;
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_react77.Group, { width, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        import_react77.InputElement,
         {
           placement: "start",
           px: "0",
@@ -11239,8 +11380,8 @@ var SearchInput = (0, import_react72.forwardRef)(
           children: icon
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
-        import_react73.Input,
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+        import_react77.Input,
         {
           type: "text",
           placeholder,
@@ -11248,7 +11389,7 @@ var SearchInput = (0, import_react72.forwardRef)(
           size,
           value,
           disabled,
-          ref: (0, import_react73.mergeRefs)(ref, inputRef),
+          ref: (0, import_react77.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)",
@@ -11256,15 +11397,15 @@ var SearchInput = (0, import_react72.forwardRef)(
           ...inputProps
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react73.InputElement, { placement: "end", children: endElement })
+      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react77.InputElement, { placement: "end", children: endElement })
     ] });
   }
 );
-var SearchInputResetButton = (0, import_react72.forwardRef)(
+var SearchInputResetButton = (0, import_react76.forwardRef)(
   (props, ref) => {
-    const { children = /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(CloseIcon, {}), ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
-      import_react73.IconButton,
+    const { children = /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(CloseIcon, {}), ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+      import_react77.IconButton,
       {
         ref,
         variant: "ghost",
@@ -11294,24 +11435,24 @@ __export(namespace_exports, {
 });
 
 // src/components/select/select.tsx
-var import_react74 = require("react");
+var import_react78 = require("react");
 var import_portal6 = require("@chakra-ui/react/portal");
 var import_select2 = require("@chakra-ui/react/select");
-var import_jsx_runtime41 = require("react/jsx-runtime");
-var SelectTrigger = (0, import_react74.forwardRef)(
+var import_jsx_runtime42 = require("react/jsx-runtime");
+var SelectTrigger = (0, import_react78.forwardRef)(
   function SelectTrigger2(props, ref) {
     const { children, clearable, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_select2.Select.Control, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.Trigger, { ref, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_select2.Select.IndicatorGroup, { children: [
-        clearable && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SelectClearTrigger, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.Indicator, {})
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_select2.Select.Control, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.Trigger, { ref, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_select2.Select.IndicatorGroup, { children: [
+        clearable && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(SelectClearTrigger, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.Indicator, {})
       ] })
     ] });
   }
 );
-var SelectClearTrigger = (0, import_react74.forwardRef)(function SelectClearTrigger2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+var SelectClearTrigger = (0, import_react78.forwardRef)(function SelectClearTrigger2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     CloseButton,
     {
       size: "xs",
@@ -11322,24 +11463,24 @@ var SelectClearTrigger = (0, import_react74.forwardRef)(function SelectClearTrig
     }
   ) });
 });
-var SelectContent = (0, import_react74.forwardRef)(
+var SelectContent = (0, import_react78.forwardRef)(
   function SelectContent2(props, ref) {
     const { portalled = true, portalRef, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_portal6.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.Content, { ...rest, ref }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_portal6.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.Content, { ...rest, ref }) }) });
   }
 );
-var SelectItem = (0, import_react74.forwardRef)(
+var SelectItem = (0, import_react78.forwardRef)(
   function SelectItem2(props, ref) {
     const { item, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_select2.Select.Item, { item, ...rest, ref, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_select2.Select.Item, { item, ...rest, ref, children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.ItemIndicator, {})
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.ItemIndicator, {})
     ] }, item.value);
   }
 );
-var SelectValueText = (0, import_react74.forwardRef)(function SelectValueText2(props, ref) {
+var SelectValueText = (0, import_react78.forwardRef)(function SelectValueText2(props, ref) {
   const { children, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.ValueText, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.Context, { children: (select) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.ValueText, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.Context, { children: (select) => {
     const items = select.selectedItems;
     if (items.length === 0) return props.placeholder;
     if (children) return children(items);
@@ -11348,8 +11489,8 @@ var SelectValueText = (0, import_react74.forwardRef)(function SelectValueText2(p
     return `${items.length} selected`;
   } }) });
 });
-var SelectRoot = (0, import_react74.forwardRef)(function SelectRoot2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+var SelectRoot = (0, import_react78.forwardRef)(function SelectRoot2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
     import_select2.Select.Root,
     {
       ...props,
@@ -11358,11 +11499,11 @@ var SelectRoot = (0, import_react74.forwardRef)(function SelectRoot2(props, ref)
     }
   );
 });
-var SelectItemGroup = (0, import_react74.forwardRef)(
+var SelectItemGroup = (0, import_react78.forwardRef)(
   function SelectItemGroup2(props, ref) {
     const { children, label, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_select2.Select.ItemGroup, { ...rest, ref, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_select2.Select.ItemGroupLabel, { children: label }),
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_select2.Select.ItemGroup, { ...rest, ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_select2.Select.ItemGroupLabel, { children: label }),
       children
     ] });
   }
@@ -11374,19 +11515,19 @@ var SelectItemText = import_select2.Select.ItemText;
 var import_separator = require("@chakra-ui/react/separator");
 
 // src/components/skeleton/skeleton.tsx
-var import_react75 = require("react");
+var import_react79 = require("react");
 var import_box = require("@chakra-ui/react/box");
 var import_skeleton = require("@chakra-ui/react/skeleton");
 var import_stack = require("@chakra-ui/react/stack");
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime43 = require("react/jsx-runtime");
 var SkeletonCircle = (props) => {
   const { size, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_box.Circle, { size, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_skeleton.Skeleton, { ...rest }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_box.Circle, { size, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_skeleton.Skeleton, { ...rest }) });
 };
-var SkeletonText = (0, import_react75.forwardRef)(
+var SkeletonText = (0, import_react79.forwardRef)(
   function SkeletonText2(props, ref) {
     const { noOfLines = 3, gap, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_stack.Stack, { gap, width: "full", ref, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_stack.Stack, { gap, width: "full", ref, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
       import_skeleton.Skeleton,
       {
         height: "4",
@@ -11401,29 +11542,29 @@ var SkeletonText = (0, import_react75.forwardRef)(
 var Skeleton = import_skeleton.Skeleton;
 
 // src/components/segmented-control/segmented-control.tsx
-var import_react76 = require("react");
+var import_react80 = require("react");
 var import_for = require("@chakra-ui/react/for");
 var import_segment_group = require("@chakra-ui/react/segment-group");
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 function normalize(items) {
   return items.map((item) => {
     if (typeof item === "string") return { value: item, label: item };
     return item;
   });
 }
-var SegmentedControl = (0, import_react76.forwardRef)(function SegmentedControl2(props, ref) {
+var SegmentedControl = (0, import_react80.forwardRef)(function SegmentedControl2(props, ref) {
   const { items, ...rest } = props;
-  const data = (0, import_react76.useMemo)(() => normalize(items), [items]);
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_segment_group.SegmentGroup.Root, { ref, ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_segment_group.SegmentGroup.Indicator, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_for.For, { each: data, children: (item) => /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+  const data = (0, import_react80.useMemo)(() => normalize(items), [items]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_segment_group.SegmentGroup.Root, { ref, ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_segment_group.SegmentGroup.Indicator, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_for.For, { each: data, children: (item) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
       import_segment_group.SegmentGroup.Item,
       {
         value: item.value,
         disabled: item.disabled,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_segment_group.SegmentGroup.ItemText, { children: item.label }),
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_segment_group.SegmentGroup.ItemHiddenInput, {})
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_segment_group.SegmentGroup.ItemText, { children: item.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_segment_group.SegmentGroup.ItemHiddenInput, {})
         ]
       },
       item.value
@@ -11456,28 +11597,28 @@ __export(sidebar_exports, {
 var import_sidebar = require("@saas-ui/core/sidebar");
 
 // src/components/sidebar/sidebar.context.ts
-var import_react77 = require("@chakra-ui/react");
+var import_react81 = require("@chakra-ui/react");
 var {
-  withContext: withContext7,
+  withContext: withContext8,
   useRecipeResult,
   StylesProvider,
   ClassNamesProvider,
   useStyles: useSidebarStyles
-} = (0, import_react77.createSlotRecipeContext)({
+} = (0, import_react81.createSlotRecipeContext)({
   key: "suiSidebar"
 });
 var {
   withProvider: withItemProvider,
   withContext: withItemContext,
   useStyles: useSidebarItemStyles
-} = (0, import_react77.createSlotRecipeContext)({
+} = (0, import_react81.createSlotRecipeContext)({
   key: "suiSidebarNavItem"
 });
 
 // src/components/sidebar/sidebar.tsx
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 var SidebarProvider = function SidebarProvider2(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_sidebar.Sidebar.Provider, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(RecipeProvider, { ...props, children: props.children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_sidebar.Sidebar.Provider, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(RecipeProvider, { ...props, children: props.children }) });
 };
 function RecipeProvider(props) {
   const { mode } = (0, import_sidebar.useSidebar)();
@@ -11485,49 +11626,49 @@ function RecipeProvider(props) {
     ...props,
     mode
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(StylesProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ClassNamesProvider, { value: classNames, children: props.children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(StylesProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(ClassNamesProvider, { value: classNames, children: props.children }) });
 }
-var SidebarRoot = withContext7(
+var SidebarRoot = withContext8(
   import_sidebar.Sidebar.Root,
   "root"
 );
-var SidebarTrigger = withContext7(
+var SidebarTrigger = withContext8(
   import_sidebar.Sidebar.Trigger,
   "trigger",
   {
     forwardAsChild: true
   }
 );
-var SidebarFlyoutTrigger = withContext7(import_sidebar.Sidebar.FlyoutTrigger, "flyoutTrigger", {
+var SidebarFlyoutTrigger = withContext8(import_sidebar.Sidebar.FlyoutTrigger, "flyoutTrigger", {
   forwardAsChild: true
 });
-var SidebarBackdrop = withContext7(
+var SidebarBackdrop = withContext8(
   import_sidebar.Sidebar.Backdrop,
   "backdrop",
   {
     forwardAsChild: true
   }
 );
-var SidebarHeader = withContext7(
+var SidebarHeader = withContext8(
   import_sidebar.Sidebar.Header,
   "header"
 );
-var SidebarBody = withContext7(
+var SidebarBody = withContext8(
   import_sidebar.Sidebar.Body,
   "body"
 );
-var SidebarFooter = withContext7(
+var SidebarFooter = withContext8(
   import_sidebar.Sidebar.Footer,
   "footer"
 );
-var SidebarTrack = withContext7(
+var SidebarTrack = withContext8(
   import_sidebar.Sidebar.Track,
   "track",
   {
     forwardAsChild: true
   }
 );
-var SidebarGroup = withContext7(
+var SidebarGroup = withContext8(
   import_sidebar.Sidebar.Group,
   "group",
   {
@@ -11536,13 +11677,13 @@ var SidebarGroup = withContext7(
     }
   }
 );
-var SidebarGroupHeader = withContext7(
+var SidebarGroupHeader = withContext8(
   import_sidebar.Sidebar.GroupHeader,
   "groupHeader"
 );
-var SidebarGroupTitle = withContext7(import_sidebar.Sidebar.GroupTitle, "groupTitle");
-var SidebarGroupEndElement = withContext7(import_sidebar.Sidebar.GroupEndElement, "groupEndElement");
-var SidebarGroupContent = withContext7(
+var SidebarGroupTitle = withContext8(import_sidebar.Sidebar.GroupTitle, "groupTitle");
+var SidebarGroupEndElement = withContext8(import_sidebar.Sidebar.GroupEndElement, "groupEndElement");
+var SidebarGroupContent = withContext8(
   import_sidebar.Sidebar.GroupContent,
   "groupContent"
 );
@@ -11563,14 +11704,14 @@ var SidebarContext = import_sidebar.Sidebar.Context;
 // src/components/sidebar/index.ts
 var import_sidebar2 = require("@saas-ui/core/sidebar");
 
-// src/components/skip-nav-link/index.ts
+// src/components/skip-nav/index.ts
 var import_skip_nav = require("@chakra-ui/react/skip-nav");
 
 // src/components/slider/slider.tsx
-var import_react78 = require("react");
+var import_react82 = require("react");
 var import_slider = require("@chakra-ui/react/slider");
-var import_jsx_runtime45 = require("react/jsx-runtime");
-var Slider = (0, import_react78.forwardRef)(
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var Slider = (0, import_react82.forwardRef)(
   function Slider2(props, ref) {
     var _a8;
     const { marks: marksProp, label, ...rest } = props;
@@ -11580,17 +11721,17 @@ var Slider = (0, import_react78.forwardRef)(
       return mark;
     });
     const hasMarkLabel = !!(marks == null ? void 0 : marks.some((mark) => mark.label));
-    return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_slider.Slider.Root, { ref, thumbAlignment: "center", ...rest, children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.Label, { fontWeight: "medium", children: label }),
-      /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_slider.Slider.Control, { mb: hasMarkLabel ? "4" : void 0, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.Track, { children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.Range, {}) }),
-        value == null ? void 0 : value.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.Thumb, { index, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.HiddenInput, {}) }, index))
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_slider.Slider.Root, { ref, thumbAlignment: "center", ...rest, children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.Label, { fontWeight: "medium", children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_slider.Slider.Control, { mb: hasMarkLabel ? "4" : void 0, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.Track, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.Range, {}) }),
+        value == null ? void 0 : value.map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.Thumb, { index, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.HiddenInput, {}) }, index))
       ] }),
-      (marks == null ? void 0 : marks.length) && /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.MarkerGroup, { children: marks.map((mark, index) => {
+      (marks == null ? void 0 : marks.length) && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.MarkerGroup, { children: marks.map((mark, index) => {
         const value2 = typeof mark === "number" ? mark : mark.value;
         const label2 = typeof mark === "number" ? void 0 : mark.label;
-        return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_slider.Slider.Marker, { value: value2, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_slider.Slider.MarkerIndicator, {}),
+        return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_slider.Slider.Marker, { value: value2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_slider.Slider.MarkerIndicator, {}),
           label2
         ] }, index);
       }) })
@@ -11599,15 +11740,15 @@ var Slider = (0, import_react78.forwardRef)(
 );
 
 // src/components/status/status.tsx
-var import_react79 = require("react");
+var import_react83 = require("react");
 var import_status = require("@chakra-ui/react/status");
-var import_jsx_runtime46 = require("react/jsx-runtime");
-var Status = (0, import_react79.forwardRef)(
+var import_jsx_runtime47 = require("react/jsx-runtime");
+var Status = (0, import_react83.forwardRef)(
   function Status2(props, ref) {
     const { children, value, ...rest } = props;
     const color = value ? `status.${value}` : void 0;
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_status.Status.Root, { ref, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_status.Status.Indicator, { bg: color }),
+    return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_status.Status.Root, { ref, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_status.Status.Indicator, { bg: color }),
       children
     ] });
   }
@@ -11624,29 +11765,29 @@ __export(stat_exports, {
   ValueText: () => StatValueText,
   ValueUnit: () => ValueUnit
 });
-var React19 = __toESM(require("react"), 1);
+var React20 = __toESM(require("react"), 1);
 var import_badge4 = require("@chakra-ui/react/badge");
 var import_format = require("@chakra-ui/react/format");
 var import_stat = require("@chakra-ui/react/stat");
-var import_jsx_runtime47 = require("react/jsx-runtime");
-var StatValueText = React19.forwardRef(
+var import_jsx_runtime48 = require("react/jsx-runtime");
+var StatValueText = React20.forwardRef(
   function StatValueText2(props, ref) {
     const { value, formatOptions, children, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_stat.Stat.ValueText, { ...rest, ref, children: children || value != null && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_format.FormatNumber, { value, ...formatOptions }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_stat.Stat.ValueText, { ...rest, ref, children: children || value != null && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_format.FormatNumber, { value, ...formatOptions }) });
   }
 );
-var StatUpTrend = React19.forwardRef(
+var StatUpTrend = React20.forwardRef(
   function StatUpTrend2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_badge4.Badge, { colorPalette: "green", gap: "0", ...props, ref, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_stat.Stat.UpIndicator, {}),
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_badge4.Badge, { colorPalette: "green", gap: "0", ...props, ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_stat.Stat.UpIndicator, {}),
       props.children
     ] });
   }
 );
-var StatDownTrend = React19.forwardRef(
+var StatDownTrend = React20.forwardRef(
   function StatDownTrend2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(import_badge4.Badge, { colorPalette: "red", gap: "0", ...props, ref, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_stat.Stat.DownIndicator, {}),
+    return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_badge4.Badge, { colorPalette: "red", gap: "0", ...props, ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_stat.Stat.DownIndicator, {}),
       props.children
     ] });
   }
@@ -11671,65 +11812,65 @@ __export(steps_exports, {
 });
 var import_box2 = require("@chakra-ui/react/box");
 var import_steps = require("@chakra-ui/react/steps");
-var import_jsx_runtime48 = require("react/jsx-runtime");
+var import_jsx_runtime49 = require("react/jsx-runtime");
 var StepsItem = (props) => {
   const { title, description, completedIcon, icon, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_steps.Steps.Item, { ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_steps.Steps.Trigger, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_steps.Steps.Item, { ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_steps.Steps.Trigger, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
         import_steps.Steps.Status,
         {
-          complete: completedIcon || /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(CheckIcon, {}),
-          incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Number, {})
+          complete: completedIcon || /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(CheckIcon, {}),
+          incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Number, {})
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(StepInfo, { title, description })
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(StepInfo, { title, description })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Separator, {})
+    /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Separator, {})
   ] });
 };
 var StepInfo = (props) => {
   const { title, description } = props;
   if (title && description) {
-    return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_box2.Box, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Title, { children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Description, { children: description })
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_box2.Box, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Title, { children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Description, { children: description })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Title, { children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Description, { children: description })
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_jsx_runtime49.Fragment, { children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Title, { children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Description, { children: description })
   ] });
 };
 var StepsIndicator = (props) => {
-  const { icon = /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Number, {}), completedIcon } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.Status, { complete: completedIcon, incomplete: icon }) });
+  const { icon = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Number, {}), completedIcon } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.Status, { complete: completedIcon, incomplete: icon }) });
 };
 var StepsList = import_steps.Steps.List;
 var StepsRoot = import_steps.Steps.Root;
 var StepsContent = import_steps.Steps.Content;
 var StepsCompletedContent = import_steps.Steps.CompletedContent;
 var StepsNextTrigger = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.NextTrigger, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.NextTrigger, { ...props });
 };
 var StepsPrevTrigger = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_steps.Steps.PrevTrigger, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_steps.Steps.PrevTrigger, { ...props });
 };
 
 // src/components/switch/switch.tsx
-var import_react80 = require("react");
+var import_react84 = require("react");
 var import_switch = require("@chakra-ui/react/switch");
-var import_jsx_runtime49 = require("react/jsx-runtime");
-var Switch = (0, import_react80.forwardRef)(
+var import_jsx_runtime50 = require("react/jsx-runtime");
+var Switch = (0, import_react84.forwardRef)(
   function Switch2(props, ref) {
     const { inputProps, children, rootRef, trackLabel, thumbLabel, ...rest } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_switch.Switch.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_switch.Switch.HiddenInput, { ref, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(import_switch.Switch.Control, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_switch.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_switch.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
-        trackLabel && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_switch.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
+    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_switch.Switch.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_switch.Switch.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_switch.Switch.Control, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_switch.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_switch.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
+        trackLabel && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_switch.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
       ] }),
-      children != null && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_switch.Switch.Label, { children })
+      children != null && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_switch.Switch.Label, { children })
     ] });
   }
 );
@@ -11741,10 +11882,10 @@ var import_table = require("@chakra-ui/react/table");
 var import_tabs = require("@chakra-ui/react/tabs");
 
 // src/components/tag/tag.tsx
-var import_react81 = require("react");
+var import_react85 = require("react");
 var import_tag = require("@chakra-ui/react/tag");
-var import_jsx_runtime50 = require("react/jsx-runtime");
-var Tag = (0, import_react81.forwardRef)(
+var import_jsx_runtime51 = require("react/jsx-runtime");
+var Tag = (0, import_react85.forwardRef)(
   function Tag2(props, ref) {
     const {
       startElement,
@@ -11754,11 +11895,11 @@ var Tag = (0, import_react81.forwardRef)(
       children,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_tag.Tag.Root, { ref, ...rest, children: [
-      startElement && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_tag.Tag.StartElement, { children: startElement }),
-      /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_tag.Tag.Label, { children }),
-      endElement && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_tag.Tag.EndElement, { children: endElement }),
-      closable && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_tag.Tag.EndElement, { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_tag.Tag.CloseTrigger, { onClick: onClose }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_tag.Tag.Root, { ref, ...rest, children: [
+      startElement && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_tag.Tag.StartElement, { children: startElement }),
+      /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_tag.Tag.Label, { children }),
+      endElement && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_tag.Tag.EndElement, { children: endElement }),
+      closable && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_tag.Tag.EndElement, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_tag.Tag.CloseTrigger, { onClick: onClose }) })
     ] });
   }
 );
@@ -11767,11 +11908,11 @@ var Tag = (0, import_react81.forwardRef)(
 var import_timeline = require("@chakra-ui/react/timeline");
 
 // src/components/toaster/toaster.tsx
-var import_react82 = require("react");
+var import_react86 = require("react");
 var import_portal7 = require("@chakra-ui/react/portal");
 var import_stack2 = require("@chakra-ui/react/stack");
 var import_toast = require("@chakra-ui/react/toast");
-var import_jsx_runtime51 = require("react/jsx-runtime");
+var import_jsx_runtime52 = require("react/jsx-runtime");
 var defaultOptions = {
   placement: "bottom-end",
   pauseOnPageIdle: true
@@ -11779,33 +11920,33 @@ var defaultOptions = {
 var toast = (0, import_toast.createToaster)(defaultOptions);
 var Toaster = (props) => {
   const { closable: defaultClosable = true, ...options } = props || {};
-  const toaster = (0, import_react82.useMemo)(() => {
+  const toaster = (0, import_react86.useMemo)(() => {
     toast = (0, import_toast.createToaster)({
       ...defaultOptions,
       ...options
     });
     return toast;
   }, [options]);
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_portal7.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_toast.Toaster, { toaster, insetInline: { mdDown: "4" }, children: (toast2) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_portal7.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_toast.Toaster, { toaster, insetInline: { mdDown: "4" }, children: (toast2) => {
     var _a8;
     const closable = ((_a8 = toast2.meta) == null ? void 0 : _a8.closable) === false ? false : defaultClosable && toast2.type !== "loading";
-    return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToastRoot, { children: [
-      toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Spinner, { size: "sm", color: "colorPalette.solid", mt: "0.5" }) : /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_toast.Toast.Indicator, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_stack2.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
-        toast2.title && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_toast.Toast.Title, { children: toast2.title }),
-        toast2.description && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_toast.Toast.Description, { children: toast2.description }),
-        toast2.action && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_toast.Toast.ActionTrigger, { children: toast2.action.label })
+    return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(ToastRoot, { children: [
+      toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(Spinner, { size: "sm", color: "colorPalette.solid", mt: "0.5" }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_toast.Toast.Indicator, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_stack2.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
+        toast2.title && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_toast.Toast.Title, { children: toast2.title }),
+        toast2.description && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_toast.Toast.Description, { children: toast2.description }),
+        toast2.action && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_toast.Toast.ActionTrigger, { children: toast2.action.label })
       ] }),
-      closable !== false && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_toast.Toast.CloseTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(CloseButton, { size: "xs" }) })
+      closable !== false && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_toast.Toast.CloseTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(CloseButton, { size: "xs" }) })
     ] });
   } }) });
 };
 function ToastRoot(props) {
-  const [rect, setRect] = (0, import_react82.useState)();
-  const rectCallbackRef = (0, import_react82.useCallback)((el) => {
+  const [rect, setRect] = (0, import_react86.useState)();
+  const rectCallbackRef = (0, import_react86.useCallback)((el) => {
     setRect(el == null ? void 0 : el.getBoundingClientRect());
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
     import_toast.Toast.Root,
     {
       ref: rectCallbackRef,
@@ -11819,11 +11960,11 @@ function ToastRoot(props) {
 }
 
 // src/components/tooltip/tooltip.tsx
-var import_react83 = require("react");
+var import_react87 = require("react");
 var import_portal8 = require("@chakra-ui/react/portal");
 var import_tooltip = require("@chakra-ui/react/tooltip");
-var import_jsx_runtime52 = require("react/jsx-runtime");
-var Tooltip = (0, import_react83.forwardRef)(
+var import_jsx_runtime53 = require("react/jsx-runtime");
+var Tooltip = (0, import_react87.forwardRef)(
   function Tooltip2(props, ref) {
     const {
       showArrow,
@@ -11836,10 +11977,10 @@ var Tooltip = (0, import_react83.forwardRef)(
       ...rest
     } = props;
     if (disabled) return children;
-    return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_tooltip.Tooltip.Root, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_tooltip.Tooltip.Trigger, { asChild: true, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_portal8.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_tooltip.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_tooltip.Tooltip.Content, { ref, ...contentProps, children: [
-        showArrow && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_tooltip.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_tooltip.Tooltip.ArrowTip, {}) }),
+    return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_tooltip.Tooltip.Root, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_tooltip.Tooltip.Trigger, { asChild: true, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_portal8.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_tooltip.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_tooltip.Tooltip.Content, { ref, ...contentProps, children: [
+        showArrow && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_tooltip.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_tooltip.Tooltip.ArrowTip, {}) }),
         content
       ] }) }) })
     ] });
@@ -11848,40 +11989,129 @@ var Tooltip = (0, import_react83.forwardRef)(
 
 // src/components/textarea/index.ts
 var import_textarea = require("@chakra-ui/react/textarea");
+
+// src/components/aspect-ratio/index.ts
+var import_aspect_ratio = require("@chakra-ui/react/aspect-ratio");
+
+// src/components/bleed/index.ts
+var import_bleed = require("@chakra-ui/react/bleed");
+
+// src/components/box/index.ts
+var import_box3 = require("@chakra-ui/react/box");
+
+// src/components/center/index.ts
+var import_center2 = require("@chakra-ui/react/center");
+
+// src/components/client-only/index.ts
+var import_client_only = require("@chakra-ui/react/client-only");
+
+// src/components/color-picker/index.ts
+var import_color_picker = require("@chakra-ui/react/color-picker");
+
+// src/components/color-swatch/index.ts
+var import_color_swatch = require("@chakra-ui/react/color-swatch");
+
+// src/components/env/index.ts
+var import_env = require("@chakra-ui/react/env");
+
+// src/components/float/index.ts
+var import_float = require("@chakra-ui/react/float");
+
+// src/components/focus-trap/index.ts
+var import_focus_trap = require("@chakra-ui/react/focus-trap");
+
+// src/components/format/index.ts
+var import_format2 = require("@chakra-ui/react/format");
+
+// src/components/grid/index.ts
+var import_grid = require("@chakra-ui/react/grid");
+
+// src/components/group/index.ts
+var import_group3 = require("@chakra-ui/react/group");
+
+// src/components/highlight/index.ts
+var import_highlight = require("@chakra-ui/react/highlight");
+
+// src/components/portal/index.ts
+var import_portal9 = require("@chakra-ui/react/portal");
+
+// src/components/presence/index.ts
+var import_presence3 = require("@chakra-ui/react/presence");
+
+// src/components/qr-code/index.ts
+var import_qr_code = require("@chakra-ui/react/qr-code");
+
+// src/components/show/index.ts
+var import_show = require("@chakra-ui/react/show");
+
+// src/components/spacer/index.ts
+var import_spacer = require("@chakra-ui/react/spacer");
+
+// src/components/stack/index.ts
+var import_stack3 = require("@chakra-ui/react/stack");
+
+// src/components/toggle/index.ts
+var import_toggle = require("@chakra-ui/react/toggle");
+
+// src/components/typography/index.ts
+var import_typography4 = require("@chakra-ui/react/typography");
+
+// src/components/visually-hidden/index.ts
+var import_visually_hidden = require("@chakra-ui/react/visually-hidden");
+
+// src/components/wrap/index.ts
+var import_wrap = require("@chakra-ui/react/wrap");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Accordion,
   ActionBar,
   Alert,
   AppShell,
+  AspectRatio,
   Avatar,
   AvatarGroup,
+  BackButton,
   Badge,
   BadgePropsProvider,
+  Bleed,
   Blockquote,
+  Box,
   Breadcrumb,
   Button,
   ButtonGroup,
   Card,
+  Center,
   Checkbox,
   CheckboxCard,
   Checkmark,
+  ClientOnly,
   Clipboard,
   CloseButton,
   Code,
   Collapsible,
+  ColorPicker,
+  ColorSwatch,
   Command,
   Container,
   DataList,
   Dialog,
   Drawer,
   Editable,
+  Em,
   EmptyState,
+  EnvironmentProvider,
   Field,
   Fieldset,
   FileUpload,
+  Float,
+  FocusTrap,
+  FormatByte,
+  FormatNumber,
+  Grid,
   GridList,
+  Group,
   Heading,
+  Highlight,
   HoverCard,
   Icon,
   IconBadge,
@@ -11903,14 +12133,18 @@ var import_textarea = require("@chakra-ui/react/textarea");
   NativeSelect,
   Navbar,
   NumberInput,
+  Page,
   Pagination,
   PasswordInput,
   Persona,
   PersonaAvatar,
   PinInput,
   Popover,
+  Portal,
+  Presence,
   Progress,
   ProgressCircle,
+  QrCode,
   Radio,
   RadioCard,
   RadioGroup,
@@ -11919,6 +12153,7 @@ var import_textarea = require("@chakra-ui/react/textarea");
   SegmentedControl,
   Select,
   Separator,
+  Show,
   Sidebar,
   Skeleton,
   SkeletonCircle,
@@ -11926,32 +12161,41 @@ var import_textarea = require("@chakra-ui/react/textarea");
   SkipNavContent,
   SkipNavLink,
   Slider,
+  Spacer,
   Spinner,
+  Stack,
   Stat,
   Status,
   Steps,
+  Strong,
   SuiContext,
   SuiProvider,
   Switch,
   Table,
   Tabs,
   Tag,
+  Text,
   Textarea,
   Timeline,
   Toaster,
+  Toggle,
   ToggleTip,
   Tooltip,
+  VisuallyHidden,
+  Wrap,
   createSystem,
   defaultConfig,
-  defaultPresenceOptions,
+  defaultPersonaPresenceOptions,
   defaultSystem,
   toast,
   useDataListStyles,
+  useEnvironmentContext,
   useFieldContext,
   useFieldStyles,
   useFieldsetContext,
   useFileUploadContext,
   useLink,
+  usePageStyles,
   useSidebar,
   useSidebarItemStyles,
   useSidebarStyles,