@saas-ui/react 3.0.0-alpha.6 → 3.0.0-alpha.8

package/dist/index.cjs

@@ -33,13 +33,13 @@ __export(src_exports, {
   AppShell: () => AppShell,
   Avatar: () => Avatar,
   AvatarGroup: () => AvatarGroup,
-  Breadcrumb: () => namespace_exports,
+  Breadcrumb: () => breadcrumb_exports,
   Button: () => Button,
   Checkbox: () => Checkbox,
   CloseButton: () => CloseButton,
   Command: () => Command,
-  Dialog: () => namespace_exports2,
-  Drawer: () => namespace_exports3,
+  Dialog: () => namespace_exports,
+  Drawer: () => namespace_exports2,
   EmptyState: () => EmptyState,
   GridList: () => grid_list_exports,
   IconBadge: () => IconBadge,
@@ -56,7 +56,8 @@ __export(src_exports, {
   Radio: () => Radio,
   RadioGroup: () => RadioGroup,
   SearchInput: () => SearchInput,
-  Select: () => namespace_exports4,
+  SegmentedControl: () => SegmentedControl,
+  Select: () => namespace_exports3,
   Sidebar: () => sidebar_exports,
   Spinner: () => Spinner2,
   Steps: () => steps_exports,
@@ -65,7 +66,7 @@ __export(src_exports, {
   Switch: () => Switch,
   Toaster: () => Toaster,
   Tooltip: () => Tooltip,
-  createSystem: () => import_react166.createSystem,
+  createSystem: () => import_react161.createSystem,
   defaultConfig: () => defaultConfig,
   defaultPresenceOptions: () => defaultPresenceOptions,
   defaultSystem: () => defaultSystem,
@@ -378,6 +379,7 @@ var import_react5 = require("@chakra-ui/react");
 var buttonRecipe = (0, import_react5.defineRecipe)({
   className: "chakra-button",
   base: {
+    colorPalette: "gray",
     display: "inline-flex",
     appearance: "none",
     alignItems: "center",
@@ -1664,6 +1666,26 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.gray.900}", _dark: "{colors.white}" }
     }
   },
+  slate: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.slate.900}", _dark: "{colors.slate.200}" }
+    },
+    muted: {
+      value: { _light: "{colors.slate.100}", _dark: "{colors.slate.900}" }
+    },
+    subtle: {
+      value: { _light: "{colors.slate.200}", _dark: "{colors.slate.800}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.slate.300}", _dark: "{colors.slate.700}" }
+    },
+    solid: {
+      value: { _light: "{colors.slate.500}", _dark: "{colors.slate.500}" }
+    }
+  },
   gray: {
     contrast: {
       value: { _light: "white", _dark: "white" }
@@ -1684,6 +1706,46 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.gray.500}", _dark: "{colors.gray.500}" }
     }
   },
+  zinc: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.zinc.900}", _dark: "{colors.zinc.200}" }
+    },
+    muted: {
+      value: { _light: "{colors.zinc.100}", _dark: "{colors.zinc.900}" }
+    },
+    subtle: {
+      value: { _light: "{colors.zinc.200}", _dark: "{colors.zinc.800}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.zinc.300}", _dark: "{colors.zinc.700}" }
+    },
+    solid: {
+      value: { _light: "{colors.zinc.500}", _dark: "{colors.zinc.500}" }
+    }
+  },
+  stone: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.stone.900}", _dark: "{colors.stone.200}" }
+    },
+    muted: {
+      value: { _light: "{colors.stone.100}", _dark: "{colors.stone.900}" }
+    },
+    subtle: {
+      value: { _light: "{colors.stone.200}", _dark: "{colors.stone.800}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.stone.300}", _dark: "{colors.stone.700}" }
+    },
+    solid: {
+      value: { _light: "{colors.stone.500}", _dark: "{colors.stone.500}" }
+    }
+  },
   red: {
     contrast: {
       value: { _light: "white", _dark: "white" }
@@ -1724,6 +1786,66 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.orange.600}", _dark: "{colors.orange.500}" }
     }
   },
+  amber: {
+    contrast: {
+      value: { _light: "black", _dark: "black" }
+    },
+    fg: {
+      value: { _light: "{colors.amber.700}", _dark: "{colors.amber.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.amber.50}", _dark: "{colors.amber.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.amber.100}", _dark: "{colors.amber.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.amber.200}", _dark: "{colors.amber.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.amber.600}", _dark: "{colors.amber.600}" }
+    }
+  },
+  yellow: {
+    contrast: {
+      value: { _light: "black", _dark: "black" }
+    },
+    fg: {
+      value: { _light: "{colors.yellow.700}", _dark: "{colors.yellow.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.yellow.50}", _dark: "{colors.yellow.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.yellow.100}", _dark: "{colors.yellow.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.yellow.200}", _dark: "{colors.yellow.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.yellow.600}", _dark: "{colors.yellow.600}" }
+    }
+  },
+  lime: {
+    contrast: {
+      value: { _light: "black", _dark: "black" }
+    },
+    fg: {
+      value: { _light: "{colors.lime.700}", _dark: "{colors.lime.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.lime.50}", _dark: "{colors.lime.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.lime.100}", _dark: "{colors.lime.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.lime.200}", _dark: "{colors.lime.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.lime.600}", _dark: "{colors.lime.600}" }
+    }
+  },
   green: {
     contrast: {
       value: { _light: "white", _dark: "white" }
@@ -1744,64 +1866,104 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.green.600}", _dark: "{colors.green.600}" }
     }
   },
-  blue: {
+  emerald: {
     contrast: {
       value: { _light: "white", _dark: "white" }
     },
     fg: {
-      value: { _light: "{colors.blue.700}", _dark: "{colors.blue.300}" }
+      value: { _light: "{colors.emerald.700}", _dark: "{colors.emerald.300}" }
     },
     muted: {
-      value: { _light: "{colors.blue.50}", _dark: "{colors.blue.950}" }
+      value: { _light: "{colors.emerald.50}", _dark: "{colors.emerald.950}" }
     },
     subtle: {
-      value: { _light: "{colors.blue.100}", _dark: "{colors.blue.900}" }
+      value: { _light: "{colors.emerald.100}", _dark: "{colors.emerald.900}" }
     },
     emphasized: {
-      value: { _light: "{colors.blue.200}", _dark: "{colors.blue.800}" }
+      value: { _light: "{colors.emerald.200}", _dark: "{colors.emerald.800}" }
     },
     solid: {
-      value: { _light: "{colors.blue.600}", _dark: "{colors.blue.600}" }
+      value: { _light: "{colors.emerald.600}", _dark: "{colors.emerald.600}" }
     }
   },
-  yellow: {
+  teal: {
     contrast: {
-      value: { _light: "black", _dark: "black" }
+      value: { _light: "white", _dark: "white" }
     },
     fg: {
-      value: { _light: "{colors.yellow.700}", _dark: "{colors.yellow.300}" }
+      value: { _light: "{colors.teal.700}", _dark: "{colors.teal.300}" }
     },
     muted: {
-      value: { _light: "{colors.yellow.50}", _dark: "{colors.yellow.950}" }
+      value: { _light: "{colors.teal.50}", _dark: "{colors.teal.950}" }
     },
     subtle: {
-      value: { _light: "{colors.yellow.100}", _dark: "{colors.yellow.900}" }
+      value: { _light: "{colors.teal.100}", _dark: "{colors.teal.900}" }
     },
     emphasized: {
-      value: { _light: "{colors.yellow.200}", _dark: "{colors.yellow.800}" }
+      value: { _light: "{colors.teal.200}", _dark: "{colors.teal.800}" }
     },
     solid: {
-      value: { _light: "{colors.yellow.300}", _dark: "{colors.yellow.300}" }
+      value: { _light: "{colors.teal.600}", _dark: "{colors.teal.600}" }
     }
   },
-  teal: {
+  cyan: {
     contrast: {
       value: { _light: "white", _dark: "white" }
     },
     fg: {
-      value: { _light: "{colors.teal.700}", _dark: "{colors.teal.300}" }
+      value: { _light: "{colors.cyan.700}", _dark: "{colors.cyan.300}" }
     },
     muted: {
-      value: { _light: "{colors.teal.50}", _dark: "{colors.teal.950}" }
+      value: { _light: "{colors.cyan.50}", _dark: "{colors.cyan.950}" }
     },
     subtle: {
-      value: { _light: "{colors.teal.100}", _dark: "{colors.teal.900}" }
+      value: { _light: "{colors.cyan.100}", _dark: "{colors.cyan.900}" }
     },
     emphasized: {
-      value: { _light: "{colors.teal.200}", _dark: "{colors.teal.800}" }
+      value: { _light: "{colors.cyan.200}", _dark: "{colors.cyan.800}" }
     },
     solid: {
-      value: { _light: "{colors.teal.600}", _dark: "{colors.teal.600}" }
+      value: { _light: "{colors.cyan.600}", _dark: "{colors.cyan.600}" }
+    }
+  },
+  sky: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.sky.700}", _dark: "{colors.sky.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.sky.50}", _dark: "{colors.sky.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.sky.100}", _dark: "{colors.sky.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.sky.200}", _dark: "{colors.sky.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.sky.600}", _dark: "{colors.sky.600}" }
+    }
+  },
+  blue: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.blue.700}", _dark: "{colors.blue.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.blue.50}", _dark: "{colors.blue.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.blue.100}", _dark: "{colors.blue.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.blue.200}", _dark: "{colors.blue.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.blue.600}", _dark: "{colors.blue.600}" }
     }
   },
   indigo: {
@@ -1824,6 +1986,26 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.indigo.600}", _dark: "{colors.indigo.600}" }
     }
   },
+  violet: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.violet.700}", _dark: "{colors.violet.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.violet.50}", _dark: "{colors.violet.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.violet.100}", _dark: "{colors.violet.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.violet.200}", _dark: "{colors.violet.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.violet.600}", _dark: "{colors.violet.600}" }
+    }
+  },
   purple: {
     contrast: {
       value: { _light: "white", _dark: "white" }
@@ -1844,6 +2026,26 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.purple.600}", _dark: "{colors.purple.600}" }
     }
   },
+  fuchsia: {
+    contrast: {
+      value: { _light: "white", _dark: "white" }
+    },
+    fg: {
+      value: { _light: "{colors.fuchsia.700}", _dark: "{colors.fuchsia.300}" }
+    },
+    muted: {
+      value: { _light: "{colors.fuchsia.50}", _dark: "{colors.fuchsia.950}" }
+    },
+    subtle: {
+      value: { _light: "{colors.fuchsia.100}", _dark: "{colors.fuchsia.900}" }
+    },
+    emphasized: {
+      value: { _light: "{colors.fuchsia.200}", _dark: "{colors.fuchsia.800}" }
+    },
+    solid: {
+      value: { _light: "{colors.fuchsia.600}", _dark: "{colors.fuchsia.600}" }
+    }
+  },
   pink: {
     contrast: {
       value: { _light: "white", _dark: "white" }
@@ -1864,24 +2066,24 @@ var semanticColors = import_react25.defineSemanticTokens.colors({
       value: { _light: "{colors.pink.600}", _dark: "{colors.pink.600}" }
     }
   },
-  cyan: {
+  rose: {
     contrast: {
       value: { _light: "white", _dark: "white" }
     },
     fg: {
-      value: { _light: "{colors.cyan.700}", _dark: "{colors.cyan.300}" }
+      value: { _light: "{colors.rose.700}", _dark: "{colors.rose.300}" }
     },
     muted: {
-      value: { _light: "{colors.cyan.50}", _dark: "{colors.cyan.950}" }
+      value: { _light: "{colors.rose.50}", _dark: "{colors.rose.950}" }
     },
     subtle: {
-      value: { _light: "{colors.cyan.100}", _dark: "{colors.cyan.900}" }
+      value: { _light: "{colors.rose.100}", _dark: "{colors.rose.900}" }
     },
     emphasized: {
-      value: { _light: "{colors.cyan.200}", _dark: "{colors.cyan.800}" }
+      value: { _light: "{colors.rose.200}", _dark: "{colors.rose.800}" }
     },
     solid: {
-      value: { _light: "{colors.cyan.600}", _dark: "{colors.cyan.600}" }
+      value: { _light: "{colors.rose.600}", _dark: "{colors.rose.600}" }
     }
   }
 });
@@ -4695,6 +4897,7 @@ var menuSlotRecipe = (0, import_react54.defineSlotRecipe)({
       bg: "bg.panel",
       boxShadow: "lg",
       color: "fg",
+      maxHeight: "var(--available-height)",
       "--menu-z-index": "zIndex.dropdown",
       zIndex: "calc(var(--menu-z-index) + var(--layer-index, 0))",
       borderRadius: "l2",
@@ -7798,319 +8001,319 @@ var import_react82 = require("@chakra-ui/react");
 var colors = import_react82.defineTokens.colors({
   transparent: { value: "transparent" },
   current: { value: "currentColor" },
-  black: { value: "#09090B" },
-  white: { value: "#FFFFFF" },
+  black: { value: "oklch(0.07 0 0)" },
+  white: { value: "oklch(1 0 0)" },
   whiteAlpha: {
-    50: { value: "rgba(255, 255, 255, 0.04)" },
-    100: { value: "rgba(255, 255, 255, 0.06)" },
-    200: { value: "rgba(255, 255, 255, 0.08)" },
-    300: { value: "rgba(255, 255, 255, 0.16)" },
-    400: { value: "rgba(255, 255, 255, 0.24)" },
-    500: { value: "rgba(255, 255, 255, 0.36)" },
-    600: { value: "rgba(255, 255, 255, 0.48)" },
-    700: { value: "rgba(255, 255, 255, 0.64)" },
-    800: { value: "rgba(255, 255, 255, 0.80)" },
-    900: { value: "rgba(255, 255, 255, 0.92)" },
-    950: { value: "rgba(255, 255, 255, 0.95)" }
+    50: { value: "oklch(1 0 0 / 0.04)" },
+    100: { value: "oklch(1 0 0 / 0.06)" },
+    200: { value: "oklch(1 0 0 / 0.08)" },
+    300: { value: "oklch(1 0 0 / 0.16)" },
+    400: { value: "oklch(1 0 0 / 0.24)" },
+    500: { value: "oklch(1 0 0 / 0.36)" },
+    600: { value: "oklch(1 0 0 / 0.48)" },
+    700: { value: "oklch(1 0 0 / 0.64)" },
+    800: { value: "oklch(1 0 0 / 0.80)" },
+    900: { value: "oklch(1 0 0 / 0.92)" },
+    950: { value: "oklch(1 0 0 / 0.95)" }
   },
   blackAlpha: {
-    50: { value: "rgba(0, 0, 0, 0.04)" },
-    100: { value: "rgba(0, 0, 0, 0.06)" },
-    200: { value: "rgba(0, 0, 0, 0.08)" },
-    300: { value: "rgba(0, 0, 0, 0.16)" },
-    400: { value: "rgba(0, 0, 0, 0.24)" },
-    500: { value: "rgba(0, 0, 0, 0.36)" },
-    600: { value: "rgba(0, 0, 0, 0.48)" },
-    700: { value: "rgba(0, 0, 0, 0.64)" },
-    800: { value: "rgba(0, 0, 0, 0.80)" },
-    900: { value: "rgba(0, 0, 0, 0.92)" },
-    950: { value: "rgba(0, 0, 0, 0.95)" }
-  },
-  gray: {
-    50: { value: "#fafafa" },
-    100: { value: "#f4f4f5" },
-    200: { value: "#e4e4e7" },
-    300: { value: "#d4d4d8" },
-    400: { value: "#a1a1aa" },
-    500: { value: "#71717a" },
-    600: { value: "#52525b" },
-    700: { value: "#3f3f46" },
-    800: { value: "#27272a" },
-    900: { value: "#18181b" },
-    950: { value: "#111111" }
+    50: { value: "oklch(0 0 0 / 0.04)" },
+    100: { value: "oklch(0 0 0 / 0.06)" },
+    200: { value: "oklch(0 0 0 / 0.08)" },
+    300: { value: "oklch(0 0 0 / 0.16)" },
+    400: { value: "oklch(0 0 0 / 0.24)" },
+    500: { value: "oklch(0 0 0 / 0.36)" },
+    600: { value: "oklch(0 0 0 / 0.48)" },
+    700: { value: "oklch(0 0 0 / 0.64)" },
+    800: { value: "oklch(0 0 0 / 0.80)" },
+    900: { value: "oklch(0 0 0 / 0.92)" },
+    950: { value: "oklch(0 0 0 / 0.95)" }
   },
-  red: {
-    50: { value: "#fef2f2" },
-    100: { value: "#fee2e2" },
-    200: { value: "#fecaca" },
-    300: { value: "#fca5a5" },
-    400: { value: "#f87171" },
-    500: { value: "#ef4444" },
-    600: { value: "#dc2626" },
-    700: { value: "#991919" },
-    800: { value: "#511111" },
-    900: { value: "#300c0c" },
-    950: { value: "#1f0808" }
-  },
-  orange: {
-    50: { value: "#fff7ed" },
-    100: { value: "#ffedd5" },
-    200: { value: "#fed7aa" },
-    300: { value: "#fdba74" },
-    400: { value: "#fb923c" },
-    500: { value: "#f97316" },
-    600: { value: "#ea580c" },
-    700: { value: "#92310a" },
-    800: { value: "#6c2710" },
-    900: { value: "#3b1106" },
-    950: { value: "#220a04" }
+  slate: {
+    50: { value: "oklch(0.984 0.003 247.858)" },
+    100: { value: "oklch(0.968 0.007 247.896)" },
+    200: { value: "oklch(0.929 0.013 255.508)" },
+    300: { value: "oklch(0.869 0.022 252.894)" },
+    400: { value: "oklch(0.704 0.04 256.788)" },
+    500: { value: "oklch(0.554 0.046 257.417)" },
+    600: { value: "oklch(0.446 0.043 257.281)" },
+    700: { value: "oklch(0.372 0.044 257.287)" },
+    800: { value: "oklch(0.279 0.041 260.031)" },
+    900: { value: "oklch(0.208 0.042 265.755)" },
+    950: { value: "oklch(0.129 0.042 264.695)" }
   },
-  yellow: {
-    50: { value: "#fefce8" },
-    100: { value: "#fef9c3" },
-    200: { value: "#fef08a" },
-    300: { value: "#fde047" },
-    400: { value: "#facc15" },
-    500: { value: "#eab308" },
-    600: { value: "#ca8a04" },
-    700: { value: "#845209" },
-    800: { value: "#713f12" },
-    900: { value: "#422006" },
-    950: { value: "#281304" }
+  gray: {
+    50: { value: "oklch(0.985 0.002 247.839)" },
+    100: { value: "oklch(0.967 0.003 264.542)" },
+    200: { value: "oklch(0.928 0.006 264.531)" },
+    300: { value: "oklch(0.872 0.01 258.338)" },
+    400: { value: "oklch(0.707 0.022 261.325)" },
+    500: { value: "oklch(0.551 0.027 264.364)" },
+    600: { value: "oklch(0.446 0.03 256.802)" },
+    700: { value: "oklch(0.373 0.034 259.733)" },
+    800: { value: "oklch(0.278 0.033 256.848)" },
+    900: { value: "oklch(0.21 0.034 264.665)" },
+    950: { value: "oklch(0.13 0.028 261.692)" }
   },
-  green: {
-    50: { value: "#f0fdf4" },
-    100: { value: "#dcfce7" },
-    200: { value: "#bbf7d0" },
-    300: { value: "#86efac" },
-    400: { value: "#4ade80" },
-    500: { value: "#22c55e" },
-    600: { value: "#16a34a" },
-    700: { value: "#116932" },
-    800: { value: "#124a28" },
-    900: { value: "#042713" },
-    950: { value: "#03190c" }
+  zinc: {
+    50: { value: "oklch(0.985 0 0)" },
+    100: { value: "oklch(0.967 0.001 286.375)" },
+    200: { value: "oklch(0.92 0.004 286.32)" },
+    300: { value: "oklch(0.871 0.006 286.286)" },
+    400: { value: "oklch(0.705 0.015 286.067)" },
+    500: { value: "oklch(0.552 0.016 285.938)" },
+    600: { value: "oklch(0.442 0.017 285.786)" },
+    700: { value: "oklch(0.37 0.013 285.805)" },
+    800: { value: "oklch(0.274 0.006 286.033)" },
+    900: { value: "oklch(0.21 0.006 285.885)" },
+    950: { value: "oklch(0.141 0.005 285.823)" }
   },
-  teal: {
-    50: { value: "#f0fdfa" },
-    100: { value: "#ccfbf1" },
-    200: { value: "#99f6e4" },
-    300: { value: "#5eead4" },
-    400: { value: "#2dd4bf" },
-    500: { value: "#14b8a6" },
-    600: { value: "#0d9488" },
-    700: { value: "#0c5d56" },
-    800: { value: "#114240" },
-    900: { value: "#032726" },
-    950: { value: "#021716" }
+  neutral: {
+    50: { value: "oklch(0.985 0 0)" },
+    100: { value: "oklch(0.97 0 0)" },
+    200: { value: "oklch(0.922 0 0)" },
+    300: { value: "oklch(0.87 0 0)" },
+    400: { value: "oklch(0.708 0 0)" },
+    500: { value: "oklch(0.556 0 0)" },
+    600: { value: "oklch(0.439 0 0)" },
+    700: { value: "oklch(0.371 0 0)" },
+    800: { value: "oklch(0.269 0 0)" },
+    900: { value: "oklch(0.205 0 0)" },
+    950: { value: "oklch(0.145 0 0)" }
   },
-  blue: {
-    50: { value: "#eff6ff" },
-    100: { value: "#dbeafe" },
-    200: { value: "#bfdbfe" },
-    300: { value: "#a3cfff" },
-    400: { value: "#60a5fa" },
-    500: { value: "#3b82f6" },
-    600: { value: "#2563eb" },
-    700: { value: "#173da6" },
-    800: { value: "#1a3478" },
-    900: { value: "#14204a" },
-    950: { value: "#0c142e" }
+  stone: {
+    50: { value: "oklch(0.985 0.001 106.423)" },
+    100: { value: "oklch(0.97 0.001 106.424)" },
+    200: { value: "oklch(0.923 0.003 48.717)" },
+    300: { value: "oklch(0.869 0.005 56.366)" },
+    400: { value: "oklch(0.709 0.01 56.259)" },
+    500: { value: "oklch(0.553 0.013 58.071)" },
+    600: { value: "oklch(0.444 0.011 73.639)" },
+    700: { value: "oklch(0.374 0.01 67.558)" },
+    800: { value: "oklch(0.268 0.007 34.298)" },
+    900: { value: "oklch(0.216 0.006 56.043)" },
+    950: { value: "oklch(0.147 0.004 49.25)" }
   },
-  cyan: {
-    50: { value: "#ecfeff" },
-    100: { value: "#cffafe" },
-    200: { value: "#a5f3fc" },
-    300: { value: "#67e8f9" },
-    400: { value: "#22d3ee" },
-    500: { value: "#06b6d4" },
-    600: { value: "#0891b2" },
-    700: { value: "#0c5c72" },
-    800: { value: "#134152" },
-    900: { value: "#072a38" },
-    950: { value: "#051b24" }
+  red: {
+    50: { value: "oklch(0.971 0.013 17.38)" },
+    100: { value: "oklch(0.936 0.032 17.717)" },
+    200: { value: "oklch(0.885 0.062 18.334)" },
+    300: { value: "oklch(0.808 0.114 19.571)" },
+    400: { value: "oklch(0.704 0.191 22.216)" },
+    500: { value: "oklch(0.637 0.237 25.331)" },
+    600: { value: "oklch(0.577 0.245 27.325)" },
+    700: { value: "oklch(0.505 0.213 27.518)" },
+    800: { value: "oklch(0.444 0.177 26.899)" },
+    900: { value: "oklch(0.396 0.141 25.723)" },
+    950: { value: "oklch(0.258 0.092 26.042)" }
   },
-  indigo: {
-    50: { value: "#eef2ff" },
-    100: { value: "#e0e7ff" },
-    200: { value: "#c7d2fe" },
-    300: { value: "#a5b4fc" },
-    400: { value: "#818cf8" },
-    500: { value: "#6366f1" },
-    600: { value: "#4f46e5" },
-    700: { value: "#4338ca" },
-    800: { value: "#3730a3" },
-    900: { value: "#312e81" },
-    950: { value: "#1e1b4b" }
+  orange: {
+    50: { value: "oklch(0.98 0.016 73.684)" },
+    100: { value: "oklch(0.954 0.038 75.164)" },
+    200: { value: "oklch(0.901 0.076 70.697)" },
+    300: { value: "oklch(0.837 0.128 66.29)" },
+    400: { value: "oklch(0.75 0.183 55.934)" },
+    500: { value: "oklch(0.705 0.213 47.604)" },
+    600: { value: "oklch(0.646 0.222 41.116)" },
+    700: { value: "oklch(0.553 0.195 38.402)" },
+    800: { value: "oklch(0.47 0.157 37.304)" },
+    900: { value: "oklch(0.408 0.123 38.172)" },
+    950: { value: "oklch(0.266 0.079 36.259)" }
   },
-  purple: {
-    50: { value: "#faf5ff" },
-    100: { value: "#f3e8ff" },
-    200: { value: "#e9d5ff" },
-    300: { value: "#d8b4fe" },
-    400: { value: "#c084fc" },
-    500: { value: "#a855f7" },
-    600: { value: "#9333ea" },
-    700: { value: "#641ba3" },
-    800: { value: "#4a1772" },
-    900: { value: "#2f0553" },
-    950: { value: "#1a032e" }
+  amber: {
+    50: { value: "oklch(0.987 0.022 95.277)" },
+    100: { value: "oklch(0.962 0.059 95.617)" },
+    200: { value: "oklch(0.924 0.12 95.746)" },
+    300: { value: "oklch(0.879 0.169 91.605)" },
+    400: { value: "oklch(0.828 0.189 84.429)" },
+    500: { value: "oklch(0.769 0.188 70.08)" },
+    600: { value: "oklch(0.666 0.179 58.318)" },
+    700: { value: "oklch(0.555 0.163 48.998)" },
+    800: { value: "oklch(0.473 0.137 46.201)" },
+    900: { value: "oklch(0.414 0.112 45.904)" },
+    950: { value: "oklch(0.279 0.077 45.635)" }
   },
-  pink: {
-    50: { value: "#fdf2f8" },
-    100: { value: "#fce7f3" },
-    200: { value: "#fbcfe8" },
-    300: { value: "#f9a8d4" },
-    400: { value: "#f472b6" },
-    500: { value: "#ec4899" },
-    600: { value: "#db2777" },
-    700: { value: "#a41752" },
-    800: { value: "#6d0e34" },
-    900: { value: "#45061f" },
-    950: { value: "#2c0514" }
+  yellow: {
+    50: { value: "oklch(0.987 0.026 102.212)" },
+    100: { value: "oklch(0.973 0.071 103.193)" },
+    200: { value: "oklch(0.945 0.129 101.54)" },
+    300: { value: "oklch(0.905 0.182 98.111)" },
+    400: { value: "oklch(0.852 0.199 91.936)" },
+    500: { value: "oklch(0.795 0.184 86.047)" },
+    600: { value: "oklch(0.681 0.162 75.834)" },
+    700: { value: "oklch(0.554 0.135 66.442)" },
+    800: { value: "oklch(0.476 0.114 61.907)" },
+    900: { value: "oklch(0.421 0.095 57.708)" },
+    950: { value: "oklch(0.286 0.066 53.813)" }
   },
-  slate: {
-    50: { value: "#f8fafc" },
-    100: { value: "#f1f5f9" },
-    200: { value: "#e2e8f0" },
-    300: { value: "#cbd5e1" },
-    400: { value: "#94a3b8" },
-    500: { value: "#64748b" },
-    600: { value: "#475569" },
-    700: { value: "#334155" },
-    800: { value: "#1e293b" },
-    900: { value: "#0f172a" },
-    950: { value: "#020617" }
+  lime: {
+    50: { value: "oklch(0.986 0.031 120.757)" },
+    100: { value: "oklch(0.967 0.067 122.328)" },
+    200: { value: "oklch(0.938 0.127 124.321)" },
+    300: { value: "oklch(0.897 0.196 126.665)" },
+    400: { value: "oklch(0.841 0.238 128.85)" },
+    500: { value: "oklch(0.768 0.233 130.85)" },
+    600: { value: "oklch(0.648 0.2 131.684)" },
+    700: { value: "oklch(0.532 0.157 131.589)" },
+    800: { value: "oklch(0.453 0.124 130.933)" },
+    900: { value: "oklch(0.405 0.101 131.063)" },
+    950: { value: "oklch(0.274 0.072 132.109)" }
   },
-  zinc: {
-    50: { value: "#fafafa" },
-    100: { value: "#f4f4f5" },
-    200: { value: "#e4e4e7" },
-    300: { value: "#d4d4d8" },
-    400: { value: "#a1a1aa" },
-    500: { value: "#71717a" },
-    600: { value: "#52525b" },
-    700: { value: "#3f3f46" },
-    800: { value: "#27272a" },
-    900: { value: "#18181b" },
-    950: { value: "#09090b" }
+  green: {
+    50: { value: "oklch(0.982 0.018 155.826)" },
+    100: { value: "oklch(0.962 0.044 156.743)" },
+    200: { value: "oklch(0.925 0.084 155.995)" },
+    300: { value: "oklch(0.871 0.15 154.449)" },
+    400: { value: "oklch(0.792 0.209 151.711)" },
+    500: { value: "oklch(0.723 0.219 149.579)" },
+    600: { value: "oklch(0.627 0.194 149.214)" },
+    700: { value: "oklch(0.527 0.154 150.069)" },
+    800: { value: "oklch(0.448 0.119 151.328)" },
+    900: { value: "oklch(0.393 0.095 152.535)" },
+    950: { value: "oklch(0.266 0.065 152.934)" }
   },
-  neutral: {
-    50: { value: "#fafafa" },
-    100: { value: "#f5f5f5" },
-    200: { value: "#e5e5e5" },
-    300: { value: "#d4d4d4" },
-    400: { value: "#a3a3a3" },
-    500: { value: "#737373" },
-    600: { value: "#525252" },
-    700: { value: "#404040" },
-    800: { value: "#262626" },
-    900: { value: "#171717" },
-    950: { value: "#0a0a0a" }
+  emerald: {
+    50: { value: "oklch(0.979 0.021 166.113)" },
+    100: { value: "oklch(0.95 0.052 163.051)" },
+    200: { value: "oklch(0.905 0.093 164.15)" },
+    300: { value: "oklch(0.845 0.143 164.978)" },
+    400: { value: "oklch(0.765 0.177 163.223)" },
+    500: { value: "oklch(0.696 0.17 162.48)" },
+    600: { value: "oklch(0.596 0.145 163.225)" },
+    700: { value: "oklch(0.508 0.118 165.612)" },
+    800: { value: "oklch(0.432 0.095 166.913)" },
+    900: { value: "oklch(0.378 0.077 168.94)" },
+    950: { value: "oklch(0.262 0.051 172.552)" }
   },
-  stone: {
-    50: { value: "#fafaf9" },
-    100: { value: "#f5f5f4" },
-    200: { value: "#e7e5e4" },
-    300: { value: "#d6d3d1" },
-    400: { value: "#a8a29e" },
-    500: { value: "#78716c" },
-    600: { value: "#57534e" },
-    700: { value: "#44403c" },
-    800: { value: "#292524" },
-    900: { value: "#1c1917" },
-    950: { value: "#0c0a09" }
+  teal: {
+    50: { value: "oklch(0.984 0.014 180.72)" },
+    100: { value: "oklch(0.953 0.051 180.801)" },
+    200: { value: "oklch(0.91 0.096 180.426)" },
+    300: { value: "oklch(0.855 0.138 181.071)" },
+    400: { value: "oklch(0.777 0.152 181.912)" },
+    500: { value: "oklch(0.704 0.14 182.503)" },
+    600: { value: "oklch(0.6 0.118 184.704)" },
+    700: { value: "oklch(0.511 0.096 186.391)" },
+    800: { value: "oklch(0.437 0.078 188.216)" },
+    900: { value: "oklch(0.386 0.063 188.416)" },
+    950: { value: "oklch(0.277 0.046 192.524)" }
   },
-  amber: {
-    50: { value: "#fffbeb" },
-    100: { value: "#fef3c7" },
-    200: { value: "#fde68a" },
-    300: { value: "#fcd34d" },
-    400: { value: "#fbbf24" },
-    500: { value: "#f59e0b" },
-    600: { value: "#d97706" },
-    700: { value: "#b45309" },
-    800: { value: "#92400e" },
-    900: { value: "#78350f" },
-    950: { value: "#451a03" }
+  cyan: {
+    50: { value: "oklch(0.984 0.019 200.873)" },
+    100: { value: "oklch(0.956 0.045 203.388)" },
+    200: { value: "oklch(0.917 0.08 205.041)" },
+    300: { value: "oklch(0.865 0.127 207.078)" },
+    400: { value: "oklch(0.789 0.154 211.53)" },
+    500: { value: "oklch(0.715 0.143 215.221)" },
+    600: { value: "oklch(0.609 0.126 221.723)" },
+    700: { value: "oklch(0.52 0.105 223.128)" },
+    800: { value: "oklch(0.45 0.085 224.283)" },
+    900: { value: "oklch(0.398 0.07 227.392)" },
+    950: { value: "oklch(0.302 0.056 229.695)" }
   },
-  lime: {
-    50: { value: "#f7fee7" },
-    100: { value: "#ecfccb" },
-    200: { value: "#d9f99d" },
-    300: { value: "#bef264" },
-    400: { value: "#a3e635" },
-    500: { value: "#84cc16" },
-    600: { value: "#65a30d" },
-    700: { value: "#4d7c0f" },
-    800: { value: "#3f6212" },
-    900: { value: "#365314" },
-    950: { value: "#1a2e05" }
+  sky: {
+    50: { value: "oklch(0.977 0.013 236.62)" },
+    100: { value: "oklch(0.951 0.026 236.824)" },
+    200: { value: "oklch(0.901 0.058 230.902)" },
+    300: { value: "oklch(0.828 0.111 230.318)" },
+    400: { value: "oklch(0.746 0.16 232.661)" },
+    500: { value: "oklch(0.685 0.169 237.323)" },
+    600: { value: "oklch(0.588 0.158 241.966)" },
+    700: { value: "oklch(0.5 0.134 242.749)" },
+    800: { value: "oklch(0.443 0.11 240.79)" },
+    900: { value: "oklch(0.391 0.09 240.876)" },
+    950: { value: "oklch(0.293 0.066 243.157)" }
   },
-  emerald: {
-    50: { value: "#ecfdf5" },
-    100: { value: "#d1fae5" },
-    200: { value: "#a7f3d0" },
-    300: { value: "#6ee7b7" },
-    400: { value: "#34d399" },
-    500: { value: "#10b981" },
-    600: { value: "#059669" },
-    700: { value: "#047857" },
-    800: { value: "#065f46" },
-    900: { value: "#064e3b" },
-    950: { value: "#022c22" }
+  blue: {
+    50: { value: "oklch(0.97 0.014 254.604)" },
+    100: { value: "oklch(0.932 0.032 255.585)" },
+    200: { value: "oklch(0.882 0.059 254.128)" },
+    300: { value: "oklch(0.809 0.105 251.813)" },
+    400: { value: "oklch(0.707 0.165 254.624)" },
+    500: { value: "oklch(0.623 0.214 259.815)" },
+    600: { value: "oklch(0.546 0.245 262.881)" },
+    700: { value: "oklch(0.488 0.243 264.376)" },
+    800: { value: "oklch(0.424 0.199 265.638)" },
+    900: { value: "oklch(0.379 0.146 265.522)" },
+    950: { value: "oklch(0.282 0.091 267.935)" }
   },
-  sky: {
-    50: { value: "#f0f9ff" },
-    100: { value: "#e0f2fe" },
-    200: { value: "#bae6fd" },
-    300: { value: "#7dd3fc" },
-    400: { value: "#38bdf8" },
-    500: { value: "#0ea5e9" },
-    600: { value: "#0284c7" },
-    700: { value: "#0369a1" },
-    800: { value: "#075985" },
-    900: { value: "#0c4a6e" },
-    950: { value: "#082f49" }
+  indigo: {
+    50: { value: "oklch(0.962 0.018 272.314)" },
+    100: { value: "oklch(0.93 0.034 272.788)" },
+    200: { value: "oklch(0.87 0.065 274.039)" },
+    300: { value: "oklch(0.785 0.115 274.713)" },
+    400: { value: "oklch(0.673 0.182 276.935)" },
+    500: { value: "oklch(0.585 0.233 277.117)" },
+    600: { value: "oklch(0.511 0.262 276.966)" },
+    700: { value: "oklch(0.457 0.24 277.023)" },
+    800: { value: "oklch(0.398 0.195 277.366)" },
+    900: { value: "oklch(0.359 0.144 278.697)" },
+    950: { value: "oklch(0.257 0.09 281.288)" }
   },
   violet: {
-    50: { value: "#f5f3ff" },
-    100: { value: "#ede9fe" },
-    200: { value: "#ddd6fe" },
-    300: { value: "#c4b5fd" },
-    400: { value: "#a78bfa" },
-    500: { value: "#8b5cf6" },
-    600: { value: "#7c3aed" },
-    700: { value: "#6d28d9" },
-    800: { value: "#5b21b6" },
-    900: { value: "#4c1d95" },
-    950: { value: "#2e1065" }
+    50: { value: "oklch(0.969 0.016 293.756)" },
+    100: { value: "oklch(0.943 0.029 294.588)" },
+    200: { value: "oklch(0.894 0.057 293.283)" },
+    300: { value: "oklch(0.811 0.111 293.571)" },
+    400: { value: "oklch(0.702 0.183 293.541)" },
+    500: { value: "oklch(0.606 0.25 292.717)" },
+    600: { value: "oklch(0.541 0.281 293.009)" },
+    700: { value: "oklch(0.491 0.27 292.581)" },
+    800: { value: "oklch(0.432 0.232 292.759)" },
+    900: { value: "oklch(0.38 0.189 293.745)" },
+    950: { value: "oklch(0.283 0.141 291.089)" }
+  },
+  purple: {
+    50: { value: "oklch(0.977 0.014 308.299)" },
+    100: { value: "oklch(0.946 0.033 307.174)" },
+    200: { value: "oklch(0.902 0.063 306.703)" },
+    300: { value: "oklch(0.827 0.119 306.383)" },
+    400: { value: "oklch(0.714 0.203 305.504)" },
+    500: { value: "oklch(0.627 0.265 303.9)" },
+    600: { value: "oklch(0.558 0.288 302.321)" },
+    700: { value: "oklch(0.496 0.265 301.924)" },
+    800: { value: "oklch(0.438 0.218 303.724)" },
+    900: { value: "oklch(0.381 0.176 304.987)" },
+    950: { value: "oklch(0.291 0.149 302.717)" }
   },
   fuchsia: {
-    50: { value: "#fdf4ff" },
-    100: { value: "#fae8ff" },
-    200: { value: "#f5d0fe" },
-    300: { value: "#f0abfc" },
-    400: { value: "#e879f9" },
-    500: { value: "#d946ef" },
-    600: { value: "#c026d3" },
-    700: { value: "#a21caf" },
-    800: { value: "#86198f" },
-    900: { value: "#701a75" },
-    950: { value: "#4a044e" }
+    50: { value: "oklch(0.977 0.017 320.058)" },
+    100: { value: "oklch(0.952 0.037 318.852)" },
+    200: { value: "oklch(0.903 0.076 319.62)" },
+    300: { value: "oklch(0.833 0.145 321.434)" },
+    400: { value: "oklch(0.74 0.238 322.16)" },
+    500: { value: "oklch(0.667 0.295 322.15)" },
+    600: { value: "oklch(0.591 0.293 322.896)" },
+    700: { value: "oklch(0.518 0.253 323.949)" },
+    800: { value: "oklch(0.452 0.211 324.591)" },
+    900: { value: "oklch(0.401 0.17 325.612)" },
+    950: { value: "oklch(0.293 0.136 325.661)" }
+  },
+  pink: {
+    50: { value: "oklch(0.971 0.014 343.198)" },
+    100: { value: "oklch(0.948 0.028 342.258)" },
+    200: { value: "oklch(0.899 0.061 343.231)" },
+    300: { value: "oklch(0.823 0.12 346.018)" },
+    400: { value: "oklch(0.718 0.202 349.761)" },
+    500: { value: "oklch(0.656 0.241 354.308)" },
+    600: { value: "oklch(0.592 0.249 0.584)" },
+    700: { value: "oklch(0.525 0.223 3.958)" },
+    800: { value: "oklch(0.459 0.187 3.815)" },
+    900: { value: "oklch(0.408 0.153 2.432)" },
+    950: { value: "oklch(0.284 0.109 3.907)" }
   },
   rose: {
-    50: { value: "#fff1f2" },
-    100: { value: "#ffe4e6" },
-    200: { value: "#fecdd3" },
-    300: { value: "#fda4af" },
-    400: { value: "#fb7185" },
-    500: { value: "#f43f5e" },
-    600: { value: "#e11d48" },
-    700: { value: "#be123c" },
-    800: { value: "#9f1239" },
-    900: { value: "#881337" },
-    950: { value: "#4c0519" }
+    50: { value: "oklch(0.969 0.015 12.422)" },
+    100: { value: "oklch(0.941 0.03 12.58)" },
+    200: { value: "oklch(0.892 0.058 10.001)" },
+    300: { value: "oklch(0.81 0.117 11.638)" },
+    400: { value: "oklch(0.712 0.194 13.428)" },
+    500: { value: "oklch(0.645 0.246 16.439)" },
+    600: { value: "oklch(0.586 0.253 17.585)" },
+    700: { value: "oklch(0.514 0.222 16.935)" },
+    800: { value: "oklch(0.455 0.188 13.697)" },
+    900: { value: "oklch(0.41 0.159 10.272)" },
+    950: { value: "oklch(0.271 0.105 12.094)" }
   }
 });
 
@@ -8589,15 +8792,15 @@ var defaultConfig = (0, import_react97.mergeConfigs)(import_react97.defaultBaseC
 var defaultSystem = (0, import_react97.createSystem)(defaultConfig);
 
 // src/index.ts
-var import_react166 = require("@chakra-ui/react");
+var import_react161 = require("@chakra-ui/react");
 
 // src/provider/sui-provider.tsx
 var React = __toESM(require("react"), 1);
 var import_react98 = require("@chakra-ui/react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var SuiContext = React.createContext({});
-function SuiProvider(props2) {
-  const { linkComponent, onError, children, ...rest } = props2;
+function SuiProvider(props) {
+  const { linkComponent, onError, children, ...rest } = props;
   const context = React.useMemo(
     () => ({
       linkComponent
@@ -8641,9 +8844,9 @@ var AppShellMain = withContext(
   { forwardAsChild: true }
 );
 var AppShell = (0, import_react100.forwardRef)(
-  (props2, ref2) => {
-    const { header, sidebar, aside, footer, children, ...rootProps } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(AppShellRoot, { ref: ref2, ...rootProps, children: [
+  (props, ref) => {
+    const { header, sidebar, aside, footer, children, ...rootProps } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(AppShellRoot, { ref, ...rootProps, children: [
       header,
       /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(AppShellContent, { children: [
         sidebar,
@@ -8661,9 +8864,9 @@ var import_react102 = require("react");
 var import_react103 = require("@chakra-ui/react");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var Avatar = (0, import_react102.forwardRef)(
-  function Avatar2(props2, ref2) {
-    const { name, src, srcSet, loading, icon, fallback: fallback2, children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react103.Avatar.Root, { ref: ref2, ...rest, children: [
+  function Avatar2(props, ref) {
+    const { name, src, srcSet, loading, icon, fallback: fallback2, children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react103.Avatar.Root, { ref, ...rest, children: [
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AvatarFallback, { name, icon, children: fallback2 }),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react103.Avatar.Image, { src, srcSet, loading }),
       children
@@ -8671,9 +8874,9 @@ var Avatar = (0, import_react102.forwardRef)(
   }
 );
 var AvatarFallback = (0, import_react102.forwardRef)(
-  function AvatarFallback2(props2, ref2) {
-    const { name, icon, children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react103.Avatar.Fallback, { ref: ref2, ...rest, children: [
+  function AvatarFallback2(props, ref) {
+    const { name, icon, children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react103.Avatar.Fallback, { ref, ...rest, children: [
       children,
       name != null && children == null && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: getInitials(name) }),
       name == null && children == null && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react103.Avatar.Icon, { asChild: !!icon, children: icon })
@@ -8687,30 +8890,28 @@ function getInitials(name) {
   return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
 }
 var AvatarGroup = (0, import_react102.forwardRef)(
-  function AvatarGroup2(props2, ref2) {
-    const { size, variant, borderless, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react103.Avatar.PropsProvider, { value: { size, variant, borderless }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react103.Group, { gap: "0", spaceX: "-3", ref: ref2, ...rest }) });
+  function AvatarGroup2(props, ref) {
+    const { size, variant, borderless, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react103.Avatar.PropsProvider, { value: { size, variant, borderless }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react103.Group, { gap: "0", spaceX: "-3", ref, ...rest }) });
   }
 );
 
-// src/components/breadcrumbs/namespace.ts
-var namespace_exports = {};
-__export(namespace_exports, {
+// src/components/breadcrumb/breadcrumb.tsx
+var breadcrumb_exports = {};
+__export(breadcrumb_exports, {
   CurrentLink: () => BreadcrumbCurrentLink,
   Ellipsis: () => BreadcrumbEllipsis,
   Link: () => BreadcrumbLink,
   Root: () => BreadcrumbRoot
 });
-
-// src/components/breadcrumbs/breadcrumb.tsx
 var import_react104 = require("react");
 var import_react105 = require("@chakra-ui/react");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var BreadcrumbRoot = (0, import_react104.forwardRef)(
-  function BreadcrumbRoot2(props2, ref2) {
-    const { separator = "/", separatorGap, children, ...rest } = props2;
+  function BreadcrumbRoot2(props, ref) {
+    const { separator = "/", separatorGap, children, ...rest } = props;
     const validChildren = import_react104.Children.toArray(children).filter(import_react104.isValidElement);
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react105.Breadcrumb.Root, { ref: ref2, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react105.Breadcrumb.List, { gap: separatorGap, children: validChildren.map((child, index) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react105.Breadcrumb.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react105.Breadcrumb.List, { gap: separatorGap, children: validChildren.map((child, index) => {
       const last = index === validChildren.length - 1;
       return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react104.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react105.Breadcrumb.Item, { children: child }),
@@ -8728,7 +8929,7 @@ var import_react106 = require("react");
 var import_react107 = require("@chakra-ui/react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 var Button = (0, import_react106.forwardRef)(
-  function Button2(props2, ref2) {
+  function Button2(props, ref) {
     const {
       loading,
       disabled,
@@ -8737,14 +8938,14 @@ var Button = (0, import_react106.forwardRef)(
       variant = "glass",
       colorPalette = variant === "glass" ? "accent" : "gray",
       ...rest
-    } = props2;
+    } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       import_react107.Button,
       {
         colorPalette,
         disabled: loading || disabled,
         variant,
-        ref: ref2,
+        ref,
         ...rest,
         children: loading && !loadingText ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react107.AbsoluteCenter, { display: "inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react107.Spinner, { size: "inherit", color: "inherit" }) }),
@@ -8763,10 +8964,10 @@ var import_react108 = require("react");
 var import_react109 = require("@chakra-ui/react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var Checkbox = (0, import_react108.forwardRef)(
-  function Checkbox2(props2, ref2) {
-    const { icon, children, inputProps, rootRef, ...rest } = props2;
+  function Checkbox2(props, ref) {
+    const { icon, children, inputProps, rootRef, ...rest } = props;
     return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react109.Checkbox.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react109.Checkbox.HiddenInput, { ref: ref2, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react109.Checkbox.HiddenInput, { ref, ...inputProps }),
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react109.Checkbox.Control, { children: icon || /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react109.Checkbox.Indicator, {}) }),
       children != null && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react109.Checkbox.Label, { children })
     ] });
@@ -8779,7 +8980,7 @@ var import_react112 = require("@chakra-ui/react");
 
 // src/components/icons/create-icon.tsx
 var import_react110 = require("@chakra-ui/react");
-var createIcon = (props2) => {
+var createIcon = (props) => {
   return (0, import_react110.createIcon)({
     viewBox: "0 0 24 24",
     defaultProps: {
@@ -8789,7 +8990,7 @@ var createIcon = (props2) => {
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    ...props2
+    ...props
   });
 };
 
@@ -8879,9 +9080,9 @@ var CheckIcon = createIcon({
 // src/components/close-button/close-button.tsx
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var CloseButton = (0, import_react111.forwardRef)(
-  function CloseButton2(props2, ref2) {
+  function CloseButton2(props, ref) {
     var _a7;
-    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react112.IconButton, { variant: "ghost", "aria-label": "Close", ref: ref2, ...props2, children: (_a7 = props2.children) != null ? _a7 : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon, {}) });
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react112.IconButton, { variant: "ghost", "aria-label": "Close", ref, ...props, children: (_a7 = props.children) != null ? _a7 : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(CloseIcon, {}) });
   }
 );
 
@@ -8901,8 +9102,8 @@ var Key = ({ children }) => {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react113.Kbd, { children });
 };
-var Command = (props2) => {
-  const { children, ...rest } = props2;
+var Command = (props) => {
+  const { children, ...rest } = props;
   if (typeof children !== "string") {
     return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children });
   }
@@ -8912,14 +9113,14 @@ var Command = (props2) => {
 var CommandRoot = withContext2("span");
 
 // src/components/dialog/namespace.ts
-var namespace_exports2 = {};
-__export(namespace_exports2, {
+var namespace_exports = {};
+__export(namespace_exports, {
   ActionTrigger: () => DialogActionTrigger,
   Backdrop: () => DialogBackdrop,
   Body: () => DialogBody,
   CloseTrigger: () => DialogCloseTrigger,
   Content: () => DialogContent,
-  Context: () => DialogContext,
+  Context: () => import_dialog2.DialogContext,
   Description: () => DialogDescription,
   Footer: () => DialogFooter,
   Header: () => DialogHeader,
@@ -8929,1909 +9130,51 @@ __export(namespace_exports2, {
 });
 
 // src/components/dialog/dialog.tsx
-var import_react121 = require("react");
-var import_react122 = require("@chakra-ui/react");
-
-// ../../node_modules/proxy-compare/dist/index.js
-var TRACK_MEMO_SYMBOL = Symbol();
-var GET_ORIGINAL_SYMBOL = Symbol();
-var AFFECTED_PROPERTY = "a";
-var IS_TARGET_COPIED_PROPERTY = "f";
-var PROXY_PROPERTY = "p";
-var PROXY_CACHE_PROPERTY = "c";
-var TARGET_CACHE_PROPERTY = "t";
-var NEXT_OBJECT_PROPERTY = "n";
-var CHANGED_PROPERTY = "g";
-var HAS_KEY_PROPERTY = "h";
-var ALL_OWN_KEYS_PROPERTY = "w";
-var HAS_OWN_KEY_PROPERTY = "o";
-var KEYS_PROPERTY = "k";
-var newProxy = (target, handler) => new Proxy(target, handler);
-var getProto = Object.getPrototypeOf;
-var objectsToTrack = /* @__PURE__ */ new WeakMap();
-var isObjectToTrack = (obj) => obj && (objectsToTrack.has(obj) ? objectsToTrack.get(obj) : getProto(obj) === Object.prototype || getProto(obj) === Array.prototype);
-var isObject = (x) => typeof x === "object" && x !== null;
-var needsToCopyTargetObject = (obj) => Object.values(Object.getOwnPropertyDescriptors(obj)).some((descriptor) => !descriptor.configurable && !descriptor.writable);
-var copyTargetObject = (obj) => {
-  if (Array.isArray(obj)) {
-    return Array.from(obj);
-  }
-  const descriptors = Object.getOwnPropertyDescriptors(obj);
-  Object.values(descriptors).forEach((desc) => {
-    desc.configurable = true;
-  });
-  return Object.create(getProto(obj), descriptors);
-};
-var createProxyHandler = (origObj, isTargetCopied) => {
-  const state = {
-    [IS_TARGET_COPIED_PROPERTY]: isTargetCopied
-  };
-  let trackObject = false;
-  const recordUsage = (type, key) => {
-    if (!trackObject) {
-      let used = state[AFFECTED_PROPERTY].get(origObj);
-      if (!used) {
-        used = {};
-        state[AFFECTED_PROPERTY].set(origObj, used);
-      }
-      if (type === ALL_OWN_KEYS_PROPERTY) {
-        used[ALL_OWN_KEYS_PROPERTY] = true;
-      } else {
-        let set2 = used[type];
-        if (!set2) {
-          set2 = /* @__PURE__ */ new Set();
-          used[type] = set2;
-        }
-        set2.add(key);
-      }
-    }
-  };
-  const recordObjectAsUsed = () => {
-    trackObject = true;
-    state[AFFECTED_PROPERTY].delete(origObj);
-  };
-  const handler = {
-    get(target, key) {
-      if (key === GET_ORIGINAL_SYMBOL) {
-        return origObj;
-      }
-      recordUsage(KEYS_PROPERTY, key);
-      return createProxy(Reflect.get(target, key), state[AFFECTED_PROPERTY], state[PROXY_CACHE_PROPERTY], state[TARGET_CACHE_PROPERTY]);
-    },
-    has(target, key) {
-      if (key === TRACK_MEMO_SYMBOL) {
-        recordObjectAsUsed();
-        return true;
-      }
-      recordUsage(HAS_KEY_PROPERTY, key);
-      return Reflect.has(target, key);
-    },
-    getOwnPropertyDescriptor(target, key) {
-      recordUsage(HAS_OWN_KEY_PROPERTY, key);
-      return Reflect.getOwnPropertyDescriptor(target, key);
-    },
-    ownKeys(target) {
-      recordUsage(ALL_OWN_KEYS_PROPERTY);
-      return Reflect.ownKeys(target);
-    }
-  };
-  if (isTargetCopied) {
-    handler.set = handler.deleteProperty = () => false;
-  }
-  return [handler, state];
-};
-var getOriginalObject = (obj) => (
-  // unwrap proxy
-  obj[GET_ORIGINAL_SYMBOL] || // otherwise
-  obj
-);
-var createProxy = (obj, affected, proxyCache, targetCache2) => {
-  if (!isObjectToTrack(obj))
-    return obj;
-  let targetAndCopied = targetCache2 && targetCache2.get(obj);
-  if (!targetAndCopied) {
-    const target2 = getOriginalObject(obj);
-    if (needsToCopyTargetObject(target2)) {
-      targetAndCopied = [target2, copyTargetObject(target2)];
-    } else {
-      targetAndCopied = [target2];
-    }
-    targetCache2 === null || targetCache2 === void 0 ? void 0 : targetCache2.set(obj, targetAndCopied);
-  }
-  const [target, copiedTarget] = targetAndCopied;
-  let handlerAndState = proxyCache && proxyCache.get(target);
-  if (!handlerAndState || handlerAndState[1][IS_TARGET_COPIED_PROPERTY] !== !!copiedTarget) {
-    handlerAndState = createProxyHandler(target, !!copiedTarget);
-    handlerAndState[1][PROXY_PROPERTY] = newProxy(copiedTarget || target, handlerAndState[0]);
-    if (proxyCache) {
-      proxyCache.set(target, handlerAndState);
-    }
-  }
-  handlerAndState[1][AFFECTED_PROPERTY] = affected;
-  handlerAndState[1][PROXY_CACHE_PROPERTY] = proxyCache;
-  handlerAndState[1][TARGET_CACHE_PROPERTY] = targetCache2;
-  return handlerAndState[1][PROXY_PROPERTY];
-};
-var isAllOwnKeysChanged = (prevObj, nextObj) => {
-  const prevKeys = Reflect.ownKeys(prevObj);
-  const nextKeys = Reflect.ownKeys(nextObj);
-  return prevKeys.length !== nextKeys.length || prevKeys.some((k, i) => k !== nextKeys[i]);
-};
-var isChanged = (prevObj, nextObj, affected, cache, isEqual2 = Object.is) => {
-  if (isEqual2(prevObj, nextObj)) {
-    return false;
-  }
-  if (!isObject(prevObj) || !isObject(nextObj))
-    return true;
-  const used = affected.get(getOriginalObject(prevObj));
-  if (!used)
-    return true;
-  if (cache) {
-    const hit = cache.get(prevObj);
-    if (hit && hit[NEXT_OBJECT_PROPERTY] === nextObj) {
-      return hit[CHANGED_PROPERTY];
-    }
-    cache.set(prevObj, {
-      [NEXT_OBJECT_PROPERTY]: nextObj,
-      [CHANGED_PROPERTY]: false
-    });
-  }
-  let changed = null;
-  try {
-    for (const key of used[HAS_KEY_PROPERTY] || []) {
-      changed = Reflect.has(prevObj, key) !== Reflect.has(nextObj, key);
-      if (changed)
-        return changed;
-    }
-    if (used[ALL_OWN_KEYS_PROPERTY] === true) {
-      changed = isAllOwnKeysChanged(prevObj, nextObj);
-      if (changed)
-        return changed;
-    } else {
-      for (const key of used[HAS_OWN_KEY_PROPERTY] || []) {
-        const hasPrev = !!Reflect.getOwnPropertyDescriptor(prevObj, key);
-        const hasNext = !!Reflect.getOwnPropertyDescriptor(nextObj, key);
-        changed = hasPrev !== hasNext;
-        if (changed)
-          return changed;
-      }
-    }
-    for (const key of used[KEYS_PROPERTY] || []) {
-      changed = isChanged(prevObj[key], nextObj[key], affected, cache, isEqual2);
-      if (changed)
-        return changed;
-    }
-    if (changed === null)
-      changed = true;
-    return changed;
-  } finally {
-    if (cache) {
-      cache.set(prevObj, {
-        [NEXT_OBJECT_PROPERTY]: nextObj,
-        [CHANGED_PROPERTY]: changed
-      });
-    }
-  }
-};
-var getUntracked = (obj) => {
-  if (isObjectToTrack(obj)) {
-    return obj[GET_ORIGINAL_SYMBOL] || null;
-  }
-  return null;
-};
-var markToTrack = (obj, mark = true) => {
-  objectsToTrack.set(obj, mark);
-};
-
-// ../../node_modules/@zag-js/store/dist/index.mjs
-function getGlobal() {
-  if (typeof globalThis !== "undefined") return globalThis;
-  if (typeof self !== "undefined") return self;
-  if (typeof window !== "undefined") return window;
-  if (typeof global !== "undefined") return global;
-}
-function makeGlobal(key, value) {
-  const g = getGlobal();
-  if (!g) return value();
-  g[key] || (g[key] = value());
-  return g[key];
-}
-var isDev = () => process.env.NODE_ENV !== "production";
-var isObject2 = (x) => typeof x === "object" && x !== null;
-var proxyStateMap = makeGlobal("__zag__proxyStateMap", () => /* @__PURE__ */ new WeakMap());
-var refSet = makeGlobal("__zag__refSet", () => /* @__PURE__ */ new WeakSet());
-var isReactElement = (x) => typeof x === "object" && x !== null && "$$typeof" in x;
-var isVueElement = (x) => typeof x === "object" && x !== null && "__v_isVNode" in x;
-var isDOMElement = (x) => typeof x === "object" && x !== null && "nodeType" in x && typeof x.nodeName === "string";
-var isElement = (x) => isReactElement(x) || isVueElement(x) || isDOMElement(x);
-var buildProxyFunction = (objectIs = Object.is, newProxy2 = (target, handler) => new Proxy(target, handler), canProxy = (x) => isObject2(x) && !refSet.has(x) && (Array.isArray(x) || !(Symbol.iterator in x)) && !isElement(x) && !(x instanceof WeakMap) && !(x instanceof WeakSet) && !(x instanceof Error) && !(x instanceof Number) && !(x instanceof Date) && !(x instanceof String) && !(x instanceof RegExp) && !(x instanceof ArrayBuffer), defaultHandlePromise = (promise) => {
-  switch (promise.status) {
-    case "fulfilled":
-      return promise.value;
-    case "rejected":
-      throw promise.reason;
-    default:
-      throw promise;
-  }
-}, snapCache = /* @__PURE__ */ new WeakMap(), createSnapshot = (target, version, handlePromise = defaultHandlePromise) => {
-  const cache = snapCache.get(target);
-  if ((cache == null ? void 0 : cache[0]) === version) {
-    return cache[1];
-  }
-  const snap = Array.isArray(target) ? [] : Object.create(Object.getPrototypeOf(target));
-  markToTrack(snap, true);
-  snapCache.set(target, [version, snap]);
-  Reflect.ownKeys(target).forEach((key) => {
-    const value = Reflect.get(target, key);
-    if (refSet.has(value)) {
-      markToTrack(value, false);
-      snap[key] = value;
-    } else if (value instanceof Promise) {
-      Object.defineProperty(snap, key, {
-        get() {
-          return handlePromise(value);
-        }
-      });
-    } else if (proxyStateMap.has(value)) {
-      snap[key] = snapshot(value, handlePromise);
-    } else {
-      snap[key] = value;
-    }
-  });
-  return Object.freeze(snap);
-}, proxyCache = /* @__PURE__ */ new WeakMap(), versionHolder = [1, 1], proxyFunction2 = (initialObject) => {
-  if (!isObject2(initialObject)) {
-    throw new Error("object required");
-  }
-  const found = proxyCache.get(initialObject);
-  if (found) {
-    return found;
-  }
-  let version = versionHolder[0];
-  const listeners = /* @__PURE__ */ new Set();
-  const notifyUpdate = (op, nextVersion = ++versionHolder[0]) => {
-    if (version !== nextVersion) {
-      version = nextVersion;
-      listeners.forEach((listener) => listener(op, nextVersion));
-    }
-  };
-  let checkVersion = versionHolder[1];
-  const ensureVersion = (nextCheckVersion = ++versionHolder[1]) => {
-    if (checkVersion !== nextCheckVersion && !listeners.size) {
-      checkVersion = nextCheckVersion;
-      propProxyStates.forEach(([propProxyState]) => {
-        const propVersion = propProxyState[1](nextCheckVersion);
-        if (propVersion > version) {
-          version = propVersion;
-        }
-      });
-    }
-    return version;
-  };
-  const createPropListener = (prop) => (op, nextVersion) => {
-    const newOp = [...op];
-    newOp[1] = [prop, ...newOp[1]];
-    notifyUpdate(newOp, nextVersion);
-  };
-  const propProxyStates = /* @__PURE__ */ new Map();
-  const addPropListener = (prop, propProxyState) => {
-    if (isDev() && propProxyStates.has(prop)) {
-      throw new Error("prop listener already exists");
-    }
-    if (listeners.size) {
-      const remove = propProxyState[3](createPropListener(prop));
-      propProxyStates.set(prop, [propProxyState, remove]);
-    } else {
-      propProxyStates.set(prop, [propProxyState]);
-    }
-  };
-  const removePropListener = (prop) => {
-    var _a7;
-    const entry = propProxyStates.get(prop);
-    if (entry) {
-      propProxyStates.delete(prop);
-      (_a7 = entry[1]) == null ? void 0 : _a7.call(entry);
-    }
-  };
-  const addListener = (listener) => {
-    listeners.add(listener);
-    if (listeners.size === 1) {
-      propProxyStates.forEach(([propProxyState, prevRemove], prop) => {
-        if (isDev() && prevRemove) {
-          throw new Error("remove already exists");
-        }
-        const remove = propProxyState[3](createPropListener(prop));
-        propProxyStates.set(prop, [propProxyState, remove]);
-      });
-    }
-    const removeListener = () => {
-      listeners.delete(listener);
-      if (listeners.size === 0) {
-        propProxyStates.forEach(([propProxyState, remove], prop) => {
-          if (remove) {
-            remove();
-            propProxyStates.set(prop, [propProxyState]);
-          }
-        });
-      }
-    };
-    return removeListener;
-  };
-  const baseObject = Array.isArray(initialObject) ? [] : Object.create(Object.getPrototypeOf(initialObject));
-  const handler = {
-    deleteProperty(target, prop) {
-      const prevValue = Reflect.get(target, prop);
-      removePropListener(prop);
-      const deleted = Reflect.deleteProperty(target, prop);
-      if (deleted) {
-        notifyUpdate(["delete", [prop], prevValue]);
-      }
-      return deleted;
-    },
-    set(target, prop, value, receiver) {
-      var _a7;
-      const hasPrevValue = Reflect.has(target, prop);
-      const prevValue = Reflect.get(target, prop, receiver);
-      if (hasPrevValue && (objectIs(prevValue, value) || proxyCache.has(value) && objectIs(prevValue, proxyCache.get(value)))) {
-        return true;
-      }
-      removePropListener(prop);
-      if (isObject2(value)) {
-        value = getUntracked(value) || value;
-      }
-      let nextValue = value;
-      if ((_a7 = Object.getOwnPropertyDescriptor(target, prop)) == null ? void 0 : _a7.set) ;
-      else if (value instanceof Promise) {
-        value.then((v) => {
-          Object.assign(value, { status: "fulfilled", value: v });
-          notifyUpdate(["resolve", [prop], v]);
-        }).catch((e) => {
-          Object.assign(value, { status: "rejected", reason: e });
-          notifyUpdate(["reject", [prop], e]);
-        });
-      } else {
-        if (!proxyStateMap.has(value) && canProxy(value)) {
-          nextValue = proxy(value);
-        }
-        const childProxyState = !refSet.has(nextValue) && proxyStateMap.get(nextValue);
-        if (childProxyState) {
-          addPropListener(prop, childProxyState);
-        }
-      }
-      Reflect.set(target, prop, nextValue, receiver);
-      notifyUpdate(["set", [prop], value, prevValue]);
-      return true;
-    }
-  };
-  const proxyObject = newProxy2(baseObject, handler);
-  proxyCache.set(initialObject, proxyObject);
-  const proxyState = [baseObject, ensureVersion, createSnapshot, addListener];
-  proxyStateMap.set(proxyObject, proxyState);
-  Reflect.ownKeys(initialObject).forEach((key) => {
-    const desc = Object.getOwnPropertyDescriptor(initialObject, key);
-    if (desc.get || desc.set) {
-      Object.defineProperty(baseObject, key, desc);
-    } else {
-      proxyObject[key] = initialObject[key];
-    }
-  });
-  return proxyObject;
-}) => [
-  // public functions
-  proxyFunction2,
-  // shared state
-  proxyStateMap,
-  refSet,
-  // internal things
-  objectIs,
-  newProxy2,
-  canProxy,
-  defaultHandlePromise,
-  snapCache,
-  createSnapshot,
-  proxyCache,
-  versionHolder
-];
-var [proxyFunction] = buildProxyFunction();
-function proxy(initialObject = {}) {
-  return proxyFunction(initialObject);
-}
-function subscribe(proxyObject, callback, notifyInSync) {
-  const proxyState = proxyStateMap.get(proxyObject);
-  if (isDev() && !proxyState) {
-    console.warn("Please use proxy object");
-  }
-  let promise;
-  const ops = [];
-  const addListener = proxyState[3];
-  let isListenerActive = false;
-  const listener = (op) => {
-    ops.push(op);
-    if (notifyInSync) {
-      callback(ops.splice(0));
-      return;
-    }
-    if (!promise) {
-      promise = Promise.resolve().then(() => {
-        promise = void 0;
-        if (isListenerActive) {
-          callback(ops.splice(0));
-        }
-      });
-    }
-  };
-  const removeListener = addListener(listener);
-  isListenerActive = true;
-  return () => {
-    isListenerActive = false;
-    removeListener();
-  };
-}
-function snapshot(proxyObject, handlePromise) {
-  const proxyState = proxyStateMap.get(proxyObject);
-  if (isDev() && !proxyState) {
-    console.warn("Please use proxy object");
-  }
-  const [target, ensureVersion, createSnapshot] = proxyState;
-  return createSnapshot(target, ensureVersion(), handlePromise);
-}
-function ref(obj) {
-  refSet.add(obj);
-  return obj;
-}
-function proxyWithComputed(initialObject, computedFns) {
-  const keys = Object.keys(computedFns);
-  keys.forEach((key) => {
-    if (Object.getOwnPropertyDescriptor(initialObject, key)) {
-      throw new Error("object property already defined");
-    }
-    const computedFn = computedFns[key];
-    const { get, set: set2 } = typeof computedFn === "function" ? { get: computedFn } : computedFn;
-    const desc = {};
-    desc.get = () => get(snapshot(proxyObject));
-    if (set2) {
-      desc.set = (newValue) => set2(proxyObject, newValue);
-    }
-    Object.defineProperty(initialObject, key, desc);
-  });
-  const proxyObject = proxy(initialObject);
-  return proxyObject;
-}
-
-// ../../node_modules/@zag-js/utils/dist/index.mjs
-function clear(v) {
-  while (v.length > 0) v.pop();
-  return v;
-}
-var runIfFn = (v, ...a) => {
-  const res = typeof v === "function" ? v(...a) : v;
-  return res != null ? res : void 0;
-};
-var cast = (v) => v;
-var noop = () => {
-};
-var callAll = (...fns) => (...a) => {
-  fns.forEach(function(fn) {
-    fn == null ? void 0 : fn(...a);
-  });
-};
-var uuid = /* @__PURE__ */ (() => {
-  let id = 0;
-  return () => {
-    id++;
-    return id.toString(36);
-  };
-})();
-var isDev2 = () => process.env.NODE_ENV !== "production";
-var isArray = (v) => Array.isArray(v);
-var isObjectLike = (v) => v != null && typeof v === "object";
-var isObject3 = (v) => isObjectLike(v) && !isArray(v);
-var isNumber = (v) => typeof v === "number" && !Number.isNaN(v);
-var isString = (v) => typeof v === "string";
-var isFunction = (v) => typeof v === "function";
-var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
-var baseGetTag = (v) => Object.prototype.toString.call(v);
-var fnToString = Function.prototype.toString;
-var objectCtorString = fnToString.call(Object);
-var isPlainObject = (v) => {
-  if (!isObjectLike(v) || baseGetTag(v) != "[object Object]") return false;
-  const proto = Object.getPrototypeOf(v);
-  if (proto === null) return true;
-  const Ctor = hasProp(proto, "constructor") && proto.constructor;
-  return typeof Ctor == "function" && Ctor instanceof Ctor && fnToString.call(Ctor) == objectCtorString;
-};
-function compact(obj) {
-  if (!isPlainObject2(obj) || obj === void 0) {
-    return obj;
-  }
-  const keys = Reflect.ownKeys(obj).filter((key) => typeof key === "string");
-  const filtered = {};
-  for (const key of keys) {
-    const value = obj[key];
-    if (value !== void 0) {
-      filtered[key] = compact(value);
-    }
-  }
-  return filtered;
-}
-var isPlainObject2 = (value) => {
-  return value && typeof value === "object" && value.constructor === Object;
-};
-function warn(...a) {
-  const m = a.length === 1 ? a[0] : a[1];
-  const c = a.length === 2 ? a[0] : true;
-  if (c && process.env.NODE_ENV !== "production") {
-    console.warn(m);
-  }
-}
-function invariant(...a) {
-  const m = a.length === 1 ? a[0] : a[1];
-  const c = a.length === 2 ? a[0] : true;
-  if (c && process.env.NODE_ENV !== "production") {
-    throw new Error(m);
-  }
-}
-
-// ../../node_modules/klona/full/index.mjs
-function set(obj, key, val) {
-  if (typeof val.value === "object") val.value = klona(val.value);
-  if (!val.enumerable || val.get || val.set || !val.configurable || !val.writable || key === "__proto__") {
-    Object.defineProperty(obj, key, val);
-  } else obj[key] = val.value;
-}
-function klona(x) {
-  if (typeof x !== "object") return x;
-  var i = 0, k, list, tmp, str = Object.prototype.toString.call(x);
-  if (str === "[object Object]") {
-    tmp = Object.create(x.__proto__ || null);
-  } else if (str === "[object Array]") {
-    tmp = Array(x.length);
-  } else if (str === "[object Set]") {
-    tmp = /* @__PURE__ */ new Set();
-    x.forEach(function(val) {
-      tmp.add(klona(val));
-    });
-  } else if (str === "[object Map]") {
-    tmp = /* @__PURE__ */ new Map();
-    x.forEach(function(val, key) {
-      tmp.set(klona(key), klona(val));
-    });
-  } else if (str === "[object Date]") {
-    tmp = /* @__PURE__ */ new Date(+x);
-  } else if (str === "[object RegExp]") {
-    tmp = new RegExp(x.source, x.flags);
-  } else if (str === "[object DataView]") {
-    tmp = new x.constructor(klona(x.buffer));
-  } else if (str === "[object ArrayBuffer]") {
-    tmp = x.slice(0);
-  } else if (str.slice(-6) === "Array]") {
-    tmp = new x.constructor(x);
-  }
-  if (tmp) {
-    for (list = Object.getOwnPropertySymbols(x); i < list.length; i++) {
-      set(tmp, list[i], Object.getOwnPropertyDescriptor(x, list[i]));
-    }
-    for (i = 0, list = Object.getOwnPropertyNames(x); i < list.length; i++) {
-      if (Object.hasOwnProperty.call(tmp, k = list[i]) && tmp[k] === x[k]) continue;
-      set(tmp, k, Object.getOwnPropertyDescriptor(x, k));
-    }
-  }
-  return tmp || x;
-}
-
-// ../../node_modules/@zag-js/core/dist/index.mjs
-var __defProp2 = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-function deepMerge(source, ...objects) {
-  for (const obj of objects) {
-    const target = compact(obj);
-    for (const key in target) {
-      if (isPlainObject(obj[key])) {
-        if (!source[key]) {
-          source[key] = {};
-        }
-        deepMerge(source[key], obj[key]);
-      } else {
-        source[key] = obj[key];
-      }
-    }
-  }
-  return source;
-}
-function structuredClone(v) {
-  return klona(v);
-}
-function toEvent(event) {
-  const obj = isString(event) ? { type: event } : event;
-  return obj;
-}
-function toArray(value) {
-  if (!value) return [];
-  return isArray(value) ? value.slice() : [value];
-}
-function isGuardHelper(value) {
-  return isObject3(value) && value.predicate != null;
-}
-var Truthy = () => true;
-function determineGuardFn(guard, guardMap) {
-  guard = guard != null ? guard : Truthy;
-  return (context, event, meta) => {
-    if (isString(guard)) {
-      const value = guardMap[guard];
-      return isFunction(value) ? value(context, event, meta) : value;
-    }
-    if (isGuardHelper(guard)) {
-      return guard.predicate(guardMap)(context, event, meta);
-    }
-    return guard == null ? void 0 : guard(context, event, meta);
-  };
-}
-function determineActionsFn(values, guardMap) {
-  return (context, event, meta) => {
-    if (isGuardHelper(values)) {
-      return values.predicate(guardMap)(context, event, meta);
-    }
-    return values;
-  };
-}
-function createProxy2(config) {
-  var _a7, _b6, _c5, _d5, _e5;
-  const computedContext = (_a7 = config.computed) != null ? _a7 : cast({});
-  const initialContext = (_b6 = config.context) != null ? _b6 : cast({});
-  const initialTags = config.initial ? (_d5 = (_c5 = config.states) == null ? void 0 : _c5[config.initial]) == null ? void 0 : _d5.tags : [];
-  const state = proxy({
-    value: (_e5 = config.initial) != null ? _e5 : "",
-    previousValue: "",
-    event: cast({}),
-    previousEvent: cast({}),
-    context: proxyWithComputed(initialContext, computedContext),
-    done: false,
-    tags: initialTags != null ? initialTags : [],
-    hasTag(tag) {
-      return this.tags.includes(tag);
-    },
-    matches(...value) {
-      return value.includes(this.value);
-    },
-    can(event) {
-      return cast(this).nextEvents.includes(event);
-    },
-    get nextEvents() {
-      var _a8, _b7, _c6, _d6;
-      const stateEvents = (_c6 = (_b7 = (_a8 = config.states) == null ? void 0 : _a8[this.value]) == null ? void 0 : _b7["on"]) != null ? _c6 : {};
-      const globalEvents = (_d6 = config == null ? void 0 : config.on) != null ? _d6 : {};
-      return Object.keys({ ...stateEvents, ...globalEvents });
-    },
-    get changed() {
-      if (this.event.value === "machine.init" || !this.previousValue) return false;
-      return this.value !== this.previousValue;
-    }
-  });
-  return cast(state);
-}
-function determineDelayFn(delay, delaysMap) {
-  return (context, event) => {
-    if (isNumber(delay)) return delay;
-    if (isFunction(delay)) {
-      return delay(context, event);
-    }
-    if (isString(delay)) {
-      const value = Number.parseFloat(delay);
-      if (!Number.isNaN(value)) {
-        return value;
-      }
-      if (delaysMap) {
-        const valueOrFn = delaysMap == null ? void 0 : delaysMap[delay];
-        invariant(
-          valueOrFn == null,
-          `[@zag-js/core > determine-delay] Cannot determine delay for \`${delay}\`. It doesn't exist in \`options.delays\``
-        );
-        return isFunction(valueOrFn) ? valueOrFn(context, event) : valueOrFn;
-      }
-    }
-  };
-}
-function toTarget(target) {
-  return isString(target) ? { target } : target;
-}
-function determineTransitionFn(transitions, guardMap) {
-  return (context, event, meta) => {
-    return toArray(transitions).map(toTarget).find((transition) => {
-      var _a7;
-      const determineGuard = determineGuardFn(transition.guard, guardMap);
-      const guard = determineGuard(context, event, meta);
-      return (_a7 = guard != null ? guard : transition.target) != null ? _a7 : transition.actions;
-    });
-  };
-}
-var Machine = class {
-  // Let's get started!
-  constructor(config, options) {
-    var _a7, _b6, _c5, _d5, _e5, _f5, _g5, _h3, _i3, _j3, _k3;
-    __publicField(
-      this,
-      "status",
-      "Not Started"
-      /* NotStarted */
-    );
-    __publicField(this, "state");
-    __publicField(this, "initialState");
-    __publicField(this, "initialContext");
-    __publicField(this, "id");
-    __publicField(
-      this,
-      "type",
-      "machine"
-      /* Machine */
-    );
-    __publicField(this, "activityEvents", /* @__PURE__ */ new Map());
-    __publicField(this, "delayedEvents", /* @__PURE__ */ new Map());
-    __publicField(this, "stateListeners", /* @__PURE__ */ new Set());
-    __publicField(this, "doneListeners", /* @__PURE__ */ new Set());
-    __publicField(this, "contextWatchers", /* @__PURE__ */ new Set());
-    __publicField(this, "removeStateListener", noop);
-    __publicField(this, "parent");
-    __publicField(this, "children", /* @__PURE__ */ new Map());
-    __publicField(this, "guardMap");
-    __publicField(this, "actionMap");
-    __publicField(this, "delayMap");
-    __publicField(this, "activityMap");
-    __publicField(this, "sync");
-    __publicField(this, "options");
-    __publicField(this, "config");
-    __publicField(this, "_created", () => {
-      var _a8;
-      const event = toEvent(
-        "machine.created"
-        /* Created */
-      );
-      this.executeActions((_a8 = this.config) == null ? void 0 : _a8.created, event);
-    });
-    __publicField(this, "start", (init) => {
-      this.state.value = "";
-      this.state.tags = [];
-      if (this.status === "Running") {
-        return this;
-      }
-      this.status = "Running";
-      this.removeStateListener = subscribe(
-        this.state,
-        () => {
-          this.stateListeners.forEach((listener) => {
-            listener(this.stateSnapshot);
-          });
-        },
-        this.sync
-      );
-      this.setupContextWatchers();
-      this.executeActivities(
-        toEvent(
-          "machine.start"
-          /* Start */
-        ),
-        toArray(this.config.activities),
-        "machine.start"
-        /* Start */
-      );
-      this.executeActions(this.config.entry, toEvent(
-        "machine.start"
-        /* Start */
-      ));
-      const event = toEvent(
-        "machine.init"
-        /* Init */
-      );
-      const target = isObject3(init) ? init.value : init;
-      const context = isObject3(init) ? init.context : void 0;
-      if (context) {
-        this.setContext(context);
-      }
-      const transition = {
-        target: target != null ? target : this.config.initial
-      };
-      const next = this.getNextStateInfo(transition, event);
-      this.initialState = next;
-      this.performStateChangeEffects(this.state.value, next, event);
-      return this;
-    });
-    __publicField(this, "setupContextWatchers", () => {
-      const { watch } = this.config;
-      if (!watch) return;
-      let prev = snapshot(this.state.context);
-      const cleanup = subscribe(this.state.context, () => {
-        var _a8, _b7;
-        const next = snapshot(this.state.context);
-        for (const [key, fn] of Object.entries(watch)) {
-          const isEqual2 = (_b7 = (_a8 = this.options.compareFns) == null ? void 0 : _a8[key]) != null ? _b7 : Object.is;
-          if (isEqual2(prev[key], next[key])) continue;
-          this.executeActions(fn, this.state.event);
-        }
-        prev = next;
-      });
-      this.contextWatchers.add(cleanup);
-    });
-    __publicField(this, "stop", () => {
-      if (this.status === "Stopped") return;
-      this.performExitEffects(this.state.value, toEvent(
-        "machine.stop"
-        /* Stop */
-      ));
-      this.executeActions(this.config.exit, toEvent(
-        "machine.stop"
-        /* Stop */
-      ));
-      this.setState("");
-      this.setEvent(
-        "machine.stop"
-        /* Stop */
-      );
-      this.stopStateListeners();
-      this.stopChildren();
-      this.stopActivities();
-      this.stopDelayedEvents();
-      this.stopContextWatchers();
-      this.status = "Stopped";
-      return this;
-    });
-    __publicField(this, "stopStateListeners", () => {
-      this.removeStateListener();
-      this.stateListeners.clear();
-    });
-    __publicField(this, "stopContextWatchers", () => {
-      this.contextWatchers.forEach((fn) => fn());
-      this.contextWatchers.clear();
-    });
-    __publicField(this, "stopDelayedEvents", () => {
-      this.delayedEvents.forEach((state) => {
-        state.forEach((stop) => stop());
-      });
-      this.delayedEvents.clear();
-    });
-    __publicField(this, "stopActivities", (state) => {
-      var _a8, _b7;
-      if (state) {
-        (_a8 = this.activityEvents.get(state)) == null ? void 0 : _a8.forEach((stop) => stop());
-        (_b7 = this.activityEvents.get(state)) == null ? void 0 : _b7.clear();
-        this.activityEvents.delete(state);
-      } else {
-        this.activityEvents.forEach((state2) => {
-          state2.forEach((stop) => stop());
-          state2.clear();
-        });
-        this.activityEvents.clear();
-      }
-    });
-    __publicField(this, "sendChild", (evt, to) => {
-      const event = toEvent(evt);
-      const id = runIfFn(to, this.contextSnapshot);
-      const child = this.children.get(id);
-      if (!child) {
-        invariant(`[@zag-js/core] Cannot send '${event.type}' event to unknown child`);
-      }
-      child.send(event);
-    });
-    __publicField(this, "stopChild", (id) => {
-      if (!this.children.has(id)) {
-        invariant(`[@zag-js/core > stop-child] Cannot stop unknown child ${id}`);
-      }
-      this.children.get(id).stop();
-      this.children.delete(id);
-    });
-    __publicField(this, "removeChild", (id) => {
-      this.children.delete(id);
-    });
-    __publicField(this, "stopChildren", () => {
-      this.children.forEach((child) => child.stop());
-      this.children.clear();
-    });
-    __publicField(this, "setParent", (parent) => {
-      this.parent = parent;
-    });
-    __publicField(this, "spawn", (src, id) => {
-      const actor = runIfFn(src);
-      if (id) actor.id = id;
-      actor.type = "machine.actor";
-      actor.setParent(this);
-      this.children.set(actor.id, cast(actor));
-      actor.onDone(() => {
-        this.removeChild(actor.id);
-      }).start();
-      return cast(ref(actor));
-    });
-    __publicField(this, "stopActivity", (key) => {
-      var _a8;
-      if (!this.state.value) return;
-      const cleanups = this.activityEvents.get(this.state.value);
-      (_a8 = cleanups == null ? void 0 : cleanups.get(key)) == null ? void 0 : _a8();
-      cleanups == null ? void 0 : cleanups.delete(key);
-    });
-    __publicField(this, "addActivityCleanup", (state, key, cleanup) => {
-      var _a8;
-      if (!state) return;
-      if (!this.activityEvents.has(state)) {
-        this.activityEvents.set(state, /* @__PURE__ */ new Map([[key, cleanup]]));
-      } else {
-        (_a8 = this.activityEvents.get(state)) == null ? void 0 : _a8.set(key, cleanup);
-      }
-    });
-    __publicField(this, "setState", (target) => {
-      this.state.previousValue = this.state.value;
-      this.state.value = target;
-      const stateNode = this.getStateNode(target);
-      if (target == null) {
-        clear(this.state.tags);
-      } else {
-        this.state.tags = toArray(stateNode == null ? void 0 : stateNode.tags);
-      }
-    });
-    __publicField(this, "setContext", (context) => {
-      if (!context) return;
-      deepMerge(this.state.context, compact(context));
-    });
-    __publicField(this, "setOptions", (options2) => {
-      const opts = compact(options2);
-      this.actionMap = { ...this.actionMap, ...opts.actions };
-      this.delayMap = { ...this.delayMap, ...opts.delays };
-      this.activityMap = { ...this.activityMap, ...opts.activities };
-      this.guardMap = { ...this.guardMap, ...opts.guards };
-    });
-    __publicField(this, "getStateNode", (state) => {
-      var _a8;
-      if (!state) return;
-      return (_a8 = this.config.states) == null ? void 0 : _a8[state];
-    });
-    __publicField(this, "getNextStateInfo", (transitions, event) => {
-      var _a8;
-      const transition = this.determineTransition(transitions, event);
-      const isTargetless = !(transition == null ? void 0 : transition.target);
-      const target = (_a8 = transition == null ? void 0 : transition.target) != null ? _a8 : this.state.value;
-      const changed = this.state.value !== target;
-      const stateNode = this.getStateNode(target);
-      const reenter = !isTargetless && !changed && !(transition == null ? void 0 : transition.internal);
-      const info = {
-        reenter,
-        transition,
-        stateNode,
-        target,
-        changed
-      };
-      this.log("NextState:", `[${event.type}]`, this.state.value, "---->", info.target);
-      return info;
-    });
-    __publicField(this, "getAfterActions", (transition, delay) => {
-      let id;
-      const current = this.state.value;
-      return {
-        entry: () => {
-          id = globalThis.setTimeout(() => {
-            const next = this.getNextStateInfo(transition, this.state.event);
-            this.performStateChangeEffects(current, next, this.state.event);
-          }, delay);
-        },
-        exit: () => {
-          globalThis.clearTimeout(id);
-        }
-      };
-    });
-    __publicField(this, "getDelayedEventActions", (state) => {
-      const stateNode = this.getStateNode(state);
-      const event = this.state.event;
-      if (!stateNode || !stateNode.after) return;
-      const entries = [];
-      const exits = [];
-      if (isArray(stateNode.after)) {
-        const transition = this.determineTransition(stateNode.after, event);
-        if (!transition) return;
-        if (!hasProp(transition, "delay")) {
-          throw new Error(`[@zag-js/core > after] Delay is required for after transition: ${JSON.stringify(transition)}`);
-        }
-        const determineDelay = determineDelayFn(transition.delay, this.delayMap);
-        const __delay = determineDelay(this.contextSnapshot, event);
-        const actions = this.getAfterActions(transition, __delay);
-        entries.push(actions.entry);
-        exits.push(actions.exit);
-        return { entries, exits };
-      }
-      if (isObject3(stateNode.after)) {
-        for (const delay in stateNode.after) {
-          const transition = stateNode.after[delay];
-          const determineDelay = determineDelayFn(delay, this.delayMap);
-          const __delay = determineDelay(this.contextSnapshot, event);
-          const actions = this.getAfterActions(transition, __delay);
-          entries.push(actions.entry);
-          exits.push(actions.exit);
-        }
-      }
-      return { entries, exits };
-    });
-    __publicField(this, "executeActions", (actions, event) => {
-      var _a8;
-      const pickedActions = determineActionsFn(actions, this.guardMap)(this.contextSnapshot, event, this.guardMeta);
-      for (const action of toArray(pickedActions)) {
-        const fn = isString(action) ? (_a8 = this.actionMap) == null ? void 0 : _a8[action] : action;
-        warn(
-          isString(action) && !fn,
-          `[@zag-js/core > execute-actions] No implementation found for action: \`${action}\``
-        );
-        fn == null ? void 0 : fn(this.state.context, event, this.meta);
-      }
-    });
-    __publicField(this, "executeActivities", (event, activities, state) => {
-      var _a8;
-      for (const activity of activities) {
-        const fn = isString(activity) ? (_a8 = this.activityMap) == null ? void 0 : _a8[activity] : activity;
-        if (!fn) {
-          warn(`[@zag-js/core > execute-activity] No implementation found for activity: \`${activity}\``);
-          continue;
-        }
-        const cleanup = fn(this.state.context, event, this.meta);
-        if (cleanup) {
-          const key = isString(activity) ? activity : activity.name || uuid();
-          this.addActivityCleanup(state != null ? state : this.state.value, key, cleanup);
-        }
-      }
-    });
-    __publicField(this, "createEveryActivities", (every, callbackfn) => {
-      if (!every) return;
-      if (isArray(every)) {
-        const picked = toArray(every).find((transition) => {
-          const delayOrFn = transition.delay;
-          const determineDelay2 = determineDelayFn(delayOrFn, this.delayMap);
-          const delay2 = determineDelay2(this.contextSnapshot, this.state.event);
-          const determineGuard = determineGuardFn(transition.guard, this.guardMap);
-          const guard = determineGuard(this.contextSnapshot, this.state.event, this.guardMeta);
-          return guard != null ? guard : delay2 != null;
-        });
-        if (!picked) return;
-        const determineDelay = determineDelayFn(picked.delay, this.delayMap);
-        const delay = determineDelay(this.contextSnapshot, this.state.event);
-        const activity = () => {
-          const id = globalThis.setInterval(() => {
-            this.executeActions(picked.actions, this.state.event);
-          }, delay);
-          return () => {
-            globalThis.clearInterval(id);
-          };
-        };
-        callbackfn(activity);
-      } else {
-        for (const interval in every) {
-          const actions = every == null ? void 0 : every[interval];
-          const determineDelay = determineDelayFn(interval, this.delayMap);
-          const delay = determineDelay(this.contextSnapshot, this.state.event);
-          const activity = () => {
-            const id = globalThis.setInterval(() => {
-              this.executeActions(actions, this.state.event);
-            }, delay);
-            return () => {
-              globalThis.clearInterval(id);
-            };
-          };
-          callbackfn(activity);
-        }
-      }
-    });
-    __publicField(this, "setEvent", (event) => {
-      this.state.previousEvent = this.state.event;
-      this.state.event = ref(toEvent(event));
-    });
-    __publicField(this, "performExitEffects", (current, event) => {
-      const currentState = this.state.value;
-      if (currentState === "") return;
-      const stateNode = current ? this.getStateNode(current) : void 0;
-      this.stopActivities(currentState);
-      const _exit = determineActionsFn(stateNode == null ? void 0 : stateNode.exit, this.guardMap)(this.contextSnapshot, event, this.guardMeta);
-      const exitActions = toArray(_exit);
-      const afterExitActions = this.delayedEvents.get(currentState);
-      if (afterExitActions) {
-        exitActions.push(...afterExitActions);
-      }
-      this.executeActions(exitActions, event);
-      this.delayedEvents.delete(currentState);
-    });
-    __publicField(this, "performEntryEffects", (next, event) => {
-      const stateNode = this.getStateNode(next);
-      const activities = toArray(stateNode == null ? void 0 : stateNode.activities);
-      this.createEveryActivities(stateNode == null ? void 0 : stateNode.every, (activity) => {
-        activities.unshift(activity);
-      });
-      if (activities.length > 0) {
-        this.executeActivities(event, activities);
-      }
-      const pickedActions = determineActionsFn(stateNode == null ? void 0 : stateNode.entry, this.guardMap)(
-        this.contextSnapshot,
-        event,
-        this.guardMeta
-      );
-      const entryActions = toArray(pickedActions);
-      const afterActions = this.getDelayedEventActions(next);
-      if ((stateNode == null ? void 0 : stateNode.after) && afterActions) {
-        this.delayedEvents.set(next, afterActions == null ? void 0 : afterActions.exits);
-        entryActions.push(...afterActions.entries);
-      }
-      this.executeActions(entryActions, event);
-      if ((stateNode == null ? void 0 : stateNode.type) === "final") {
-        this.state.done = true;
-        this.doneListeners.forEach((listener) => {
-          listener(this.stateSnapshot);
-        });
-        this.stop();
-      }
-    });
-    __publicField(this, "performTransitionEffects", (transitions, event) => {
-      const transition = this.determineTransition(transitions, event);
-      this.executeActions(transition == null ? void 0 : transition.actions, event);
-    });
-    __publicField(this, "performStateChangeEffects", (current, next, event) => {
-      this.setEvent(event);
-      const changed = next.changed || next.reenter;
-      if (changed) {
-        this.performExitEffects(current, event);
-      }
-      this.performTransitionEffects(next.transition, event);
-      this.setState(next.target);
-      if (changed) {
-        this.performEntryEffects(next.target, event);
-      }
-    });
-    __publicField(this, "determineTransition", (transition, event) => {
-      const fn = determineTransitionFn(transition, this.guardMap);
-      return fn == null ? void 0 : fn(this.contextSnapshot, event, this.guardMeta);
-    });
-    __publicField(this, "sendParent", (evt) => {
-      var _a8;
-      if (!this.parent) {
-        invariant("[@zag-js/core > send-parent] Cannot send event to an unknown parent");
-      }
-      const event = toEvent(evt);
-      (_a8 = this.parent) == null ? void 0 : _a8.send(event);
-    });
-    __publicField(this, "log", (...args) => {
-      if (isDev2() && this.options.debug) {
-        console.log(...args);
-      }
-    });
-    __publicField(this, "send", (evt) => {
-      const event = toEvent(evt);
-      this.transition(this.state.value, event);
-    });
-    __publicField(this, "transition", (state, evt) => {
-      var _a8, _b7, _c6;
-      const stateNode = isString(state) ? this.getStateNode(state) : state == null ? void 0 : state.stateNode;
-      const event = toEvent(evt);
-      if (!stateNode && !this.config.on) {
-        const msg = this.status === "Stopped" ? "[@zag-js/core > transition] Cannot transition a stopped machine" : `[@zag-js/core > transition] State does not have a definition for \`state\`: ${state}, \`event\`: ${event.type}`;
-        warn(msg);
-        return;
-      }
-      const transitions = (
-        // @ts-expect-error - Fix this
-        (_c6 = (_a8 = stateNode == null ? void 0 : stateNode.on) == null ? void 0 : _a8[event.type]) != null ? _c6 : (_b7 = this.config.on) == null ? void 0 : _b7[event.type]
-      );
-      const next = this.getNextStateInfo(transitions, event);
-      this.performStateChangeEffects(this.state.value, next, event);
-      return next.stateNode;
-    });
-    __publicField(this, "subscribe", (listener) => {
-      this.stateListeners.add(listener);
-      if (this.status === "Running") {
-        listener(this.stateSnapshot);
-      }
-      return () => {
-        this.stateListeners.delete(listener);
-      };
-    });
-    __publicField(this, "onDone", (listener) => {
-      this.doneListeners.add(listener);
-      return this;
-    });
-    __publicField(this, "onTransition", (listener) => {
-      this.stateListeners.add(listener);
-      if (this.status === "Running") {
-        listener(this.stateSnapshot);
-      }
-      return this;
-    });
-    this.config = structuredClone(config);
-    this.options = structuredClone(options != null ? options : {});
-    this.id = (_a7 = this.config.id) != null ? _a7 : `machine-${uuid()}`;
-    this.guardMap = (_c5 = (_b6 = this.options) == null ? void 0 : _b6.guards) != null ? _c5 : {};
-    this.actionMap = (_e5 = (_d5 = this.options) == null ? void 0 : _d5.actions) != null ? _e5 : {};
-    this.delayMap = (_g5 = (_f5 = this.options) == null ? void 0 : _f5.delays) != null ? _g5 : {};
-    this.activityMap = (_i3 = (_h3 = this.options) == null ? void 0 : _h3.activities) != null ? _i3 : {};
-    this.sync = (_k3 = (_j3 = this.options) == null ? void 0 : _j3.sync) != null ? _k3 : false;
-    this.state = createProxy2(this.config);
-    this.initialContext = snapshot(this.state.context);
-  }
-  // immutable state value
-  get stateSnapshot() {
-    return cast(snapshot(this.state));
-  }
-  getState() {
-    return this.stateSnapshot;
-  }
-  // immutable context value
-  get contextSnapshot() {
-    return this.stateSnapshot.context;
-  }
-  /**
-   * A reference to the instance methods of the machine.
-   * Useful when spawning child machines and managing the communication between them.
-   */
-  get self() {
-    const self2 = this;
-    return {
-      id: this.id,
-      send: this.send.bind(this),
-      sendParent: this.sendParent.bind(this),
-      sendChild: this.sendChild.bind(this),
-      stop: this.stop.bind(this),
-      stopChild: this.stopChild.bind(this),
-      spawn: this.spawn.bind(this),
-      stopActivity: this.stopActivity.bind(this),
-      get state() {
-        return self2.stateSnapshot;
-      },
-      get initialContext() {
-        return self2.initialContext;
-      },
-      get initialState() {
-        var _a7, _b6;
-        return (_b6 = (_a7 = self2.initialState) == null ? void 0 : _a7.target) != null ? _b6 : "";
-      }
-    };
-  }
-  get meta() {
-    var _a7, _b6;
-    return {
-      state: this.stateSnapshot,
-      guards: this.guardMap,
-      send: this.send.bind(this),
-      self: this.self,
-      initialContext: this.initialContext,
-      initialState: (_b6 = (_a7 = this.initialState) == null ? void 0 : _a7.target) != null ? _b6 : "",
-      getState: () => this.stateSnapshot,
-      getAction: (key) => this.actionMap[key],
-      getGuard: (key) => this.guardMap[key]
-    };
-  }
-  get guardMeta() {
-    return {
-      state: this.stateSnapshot
-    };
-  }
-  get [Symbol.toStringTag]() {
-    return "Machine";
-  }
-  getHydrationState() {
-    const state = this.getState();
-    return {
-      value: state.value,
-      tags: state.tags
-    };
-  }
-};
-var createMachine = (config, options) => new Machine(config, options);
-var clsx = (...args) => args.map((str) => {
-  var _a7;
-  return (_a7 = str == null ? void 0 : str.trim) == null ? void 0 : _a7.call(str);
-}).filter(Boolean).join(" ");
-var CSS_REGEX = /((?:--)?(?:\w+-?)+)\s*:\s*([^;]*)/g;
-var serialize = (style) => {
-  const res = {};
-  let match;
-  while (match = CSS_REGEX.exec(style)) {
-    res[match[1]] = match[2];
-  }
-  return res;
-};
-var css = (a, b) => {
-  if (isString(a)) {
-    if (isString(b)) return `${a};${b}`;
-    a = serialize(a);
-  } else if (isString(b)) {
-    b = serialize(b);
-  }
-  return Object.assign({}, a != null ? a : {}, b != null ? b : {});
-};
-function mergeProps(...args) {
-  let result = {};
-  for (let props2 of args) {
-    for (let key in result) {
-      if (key.startsWith("on") && typeof result[key] === "function" && typeof props2[key] === "function") {
-        result[key] = callAll(props2[key], result[key]);
-        continue;
-      }
-      if (key === "className" || key === "class") {
-        result[key] = clsx(result[key], props2[key]);
-        continue;
-      }
-      if (key === "style") {
-        result[key] = css(result[key], props2[key]);
-        continue;
-      }
-      result[key] = props2[key] !== void 0 ? props2[key] : result[key];
-    }
-    for (let key in props2) {
-      if (result[key] === void 0) {
-        result[key] = props2[key];
-      }
-    }
-  }
-  return result;
-}
-
-// ../../node_modules/@zag-js/types/dist/index.mjs
-function createNormalizer(fn) {
-  return new Proxy({}, {
-    get() {
-      return fn;
-    }
-  });
-}
-var createProps = () => (props2) => Array.from(new Set(props2));
-
-// ../../node_modules/@zag-js/react/dist/index.mjs
-var import_react115 = __toESM(require("react"), 1);
-var import_react_dom = require("react-dom");
+var import_react115 = require("react");
+var import_react116 = require("@chakra-ui/react");
+var import_dialog2 = require("@ark-ui/react/dialog");
 var import_jsx_runtime10 = require("react/jsx-runtime");
-var normalizeProps = createNormalizer((v) => v);
-var isArrayLike = (value) => (value == null ? void 0 : value.constructor.name) === "Array";
-var isArrayEqual = (a, b) => {
-  if (a.length !== b.length) return false;
-  for (let i = 0; i < a.length; i++) {
-    if (!isEqual(a[i], b[i])) return false;
-  }
-  return true;
-};
-var isEqual = (a, b) => {
-  if (Object.is(a, b)) return true;
-  if (a == null && b != null || a != null && b == null) return false;
-  if (typeof (a == null ? void 0 : a.isEqual) === "function" && typeof (b == null ? void 0 : b.isEqual) === "function") {
-    return a.isEqual(b);
-  }
-  if (typeof a === "function" && typeof b === "function") {
-    return a.toString() === b.toString();
-  }
-  if (isArrayLike(a) && isArrayLike(b)) {
-    return isArrayEqual(Array.from(a), Array.from(b));
-  }
-  if (!(typeof a === "object") || !(typeof b === "object")) return false;
-  const keys = Object.keys(b != null ? b : /* @__PURE__ */ Object.create(null));
-  const length = keys.length;
-  for (let i = 0; i < length; i++) {
-    const hasKey = Reflect.has(a, keys[i]);
-    if (!hasKey) return false;
-  }
-  for (let i = 0; i < length; i++) {
-    const key = keys[i];
-    if (!isEqual(a[key], b[key])) return false;
-  }
-  return true;
-};
-var isDev3 = () => process.env.NODE_ENV !== "production";
-var fnToString2 = Function.prototype.toString;
-fnToString2.call(Object);
-function compact2(obj) {
-  if (!isPlainObject3(obj) || obj === void 0) {
-    return obj;
-  }
-  const keys = Reflect.ownKeys(obj).filter((key) => typeof key === "string");
-  const filtered = {};
-  for (const key of keys) {
-    const value = obj[key];
-    if (value !== void 0) {
-      filtered[key] = compact2(value);
-    }
-  }
-  return filtered;
-}
-var isPlainObject3 = (value) => {
-  return value && typeof value === "object" && value.constructor === Object;
-};
-function useUpdateEffect(callback, deps) {
-  const render = (0, import_react115.useRef)(false);
-  const effect = (0, import_react115.useRef)(false);
-  (0, import_react115.useEffect)(() => {
-    const mounted = render.current;
-    const run = mounted && effect.current;
-    if (run) {
-      return callback();
-    }
-    effect.current = true;
-  }, deps);
-  (0, import_react115.useEffect)(() => {
-    render.current = true;
-    return () => {
-      render.current = false;
-    };
-  }, []);
-}
-var { use } = import_react115.default;
-var targetCache = makeGlobal("__zag__targetCache", () => /* @__PURE__ */ new WeakMap());
-function useSnapshot(service, options) {
-  const { actions, context, sync: notifyInSync } = options != null ? options : {};
-  const lastSnapshot = (0, import_react115.useRef)();
-  const lastAffected = (0, import_react115.useRef)();
-  const currSnapshot = (0, import_react115.useSyncExternalStore)(
-    (0, import_react115.useCallback)((callback) => subscribe(service.state, callback, notifyInSync), [notifyInSync]),
-    () => {
-      const nextSnapshot = snapshot(service.state, use);
-      try {
-        if (lastSnapshot.current && lastAffected.current && !isChanged(lastSnapshot.current, nextSnapshot, lastAffected.current, /* @__PURE__ */ new WeakMap())) {
-          return lastSnapshot.current;
-        }
-      } catch {
-      }
-      return nextSnapshot;
-    },
-    () => snapshot(service.state, use)
-  );
-  service.setOptions({ actions });
-  const ctx = (0, import_react115.useMemo)(() => compact2(context != null ? context : {}), [context]);
-  useUpdateEffect(() => {
-    var _a7;
-    const entries = Object.entries(ctx);
-    const previousCtx = (_a7 = service.contextSnapshot) != null ? _a7 : {};
-    const equality = entries.map(([key, value]) => ({
-      key,
-      curr: value,
-      prev: previousCtx[key],
-      equal: isEqual(previousCtx[key], value)
-    }));
-    const allEqual = equality.every(({ equal }) => equal);
-    if (!allEqual) {
-      service.setContext(ctx);
-    }
-  }, [ctx]);
-  const currAffected = /* @__PURE__ */ new WeakMap();
-  (0, import_react115.useEffect)(() => {
-    lastSnapshot.current = currSnapshot;
-    lastAffected.current = currAffected;
-  });
-  const proxyCache = (0, import_react115.useMemo)(() => /* @__PURE__ */ new WeakMap(), []);
-  return createProxy(currSnapshot, currAffected, proxyCache, targetCache);
-}
-function useConstant(fn) {
-  const ref2 = (0, import_react115.useRef)();
-  if (!ref2.current) ref2.current = { v: fn() };
-  return ref2.current.v;
-}
-var useSafeLayoutEffect = typeof document !== "undefined" ? import_react115.useLayoutEffect : import_react115.useEffect;
-function useService(machine2, options) {
-  const { state: hydratedState, context } = options != null ? options : {};
-  const service = useConstant(() => {
-    const instance = typeof machine2 === "function" ? machine2() : machine2;
-    if (context) instance.setContext(context);
-    instance._created();
-    return instance;
-  });
-  const snapshotRef = (0, import_react115.useRef)();
-  useSafeLayoutEffect(() => {
-    const stateInit = hydratedState != null ? hydratedState : snapshotRef.current;
-    service.start(stateInit);
-    return () => {
-      if (isDev3()) {
-        snapshotRef.current = service.getHydrationState();
-      }
-      service.stop();
-    };
-  }, []);
-  return service;
-}
-function useMachine(machine2, options) {
-  const service = useService(machine2, options);
-  const state = useSnapshot(service, options);
-  return [state, service.send, service];
-}
-
-// ../../node_modules/@ark-ui/react/dist/utils/compose-refs.js
-function setRef(ref2, value) {
-  if (typeof ref2 === "function") {
-    ref2(value);
-  } else if (ref2 !== null && ref2 !== void 0) {
-    ref2.current = value;
-  }
-}
-function composeRefs(...refs) {
-  return (node) => {
-    for (const ref2 of refs) {
-      setRef(ref2, node);
-    }
-  };
-}
-
-// ../../node_modules/@ark-ui/react/dist/utils/create-context.js
-var import_react116 = require("react");
-function getErrorMessage(hook, provider) {
-  return `${hook} returned \`undefined\`. Seems you forgot to wrap component within ${provider}`;
-}
-function createContext2(options = {}) {
-  const {
-    name,
-    strict = true,
-    hookName = "useContext",
-    providerName = "Provider",
-    errorMessage,
-    defaultValue
-  } = options;
-  const Context = (0, import_react116.createContext)(defaultValue);
-  Context.displayName = name;
-  function useContext$1() {
-    var _a7;
-    const context = (0, import_react116.useContext)(Context);
-    if (!context && strict) {
-      const error = new Error(errorMessage != null ? errorMessage : getErrorMessage(hookName, providerName));
-      error.name = "ContextError";
-      (_a7 = Error.captureStackTrace) == null ? void 0 : _a7.call(Error, error, useContext$1);
-      throw error;
-    }
-    return context;
-  }
-  return [Context.Provider, useContext$1, Context];
-}
-
-// ../../node_modules/@ark-ui/react/dist/utils/create-split-props.js
-var createSplitProps = () => (props2, keys) => keys.reduce(
-  (previousValue, currentValue) => {
-    const [target, source] = previousValue;
-    const key = currentValue;
-    if (source[key] !== void 0) {
-      target[key] = source[key];
-    }
-    delete source[key];
-    return [target, source];
-  },
-  [{}, { ...props2 }]
-);
-
-// ../../node_modules/@ark-ui/react/dist/components/factory.js
-var import_react117 = require("react");
-function getRef(element) {
-  var _a7, _b6;
-  let getter = (_a7 = Object.getOwnPropertyDescriptor(element.props, "ref")) == null ? void 0 : _a7.get;
-  let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
-  if (mayWarn) {
-    return element.ref;
-  }
-  getter = (_b6 = Object.getOwnPropertyDescriptor(element, "ref")) == null ? void 0 : _b6.get;
-  mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
-  if (mayWarn) {
-    return element.props.ref;
-  }
-  return element.props.ref || element.ref;
-}
-var withAsChild = (Component) => {
-  const Comp = (0, import_react117.memo)(
-    (0, import_react117.forwardRef)((props2, ref2) => {
-      const { asChild, children, ...restProps } = props2;
-      if (!asChild) {
-        return (0, import_react117.createElement)(Component, { ...restProps, ref: ref2 }, children);
-      }
-      const onlyChild = import_react117.Children.only(children);
-      if (!(0, import_react117.isValidElement)(onlyChild)) {
-        return null;
-      }
-      const childRef = getRef(onlyChild);
-      return (0, import_react117.cloneElement)(onlyChild, {
-        ...mergeProps(restProps, onlyChild.props),
-        ref: ref2 ? composeRefs(ref2, childRef) : childRef
-      });
-    })
-  );
-  Comp.displayName = Component.displayName || Component.name;
-  return Comp;
-};
-var jsxFactory = () => {
-  const cache = /* @__PURE__ */ new Map();
-  return new Proxy(withAsChild, {
-    apply(_target, _thisArg, argArray) {
-      return withAsChild(argArray[0]);
-    },
-    get(_, element) {
-      const asElement = element;
-      if (!cache.has(asElement)) {
-        cache.set(asElement, withAsChild(asElement));
-      }
-      return cache.get(asElement);
-    }
-  });
-};
-var ark = jsxFactory();
-
-// ../../node_modules/@zag-js/presence/dist/index.mjs
-function connect(state, send, _normalize) {
-  const present = state.matches("mounted", "unmountSuspended");
-  return {
-    skip: !state.context.initial && present,
-    present,
-    setNode(node) {
-      if (!node) return;
-      send({ type: "NODE.SET", node });
-    },
-    unmount() {
-      send({ type: "UNMOUNT" });
-    }
-  };
-}
-function machine(ctx) {
-  return createMachine(
-    {
-      initial: ctx.present ? "mounted" : "unmounted",
-      context: {
-        node: null,
-        styles: null,
-        unmountAnimationName: null,
-        prevAnimationName: null,
-        present: false,
-        initial: false,
-        ...ctx
-      },
-      exit: ["clearInitial"],
-      watch: {
-        present: ["setInitial", "syncPresence"]
-      },
-      on: {
-        "NODE.SET": {
-          actions: ["setNode", "setStyles"]
-        }
-      },
-      states: {
-        mounted: {
-          on: {
-            UNMOUNT: {
-              target: "unmounted",
-              actions: ["invokeOnExitComplete"]
-            },
-            "UNMOUNT.SUSPEND": "unmountSuspended"
-          }
-        },
-        unmountSuspended: {
-          activities: ["trackAnimationEvents"],
-          after: {
-            // Fallback to timeout to ensure we exit this state even if the `animationend` event
-            // did not get trigger
-            ANIMATION_DURATION: {
-              target: "unmounted",
-              actions: ["invokeOnExitComplete"]
-            }
-          },
-          on: {
-            MOUNT: {
-              target: "mounted",
-              actions: ["setPrevAnimationName"]
-            },
-            UNMOUNT: {
-              target: "unmounted",
-              actions: ["invokeOnExitComplete"]
-            }
-          }
-        },
-        unmounted: {
-          entry: ["clearPrevAnimationName"],
-          on: {
-            MOUNT: {
-              target: "mounted",
-              actions: ["setPrevAnimationName"]
-            }
-          }
-        }
-      }
-    },
-    {
-      delays: {
-        ANIMATION_DURATION(ctx2) {
-          var _a7, _b6;
-          return parseMs((_a7 = ctx2.styles) == null ? void 0 : _a7.animationDuration) + parseMs((_b6 = ctx2.styles) == null ? void 0 : _b6.animationDelay) + ANIMATION_TIMEOUT_MARGIN;
-        }
-      },
-      actions: {
-        setInitial(ctx2) {
-          ctx2.initial = true;
-        },
-        clearInitial(ctx2) {
-          ctx2.initial = false;
-        },
-        invokeOnExitComplete(ctx2) {
-          var _a7;
-          (_a7 = ctx2.onExitComplete) == null ? void 0 : _a7.call(ctx2);
-        },
-        setNode(ctx2, evt) {
-          ctx2.node = ref(evt.node);
-        },
-        setStyles(ctx2, evt) {
-          const win = evt.node.ownerDocument.defaultView || window;
-          ctx2.styles = ref(win.getComputedStyle(evt.node));
-        },
-        syncPresence(ctx2, _evt, { send }) {
-          var _a7;
-          if (ctx2.present) {
-            send({ type: "MOUNT", src: "presence.changed" });
-            return;
-          }
-          if (!ctx2.present && ((_a7 = ctx2.node) == null ? void 0 : _a7.ownerDocument.visibilityState) === "hidden") {
-            send({ type: "UNMOUNT", src: "visibilitychange" });
-            return;
-          }
-          const animationName = getAnimationName(ctx2.styles);
-          const exec = ctx2.immediate ? queueMicrotask : requestAnimationFrame;
-          exec(() => {
-            var _a8, _b6;
-            ctx2.unmountAnimationName = animationName;
-            if (animationName === "none" || animationName === ctx2.prevAnimationName || ((_a8 = ctx2.styles) == null ? void 0 : _a8.display) === "none" || ((_b6 = ctx2.styles) == null ? void 0 : _b6.animationDuration) === "0s") {
-              send({ type: "UNMOUNT", src: "presence.changed" });
-            } else {
-              send({ type: "UNMOUNT.SUSPEND" });
-            }
-          });
-        },
-        setPrevAnimationName(ctx2) {
-          const exec = ctx2.immediate ? queueMicrotask : requestAnimationFrame;
-          exec(() => {
-            ctx2.prevAnimationName = getAnimationName(ctx2.styles);
-          });
-        },
-        clearPrevAnimationName(ctx2) {
-          ctx2.prevAnimationName = null;
-        }
-      },
-      activities: {
-        trackAnimationEvents(ctx2, _evt, { send }) {
-          const node = ctx2.node;
-          if (!node) return;
-          const onStart = (event) => {
-            var _a7, _b6, _c5;
-            const target = (_c5 = (_b6 = (_a7 = event.composedPath) == null ? void 0 : _a7.call(event)) == null ? void 0 : _b6[0]) != null ? _c5 : event.target;
-            if (target === node) {
-              ctx2.prevAnimationName = getAnimationName(ctx2.styles);
-            }
-          };
-          const onEnd = (event) => {
-            var _a7, _b6, _c5;
-            const animationName = getAnimationName(ctx2.styles);
-            const target = (_c5 = (_b6 = (_a7 = event.composedPath) == null ? void 0 : _a7.call(event)) == null ? void 0 : _b6[0]) != null ? _c5 : event.target;
-            if (target === node && animationName === ctx2.unmountAnimationName) {
-              send({ type: "UNMOUNT", src: "animationend" });
-            }
-          };
-          node.addEventListener("animationstart", onStart);
-          node.addEventListener("animationcancel", onEnd);
-          node.addEventListener("animationend", onEnd);
-          return () => {
-            node.removeEventListener("animationstart", onStart);
-            node.removeEventListener("animationcancel", onEnd);
-            node.removeEventListener("animationend", onEnd);
-          };
-        }
-      }
-    }
-  );
-}
-function getAnimationName(styles) {
-  return (styles == null ? void 0 : styles.animationName) || "none";
-}
-function parseMs(value) {
-  return parseFloat(value || "0") * 1e3;
-}
-var ANIMATION_TIMEOUT_MARGIN = 16.667;
-var props = createProps()(["onExitComplete", "present", "immediate"]);
-
-// ../../node_modules/@ark-ui/react/dist/components/presence/use-presence.js
-var import_react120 = require("react");
-
-// ../../node_modules/@ark-ui/react/dist/utils/use-event.js
-var import_react118 = require("react");
-function useEvent(callback, opts = {}) {
-  const { sync = false } = opts;
-  const callbackRef = useLatestRef(callback);
-  return (0, import_react118.useCallback)(
-    // biome-ignore lint/suspicious/noExplicitAny: <explanation>
-    (...args) => {
-      var _a7;
-      if (sync) return queueMicrotask(() => {
-        var _a8;
-        return (_a8 = callbackRef.current) == null ? void 0 : _a8.call(callbackRef, ...args);
-      });
-      return (_a7 = callbackRef.current) == null ? void 0 : _a7.call(callbackRef, ...args);
-    },
-    [sync, callbackRef]
-  );
-}
-function useLatestRef(value) {
-  const ref2 = (0, import_react118.useRef)(value);
-  ref2.current = value;
-  return ref2;
-}
-
-// ../../node_modules/@ark-ui/react/dist/components/presence/use-presence.js
-var usePresence = (props2) => {
-  const { lazyMount, unmountOnExit, ...rest } = props2;
-  const wasEverPresent = (0, import_react120.useRef)(false);
-  const context = {
-    ...rest,
-    onExitComplete: useEvent(props2.onExitComplete)
-  };
-  const [state, send] = useMachine(machine(context), { context });
-  const api = connect(state, send, normalizeProps);
-  if (api.present) {
-    wasEverPresent.current = true;
-  }
-  const unmounted = !api.present && !wasEverPresent.current && lazyMount || unmountOnExit && !api.present && wasEverPresent.current;
-  const getPresenceProps = () => ({
-    "data-state": props2.present ? "open" : "closed",
-    hidden: !api.present
-  });
-  return {
-    ref: api.setNode,
-    getPresenceProps,
-    present: api.present,
-    unmounted
-  };
-};
-
-// ../../node_modules/@ark-ui/react/dist/components/dialog/use-dialog-context.js
-var [DialogProvider, useDialogContext] = createContext2({
-  name: "DialogContext",
-  hookName: "useDialogContext",
-  providerName: "<DialogProvider />"
-});
-
-// ../../node_modules/@ark-ui/react/dist/components/dialog/dialog-context.js
-var DialogContext = (props2) => props2.children(useDialogContext());
-
-// ../../node_modules/@ark-ui/react/dist/components/presence/split-presence-props.js
-var splitPresenceProps = (props2) => createSplitProps()(props2, [
-  "immediate",
-  "lazyMount",
-  "onExitComplete",
-  "present",
-  "unmountOnExit"
-]);
-
-// src/components/dialog/dialog.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
-var DialogContent = (0, import_react121.forwardRef)(
-  function DialogContent2(props2, ref2) {
+var DialogContent = (0, import_react115.forwardRef)(
+  function DialogContent2(props, ref) {
     const {
       children,
       portalled = true,
       portalRef,
       backdrop = true,
       ...rest
-    } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react122.Portal, { disabled: !portalled, container: portalRef, children: [
-      backdrop && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react122.Dialog.Backdrop, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react122.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react122.Dialog.Content, { ref: ref2, ...rest, asChild: false, children }) })
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react116.Portal, { disabled: !portalled, container: portalRef, children: [
+      backdrop && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react116.Dialog.Backdrop, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react116.Dialog.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react116.Dialog.Content, { ref, ...rest, asChild: false, children }) })
     ] });
   }
 );
-var DialogCloseTrigger = (0, import_react121.forwardRef)(function DialogCloseTrigger2(props2, ref2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    import_react122.Dialog.CloseTrigger,
+var DialogCloseTrigger = (0, import_react115.forwardRef)(function DialogCloseTrigger2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    import_react116.Dialog.CloseTrigger,
     {
       position: "absolute",
       top: "2",
       insetEnd: "2",
-      ...props2,
+      ...props,
       asChild: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CloseButton, { size: "sm", ref: ref2, children: props2.children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(CloseButton, { size: "sm", ref, children: props.children })
     }
   );
 });
-var DialogRoot = import_react122.Dialog.Root;
-var DialogFooter = import_react122.Dialog.Footer;
-var DialogHeader = import_react122.Dialog.Header;
-var DialogBody = import_react122.Dialog.Body;
-var DialogBackdrop = import_react122.Dialog.Backdrop;
-var DialogTitle = import_react122.Dialog.Title;
-var DialogDescription = import_react122.Dialog.Description;
-var DialogTrigger = import_react122.Dialog.Trigger;
-var DialogActionTrigger = import_react122.Dialog.ActionTrigger;
+var DialogRoot = import_react116.Dialog.Root;
+var DialogFooter = import_react116.Dialog.Footer;
+var DialogHeader = import_react116.Dialog.Header;
+var DialogBody = import_react116.Dialog.Body;
+var DialogBackdrop = import_react116.Dialog.Backdrop;
+var DialogTitle = import_react116.Dialog.Title;
+var DialogDescription = import_react116.Dialog.Description;
+var DialogTrigger = import_react116.Dialog.Trigger;
+var DialogActionTrigger = import_react116.Dialog.ActionTrigger;
 
 // src/components/drawer/namespace.ts
-var namespace_exports3 = {};
-__export(namespace_exports3, {
+var namespace_exports2 = {};
+__export(namespace_exports2, {
   ActionTrigger: () => DrawerActionTrigger,
   Backdrop: () => DrawerBackdrop,
   Body: () => DrawerBody,
@@ -10847,52 +9190,53 @@ __export(namespace_exports3, {
 });
 
 // src/components/drawer/drawer.tsx
-var import_react123 = require("react");
-var import_react124 = require("@chakra-ui/react");
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var DrawerContent = (0, import_react123.forwardRef)(
-  function DrawerContent2(props2, ref2) {
-    const { children, portalled = true, portalRef, offset, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react124.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react124.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react124.Drawer.Content, { ref: ref2, ...rest, asChild: false, children }) }) });
+var import_react117 = require("react");
+var import_dialog4 = require("@ark-ui/react/dialog");
+var import_react118 = require("@chakra-ui/react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var DrawerContent = (0, import_react117.forwardRef)(
+  function DrawerContent2(props, ref) {
+    const { children, portalled = true, portalRef, offset, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react118.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react118.Drawer.Positioner, { padding: offset, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react118.Drawer.Content, { ref, ...rest, asChild: false, children }) }) });
   }
 );
-var DrawerCloseTrigger = (0, import_react123.forwardRef)(function DrawerCloseTrigger2(props2, ref2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_react124.Drawer.CloseTrigger,
+var DrawerCloseTrigger = (0, import_react117.forwardRef)(function DrawerCloseTrigger2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    import_react118.Drawer.CloseTrigger,
     {
       position: "absolute",
       top: "2",
       insetEnd: "2",
-      ...props2,
+      ...props,
       asChild: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CloseButton, { size: "sm", ref: ref2 })
+      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CloseButton, { size: "sm", ref })
     }
   );
 });
-var DrawerTrigger = import_react124.Drawer.Trigger;
-var DrawerRoot = import_react124.Drawer.Root;
-var DrawerFooter = import_react124.Drawer.Footer;
-var DrawerHeader = import_react124.Drawer.Header;
-var DrawerBody = import_react124.Drawer.Body;
-var DrawerBackdrop = import_react124.Drawer.Backdrop;
-var DrawerDescription = import_react124.Drawer.Description;
-var DrawerTitle = import_react124.Drawer.Title;
-var DrawerActionTrigger = import_react124.Drawer.ActionTrigger;
-var DrawerContext = DialogContext;
+var DrawerTrigger = import_react118.Drawer.Trigger;
+var DrawerRoot = import_react118.Drawer.Root;
+var DrawerFooter = import_react118.Drawer.Footer;
+var DrawerHeader = import_react118.Drawer.Header;
+var DrawerBody = import_react118.Drawer.Body;
+var DrawerBackdrop = import_react118.Drawer.Backdrop;
+var DrawerDescription = import_react118.Drawer.Description;
+var DrawerTitle = import_react118.Drawer.Title;
+var DrawerActionTrigger = import_react118.Drawer.ActionTrigger;
+var DrawerContext = import_dialog4.DialogContext;
 
 // src/components/empty-state/empty-state.tsx
-var import_react125 = require("@chakra-ui/react");
-var import_react126 = require("react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var EmptyState = (0, import_react126.forwardRef)(
-  function EmptyState2(props2, ref2) {
-    const { title, description, icon, children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react125.EmptyState.Root, { ref: ref2, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_react125.EmptyState.Content, { children: [
-      icon && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react125.EmptyState.Indicator, { children: icon }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_react125.VStack, { textAlign: "center", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react125.EmptyState.Title, { children: title }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react125.EmptyState.Description, { children: description })
-      ] }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_react125.EmptyState.Title, { children: title }),
+var import_react119 = require("@chakra-ui/react");
+var import_react120 = require("react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var EmptyState = (0, import_react120.forwardRef)(
+  function EmptyState2(props, ref) {
+    const { title, description, icon, children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Root, { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react119.EmptyState.Content, { children: [
+      icon && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Indicator, { children: icon }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_react119.VStack, { textAlign: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Title, { children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Description, { children: description })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_react119.EmptyState.Title, { children: title }),
       children
     ] }) });
   }
@@ -10909,12 +9253,12 @@ __export(grid_list_exports, {
 var import_grid_list = require("@saas-ui/core/grid-list");
 
 // src/components/grid-list/grid-list.context.ts
-var import_react127 = require("@chakra-ui/react");
+var import_react121 = require("@chakra-ui/react");
 var {
   withProvider: withProvider2,
   withContext: withContext3,
   useStyles: useGridListStyles
-} = (0, import_react127.createSlotRecipeContext)({
+} = (0, import_react121.createSlotRecipeContext)({
   key: "suiGridList"
 });
 
@@ -10938,28 +9282,28 @@ var GridListCell = withContext3(
 
 // src/components/icon-badge/icon-badge.tsx
 var React2 = __toESM(require("react"), 1);
-var import_react128 = require("react");
-var import_react129 = require("@chakra-ui/react");
-var import_utils8 = require("@saas-ui/core/utils");
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_react122 = require("react");
+var import_react123 = require("@chakra-ui/react");
+var import_utils7 = require("@saas-ui/core/utils");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var IconBadge = React2.forwardRef(
-  (props2, ref2) => {
-    const { icon, children, ...rest } = props2;
-    const recipe = (0, import_react129.useRecipe)({ key: "suiIconBadge", recipe: props2.recipe });
+  (props, ref) => {
+    const { icon, children, ...rest } = props;
+    const recipe = (0, import_react123.useRecipe)({ key: "suiIconBadge", recipe: props.recipe });
     const [variantProps, localProps] = recipe.splitVariantProps(rest);
     const styles = recipe(variantProps);
     const element = icon || children;
-    const _children = (0, import_react128.isValidElement)(element) ? (0, import_react128.cloneElement)(element, {
+    const _children = (0, import_react122.isValidElement)(element) ? (0, import_react122.cloneElement)(element, {
       "aria-hidden": true,
       focusable: false
     }) : null;
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
-      import_react129.chakra.div,
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      import_react123.chakra.div,
       {
-        ref: ref2,
+        ref,
         ...localProps,
-        css: [styles, props2.css],
-        className: (0, import_utils8.cx)(recipe.className, props2.className),
+        css: [styles, props.css],
+        className: (0, import_utils7.cx)(recipe.className, props.className),
         children: _children
       }
     );
@@ -10967,11 +9311,11 @@ var IconBadge = React2.forwardRef(
 );
 
 // src/components/input-group/input-group.tsx
-var import_react130 = require("react");
-var import_react131 = require("@chakra-ui/react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var InputGroup = (0, import_react130.forwardRef)(
-  function InputGroup2(props2, ref2) {
+var import_react124 = require("react");
+var import_react125 = require("@chakra-ui/react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var InputGroup = (0, import_react124.forwardRef)(
+  function InputGroup2(props, ref) {
     const {
       startElement,
       startElementProps,
@@ -10979,27 +9323,27 @@ var InputGroup = (0, import_react130.forwardRef)(
       endElementProps,
       children,
       ...rest
-    } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_react131.Group, { ref: ref2, display: "flex", ...rest, children: [
-      startElement && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react131.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
-      (0, import_react130.isValidElement)(children) && (0, import_react130.cloneElement)(children, {
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_react125.Group, { ref, display: "flex", ...rest, children: [
+      startElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react125.InputElement, { pointerEvents: "none", ...startElementProps, children: startElement }),
+      (0, import_react124.isValidElement)(children) && (0, import_react124.cloneElement)(children, {
         ...startElement && { ps: "calc(var(--input-height) - 6px)" },
         ...endElement && { pe: "calc(var(--input-height) - 6px)" },
         ...children.props
       }),
-      endElement && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react131.InputElement, { placement: "end", ...endElementProps, children: endElement })
+      endElement && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_react125.InputElement, { placement: "end", ...endElementProps, children: endElement })
     ] });
   }
 );
 
 // src/components/link/link.tsx
-var import_react132 = __toESM(require("react"), 1);
-var import_react133 = require("@chakra-ui/react");
-var import_jsx_runtime16 = require("react/jsx-runtime");
-var Link = import_react132.default.forwardRef(
-  (props2, ref2) => {
+var import_react126 = __toESM(require("react"), 1);
+var import_react127 = require("@chakra-ui/react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var Link = import_react126.default.forwardRef(
+  (props, ref) => {
     const LinkComponent = useLink();
-    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react133.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(LinkComponent, { ref: ref2, ...props2 }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react127.Link, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(LinkComponent, { ref, ...props }) });
   }
 );
 Link.displayName = "Link";
@@ -11011,62 +9355,39 @@ __export(loading_overlay_exports, {
   Spinner: () => LoadingOverlaySpinner,
   Text: () => LoadingOverlayText
 });
-
-// ../../node_modules/@ark-ui/react/dist/components/presence/presence.js
-var import_jsx_runtime17 = require("react/jsx-runtime");
-var import_react134 = require("react");
-var Presence = (0, import_react134.forwardRef)((props2, ref2) => {
-  const [presenceProps, localProps] = splitPresenceProps(props2);
-  const presence = usePresence(presenceProps);
-  if (presence.unmounted) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-    ark.div,
-    {
-      ...localProps,
-      ...presence.getPresenceProps(),
-      "data-scope": "presence",
-      "data-part": "root",
-      ref: composeRefs(presence.ref, ref2)
-    }
-  );
-});
-Presence.displayName = "Presence";
-
-// src/components/loading-overlay/loading-overlay.tsx
-var import_react138 = require("@chakra-ui/react");
+var import_presence = require("@ark-ui/react/presence");
+var import_react131 = require("@chakra-ui/react");
 
 // src/components/spinner/spinner.tsx
-var import_react135 = require("react");
-var import_react136 = require("@chakra-ui/react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-var Spinner2 = (0, import_react135.forwardRef)(
-  function Spinner3(props2, ref2) {
-    const { loading, children, ...rest } = props2;
+var import_react128 = require("react");
+var import_react129 = require("@chakra-ui/react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var Spinner2 = (0, import_react128.forwardRef)(
+  function Spinner3(props, ref) {
+    const { loading, children, ...rest } = props;
     if (loading === false) {
-      return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react136.Spinner, { ref: ref2, ...rest });
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react129.Spinner, { ref, ...rest });
   }
 );
 
 // src/components/loading-overlay/loading-overlay.context.ts
-var import_react137 = require("@chakra-ui/react");
+var import_react130 = require("@chakra-ui/react");
 var {
   useStyles: useLoadingOverlayStyles,
   withContext: withContext4,
   withProvider: withProvider3
-} = (0, import_react137.createSlotRecipeContext)({
+} = (0, import_react130.createSlotRecipeContext)({
   key: "suiLoadingOverlay"
 });
 
 // src/components/loading-overlay/loading-overlay.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var LoadingOverlay = (props2) => {
-  const { children, loading = true, ...rest } = props2;
-  const [presenceProps, rootProps] = splitPresenceProps(rest);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react138.chakra.div, { ...rootProps, children }) });
+var import_jsx_runtime17 = require("react/jsx-runtime");
+var LoadingOverlay = (props) => {
+  const { children, loading = true, ...rest } = props;
+  const [presenceProps, rootProps] = (0, import_presence.splitPresenceProps)(rest);
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_presence.Presence, { present: loading, ...presenceProps, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_react131.chakra.div, { ...rootProps, children }) });
 };
 var LoadingOverlayRoot = withProvider3(
   LoadingOverlay,
@@ -11091,12 +9412,12 @@ __export(navbar_exports, {
 var import_navbar = require("@saas-ui/core/navbar");
 
 // src/components/navbar/navbar.context.ts
-var import_react139 = require("@chakra-ui/react");
+var import_react132 = require("@chakra-ui/react");
 var {
   withProvider: withProvider4,
   withContext: withContext5,
   useStyles: useNavbarStyles
-} = (0, import_react139.createSlotRecipeContext)({
+} = (0, import_react132.createSlotRecipeContext)({
   key: "suiNavbar"
 });
 
@@ -11123,11 +9444,11 @@ var NavbarLink = withContext5(
 );
 
 // src/components/number-input/number-input.tsx
-var import_react140 = require("react");
-var import_react141 = require("@chakra-ui/react");
-var import_jsx_runtime20 = require("react/jsx-runtime");
-var NumberInput = (0, import_react140.forwardRef)(
-  function NumberInput2(props2, ref2) {
+var import_react133 = require("react");
+var import_react134 = require("@chakra-ui/react");
+var import_jsx_runtime18 = require("react/jsx-runtime");
+var NumberInput = (0, import_react133.forwardRef)(
+  function NumberInput2(props, ref) {
     const {
       hideControls,
       startElement,
@@ -11135,12 +9456,12 @@ var NumberInput = (0, import_react140.forwardRef)(
       inputProps,
       rootRef,
       ...rest
-    } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react141.NumberInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(InputGroup, { startElement, endElement, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react141.NumberInput.Input, { ref: ref2, ...inputProps }) }),
-      !hideControls && !endElement ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react141.NumberInput.Control, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react141.NumberInput.IncrementTrigger, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react141.NumberInput.DecrementTrigger, {})
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_react134.NumberInput.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(InputGroup, { startElement, endElement, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react134.NumberInput.Input, { ref, ...inputProps }) }),
+      !hideControls && !endElement ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_react134.NumberInput.Control, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react134.NumberInput.IncrementTrigger, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react134.NumberInput.DecrementTrigger, {})
       ] }) : null
     ] });
   }
@@ -11150,8 +9471,10 @@ var NumberInput = (0, import_react140.forwardRef)(
 var menu_exports = {};
 __export(menu_exports, {
   Arrow: () => MenuArrow,
+  Button: () => MenuButton,
   CheckboxItem: () => MenuCheckboxItem,
   Content: () => MenuContent,
+  Context: () => MenuContext,
   ContextTrigger: () => MenuContextTrigger,
   Item: () => MenuItem,
   ItemCommand: () => MenuItemCommand,
@@ -11164,14 +9487,78 @@ __export(menu_exports, {
   Trigger: () => MenuTrigger,
   TriggerItem: () => MenuTriggerItem
 });
-var import_react144 = require("react");
-var import_react145 = require("@chakra-ui/react");
+var import_react135 = require("react");
+var import_react136 = require("@chakra-ui/react");
+var import_jsx_runtime19 = require("react/jsx-runtime");
+var MenuContent = (0, import_react135.forwardRef)(
+  function MenuContent2(props, ref) {
+    const { portalled = true, portalRef, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.Content, { ref, ...rest }) }) });
+  }
+);
+var MenuArrow = (0, import_react135.forwardRef)(
+  function MenuArrow2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.Arrow, { ref, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.ArrowTip, {}) });
+  }
+);
+var MenuCheckboxItem = (0, import_react135.forwardRef)(function MenuCheckboxItem2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react136.Menu.CheckboxItem, { ref, ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.ItemIndicator, { hidden: false, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CheckIcon, {}) }),
+    props.children
+  ] });
+});
+var MenuRadioItem = (0, import_react135.forwardRef)(
+  function MenuRadioItem2(props, ref) {
+    const { children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react136.Menu.RadioItem, { ps: "8", ref, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.AbsoluteCenter, { axis: "horizontal", left: "4", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(CheckIcon, {}) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.ItemText, { children })
+    ] });
+  }
+);
+var MenuItemGroup = (0, import_react135.forwardRef)(
+  function MenuItemGroup2(props, ref) {
+    const { title, children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react136.Menu.ItemGroup, { ref, ...rest, children: [
+      title && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react136.Menu.ItemGroupLabel, { userSelect: "none", children: title }),
+      children
+    ] });
+  }
+);
+var MenuTriggerItem = (0, import_react135.forwardRef)(
+  function MenuTriggerItem2(props, ref) {
+    const { startIcon, children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react136.Menu.TriggerItem, { ref, ...rest, children: [
+      startIcon,
+      children,
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ChevronRightIcon, {})
+    ] });
+  }
+);
+var MenuButton = (0, import_react135.forwardRef)(
+  function MenuButton2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MenuTrigger, { ref, ...props, asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Button, {}) });
+  }
+);
+var MenuRadioItemGroup = import_react136.Menu.RadioItemGroup;
+var MenuContextTrigger = import_react136.Menu.ContextTrigger;
+var MenuRoot = import_react136.Menu.Root;
+var MenuSeparator = import_react136.Menu.Separator;
+var MenuContext = import_react136.Menu.Context;
+var MenuItem = import_react136.Menu.Item;
+var MenuItemText = import_react136.Menu.ItemText;
+var MenuItemCommand = import_react136.Menu.ItemCommand;
+var MenuTrigger = import_react136.Menu.Trigger;
+
+// src/components/password-input/password-input.tsx
+var import_react139 = require("react");
+var import_react140 = require("@chakra-ui/react");
 
 // ../../node_modules/react-icons/lib/iconBase.mjs
-var import_react143 = __toESM(require("react"), 1);
+var import_react138 = __toESM(require("react"), 1);
 
 // ../../node_modules/react-icons/lib/iconContext.mjs
-var import_react142 = __toESM(require("react"), 1);
+var import_react137 = __toESM(require("react"), 1);
 var DefaultContext = {
   color: void 0,
   size: void 0,
@@ -11179,7 +9566,7 @@ var DefaultContext = {
   style: void 0,
   attr: void 0
 };
-var IconContext = import_react142.default.createContext && /* @__PURE__ */ import_react142.default.createContext(DefaultContext);
+var IconContext = import_react137.default.createContext && /* @__PURE__ */ import_react137.default.createContext(DefaultContext);
 
 // ../../node_modules/react-icons/lib/iconBase.mjs
 var _excluded = ["attr", "size", "title"];
@@ -11268,138 +9655,74 @@ function _toPrimitive(t, r) {
   return ("string" === r ? String : Number)(t);
 }
 function Tree2Element(tree) {
-  return tree && tree.map((node, i) => /* @__PURE__ */ import_react143.default.createElement(node.tag, _objectSpread({
+  return tree && tree.map((node, i) => /* @__PURE__ */ import_react138.default.createElement(node.tag, _objectSpread({
     key: i
   }, node.attr), Tree2Element(node.child)));
 }
 function GenIcon(data) {
-  return (props2) => /* @__PURE__ */ import_react143.default.createElement(IconBase, _extends({
+  return (props) => /* @__PURE__ */ import_react138.default.createElement(IconBase, _extends({
     attr: _objectSpread({}, data.attr)
-  }, props2), Tree2Element(data.child));
+  }, props), Tree2Element(data.child));
 }
-function IconBase(props2) {
+function IconBase(props) {
   var elem = (conf) => {
     var {
       attr,
       size,
       title
-    } = props2, svgProps = _objectWithoutProperties(props2, _excluded);
+    } = props, svgProps = _objectWithoutProperties(props, _excluded);
     var computedSize = size || conf.size || "1em";
     var className;
     if (conf.className) className = conf.className;
-    if (props2.className) className = (className ? className + " " : "") + props2.className;
-    return /* @__PURE__ */ import_react143.default.createElement("svg", _extends({
+    if (props.className) className = (className ? className + " " : "") + props.className;
+    return /* @__PURE__ */ import_react138.default.createElement("svg", _extends({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
     }, conf.attr, attr, svgProps, {
       className,
       style: _objectSpread(_objectSpread({
-        color: props2.color || conf.color
-      }, conf.style), props2.style),
+        color: props.color || conf.color
+      }, conf.style), props.style),
       height: computedSize,
       width: computedSize,
       xmlns: "http://www.w3.org/2000/svg"
-    }), title && /* @__PURE__ */ import_react143.default.createElement("title", null, title), props2.children);
+    }), title && /* @__PURE__ */ import_react138.default.createElement("title", null, title), props.children);
   };
-  return IconContext !== void 0 ? /* @__PURE__ */ import_react143.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
+  return IconContext !== void 0 ? /* @__PURE__ */ import_react138.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
 }
 
 // ../../node_modules/react-icons/lu/index.mjs
-function LuCheck(props2) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "polyline", "attr": { "points": "20 6 9 17 4 12" }, "child": [] }] })(props2);
+function LuEyeOff(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "M9.88 9.88a3 3 0 1 0 4.24 4.24" }, "child": [] }, { "tag": "path", "attr": { "d": "M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68" }, "child": [] }, { "tag": "path", "attr": { "d": "M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61" }, "child": [] }, { "tag": "line", "attr": { "x1": "2", "x2": "22", "y1": "2", "y2": "22" }, "child": [] }] })(props);
 }
-function LuChevronRight(props2) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "m9 18 6-6-6-6" }, "child": [] }] })(props2);
+function LuEye(props) {
+  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" }, "child": [] }, { "tag": "circle", "attr": { "cx": "12", "cy": "12", "r": "3" }, "child": [] }] })(props);
 }
-function LuEyeOff(props2) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "M9.88 9.88a3 3 0 1 0 4.24 4.24" }, "child": [] }, { "tag": "path", "attr": { "d": "M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68" }, "child": [] }, { "tag": "path", "attr": { "d": "M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61" }, "child": [] }, { "tag": "line", "attr": { "x1": "2", "x2": "22", "y1": "2", "y2": "22" }, "child": [] }] })(props2);
-}
-function LuEye(props2) {
-  return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none", "stroke": "currentColor", "strokeWidth": "2", "strokeLinecap": "round", "strokeLinejoin": "round" }, "child": [{ "tag": "path", "attr": { "d": "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" }, "child": [] }, { "tag": "circle", "attr": { "cx": "12", "cy": "12", "r": "3" }, "child": [] }] })(props2);
-}
-
-// src/components/menu/menu.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var MenuContent = (0, import_react144.forwardRef)(
-  function MenuContent2(props2, ref2) {
-    const { portalled = true, portalRef, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.Content, { ref: ref2, ...rest }) }) });
-  }
-);
-var MenuArrow = (0, import_react144.forwardRef)(
-  function MenuArrow2(props2, ref2) {
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.Arrow, { ref: ref2, ...props2, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.ArrowTip, {}) });
-  }
-);
-var MenuCheckboxItem = (0, import_react144.forwardRef)(function MenuCheckboxItem2(props2, ref2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react145.Menu.CheckboxItem, { ref: ref2, ...props2, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.ItemIndicator, { hidden: false, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LuCheck, {}) }),
-    props2.children
-  ] });
-});
-var MenuRadioItem = (0, import_react144.forwardRef)(
-  function MenuRadioItem2(props2, ref2) {
-    const { children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react145.Menu.RadioItem, { ps: "8", ref: ref2, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.AbsoluteCenter, { axis: "horizontal", left: "4", asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LuCheck, {}) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.ItemText, { children })
-    ] });
-  }
-);
-var MenuItemGroup = (0, import_react144.forwardRef)(
-  function MenuItemGroup2(props2, ref2) {
-    const { title, children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react145.Menu.ItemGroup, { ref: ref2, ...rest, children: [
-      title && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react145.Menu.ItemGroupLabel, { userSelect: "none", children: title }),
-      children
-    ] });
-  }
-);
-var MenuTriggerItem = (0, import_react144.forwardRef)(
-  function MenuTriggerItem2(props2, ref2) {
-    const { startIcon, children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react145.Menu.TriggerItem, { ref: ref2, ...rest, children: [
-      startIcon,
-      children,
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LuChevronRight, {})
-    ] });
-  }
-);
-var MenuRadioItemGroup = import_react145.Menu.RadioItemGroup;
-var MenuContextTrigger = import_react145.Menu.ContextTrigger;
-var MenuRoot = import_react145.Menu.Root;
-var MenuSeparator = import_react145.Menu.Separator;
-var MenuItem = import_react145.Menu.Item;
-var MenuItemText = import_react145.Menu.ItemText;
-var MenuItemCommand = import_react145.Menu.ItemCommand;
-var MenuTrigger = import_react145.Menu.Trigger;
 
 // src/components/password-input/password-input.tsx
-var import_react146 = require("react");
-var import_react147 = require("@chakra-ui/react");
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var PasswordInput = (0, import_react146.forwardRef)(
-  function PasswordInput2(props2, ref2) {
+var import_jsx_runtime20 = require("react/jsx-runtime");
+var PasswordInput = (0, import_react139.forwardRef)(
+  function PasswordInput2(props, ref) {
     const {
       rootProps,
       defaultVisible,
       visible: visibleProp,
       onVisibleChange,
-      visibilityIcon = { on: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LuEye, {}), off: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LuEyeOff, {}) },
+      visibilityIcon = { on: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(LuEye, {}), off: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(LuEyeOff, {}) },
       ...rest
-    } = props2;
-    const [visible, setVisible] = (0, import_react147.useControllableState)({
+    } = props;
+    const [visible, setVisible] = (0, import_react140.useControllableState)({
       value: visibleProp,
       defaultValue: defaultVisible || false,
       onChange: onVisibleChange
     });
-    const inputRef = (0, import_react146.useRef)(null);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    const inputRef = (0, import_react139.useRef)(null);
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       InputGroup,
       {
         width: "full",
-        endElement: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        endElement: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           VisibilityTrigger,
           {
             disabled: rest.disabled,
@@ -11413,11 +9736,11 @@ var PasswordInput = (0, import_react146.forwardRef)(
           }
         ),
         ...rootProps,
-        children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-          import_react147.Input,
+        children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+          import_react140.Input,
           {
             ...rest,
-            ref: (0, import_react147.mergeRefs)(ref2, inputRef),
+            ref: (0, import_react140.mergeRefs)(ref, inputRef),
             type: visible ? "text" : "password"
           }
         )
@@ -11425,13 +9748,13 @@ var PasswordInput = (0, import_react146.forwardRef)(
     );
   }
 );
-var VisibilityTrigger = (0, import_react146.forwardRef)(
-  function VisibilityTrigger2(props2, ref2) {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-      import_react147.IconButton,
+var VisibilityTrigger = (0, import_react139.forwardRef)(
+  function VisibilityTrigger2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      import_react140.IconButton,
       {
         tabIndex: -1,
-        ref: ref2,
+        ref,
         me: "-2",
         aspectRatio: "square",
         size: "sm",
@@ -11439,7 +9762,7 @@ var VisibilityTrigger = (0, import_react146.forwardRef)(
         colorPalette: "gray",
         height: "calc(100% - {spacing.2})",
         "aria-label": "Toggle password visibility",
-        ...props2
+        ...props
       }
     );
   }
@@ -11449,31 +9772,31 @@ var VisibilityTrigger = (0, import_react146.forwardRef)(
 var React7 = __toESM(require("react"), 1);
 
 // src/components/persona/persona-primitive.tsx
-var import_react149 = require("react");
-var import_react150 = require("@chakra-ui/react");
-var import_utils9 = require("@saas-ui/core/utils");
+var import_react142 = require("react");
+var import_react143 = require("@chakra-ui/react");
+var import_utils8 = require("@saas-ui/core/utils");
 
 // src/components/persona/persona.context.ts
-var import_react148 = require("@chakra-ui/react");
+var import_react141 = require("@chakra-ui/react");
 var {
   useStyles: usePersonaStyles,
   withProvider: withProvider5,
   withContext: withContext6
-} = (0, import_react148.createSlotRecipeContext)({
+} = (0, import_react141.createSlotRecipeContext)({
   key: "suiPersona"
 });
 
 // src/components/persona/persona-primitive.tsx
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var PersonaRoot = withProvider5(
-  (0, import_react149.forwardRef)((props2, ref2) => {
-    const { outOfOffice, presence, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-      import_react150.chakra.div,
+  (0, import_react142.forwardRef)((props, ref) => {
+    const { outOfOffice, presence, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      import_react143.chakra.div,
       {
-        ref: ref2,
+        ref,
         ...rest,
-        "data-out-of-office": (0, import_utils9.dataAttr)(outOfOffice),
+        "data-out-of-office": (0, import_utils8.dataAttr)(outOfOffice),
         "data-presence": presence,
         css: [
           presence ? {
@@ -11486,8 +9809,8 @@ var PersonaRoot = withProvider5(
   }),
   "root"
 );
-var PersonaAvatar = (0, import_react149.forwardRef)(
-  (props2, ref2) => {
+var PersonaAvatar = (0, import_react142.forwardRef)(
+  (props, ref) => {
     const {
       name,
       getInitials: getInitials2 = (name2) => name2 == null ? void 0 : name2[0],
@@ -11498,11 +9821,11 @@ var PersonaAvatar = (0, import_react149.forwardRef)(
       srcSet,
       children,
       ...rest
-    } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react150.Avatar.Root, { ref: ref2, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react150.Avatar.Fallback, { children: getInitials2(name) }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-        import_react150.Avatar.Image,
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react143.Avatar.Root, { ref, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react143.Avatar.Fallback, { children: getInitials2(name) }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+        import_react143.Avatar.Image,
         {
           src,
           srcSet,
@@ -11534,9 +9857,9 @@ var PersonaTertiaryLabel = withContext6(
 );
 
 // src/components/persona/persona.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var Persona = React7.forwardRef(
-  (props2, ref2) => {
+  (props, ref) => {
     const {
       name,
       presence,
@@ -11556,16 +9879,16 @@ var Persona = React7.forwardRef(
       src,
       srcSet,
       ...rest
-    } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
       PersonaRoot,
       {
-        ref: ref2,
+        ref,
         outOfOffice: isOutOfOffice,
         presence,
         ...rest,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             PersonaAvatar,
             {
               name,
@@ -11576,13 +9899,13 @@ var Persona = React7.forwardRef(
               onError,
               src,
               srcSet,
-              children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PersonaPresenceBadge, { children: presenceIcon })
+              children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PersonaPresenceBadge, { children: presenceIcon })
             }
           ),
-          !hideDetails && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(PersonaDetails, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PersonaLabel, { children: label || name }),
-            secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PersonaSecondaryLabel, { children: secondaryLabel }),
-            tertiaryLabel && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PersonaTertiaryLabel, { children: tertiaryLabel }),
+          !hideDetails && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(PersonaDetails, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PersonaLabel, { children: label || name }),
+            secondaryLabel && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PersonaSecondaryLabel, { children: secondaryLabel }),
+            tertiaryLabel && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PersonaTertiaryLabel, { children: tertiaryLabel }),
             children
           ] })
         ]
@@ -11591,8 +9914,8 @@ var Persona = React7.forwardRef(
   }
 );
 Persona.displayName = "Persona";
-var PersonaAvatar2 = React7.forwardRef(function PersonaAvatar3(props2, ref2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Persona, { ref: ref2, ...props2, hideDetails: true });
+var PersonaAvatar2 = React7.forwardRef(function PersonaAvatar3(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Persona, { ref, ...props, hideDetails: true });
 });
 
 // src/components/persona/presence.ts
@@ -11620,11 +9943,11 @@ var defaultPresenceOptions = {
 };
 
 // src/components/pin-input/pin-input.tsx
-var import_react151 = require("react");
-var import_react152 = require("@chakra-ui/react");
-var import_jsx_runtime25 = require("react/jsx-runtime");
-var PinInput = (0, import_react151.forwardRef)(
-  function PinInput2(props2, ref2) {
+var import_react144 = require("react");
+var import_react145 = require("@chakra-ui/react");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var PinInput = (0, import_react144.forwardRef)(
+  function PinInput2(props, ref) {
     const {
       pinLength = 4,
       inputProps,
@@ -11632,37 +9955,37 @@ var PinInput = (0, import_react151.forwardRef)(
       attached,
       gap = attached ? 0 : 2,
       ...rest
-    } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react152.PinInput.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react152.PinInput.HiddenInput, { ref: ref2, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react152.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react152.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react152.PinInput.Input, { index }, index)) }) })
+    } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react145.PinInput.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react145.PinInput.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react145.PinInput.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react145.Group, { attached, gap, children: Array.from({ length: pinLength }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react145.PinInput.Input, { index }, index)) }) })
     ] });
   }
 );
 
 // src/components/radio/radio.tsx
-var import_react153 = require("react");
-var import_react154 = require("@chakra-ui/react");
-var import_jsx_runtime26 = require("react/jsx-runtime");
-var Radio = (0, import_react153.forwardRef)(
-  function Radio2(props2, ref2) {
-    const { children, inputProps, rootRef, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react154.RadioGroup.Item, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react154.RadioGroup.ItemHiddenInput, { ref: ref2, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react154.RadioGroup.ItemIndicator, {}),
-      children && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react154.RadioGroup.ItemText, { children })
+var import_react146 = require("react");
+var import_react147 = require("@chakra-ui/react");
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var Radio = (0, import_react146.forwardRef)(
+  function Radio2(props, ref) {
+    const { children, inputProps, rootRef, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react147.RadioGroup.Item, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react147.RadioGroup.ItemHiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react147.RadioGroup.ItemIndicator, {}),
+      children && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react147.RadioGroup.ItemText, { children })
     ] });
   }
 );
-var RadioGroup = import_react154.RadioGroup.Root;
+var RadioGroup = import_react147.RadioGroup.Root;
 
 // src/components/search-input/search-input.tsx
-var import_react155 = __toESM(require("react"), 1);
-var import_react156 = require("@chakra-ui/react");
-var import_utils10 = require("@saas-ui/core/utils");
-var import_jsx_runtime27 = require("react/jsx-runtime");
-var SearchInput = (0, import_react155.forwardRef)(
-  (props2, ref2) => {
+var import_react148 = __toESM(require("react"), 1);
+var import_react149 = require("@chakra-ui/react");
+var import_utils9 = require("@saas-ui/core/utils");
+var import_jsx_runtime25 = require("react/jsx-runtime");
+var SearchInput = (0, import_react148.forwardRef)(
+  (props, ref) => {
     const {
       placeholder = "Search",
       value: valueProp,
@@ -11670,7 +9993,7 @@ var SearchInput = (0, import_react155.forwardRef)(
       size,
       variant,
       width = "full",
-      icon = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SearchIcon, {}),
+      icon = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SearchIcon, {}),
       resetIcon,
       endElement: endElementProp,
       onChange: onChangeProp,
@@ -11678,19 +10001,19 @@ var SearchInput = (0, import_react155.forwardRef)(
       onKeyDown: onKeyDownProp,
       disabled,
       ...inputProps
-    } = props2;
-    const inputRef = import_react155.default.useRef(null);
-    const [value, setValue] = (0, import_react156.useControllableState)({
+    } = props;
+    const inputRef = import_react148.default.useRef(null);
+    const [value, setValue] = (0, import_react149.useControllableState)({
       value: valueProp,
       defaultValue: defaultValueProp
     });
-    const onChange = import_react155.default.useCallback(
+    const onChange = import_react148.default.useCallback(
       (e) => {
         setValue(e.target.value);
       },
       [setValue]
     );
-    const onKeyDown = import_react155.default.useCallback(
+    const onKeyDown = import_react148.default.useCallback(
       (event) => {
         if (event.key === "Escape") {
           setValue("");
@@ -11705,11 +10028,11 @@ var SearchInput = (0, import_react155.forwardRef)(
       onResetProp == null ? void 0 : onResetProp();
       (_a7 = inputRef.current) == null ? void 0 : _a7.focus();
     };
-    const showReset = value && !props2.disabled;
-    const endElement = showReset ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(SearchInputResetButton, { size, children: resetIcon }) : endElementProp;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react156.Group, { width, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-        import_react156.InputElement,
+    const showReset = value && !props.disabled;
+    const endElement = showReset ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(SearchInputResetButton, { size, children: resetIcon }) : endElementProp;
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react149.Group, { width, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        import_react149.InputElement,
         {
           placement: "start",
           px: "0",
@@ -11718,8 +10041,8 @@ var SearchInput = (0, import_react155.forwardRef)(
           children: icon
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-        import_react156.Input,
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        import_react149.Input,
         {
           type: "text",
           placeholder,
@@ -11727,25 +10050,25 @@ var SearchInput = (0, import_react155.forwardRef)(
           size,
           value,
           disabled,
-          ref: (0, import_react156.mergeRefs)(ref2, inputRef),
-          onChange: (0, import_utils10.callAll)(onChange, onChangeProp),
-          onKeyDown: (0, import_utils10.callAll)(onKeyDown, onKeyDownProp),
+          ref: (0, import_react149.mergeRefs)(ref, inputRef),
+          onChange: (0, import_utils9.callAll)(onChange, onChangeProp),
+          onKeyDown: (0, import_utils9.callAll)(onKeyDown, onKeyDownProp),
           ps: "calc(var(--input-height) - var(--input-height) / 10)",
           pe: "calc(var(--input-height) - var(--input-height) / 10)",
           ...inputProps
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react156.InputElement, { placement: "end", children: endElement })
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react149.InputElement, { placement: "end", children: endElement })
     ] });
   }
 );
-var SearchInputResetButton = (0, import_react155.forwardRef)(
-  (props2, ref2) => {
-    const { children = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CloseIcon, {}), ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-      import_react156.IconButton,
+var SearchInputResetButton = (0, import_react148.forwardRef)(
+  (props, ref) => {
+    const { children = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(CloseIcon, {}), ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      import_react149.IconButton,
       {
-        ref: ref2,
+        ref,
         variant: "ghost",
         "aria-label": "Reset search",
         me: "-2",
@@ -11760,8 +10083,8 @@ var SearchInputResetButton = (0, import_react155.forwardRef)(
 SearchInput.displayName = "SearchInput";
 
 // src/components/select/namespace.ts
-var namespace_exports4 = {};
-__export(namespace_exports4, {
+var namespace_exports3 = {};
+__export(namespace_exports3, {
   Content: () => SelectContent,
   Item: () => SelectItem,
   ItemGroup: () => SelectItemGroup,
@@ -11773,23 +10096,23 @@ __export(namespace_exports4, {
 });
 
 // src/components/select/select.tsx
-var import_react157 = require("react");
-var import_react158 = require("@chakra-ui/react");
-var import_jsx_runtime28 = require("react/jsx-runtime");
-var SelectTrigger = (0, import_react157.forwardRef)(
-  function SelectTrigger2(props2, ref2) {
-    const { children, clearable, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react158.Select.Control, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.Trigger, { ref: ref2, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react158.Select.IndicatorGroup, { children: [
-        clearable && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(SelectClearTrigger, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.Indicator, {})
+var import_react150 = require("react");
+var import_react151 = require("@chakra-ui/react");
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var SelectTrigger = (0, import_react150.forwardRef)(
+  function SelectTrigger2(props, ref) {
+    const { children, clearable, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react151.Select.Control, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.Trigger, { ref, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react151.Select.IndicatorGroup, { children: [
+        clearable && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SelectClearTrigger, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.Indicator, {})
       ] })
     ] });
   }
 );
-var SelectClearTrigger = (0, import_react157.forwardRef)(function SelectClearTrigger2(props2, ref2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.ClearTrigger, { asChild: true, ...props2, ref: ref2, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+var SelectClearTrigger = (0, import_react150.forwardRef)(function SelectClearTrigger2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.ClearTrigger, { asChild: true, ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     CloseButton,
     {
       size: "xs",
@@ -11800,53 +10123,83 @@ var SelectClearTrigger = (0, import_react157.forwardRef)(function SelectClearTri
     }
   ) });
 });
-var SelectContent = (0, import_react157.forwardRef)(
-  function SelectContent2(props2, ref2) {
-    const { portalled = true, portalRef, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.Content, { ...rest, ref: ref2 }) }) });
+var SelectContent = (0, import_react150.forwardRef)(
+  function SelectContent2(props, ref) {
+    const { portalled = true, portalRef, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.Content, { ...rest, ref }) }) });
   }
 );
-var SelectItem = (0, import_react157.forwardRef)(
-  function SelectItem2(props2, ref2) {
-    const { item, children, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react158.Select.Item, { item, ...rest, ref: ref2, children: [
+var SelectItem = (0, import_react150.forwardRef)(
+  function SelectItem2(props, ref) {
+    const { item, children, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react151.Select.Item, { item, ...rest, ref, children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.ItemIndicator, {})
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.ItemIndicator, {})
     ] }, item.value);
   }
 );
-var SelectValueText = (0, import_react157.forwardRef)(function SelectValueText2(props2, ref2) {
-  const { children, ...rest } = props2;
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.ValueText, { ...rest, ref: ref2, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.Context, { children: (select) => {
+var SelectValueText = (0, import_react150.forwardRef)(function SelectValueText2(props, ref) {
+  const { children, ...rest } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.ValueText, { ...rest, ref, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.Context, { children: (select) => {
     const items = select.selectedItems;
-    if (items.length === 0) return props2.placeholder;
+    if (items.length === 0) return props.placeholder;
     if (children) return children(items);
     if (items.length === 1)
       return select.collection.stringifyItem(items[0]);
     return `${items.length} selected`;
   } }) });
 });
-var SelectRoot = (0, import_react157.forwardRef)(function SelectRoot2(props2, ref2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-    import_react158.Select.Root,
+var SelectRoot = (0, import_react150.forwardRef)(function SelectRoot2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    import_react151.Select.Root,
     {
-      ...props2,
-      ref: ref2,
-      positioning: { sameWidth: true, ...props2.positioning }
+      ...props,
+      ref,
+      positioning: { sameWidth: true, ...props.positioning }
     }
   );
 });
-var SelectItemGroup = (0, import_react157.forwardRef)(
-  function SelectItemGroup2(props2, ref2) {
-    const { children, label, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_react158.Select.ItemGroup, { ...rest, ref: ref2, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react158.Select.ItemGroupLabel, { children: label }),
+var SelectItemGroup = (0, import_react150.forwardRef)(
+  function SelectItemGroup2(props, ref) {
+    const { children, label, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react151.Select.ItemGroup, { ...rest, ref, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react151.Select.ItemGroupLabel, { children: label }),
       children
     ] });
   }
 );
-var SelectLabel = import_react158.Select.Label;
-var SelectItemText = import_react158.Select.ItemText;
+var SelectLabel = import_react151.Select.Label;
+var SelectItemText = import_react151.Select.ItemText;
+
+// src/components/segmented-control/segmented-control.tsx
+var import_react152 = require("react");
+var import_react153 = require("@chakra-ui/react");
+var import_jsx_runtime27 = 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_react152.forwardRef)(function SegmentedControl2(props, ref) {
+  const { items, ...rest } = props;
+  const data = (0, import_react152.useMemo)(() => normalize(items), [items]);
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react153.SegmentGroup.Root, { ref, ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react153.SegmentGroup.Indicator, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react153.For, { each: data, children: (item) => /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+      import_react153.SegmentGroup.Item,
+      {
+        value: item.value,
+        disabled: item.disabled,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react153.SegmentGroup.ItemText, { children: item.label }),
+          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react153.SegmentGroup.ItemHiddenInput, {})
+        ]
+      },
+      item.value
+    ) })
+  ] });
+});
 
 // src/components/sidebar/sidebar.tsx
 var sidebar_exports = {};
@@ -11872,36 +10225,36 @@ __export(sidebar_exports, {
 var import_sidebar = require("@saas-ui/core/sidebar");
 
 // src/components/sidebar/sidebar.context.ts
-var import_react159 = require("@chakra-ui/react");
+var import_react154 = require("@chakra-ui/react");
 var {
   withContext: withContext7,
   useRecipeResult,
   StylesProvider,
   ClassNamesProvider,
   useStyles: useSidebarStyles
-} = (0, import_react159.createSlotRecipeContext)({
+} = (0, import_react154.createSlotRecipeContext)({
   key: "suiSidebar"
 });
 var {
   withProvider: withItemProvider,
   withContext: withItemContext,
   useStyles: useSidebarItemStyles
-} = (0, import_react159.createSlotRecipeContext)({
+} = (0, import_react154.createSlotRecipeContext)({
   key: "suiSidebarNavItem"
 });
 
 // src/components/sidebar/sidebar.tsx
-var import_jsx_runtime29 = require("react/jsx-runtime");
-var SidebarProvider = function SidebarProvider2(props2) {
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_sidebar.Sidebar.Provider, { ...props2, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(RecipeProvider, { ...props2, children: props2.children }) });
+var import_jsx_runtime28 = require("react/jsx-runtime");
+var SidebarProvider = function SidebarProvider2(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_sidebar.Sidebar.Provider, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RecipeProvider, { ...props, children: props.children }) });
 };
-function RecipeProvider(props2) {
+function RecipeProvider(props) {
   const { mode } = (0, import_sidebar.useSidebar)();
   const { styles, classNames } = useRecipeResult({
-    ...props2,
+    ...props,
     mode
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(StylesProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ClassNamesProvider, { value: classNames, children: props2.children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(StylesProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ClassNamesProvider, { value: classNames, children: props.children }) });
 }
 var SidebarRoot = withContext7(
   import_sidebar.Sidebar.Root,
@@ -11975,23 +10328,23 @@ var SidebarNavItemEndElement = withItemContext(import_sidebar.Sidebar.NavItemEnd
 var import_sidebar2 = require("@saas-ui/core/sidebar");
 
 // src/components/toaster/toaster.tsx
-var import_react160 = require("@chakra-ui/react");
-var import_jsx_runtime30 = require("react/jsx-runtime");
-var toast = (0, import_react160.createToaster)({
+var import_react155 = require("@chakra-ui/react");
+var import_jsx_runtime29 = require("react/jsx-runtime");
+var toast = (0, import_react155.createToaster)({
   placement: "bottom-end",
   pauseOnPageIdle: true
 });
 var Toaster = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Toaster, { toaster: toast, insetInline: { mdDown: "4" }, children: (toast2) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Toaster, { toaster: toast, insetInline: { mdDown: "4" }, children: (toast2) => {
     var _a7;
-    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react160.Toast.Root, { width: { md: "sm" }, children: [
-      toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Spinner, { size: "sm", color: "colorPalette.solid" }) : /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Toast.Indicator, {}),
-      /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react160.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
-        toast2.title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Toast.Title, { children: toast2.title }),
-        toast2.description && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Toast.Description, { children: toast2.description })
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react155.Toast.Root, { width: { md: "sm" }, children: [
+      toast2.type === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Spinner, { size: "sm", color: "colorPalette.solid" }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Toast.Indicator, {}),
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_react155.Stack, { gap: "1", flex: "1", maxWidth: "100%", children: [
+        toast2.title && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Toast.Title, { children: toast2.title }),
+        toast2.description && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Toast.Description, { children: toast2.description })
       ] }),
-      toast2.action && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Toast.ActionTrigger, { children: toast2.action.label }),
-      ((_a7 = toast2.meta) == null ? void 0 : _a7.closable) && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react160.Toast.CloseTrigger, {})
+      toast2.action && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Toast.ActionTrigger, { children: toast2.action.label }),
+      ((_a7 = toast2.meta) == null ? void 0 : _a7.closable) && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_react155.Toast.CloseTrigger, {})
     ] });
   } }) });
 };
@@ -12008,76 +10361,76 @@ __export(steps_exports, {
   PrevTrigger: () => StepsPrevTrigger,
   Root: () => StepsRoot
 });
-var import_react161 = require("@chakra-ui/react");
-var import_jsx_runtime31 = require("react/jsx-runtime");
-var StepsItem = (props2) => {
-  const { title, description, completedIcon, icon, ...rest } = props2;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react161.Steps.Item, { ...rest, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react161.Steps.Trigger, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
-        import_react161.Steps.Status,
+var import_react156 = require("@chakra-ui/react");
+var import_jsx_runtime30 = require("react/jsx-runtime");
+var StepsItem = (props) => {
+  const { title, description, completedIcon, icon, ...rest } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react156.Steps.Item, { ...rest, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react156.Steps.Trigger, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        import_react156.Steps.Status,
         {
-          complete: completedIcon || /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(CheckIcon, {}),
-          incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Number, {})
+          complete: completedIcon || /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(CheckIcon, {}),
+          incomplete: icon || /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Number, {})
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(StepInfo, { title, description })
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(StepInfo, { title, description })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Separator, {})
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Separator, {})
   ] });
 };
-var StepInfo = (props2) => {
-  const { title, description } = props2;
+var StepInfo = (props) => {
+  const { title, description } = props;
   if (title && description) {
-    return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react161.Box, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Title, { children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Description, { children: description })
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react156.Box, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Title, { children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Description, { children: description })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Title, { children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Description, { children: description })
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Title, { children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Description, { children: description })
   ] });
 };
-var StepsIndicator = (props2) => {
-  const { icon = /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Number, {}), completedIcon } = props2;
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.Status, { complete: completedIcon, incomplete: icon }) });
+var StepsIndicator = (props) => {
+  const { icon = /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Number, {}), completedIcon } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.Status, { complete: completedIcon, incomplete: icon }) });
 };
-var StepsList = import_react161.Steps.List;
-var StepsRoot = import_react161.Steps.Root;
-var StepsContent = import_react161.Steps.Content;
-var StepsCompletedContent = import_react161.Steps.CompletedContent;
-var StepsNextTrigger = (props2) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.NextTrigger, { ...props2 });
+var StepsList = import_react156.Steps.List;
+var StepsRoot = import_react156.Steps.Root;
+var StepsContent = import_react156.Steps.Content;
+var StepsCompletedContent = import_react156.Steps.CompletedContent;
+var StepsNextTrigger = (props) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.NextTrigger, { ...props });
 };
-var StepsPrevTrigger = (props2) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react161.Steps.PrevTrigger, { ...props2 });
+var StepsPrevTrigger = (props) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react156.Steps.PrevTrigger, { ...props });
 };
 
 // src/components/switch/switch.tsx
-var import_react162 = require("@chakra-ui/react");
-var import_react163 = require("react");
-var import_jsx_runtime32 = require("react/jsx-runtime");
-var Switch = (0, import_react163.forwardRef)(
-  function Switch2(props2, ref2) {
-    const { inputProps, children, rootRef, trackLabel, thumbLabel, ...rest } = props2;
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react162.Switch.Root, { ref: rootRef, ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react162.Switch.HiddenInput, { ref: ref2, ...inputProps }),
-      /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react162.Switch.Control, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react162.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react162.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
-        trackLabel && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react162.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
+var import_react157 = require("@chakra-ui/react");
+var import_react158 = require("react");
+var import_jsx_runtime31 = require("react/jsx-runtime");
+var Switch = (0, import_react158.forwardRef)(
+  function Switch2(props, ref) {
+    const { inputProps, children, rootRef, trackLabel, thumbLabel, ...rest } = props;
+    return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react157.Switch.Root, { ref: rootRef, ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.HiddenInput, { ref, ...inputProps }),
+      /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_react157.Switch.Control, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.Thumb, { children: thumbLabel && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.ThumbIndicator, { fallback: thumbLabel == null ? void 0 : thumbLabel.off, children: thumbLabel == null ? void 0 : thumbLabel.on }) }),
+        trackLabel && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.Indicator, { fallback: trackLabel.off, children: trackLabel.on })
       ] }),
-      children != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react162.Switch.Label, { children })
+      children != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react157.Switch.Label, { children })
     ] });
   }
 );
 
 // src/components/tooltip/tooltip.tsx
-var import_react164 = require("react");
-var import_react165 = require("@chakra-ui/react");
-var import_jsx_runtime33 = require("react/jsx-runtime");
-var Tooltip = (0, import_react164.forwardRef)(
-  function Tooltip2(props2, ref2) {
+var import_react159 = require("react");
+var import_react160 = require("@chakra-ui/react");
+var import_jsx_runtime32 = require("react/jsx-runtime");
+var Tooltip = (0, import_react159.forwardRef)(
+  function Tooltip2(props, ref) {
     const {
       showArrow,
       children,
@@ -12087,12 +10440,12 @@ var Tooltip = (0, import_react164.forwardRef)(
       contentProps,
       portalRef,
       ...rest
-    } = props2;
+    } = props;
     if (disabled) return children;
-    return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react165.Tooltip.Root, { ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react165.Tooltip.Trigger, { asChild: true, children }),
-      /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react165.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react165.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react165.Tooltip.Content, { ref: ref2, ...contentProps, children: [
-        showArrow && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react165.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_react165.Tooltip.ArrowTip, {}) }),
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react160.Tooltip.Root, { ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react160.Tooltip.Trigger, { asChild: true, children }),
+      /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react160.Portal, { disabled: !portalled, container: portalRef, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react160.Tooltip.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(import_react160.Tooltip.Content, { ref, ...contentProps, children: [
+        showArrow && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react160.Tooltip.Arrow, { children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_react160.Tooltip.ArrowTip, {}) }),
         content
       ] }) }) })
     ] });
@@ -12126,6 +10479,7 @@ var Tooltip = (0, import_react164.forwardRef)(
   Radio,
   RadioGroup,
   SearchInput,
+  SegmentedControl,
   Select,
   Sidebar,
   Spinner,