@salesmind-ai/design-system 0.2.0 → 0.3.0

package/dist/core/index.cjs

@@ -1,12 +1,13 @@
 'use strict';
 
-var React38 = require('react');
+var React39 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
-var clsx27 = require('clsx');
+var clsx28 = require('clsx');
 var reactSlot = require('@radix-ui/react-slot');
 var input = require('@base-ui/react/input');
 var checkbox = require('@base-ui/react/checkbox');
 var _switch = require('@base-ui/react/switch');
+var select = require('@base-ui/react/select');
 var dialog = require('@base-ui/react/dialog');
 var tooltip = require('@base-ui/react/tooltip');
 var ReactDOM = require('react-dom');
@@ -16,8 +17,8 @@ var reactIntl = require('react-intl');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var React38__default = /*#__PURE__*/_interopDefault(React38);
-var clsx27__default = /*#__PURE__*/_interopDefault(clsx27);
+var React39__default = /*#__PURE__*/_interopDefault(React39);
+var clsx28__default = /*#__PURE__*/_interopDefault(clsx28);
 var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
 
 // src/tokens/motion.ts
@@ -345,18 +346,18 @@ function prefersReducedMotion() {
   if (typeof window === "undefined") return false;
   return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
 }
-var AppearanceContext = React38.createContext(null);
+var AppearanceContext = React39.createContext(null);
 function AppearanceProvider({
   initialSettings,
   disablePersistence = false,
   children
 }) {
-  const [settings, setSettings] = React38.useState(() => ({
+  const [settings, setSettings] = React39.useState(() => ({
     ...DEFAULT_SETTINGS,
     ...initialSettings
   }));
-  const [hydrated, setHydrated] = React38.useState(false);
-  React38.useEffect(() => {
+  const [hydrated, setHydrated] = React39.useState(false);
+  React39.useEffect(() => {
     if (!disablePersistence) {
       const loaded = loadSettings();
       setSettings({
@@ -367,13 +368,13 @@ function AppearanceProvider({
     }
     setHydrated(true);
   }, []);
-  React38.useEffect(() => {
+  React39.useEffect(() => {
     applySettings(settings);
     if (!disablePersistence && hydrated) {
       saveSettings(settings);
     }
   }, [settings, disablePersistence, hydrated]);
-  React38.useEffect(() => {
+  React39.useEffect(() => {
     if (typeof window === "undefined") return;
     const mediaQuery = window.matchMedia("(prefers-color-scheme: light)");
     const handleChange = (e) => {
@@ -390,7 +391,7 @@ function AppearanceProvider({
     mediaQuery.addEventListener("change", handleChange);
     return () => mediaQuery.removeEventListener("change", handleChange);
   }, []);
-  React38.useEffect(() => {
+  React39.useEffect(() => {
     if (typeof window === "undefined") return;
     const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
     const handleChange = () => {
@@ -399,28 +400,28 @@ function AppearanceProvider({
     mediaQuery.addEventListener("change", handleChange);
     return () => mediaQuery.removeEventListener("change", handleChange);
   }, [settings]);
-  const setTheme = React38.useCallback((theme) => {
+  const setTheme = React39.useCallback((theme) => {
     setSettings((prev) => ({ ...prev, theme }));
   }, []);
-  const setBrand = React38.useCallback((brand) => {
+  const setBrand = React39.useCallback((brand) => {
     setSettings((prev) => ({ ...prev, brand }));
   }, []);
-  const setNavPlacement = React38.useCallback((navPlacement) => {
+  const setNavPlacement = React39.useCallback((navPlacement) => {
     setSettings((prev) => ({ ...prev, navPlacement }));
   }, []);
-  const setDensity = React38.useCallback((density) => {
+  const setDensity = React39.useCallback((density) => {
     setSettings((prev) => ({ ...prev, density }));
   }, []);
-  const setRadius = React38.useCallback((radius) => {
+  const setRadius = React39.useCallback((radius) => {
     setSettings((prev) => ({ ...prev, radius }));
   }, []);
-  const setCustomColor = React38.useCallback((customColor) => {
+  const setCustomColor = React39.useCallback((customColor) => {
     setSettings((prev) => ({ ...prev, customColor, brand: "custom" }));
   }, []);
-  const setAppearance = React38.useCallback((partial) => {
+  const setAppearance = React39.useCallback((partial) => {
     setSettings((prev) => ({ ...prev, ...partial }));
   }, []);
-  const resetToDefaults = React38.useCallback(() => {
+  const resetToDefaults = React39.useCallback(() => {
     setSettings(DEFAULT_SETTINGS);
   }, []);
   const contextValue = {
@@ -437,7 +438,7 @@ function AppearanceProvider({
   return /* @__PURE__ */ jsxRuntime.jsx(AppearanceContext.Provider, { value: contextValue, children });
 }
 function useAppearance() {
-  const context = React38.useContext(AppearanceContext);
+  const context = React39.useContext(AppearanceContext);
   if (!context) {
     throw new Error("useAppearance must be used within an AppearanceProvider");
   }
@@ -448,7 +449,7 @@ function initializeAppearance(settings) {
   const merged = { ...loaded, ...settings };
   applySettings(merged);
 }
-var AppearancePanel = React38__default.default.forwardRef(
+var AppearancePanel = React39__default.default.forwardRef(
   ({ className, labels: l }, ref) => {
     const {
       theme,
@@ -465,7 +466,7 @@ var AppearancePanel = React38__default.default.forwardRef(
       setCustomColor,
       resetToDefaults
     } = useAppearance();
-    const colorPickerId = React38.useId();
+    const colorPickerId = React39.useId();
     const themeOptions = [
       { value: "light", label: l?.themeLight ?? "Light" },
       { value: "light-contrast", label: l?.themeLightContrast ?? "Light (High Contrast)" },
@@ -490,14 +491,14 @@ var AppearancePanel = React38__default.default.forwardRef(
       { value: "playful", label: l?.radiusPlayful ?? "Playful", description: l?.radiusPlayfulDescription ?? "Rounded corners" },
       { value: "sharp", label: l?.radiusSharp ?? "Sharp", description: l?.radiusSharpDescription ?? "Technical feel" }
     ];
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx27__default.default("ds-appearance-panel", className), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx28__default.default("ds-appearance-panel", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "ds-appearance-panel__title", children: l?.title ?? "Appearance Settings" }),
       /* @__PURE__ */ jsxRuntime.jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
         /* @__PURE__ */ jsxRuntime.jsx("legend", { className: "ds-appearance-panel__legend", children: l?.themeHeading ?? "Theme" }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options", children: themeOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: clsx27__default.default(
+            className: clsx28__default.default(
               "ds-appearance-panel__option",
               theme === option.value && "ds-appearance-panel__option--active"
             ),
@@ -524,7 +525,7 @@ var AppearancePanel = React38__default.default.forwardRef(
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options", children: brandOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: clsx27__default.default(
+            className: clsx28__default.default(
               "ds-appearance-panel__option",
               brand === option.value && "ds-appearance-panel__option--active"
             ),
@@ -570,7 +571,7 @@ var AppearancePanel = React38__default.default.forwardRef(
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: densityOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: clsx27__default.default(
+            className: clsx28__default.default(
               "ds-appearance-panel__option",
               "ds-appearance-panel__option--toggle",
               density === option.value && "ds-appearance-panel__option--active"
@@ -601,7 +602,7 @@ var AppearancePanel = React38__default.default.forwardRef(
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: radiusOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: clsx27__default.default(
+            className: clsx28__default.default(
               "ds-appearance-panel__option",
               "ds-appearance-panel__option--toggle",
               radius === option.value && "ds-appearance-panel__option--active"
@@ -632,7 +633,7 @@ var AppearancePanel = React38__default.default.forwardRef(
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-appearance-panel__options", children: navOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: clsx27__default.default(
+            className: clsx28__default.default(
               "ds-appearance-panel__option",
               navPlacement === option.value && "ds-appearance-panel__option--active"
             ),
@@ -659,9 +660,9 @@ var AppearancePanel = React38__default.default.forwardRef(
   }
 );
 AppearancePanel.displayName = "AppearancePanel";
-var Button = React38__default.default.forwardRef(
+var Button = React39__default.default.forwardRef(
   ({ className, variant = "primary", size = "md", asChild = false, isLoading = false, children, disabled, ...props }, ref) => {
-    const buttonClass = clsx27__default.default(
+    const buttonClass = clsx28__default.default(
       "ds-button",
       `ds-button--${variant}`,
       size === "icon" ? "ds-button--icon ds-button--md" : `ds-button--${size}`,
@@ -704,21 +705,21 @@ var Button = React38__default.default.forwardRef(
               children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx27__default.default("ds-button__content", isLoading && "ds-button__content--hidden"), children })
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx28__default.default("ds-button__content", isLoading && "ds-button__content--hidden"), children })
         ]
       }
     );
   }
 );
 Button.displayName = "Button";
-var ButtonGroup = React38__default.default.forwardRef(
+var ButtonGroup = React39__default.default.forwardRef(
   ({ orientation = "horizontal", fullWidth = false, size = "md", className, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
         role: "group",
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-button-group",
           `ds-button-group--${orientation}`,
           fullWidth && "ds-button-group--full-width",
@@ -732,11 +733,11 @@ var ButtonGroup = React38__default.default.forwardRef(
   }
 );
 ButtonGroup.displayName = "ButtonGroup";
-var TextField = React38__default.default.forwardRef(
+var TextField = React39__default.default.forwardRef(
   ({ className, label, error, helperText, endAdornment, id, ...props }, ref) => {
-    const generatedId = React38__default.default.useId();
+    const generatedId = React39__default.default.useId();
     const inputId = id || generatedId;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx27__default.default("ds-textfield", className), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx28__default.default("ds-textfield", className), children: [
       label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: inputId, className: "ds-textfield__label", children: label }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ds-textfield__input-wrapper", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -744,7 +745,7 @@ var TextField = React38__default.default.forwardRef(
           {
             id: inputId,
             ref,
-            className: clsx27__default.default(
+            className: clsx28__default.default(
               "ds-textfield__input",
               error && "ds-textfield__input--error",
               endAdornment && "ds-textfield__input--adorned"
@@ -754,36 +755,36 @@ var TextField = React38__default.default.forwardRef(
         ),
         endAdornment && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-textfield__adornment", children: endAdornment })
       ] }),
-      helperText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx27__default.default("ds-textfield__helper", error && "ds-textfield__helper--error"), children: helperText })
+      helperText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx28__default.default("ds-textfield__helper", error && "ds-textfield__helper--error"), children: helperText })
     ] });
   }
 );
 TextField.displayName = "TextField";
-var TextArea = React38.forwardRef(
+var TextArea = React39.forwardRef(
   ({ className, label, error, helperText, id, ...props }, ref) => {
-    const generatedId = React38.useId();
+    const generatedId = React39.useId();
     const inputId = id || generatedId;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx27__default.default("ds-textarea", className), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx28__default.default("ds-textarea", className), children: [
       label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: inputId, className: "ds-textarea__label", children: label }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-textarea__input-wrapper", children: /* @__PURE__ */ jsxRuntime.jsx(
         "textarea",
         {
           id: inputId,
           ref,
-          className: clsx27__default.default("ds-textarea__input", error && "ds-textarea__input--error"),
+          className: clsx28__default.default("ds-textarea__input", error && "ds-textarea__input--error"),
           ...props
         }
       ) }),
-      helperText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx27__default.default("ds-textarea__helper", error && "ds-textarea__helper--error"), children: helperText })
+      helperText && /* @__PURE__ */ jsxRuntime.jsx("span", { className: clsx28__default.default("ds-textarea__helper", error && "ds-textarea__helper--error"), children: helperText })
     ] });
   }
 );
 TextArea.displayName = "TextArea";
-var Checkbox = React38__default.default.forwardRef(
+var Checkbox = React39__default.default.forwardRef(
   ({ className, label, id, ...props }, ref) => {
-    const generatedId = React38__default.default.useId();
+    const generatedId = React39__default.default.useId();
     const checkboxId = id || generatedId;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx27__default.default("ds-checkbox-wrapper", className), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx28__default.default("ds-checkbox-wrapper", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx(checkbox.Checkbox.Root, { id: checkboxId, ref, className: "ds-checkbox", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(checkbox.Checkbox.Indicator, { className: "ds-checkbox__indicator", children: /* @__PURE__ */ jsxRuntime.jsx(
         "svg",
         {
@@ -808,8 +809,8 @@ var Checkbox = React38__default.default.forwardRef(
   }
 );
 Checkbox.displayName = "Checkbox";
-var RadioGroupContext = React38.createContext(null);
-var RadioGroup = React38.forwardRef(
+var RadioGroupContext = React39.createContext(null);
+var RadioGroup = React39.forwardRef(
   ({
     className,
     name,
@@ -819,14 +820,14 @@ var RadioGroup = React38.forwardRef(
     children,
     ...props
   }, ref) => {
-    const generatedName = React38.useId();
+    const generatedName = React39.useId();
     const groupName = name || generatedName;
     return /* @__PURE__ */ jsxRuntime.jsx(RadioGroupContext.Provider, { value: { name: groupName, value, onChange: onValueChange }, children: /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
         role: "radiogroup",
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-radio-group",
           orientation === "horizontal" && "ds-radio-group--horizontal",
           className
@@ -838,10 +839,10 @@ var RadioGroup = React38.forwardRef(
   }
 );
 RadioGroup.displayName = "RadioGroup";
-var Radio = React38.forwardRef(
+var Radio = React39.forwardRef(
   ({ className, label, value, disabled, id, onChange, ...props }, ref) => {
-    const context = React38.useContext(RadioGroupContext);
-    const generatedId = React38.useId();
+    const context = React39.useContext(RadioGroupContext);
+    const generatedId = React39.useId();
     const radioId = id || generatedId;
     const name = context?.name || props.name;
     const isChecked = context?.value !== void 0 ? context.value === value : props.checked;
@@ -852,7 +853,7 @@ var Radio = React38.forwardRef(
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "label",
       {
-        className: clsx27__default.default("ds-radio-wrapper", disabled && "ds-radio-wrapper--disabled", className),
+        className: clsx28__default.default("ds-radio-wrapper", disabled && "ds-radio-wrapper--disabled", className),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             "input",
@@ -869,7 +870,7 @@ var Radio = React38.forwardRef(
               ...props
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx27__default.default("ds-radio", isChecked && "ds-radio--checked"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-radio__indicator" }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx28__default.default("ds-radio", isChecked && "ds-radio--checked"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-radio__indicator" }) }),
           label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ds-radio__label", children: label })
         ]
       }
@@ -877,50 +878,174 @@ var Radio = React38.forwardRef(
   }
 );
 Radio.displayName = "Radio";
-var Switch = React38__default.default.forwardRef(
+var Switch = React39__default.default.forwardRef(
   ({ className, label, id, ...props }, ref) => {
-    const generatedId = React38__default.default.useId();
+    const generatedId = React39__default.default.useId();
     const switchId = id || generatedId;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx27__default.default("ds-switch-wrapper", className), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx28__default.default("ds-switch-wrapper", className), children: [
       /* @__PURE__ */ jsxRuntime.jsx(_switch.Switch.Root, { id: switchId, ref, className: "ds-switch", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(_switch.Switch.Thumb, { className: "ds-switch__thumb" }) }),
       label && /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: switchId, className: "ds-switch__label", children: label })
     ] });
   }
 );
 Switch.displayName = "Switch";
+function Select({
+  value,
+  defaultValue,
+  onValueChange,
+  disabled,
+  required,
+  name,
+  items,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    select.Select.Root,
+    {
+      value,
+      defaultValue,
+      onValueChange: onValueChange ? (val) => onValueChange(val) : void 0,
+      disabled,
+      required,
+      name,
+      items,
+      children
+    }
+  );
+}
+Select.displayName = "Select";
+var SelectTrigger = React39__default.default.forwardRef(
+  ({ className, placeholder = "Select...", size = "md", ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-select__trigger-wrapper", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      select.Select.Trigger,
+      {
+        ref,
+        className: clsx28__default.default("ds-select__trigger", `ds-select__trigger--${size}`, className),
+        "aria-label": props["aria-label"] || (typeof placeholder === "string" ? placeholder : "Select"),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(select.Select.Value, { className: "ds-select__value", placeholder }),
+          /* @__PURE__ */ jsxRuntime.jsx(select.Select.Icon, { className: "ds-select__icon", "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDownIcon, {}) })
+        ]
+      }
+    ) });
+  }
+);
+SelectTrigger.displayName = "SelectTrigger";
+var SelectContent = React39__default.default.forwardRef(
+  ({ className, side = "bottom", sideOffset = 4, align = "start", children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(select.Select.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      select.Select.Positioner,
+      {
+        side,
+        sideOffset,
+        align,
+        alignItemWithTrigger: false,
+        children: /* @__PURE__ */ jsxRuntime.jsx(select.Select.Popup, { ref, className: clsx28__default.default("ds-select__content", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(select.Select.List, { className: "ds-select__list", children }) })
+      }
+    ) });
+  }
+);
+SelectContent.displayName = "SelectContent";
+var SelectItem = React39__default.default.forwardRef(
+  ({ className, value, children, disabled, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      select.Select.Item,
+      {
+        ref,
+        value,
+        disabled,
+        className: clsx28__default.default("ds-select__item", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(select.Select.ItemIndicator, { className: "ds-select__item-indicator", children: /* @__PURE__ */ jsxRuntime.jsx(CheckIcon, {}) }),
+          /* @__PURE__ */ jsxRuntime.jsx(select.Select.ItemText, { children })
+        ]
+      }
+    );
+  }
+);
+SelectItem.displayName = "SelectItem";
+var SelectGroup = React39__default.default.forwardRef(
+  ({ className, label, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(select.Select.Group, { ref, className: clsx28__default.default("ds-select__group", className), ...props, children: [
+      label && /* @__PURE__ */ jsxRuntime.jsx(select.Select.GroupLabel, { className: "ds-select__group-label", children: label }),
+      children
+    ] });
+  }
+);
+SelectGroup.displayName = "SelectGroup";
+var SelectSeparator = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-select__separator", className), ...props });
+});
+SelectSeparator.displayName = "SelectSeparator";
+function ChevronDownIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "16",
+      height: "16",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 9 6 6 6-6" })
+    }
+  );
+}
+function CheckIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "14",
+      height: "14",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
+    }
+  );
+}
 var Dialog = dialog.Dialog.Root;
 var DialogTrigger = dialog.Dialog.Trigger;
 var DialogClose = dialog.Dialog.Close;
-var DialogTitle = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Title, { ref, className: clsx27__default.default("ds-dialog__title", className), ...props }));
+var DialogTitle = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Title, { ref, className: clsx28__default.default("ds-dialog__title", className), ...props }));
 DialogTitle.displayName = "DialogTitle";
-var DialogDescription = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogDescription = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   dialog.Dialog.Description,
   {
     ref,
-    className: clsx27__default.default("ds-dialog__description", className),
+    className: clsx28__default.default("ds-dialog__description", className),
     ...props
   }
 ));
 DialogDescription.displayName = "DialogDescription";
-var DialogContent = React38__default.default.forwardRef(
+var DialogContent = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(dialog.Dialog.Portal, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Backdrop, { className: "ds-dialog__backdrop" }),
-    /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Popup, { ref, className: clsx27__default.default("ds-dialog__content", className), ...props, children })
+    /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Popup, { ref, className: clsx28__default.default("ds-dialog__content", className), ...props, children })
   ] })
 );
 DialogContent.displayName = "DialogContent";
-var DialogHeader = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-dialog__header", className), ...props })
+var DialogHeader = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-dialog__header", className), ...props })
 );
 DialogHeader.displayName = "DialogHeader";
-var DialogFooter = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-dialog__footer", className), ...props })
+var DialogFooter = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-dialog__footer", className), ...props })
 );
 DialogFooter.displayName = "DialogFooter";
 var TooltipProvider = tooltip.Tooltip.Provider;
 var TooltipRoot = tooltip.Tooltip.Root;
 var TooltipTrigger = tooltip.Tooltip.Trigger;
-var TooltipContent = React38__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Positioner, { sideOffset: 5, children: /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Tooltip.Popup, { ref, className: clsx27__default.default("ds-tooltip__content", className), ...props, children: [
+var TooltipContent = React39__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Positioner, { sideOffset: 5, children: /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Tooltip.Popup, { ref, className: clsx28__default.default("ds-tooltip__content", className), ...props, children: [
   children,
   /* @__PURE__ */ jsxRuntime.jsx(tooltip.Tooltip.Arrow, { className: "ds-tooltip__arrow" })
 ] }) }) }));
@@ -931,26 +1056,26 @@ var Tooltip = ({ content, children, delay = 200 }) => {
     /* @__PURE__ */ jsxRuntime.jsx(TooltipContent, { children: content })
   ] }) });
 };
-var Badge = React38__default.default.forwardRef(
+var Badge = React39__default.default.forwardRef(
   ({ className, variant = "default", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         ref,
-        className: clsx27__default.default("ds-badge", `ds-badge--${variant}`, className),
+        className: clsx28__default.default("ds-badge", `ds-badge--${variant}`, className),
         ...props
       }
     );
   }
 );
 Badge.displayName = "Badge";
-var StatusBadge = React38__default.default.forwardRef(
+var StatusBadge = React39__default.default.forwardRef(
   ({ variant = "default", size = "md", dot = false, className, children }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "span",
       {
         ref,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-status-badge",
           `ds-status-badge--${variant}`,
           `ds-status-badge--${size}`,
@@ -1039,7 +1164,7 @@ var DefaultIcons = {
     }
   )
 };
-var Alert = React38__default.default.forwardRef(
+var Alert = React39__default.default.forwardRef(
   ({ className, variant = "info", title, icon, children, ...props }, ref) => {
     const renderedIcon = icon || DefaultIcons[variant];
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -1047,7 +1172,7 @@ var Alert = React38__default.default.forwardRef(
       {
         ref,
         role: "alert",
-        className: clsx27__default.default("ds-alert", `ds-alert--${variant}`, className),
+        className: clsx28__default.default("ds-alert", `ds-alert--${variant}`, className),
         ...props,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-alert__icon", "aria-hidden": "true", children: renderedIcon }),
@@ -1061,9 +1186,9 @@ var Alert = React38__default.default.forwardRef(
   }
 );
 Alert.displayName = "Alert";
-var ToastContext = React38.createContext(void 0);
+var ToastContext = React39.createContext(void 0);
 var useToast = () => {
-  const context = React38.useContext(ToastContext);
+  const context = React39.useContext(ToastContext);
   if (!context) {
     throw new Error("useToast must be used within a ToastProvider");
   }
@@ -1077,7 +1202,7 @@ var ToastItem = ({
   onDismiss,
   dismissLabel = "Close"
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx27__default.default("ds-toast-root", `ds-toast--${variant}`), "data-state": "open", role: "alert", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx28__default.default("ds-toast-root", `ds-toast--${variant}`), "data-state": "open", role: "alert", children: [
     title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-toast-title", children: title }),
     description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-toast-description", children: description }),
     action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-toast-action", children: action }),
@@ -1118,14 +1243,14 @@ var ToastItem = ({
   ] });
 };
 var ToastProvider = ({ children }) => {
-  const [toasts, setToasts] = React38.useState([]);
-  const [mounted, setMounted] = React38.useState(false);
-  const idCounter = React38.useRef(0);
-  React38.useEffect(() => setMounted(true), []);
-  const removeToast = React38.useCallback((id) => {
+  const [toasts, setToasts] = React39.useState([]);
+  const [mounted, setMounted] = React39.useState(false);
+  const idCounter = React39.useRef(0);
+  React39.useEffect(() => setMounted(true), []);
+  const removeToast = React39.useCallback((id) => {
     setToasts((prev) => prev.filter((t) => t.id !== id));
   }, []);
-  const addToast = React38.useCallback(
+  const addToast = React39.useCallback(
     ({ duration = 5e3, ...props }) => {
       const id = `toast-${++idCounter.current}`;
       const newToast = { ...props, id, duration };
@@ -1147,18 +1272,18 @@ var ToastProvider = ({ children }) => {
   ] });
 };
 var DropdownMenu = menu.Menu.Root;
-var DropdownMenuTrigger = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var DropdownMenuTrigger = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     menu.Menu.Trigger,
     {
       ref,
-      className: clsx27__default.default("ds-dropdown-menu__trigger", className),
+      className: clsx28__default.default("ds-dropdown-menu__trigger", className),
       ...props
     }
   );
 });
 DropdownMenuTrigger.displayName = "DropdownMenuTrigger";
-var DropdownMenuContent = React38__default.default.forwardRef(
+var DropdownMenuContent = React39__default.default.forwardRef(
   ({ className, side = "bottom", align = "start", sideOffset = 4, alignOffset = 0, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
       menu.Menu.Positioner,
@@ -1171,7 +1296,7 @@ var DropdownMenuContent = React38__default.default.forwardRef(
           menu.Menu.Popup,
           {
             ref,
-            className: clsx27__default.default("ds-dropdown-menu__content", className),
+            className: clsx28__default.default("ds-dropdown-menu__content", className),
             ...props
           }
         )
@@ -1180,23 +1305,23 @@ var DropdownMenuContent = React38__default.default.forwardRef(
   }
 );
 DropdownMenuContent.displayName = "DropdownMenuContent";
-var DropdownMenuItem = React38__default.default.forwardRef(
+var DropdownMenuItem = React39__default.default.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Item, { ref, className: clsx27__default.default("ds-dropdown-menu__item", className), ...props });
+    return /* @__PURE__ */ jsxRuntime.jsx(menu.Menu.Item, { ref, className: clsx28__default.default("ds-dropdown-menu__item", className), ...props });
   }
 );
 DropdownMenuItem.displayName = "DropdownMenuItem";
-var DropdownMenuSeparator = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-dropdown-menu__separator", className), ...props });
+var DropdownMenuSeparator = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-dropdown-menu__separator", className), ...props });
 });
 DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
-var DropdownMenuLabel = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-dropdown-menu__label", className), ...props });
+var DropdownMenuLabel = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-dropdown-menu__label", className), ...props });
 });
 DropdownMenuLabel.displayName = "DropdownMenuLabel";
-var EmptyState = React38__default.default.forwardRef(
+var EmptyState = React39__default.default.forwardRef(
   ({ icon, title, description, action, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx27__default.default("ds-empty-state", className), ...props, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx28__default.default("ds-empty-state", className), ...props, children: [
       icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-empty-state__icon", children: icon }),
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "ds-empty-state__title", children: title }),
       description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "ds-empty-state__description", children: description }),
@@ -1205,48 +1330,48 @@ var EmptyState = React38__default.default.forwardRef(
   }
 );
 EmptyState.displayName = "EmptyState";
-var Card = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-card", className), ...props })
+var Card = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-card", className), ...props })
 );
 Card.displayName = "Card";
-var CardHeader = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-card__header", className), ...props })
+var CardHeader = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-card__header", className), ...props })
 );
 CardHeader.displayName = "CardHeader";
-var CardTitle = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h3", { ref, className: clsx27__default.default("ds-card__title", className), ...props }));
+var CardTitle = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h3", { ref, className: clsx28__default.default("ds-card__title", className), ...props }));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: clsx27__default.default("ds-card__description", className), ...props }));
+var CardDescription = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: clsx28__default.default("ds-card__description", className), ...props }));
 CardDescription.displayName = "CardDescription";
-var CardContent = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-card__content", className), ...props })
+var CardContent = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-card__content", className), ...props })
 );
 CardContent.displayName = "CardContent";
-var CardFooter = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-card__footer", className), ...props })
+var CardFooter = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-card__footer", className), ...props })
 );
 CardFooter.displayName = "CardFooter";
-var AccordionContext = React38__default.default.createContext(null);
+var AccordionContext = React39__default.default.createContext(null);
 function useAccordionContext() {
-  const ctx = React38__default.default.useContext(AccordionContext);
+  const ctx = React39__default.default.useContext(AccordionContext);
   if (!ctx) {
     throw new Error("Accordion compound components must be used within <Accordion>");
   }
   return ctx;
 }
-var AccordionItemContext = React38__default.default.createContext(null);
+var AccordionItemContext = React39__default.default.createContext(null);
 function useAccordionItemContext() {
-  const ctx = React38__default.default.useContext(AccordionItemContext);
+  const ctx = React39__default.default.useContext(AccordionItemContext);
   if (!ctx) {
     throw new Error("AccordionTrigger/AccordionContent must be used within <AccordionItem>");
   }
   return ctx;
 }
-var Accordion = React38__default.default.forwardRef(
+var Accordion = React39__default.default.forwardRef(
   ({ className, type = "single", defaultValue = [], collapsible: _collapsible, children, ...props }, ref) => {
-    const [openItems, setOpenItems] = React38__default.default.useState(
+    const [openItems, setOpenItems] = React39__default.default.useState(
       () => new Set(defaultValue)
     );
-    const toggle = React38__default.default.useCallback(
+    const toggle = React39__default.default.useCallback(
       (value) => {
         setOpenItems((prev) => {
           const next = new Set(prev);
@@ -1263,19 +1388,19 @@ var Accordion = React38__default.default.forwardRef(
       },
       [type]
     );
-    const contextValue = React38__default.default.useMemo(
+    const contextValue = React39__default.default.useMemo(
       () => ({ openItems, toggle }),
       [openItems, toggle]
     );
-    return /* @__PURE__ */ jsxRuntime.jsx(AccordionContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-accordion", className), ...props, children }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(AccordionContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-accordion", className), ...props, children }) });
   }
 );
 Accordion.displayName = "Accordion";
-var AccordionItem = React38__default.default.forwardRef(
+var AccordionItem = React39__default.default.forwardRef(
   ({ className, value, children, ...props }, ref) => {
     const { openItems } = useAccordionContext();
     const isOpen = openItems.has(value);
-    const contextValue = React38__default.default.useMemo(
+    const contextValue = React39__default.default.useMemo(
       () => ({ value, isOpen }),
       [value, isOpen]
     );
@@ -1283,7 +1408,7 @@ var AccordionItem = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-accordion__item", className),
+        className: clsx28__default.default("ds-accordion__item", className),
         "data-state": isOpen ? "open" : "closed",
         ...props,
         children
@@ -1292,7 +1417,7 @@ var AccordionItem = React38__default.default.forwardRef(
   }
 );
 AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React38__default.default.forwardRef(({ className, children, ...props }, ref) => {
+var AccordionTrigger = React39__default.default.forwardRef(({ className, children, ...props }, ref) => {
   const { toggle } = useAccordionContext();
   const { value, isOpen } = useAccordionItemContext();
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -1300,7 +1425,7 @@ var AccordionTrigger = React38__default.default.forwardRef(({ className, childre
     {
       ref,
       type: "button",
-      className: clsx27__default.default("ds-accordion__trigger", className),
+      className: clsx28__default.default("ds-accordion__trigger", className),
       "aria-expanded": isOpen,
       onClick: () => toggle(value),
       ...props,
@@ -1327,13 +1452,13 @@ var AccordionTrigger = React38__default.default.forwardRef(({ className, childre
   );
 });
 AccordionTrigger.displayName = "AccordionTrigger";
-var AccordionContent = React38__default.default.forwardRef(({ className, children, ...props }, ref) => {
+var AccordionContent = React39__default.default.forwardRef(({ className, children, ...props }, ref) => {
   const { isOpen } = useAccordionItemContext();
-  const contentRef = React38__default.default.useRef(null);
-  const [height, setHeight] = React38__default.default.useState(
+  const contentRef = React39__default.default.useRef(null);
+  const [height, setHeight] = React39__default.default.useState(
     isOpen ? void 0 : 0
   );
-  React38__default.default.useEffect(() => {
+  React39__default.default.useEffect(() => {
     const el = contentRef.current;
     if (!el) return;
     if (isOpen) {
@@ -1355,7 +1480,7 @@ var AccordionContent = React38__default.default.forwardRef(({ className, childre
     "div",
     {
       ref: contentRef,
-      className: clsx27__default.default("ds-accordion__content", className),
+      className: clsx28__default.default("ds-accordion__content", className),
       style: {
         height: height !== void 0 ? `${height}px` : "auto"
       },
@@ -1366,13 +1491,13 @@ var AccordionContent = React38__default.default.forwardRef(({ className, childre
   );
 });
 AccordionContent.displayName = "AccordionContent";
-var Label = React38__default.default.forwardRef(
+var Label = React39__default.default.forwardRef(
   ({ className, disabled, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "label",
       {
         ref,
-        className: clsx27__default.default("ds-label", disabled && "ds-label--disabled", className),
+        className: clsx28__default.default("ds-label", disabled && "ds-label--disabled", className),
         "data-disabled": disabled || void 0,
         ...props
       }
@@ -1380,20 +1505,20 @@ var Label = React38__default.default.forwardRef(
   }
 );
 Label.displayName = "Label";
-var Skeleton = React38__default.default.forwardRef(
+var Skeleton = React39__default.default.forwardRef(
   ({ className, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-skeleton", className),
+        className: clsx28__default.default("ds-skeleton", className),
         ...props
       }
     );
   }
 );
 Skeleton.displayName = "Skeleton";
-var Separator = React38__default.default.forwardRef(
+var Separator = React39__default.default.forwardRef(
   ({ className, orientation = "horizontal", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
@@ -1401,7 +1526,7 @@ var Separator = React38__default.default.forwardRef(
         ref,
         role: "separator",
         "aria-orientation": orientation,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-separator",
           `ds-separator--${orientation}`,
           className
@@ -1412,19 +1537,19 @@ var Separator = React38__default.default.forwardRef(
   }
 );
 Separator.displayName = "Separator";
-var SheetContext = React38__default.default.createContext(void 0);
+var SheetContext = React39__default.default.createContext(void 0);
 function useSheetContext() {
-  const ctx = React38__default.default.useContext(SheetContext);
+  const ctx = React39__default.default.useContext(SheetContext);
   if (!ctx) {
     throw new Error("Sheet compound components must be used within a <Sheet> parent.");
   }
   return ctx;
 }
 var Sheet = ({ open: controlledOpen, onOpenChange, children }) => {
-  const [uncontrolledOpen, setUncontrolledOpen] = React38__default.default.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React39__default.default.useState(false);
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : uncontrolledOpen;
-  const handleOpenChange = React38__default.default.useCallback(
+  const handleOpenChange = React39__default.default.useCallback(
     (next) => {
       if (!isControlled) {
         setUncontrolledOpen(next);
@@ -1436,7 +1561,7 @@ var Sheet = ({ open: controlledOpen, onOpenChange, children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(SheetContext.Provider, { value: { open, onOpenChange: handleOpenChange }, children });
 };
 Sheet.displayName = "Sheet";
-var SheetTrigger = React38__default.default.forwardRef(
+var SheetTrigger = React39__default.default.forwardRef(
   ({ onClick, asChild = false, ...props }, ref) => {
     const { onOpenChange } = useSheetContext();
     const handleClick = (e) => {
@@ -1448,7 +1573,7 @@ var SheetTrigger = React38__default.default.forwardRef(
   }
 );
 SheetTrigger.displayName = "SheetTrigger";
-var SheetClose = React38__default.default.forwardRef(
+var SheetClose = React39__default.default.forwardRef(
   ({ onClick, asChild = false, ...props }, ref) => {
     const { onOpenChange } = useSheetContext();
     const handleClick = (e) => {
@@ -1460,7 +1585,7 @@ var SheetClose = React38__default.default.forwardRef(
   }
 );
 SheetClose.displayName = "SheetClose";
-var SheetContent = React38__default.default.forwardRef(
+var SheetContent = React39__default.default.forwardRef(
   ({ side = "right", className, children, ...props }, ref) => {
     const { open, onOpenChange } = useSheetContext();
     if (!open) return null;
@@ -1479,7 +1604,7 @@ var SheetContent = React38__default.default.forwardRef(
           {
             ref,
             role: "dialog",
-            className: clsx27__default.default("ds-sheet__content", `ds-sheet__content--${side}`, className),
+            className: clsx28__default.default("ds-sheet__content", `ds-sheet__content--${side}`, className),
             ...props,
             children
           }
@@ -1490,45 +1615,45 @@ var SheetContent = React38__default.default.forwardRef(
   }
 );
 SheetContent.displayName = "SheetContent";
-var SheetHeader = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-sheet__header", className), ...props })
+var SheetHeader = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-sheet__header", className), ...props })
 );
 SheetHeader.displayName = "SheetHeader";
-var SheetTitle = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h2", { ref, className: clsx27__default.default("ds-sheet__title", className), ...props }));
+var SheetTitle = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h2", { ref, className: clsx28__default.default("ds-sheet__title", className), ...props }));
 SheetTitle.displayName = "SheetTitle";
-var SheetDescription = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: clsx27__default.default("ds-sheet__description", className), ...props }));
+var SheetDescription = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: clsx28__default.default("ds-sheet__description", className), ...props }));
 SheetDescription.displayName = "SheetDescription";
-var SheetFooter = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-sheet__footer", className), ...props })
+var SheetFooter = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-sheet__footer", className), ...props })
 );
 SheetFooter.displayName = "SheetFooter";
-var AvatarContext = React38__default.default.createContext({
+var AvatarContext = React39__default.default.createContext({
   hasImage: false,
   imageError: false,
   onImageError: () => {
   }
 });
-var Avatar = React38__default.default.forwardRef(
+var Avatar = React39__default.default.forwardRef(
   ({ size = "md", className, children, ...props }, ref) => {
-    const [imageError, setImageError] = React38__default.default.useState(false);
-    const [hasImage, setHasImage] = React38__default.default.useState(false);
-    React38__default.default.useEffect(() => {
+    const [imageError, setImageError] = React39__default.default.useState(false);
+    const [hasImage, setHasImage] = React39__default.default.useState(false);
+    React39__default.default.useEffect(() => {
       let found = false;
-      React38__default.default.Children.forEach(children, (child) => {
-        if (React38__default.default.isValidElement(child) && child.type === AvatarImage) {
+      React39__default.default.Children.forEach(children, (child) => {
+        if (React39__default.default.isValidElement(child) && child.type === AvatarImage) {
           found = true;
         }
       });
       setHasImage(found);
     }, [children]);
-    const onImageError = React38__default.default.useCallback(() => {
+    const onImageError = React39__default.default.useCallback(() => {
       setImageError(true);
     }, []);
     return /* @__PURE__ */ jsxRuntime.jsx(AvatarContext.Provider, { value: { hasImage, imageError, onImageError }, children: /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         ref,
-        className: clsx27__default.default("ds-avatar", `ds-avatar--${size}`, className),
+        className: clsx28__default.default("ds-avatar", `ds-avatar--${size}`, className),
         ...props,
         children
       }
@@ -1536,8 +1661,8 @@ var Avatar = React38__default.default.forwardRef(
   }
 );
 Avatar.displayName = "Avatar";
-var AvatarImage = React38__default.default.forwardRef(({ className, onError, ...props }, ref) => {
-  const { imageError, onImageError } = React38__default.default.useContext(AvatarContext);
+var AvatarImage = React39__default.default.forwardRef(({ className, onError, ...props }, ref) => {
+  const { imageError, onImageError } = React39__default.default.useContext(AvatarContext);
   const handleError = (e) => {
     onImageError();
     onError?.(e);
@@ -1547,32 +1672,32 @@ var AvatarImage = React38__default.default.forwardRef(({ className, onError, ...
     "img",
     {
       ref,
-      className: clsx27__default.default("ds-avatar__image", className),
+      className: clsx28__default.default("ds-avatar__image", className),
       onError: handleError,
       ...props
     }
   );
 });
 AvatarImage.displayName = "AvatarImage";
-var AvatarFallback = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  const { hasImage, imageError } = React38__default.default.useContext(AvatarContext);
+var AvatarFallback = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  const { hasImage, imageError } = React39__default.default.useContext(AvatarContext);
   if (hasImage && !imageError) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: clsx27__default.default("ds-avatar__fallback", className), ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: clsx28__default.default("ds-avatar__fallback", className), ...props });
 });
 AvatarFallback.displayName = "AvatarFallback";
-var PopoverContext = React38__default.default.createContext(null);
+var PopoverContext = React39__default.default.createContext(null);
 function usePopoverContext() {
-  const context = React38__default.default.useContext(PopoverContext);
+  const context = React39__default.default.useContext(PopoverContext);
   if (!context) {
     throw new Error("Popover compound components must be used within <Popover>");
   }
   return context;
 }
 var Popover = ({ open: controlledOpen, onOpenChange, children }) => {
-  const [uncontrolledOpen, setUncontrolledOpen] = React38__default.default.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React39__default.default.useState(false);
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : uncontrolledOpen;
-  const setOpen = React38__default.default.useCallback(
+  const setOpen = React39__default.default.useCallback(
     (value) => {
       if (!isControlled) {
         setUncontrolledOpen(value);
@@ -1581,17 +1706,17 @@ var Popover = ({ open: controlledOpen, onOpenChange, children }) => {
     },
     [isControlled, onOpenChange]
   );
-  const toggle = React38__default.default.useCallback(() => {
+  const toggle = React39__default.default.useCallback(() => {
     setOpen(!open);
   }, [open, setOpen]);
-  const contextValue = React38__default.default.useMemo(
+  const contextValue = React39__default.default.useMemo(
     () => ({ open, setOpen, toggle }),
     [open, setOpen, toggle]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(PopoverContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-popover", children }) });
 };
 Popover.displayName = "Popover";
-var PopoverTrigger = React38__default.default.forwardRef(
+var PopoverTrigger = React39__default.default.forwardRef(
   ({ className, onClick, asChild = false, ...props }, ref) => {
     const { toggle } = usePopoverContext();
     const handleClick = (e) => {
@@ -1604,7 +1729,7 @@ var PopoverTrigger = React38__default.default.forwardRef(
       {
         ref,
         type: "button",
-        className: clsx27__default.default("ds-popover__trigger", className),
+        className: clsx28__default.default("ds-popover__trigger", className),
         onClick: handleClick,
         ...props
       }
@@ -1612,7 +1737,7 @@ var PopoverTrigger = React38__default.default.forwardRef(
   }
 );
 PopoverTrigger.displayName = "PopoverTrigger";
-var PopoverContent = React38__default.default.forwardRef(
+var PopoverContent = React39__default.default.forwardRef(
   ({ className, side = "bottom", align = "center", ...props }, ref) => {
     const { open } = usePopoverContext();
     if (!open) return null;
@@ -1620,7 +1745,7 @@ var PopoverContent = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-popover__content",
           `ds-popover__content--${side}`,
           `ds-popover__content--align-${align}`,
@@ -1632,7 +1757,7 @@ var PopoverContent = React38__default.default.forwardRef(
   }
 );
 PopoverContent.displayName = "PopoverContent";
-var PopoverClose = React38__default.default.forwardRef(({ className, onClick, ...props }, ref) => {
+var PopoverClose = React39__default.default.forwardRef(({ className, onClick, ...props }, ref) => {
   const { setOpen } = usePopoverContext();
   const handleClick = (e) => {
     setOpen(false);
@@ -1643,14 +1768,14 @@ var PopoverClose = React38__default.default.forwardRef(({ className, onClick, ..
     {
       ref,
       type: "button",
-      className: clsx27__default.default("ds-popover__close", className),
+      className: clsx28__default.default("ds-popover__close", className),
       onClick: handleClick,
       ...props
     }
   );
 });
 PopoverClose.displayName = "PopoverClose";
-var Progress = React38__default.default.forwardRef(
+var Progress = React39__default.default.forwardRef(
   ({ className, value = 0, max = 100, ...props }, ref) => {
     const percentage = max > 0 ? Math.min(100, Math.max(0, value / max * 100)) : 0;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1661,7 +1786,7 @@ var Progress = React38__default.default.forwardRef(
         "aria-valuenow": value,
         "aria-valuemin": 0,
         "aria-valuemax": max,
-        className: clsx27__default.default("ds-progress", className),
+        className: clsx28__default.default("ds-progress", className),
         ...props,
         children: /* @__PURE__ */ jsxRuntime.jsx(
           "div",
@@ -1675,19 +1800,19 @@ var Progress = React38__default.default.forwardRef(
   }
 );
 Progress.displayName = "Progress";
-var ScrollArea = React38__default.default.forwardRef(
+var ScrollArea = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-scroll-area", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-scroll-area__viewport", children }) });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-scroll-area", className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-scroll-area__viewport", children }) });
   }
 );
 ScrollArea.displayName = "ScrollArea";
-var ScrollBar = React38__default.default.forwardRef(
+var ScrollBar = React39__default.default.forwardRef(
   ({ className, orientation = "vertical", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-scroll-area__scrollbar",
           `ds-scroll-area__scrollbar--${orientation}`,
           className
@@ -1698,55 +1823,55 @@ var ScrollBar = React38__default.default.forwardRef(
   }
 );
 ScrollBar.displayName = "ScrollBar";
-var Breadcrumb = React38__default.default.forwardRef(
+var Breadcrumb = React39__default.default.forwardRef(
   ({ className, "aria-label": ariaLabel = "Breadcrumb", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "nav",
       {
         ref,
         "aria-label": ariaLabel,
-        className: clsx27__default.default("ds-breadcrumb", className),
+        className: clsx28__default.default("ds-breadcrumb", className),
         ...props
       }
     );
   }
 );
 Breadcrumb.displayName = "Breadcrumb";
-var BreadcrumbList = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var BreadcrumbList = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "ol",
     {
       ref,
-      className: clsx27__default.default("ds-breadcrumb__list", className),
+      className: clsx28__default.default("ds-breadcrumb__list", className),
       ...props
     }
   );
 });
 BreadcrumbList.displayName = "BreadcrumbList";
-var BreadcrumbItem = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var BreadcrumbItem = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
       ref,
-      className: clsx27__default.default("ds-breadcrumb__item", className),
+      className: clsx28__default.default("ds-breadcrumb__item", className),
       ...props
     }
   );
 });
 BreadcrumbItem.displayName = "BreadcrumbItem";
-var BreadcrumbLink = React38__default.default.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var BreadcrumbLink = React39__default.default.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? reactSlot.Slot : "a";
   return /* @__PURE__ */ jsxRuntime.jsx(
     Comp,
     {
       ref,
-      className: clsx27__default.default("ds-breadcrumb__link", className),
+      className: clsx28__default.default("ds-breadcrumb__link", className),
       ...props
     }
   );
 });
 BreadcrumbLink.displayName = "BreadcrumbLink";
-var BreadcrumbPage = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var BreadcrumbPage = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
@@ -1754,39 +1879,39 @@ var BreadcrumbPage = React38__default.default.forwardRef(({ className, ...props
       role: "link",
       "aria-current": "page",
       "aria-disabled": "true",
-      className: clsx27__default.default("ds-breadcrumb__page", className),
+      className: clsx28__default.default("ds-breadcrumb__page", className),
       ...props
     }
   );
 });
 BreadcrumbPage.displayName = "BreadcrumbPage";
-var BreadcrumbSeparator = React38__default.default.forwardRef(({ className, children, ...props }, ref) => {
+var BreadcrumbSeparator = React39__default.default.forwardRef(({ className, children, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
       ref,
       role: "presentation",
       "aria-hidden": "true",
-      className: clsx27__default.default("ds-breadcrumb__separator", className),
+      className: clsx28__default.default("ds-breadcrumb__separator", className),
       ...props,
       children: children ?? "/"
     }
   );
 });
 BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
-var BreadcrumbEllipsis = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var BreadcrumbEllipsis = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
       ref,
-      className: clsx27__default.default("ds-breadcrumb__ellipsis", className),
+      className: clsx28__default.default("ds-breadcrumb__ellipsis", className),
       ...props,
       children: "\u2026"
     }
   );
 });
 BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
-var Toggle = React38__default.default.forwardRef(
+var Toggle = React39__default.default.forwardRef(
   ({
     className,
     pressed: controlledPressed,
@@ -1796,7 +1921,7 @@ var Toggle = React38__default.default.forwardRef(
     onClick,
     ...props
   }, ref) => {
-    const [uncontrolledPressed, setUncontrolledPressed] = React38__default.default.useState(false);
+    const [uncontrolledPressed, setUncontrolledPressed] = React39__default.default.useState(false);
     const isControlled = controlledPressed !== void 0;
     const pressed = isControlled ? controlledPressed : uncontrolledPressed;
     const handleClick = (e) => {
@@ -1812,7 +1937,7 @@ var Toggle = React38__default.default.forwardRef(
       {
         ref,
         type: "button",
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-toggle",
           `ds-toggle--${variant}`,
           `ds-toggle--${size}`,
@@ -1827,19 +1952,19 @@ var Toggle = React38__default.default.forwardRef(
   }
 );
 Toggle.displayName = "Toggle";
-var ToggleGroupContext = React38__default.default.createContext({
+var ToggleGroupContext = React39__default.default.createContext({
   type: "single",
   value: [],
   onItemToggle: () => {
   }
 });
-var ToggleGroup = React38__default.default.forwardRef(
+var ToggleGroup = React39__default.default.forwardRef(
   ({ className, type, value, onValueChange, children, ...props }, ref) => {
-    const normalizedValue = React38__default.default.useMemo(() => {
+    const normalizedValue = React39__default.default.useMemo(() => {
       if (value === void 0) return [];
       return Array.isArray(value) ? value : [value];
     }, [value]);
-    const onItemToggle = React38__default.default.useCallback(
+    const onItemToggle = React39__default.default.useCallback(
       (itemValue) => {
         if (type === "single") {
           const next = normalizedValue.includes(itemValue) ? "" : itemValue;
@@ -1851,7 +1976,7 @@ var ToggleGroup = React38__default.default.forwardRef(
       },
       [type, normalizedValue, onValueChange]
     );
-    const ctx = React38__default.default.useMemo(
+    const ctx = React39__default.default.useMemo(
       () => ({ type, value: normalizedValue, onItemToggle }),
       [type, normalizedValue, onItemToggle]
     );
@@ -1860,7 +1985,7 @@ var ToggleGroup = React38__default.default.forwardRef(
       {
         ref,
         role: "group",
-        className: clsx27__default.default("ds-toggle-group", className),
+        className: clsx28__default.default("ds-toggle-group", className),
         ...props,
         children
       }
@@ -1868,8 +1993,8 @@ var ToggleGroup = React38__default.default.forwardRef(
   }
 );
 ToggleGroup.displayName = "ToggleGroup";
-var ToggleGroupItem = React38__default.default.forwardRef(({ className, value, children, onClick, ...props }, ref) => {
-  const ctx = React38__default.default.useContext(ToggleGroupContext);
+var ToggleGroupItem = React39__default.default.forwardRef(({ className, value, children, onClick, ...props }, ref) => {
+  const ctx = React39__default.default.useContext(ToggleGroupContext);
   const pressed = ctx.value.includes(value);
   const handleClick = (e) => {
     ctx.onItemToggle(value);
@@ -1881,7 +2006,7 @@ var ToggleGroupItem = React38__default.default.forwardRef(({ className, value, c
       ref,
       type: "button",
       "aria-pressed": pressed,
-      className: clsx27__default.default(
+      className: clsx28__default.default(
         "ds-toggle-group__item",
         pressed && "ds-toggle-group__item--pressed",
         className
@@ -1893,7 +2018,7 @@ var ToggleGroupItem = React38__default.default.forwardRef(({ className, value, c
   );
 });
 ToggleGroupItem.displayName = "ToggleGroupItem";
-var Slider = React38__default.default.forwardRef(
+var Slider = React39__default.default.forwardRef(
   ({
     className,
     value: controlledValue,
@@ -1905,7 +2030,7 @@ var Slider = React38__default.default.forwardRef(
     disabled = false,
     ...props
   }, ref) => {
-    const [uncontrolledValue, setUncontrolledValue] = React38__default.default.useState(defaultValue);
+    const [uncontrolledValue, setUncontrolledValue] = React39__default.default.useState(defaultValue);
     const isControlled = controlledValue !== void 0;
     const value = isControlled ? controlledValue : uncontrolledValue;
     const handleChange = (e) => {
@@ -1920,7 +2045,7 @@ var Slider = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-slider", disabled && "ds-slider--disabled", className),
+        className: clsx28__default.default("ds-slider", disabled && "ds-slider--disabled", className),
         ...props,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-slider__track", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1953,27 +2078,27 @@ var Slider = React38__default.default.forwardRef(
   }
 );
 Slider.displayName = "Slider";
-var CollapsibleContext = React38__default.default.createContext(null);
+var CollapsibleContext = React39__default.default.createContext(null);
 function useCollapsibleContext() {
-  const context = React38__default.default.useContext(CollapsibleContext);
+  const context = React39__default.default.useContext(CollapsibleContext);
   if (!context) {
     throw new Error("Collapsible compound components must be used within <Collapsible>");
   }
   return context;
 }
-var Collapsible = React38__default.default.forwardRef(
+var Collapsible = React39__default.default.forwardRef(
   ({ className, open: controlledOpen, onOpenChange, children, ...props }, ref) => {
-    const [uncontrolledOpen, setUncontrolledOpen] = React38__default.default.useState(false);
+    const [uncontrolledOpen, setUncontrolledOpen] = React39__default.default.useState(false);
     const isControlled = controlledOpen !== void 0;
     const open = isControlled ? controlledOpen : uncontrolledOpen;
-    const toggle = React38__default.default.useCallback(() => {
+    const toggle = React39__default.default.useCallback(() => {
       const next = !open;
       if (!isControlled) {
         setUncontrolledOpen(next);
       }
       onOpenChange?.(next);
     }, [open, isControlled, onOpenChange]);
-    const contextValue = React38__default.default.useMemo(
+    const contextValue = React39__default.default.useMemo(
       () => ({ open, toggle }),
       [open, toggle]
     );
@@ -1981,7 +2106,7 @@ var Collapsible = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-collapsible", className),
+        className: clsx28__default.default("ds-collapsible", className),
         "data-state": open ? "open" : "closed",
         ...props,
         children
@@ -1990,7 +2115,7 @@ var Collapsible = React38__default.default.forwardRef(
   }
 );
 Collapsible.displayName = "Collapsible";
-var CollapsibleTrigger = React38__default.default.forwardRef(({ className, onClick, ...props }, ref) => {
+var CollapsibleTrigger = React39__default.default.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggle } = useCollapsibleContext();
   const handleClick = (e) => {
     toggle();
@@ -2001,20 +2126,20 @@ var CollapsibleTrigger = React38__default.default.forwardRef(({ className, onCli
     {
       ref,
       type: "button",
-      className: clsx27__default.default("ds-collapsible__trigger", className),
+      className: clsx28__default.default("ds-collapsible__trigger", className),
       onClick: handleClick,
       ...props
     }
   );
 });
 CollapsibleTrigger.displayName = "CollapsibleTrigger";
-var CollapsibleContent = React38__default.default.forwardRef(({ className, children, ...props }, ref) => {
+var CollapsibleContent = React39__default.default.forwardRef(({ className, children, ...props }, ref) => {
   const { open } = useCollapsibleContext();
-  const contentRef = React38__default.default.useRef(null);
-  const [maxHeight, setMaxHeight] = React38__default.default.useState(
+  const contentRef = React39__default.default.useRef(null);
+  const [maxHeight, setMaxHeight] = React39__default.default.useState(
     open ? void 0 : 0
   );
-  React38__default.default.useEffect(() => {
+  React39__default.default.useEffect(() => {
     const el = contentRef.current;
     if (!el) return;
     if (open) {
@@ -2036,7 +2161,7 @@ var CollapsibleContent = React38__default.default.forwardRef(({ className, child
     "div",
     {
       ref: contentRef,
-      className: clsx27__default.default("ds-collapsible__content", className),
+      className: clsx28__default.default("ds-collapsible__content", className),
       "data-state": open ? "open" : "closed",
       style: {
         maxHeight: maxHeight !== void 0 ? `${maxHeight}px` : "none"
@@ -2048,9 +2173,9 @@ var CollapsibleContent = React38__default.default.forwardRef(({ className, child
   );
 });
 CollapsibleContent.displayName = "CollapsibleContent";
-var HoverCardContext = React38__default.default.createContext(null);
+var HoverCardContext = React39__default.default.createContext(null);
 function useHoverCardContext() {
-  const context = React38__default.default.useContext(HoverCardContext);
+  const context = React39__default.default.useContext(HoverCardContext);
   if (!context) {
     throw new Error("HoverCard compound components must be used within <HoverCard>");
   }
@@ -2061,31 +2186,31 @@ var HoverCard = ({
   closeDelay = 100,
   children
 }) => {
-  const [open, setOpen] = React38__default.default.useState(false);
-  const openTimerRef = React38__default.default.useRef();
-  const closeTimerRef = React38__default.default.useRef();
-  const onOpen = React38__default.default.useCallback(() => {
+  const [open, setOpen] = React39__default.default.useState(false);
+  const openTimerRef = React39__default.default.useRef();
+  const closeTimerRef = React39__default.default.useRef();
+  const onOpen = React39__default.default.useCallback(() => {
     clearTimeout(closeTimerRef.current);
     openTimerRef.current = setTimeout(() => setOpen(true), openDelay);
   }, [openDelay]);
-  const onClose = React38__default.default.useCallback(() => {
+  const onClose = React39__default.default.useCallback(() => {
     clearTimeout(openTimerRef.current);
     closeTimerRef.current = setTimeout(() => setOpen(false), closeDelay);
   }, [closeDelay]);
-  React38__default.default.useEffect(() => {
+  React39__default.default.useEffect(() => {
     return () => {
       clearTimeout(openTimerRef.current);
       clearTimeout(closeTimerRef.current);
     };
   }, []);
-  const contextValue = React38__default.default.useMemo(
+  const contextValue = React39__default.default.useMemo(
     () => ({ open, onOpen, onClose }),
     [open, onOpen, onClose]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(HoverCardContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-hover-card", children }) });
 };
 HoverCard.displayName = "HoverCard";
-var HoverCardTrigger = React38__default.default.forwardRef(({ className, onMouseEnter, onMouseLeave, ...props }, ref) => {
+var HoverCardTrigger = React39__default.default.forwardRef(({ className, onMouseEnter, onMouseLeave, ...props }, ref) => {
   const { onOpen, onClose } = useHoverCardContext();
   const handleMouseEnter = (e) => {
     onOpen();
@@ -2099,7 +2224,7 @@ var HoverCardTrigger = React38__default.default.forwardRef(({ className, onMouse
     "span",
     {
       ref,
-      className: clsx27__default.default("ds-hover-card__trigger", className),
+      className: clsx28__default.default("ds-hover-card__trigger", className),
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       ...props
@@ -2107,7 +2232,7 @@ var HoverCardTrigger = React38__default.default.forwardRef(({ className, onMouse
   );
 });
 HoverCardTrigger.displayName = "HoverCardTrigger";
-var HoverCardContent = React38__default.default.forwardRef(
+var HoverCardContent = React39__default.default.forwardRef(
   ({ className, side = "bottom", align = "center", onMouseEnter, onMouseLeave, ...props }, ref) => {
     const { open, onOpen, onClose } = useHoverCardContext();
     const handleMouseEnter = (e) => {
@@ -2123,7 +2248,7 @@ var HoverCardContent = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-hover-card__content",
           `ds-hover-card__content--${side}`,
           `ds-hover-card__content--align-${align}`,
@@ -2137,13 +2262,13 @@ var HoverCardContent = React38__default.default.forwardRef(
   }
 );
 HoverCardContent.displayName = "HoverCardContent";
-var AspectRatio = React38__default.default.forwardRef(
+var AspectRatio = React39__default.default.forwardRef(
   ({ className, ratio = 1, style, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-aspect-ratio", className),
+        className: clsx28__default.default("ds-aspect-ratio", className),
         style: { ...style, paddingBottom: `${1 / ratio * 100}%` },
         ...props,
         children
@@ -2152,7 +2277,7 @@ var AspectRatio = React38__default.default.forwardRef(
   }
 );
 AspectRatio.displayName = "AspectRatio";
-var Pagination = React38__default.default.forwardRef(
+var Pagination = React39__default.default.forwardRef(
   ({ className, "aria-label": ariaLabel = "pagination", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "nav",
@@ -2160,43 +2285,43 @@ var Pagination = React38__default.default.forwardRef(
         ref,
         role: "navigation",
         "aria-label": ariaLabel,
-        className: clsx27__default.default("ds-pagination", className),
+        className: clsx28__default.default("ds-pagination", className),
         ...props
       }
     );
   }
 );
 Pagination.displayName = "Pagination";
-var PaginationContent = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var PaginationContent = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "ul",
     {
       ref,
-      className: clsx27__default.default("ds-pagination__content", className),
+      className: clsx28__default.default("ds-pagination__content", className),
       ...props
     }
   );
 });
 PaginationContent.displayName = "PaginationContent";
-var PaginationItem = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var PaginationItem = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
       ref,
-      className: clsx27__default.default("ds-pagination__item", className),
+      className: clsx28__default.default("ds-pagination__item", className),
       ...props
     }
   );
 });
 PaginationItem.displayName = "PaginationItem";
-var PaginationLink = React38__default.default.forwardRef(({ className, isActive = false, size = "md", asChild = false, ...props }, ref) => {
+var PaginationLink = React39__default.default.forwardRef(({ className, isActive = false, size = "md", asChild = false, ...props }, ref) => {
   const Comp = asChild ? reactSlot.Slot : "button";
   return /* @__PURE__ */ jsxRuntime.jsx(
     Comp,
     {
       ref,
       "aria-current": isActive ? "page" : void 0,
-      className: clsx27__default.default(
+      className: clsx28__default.default(
         "ds-pagination__link",
         `ds-pagination__link--${size}`,
         isActive && "ds-pagination__link--active",
@@ -2207,13 +2332,13 @@ var PaginationLink = React38__default.default.forwardRef(({ className, isActive
   );
 });
 PaginationLink.displayName = "PaginationLink";
-var PaginationPrevious = React38__default.default.forwardRef(({ className, label = "Previous", "aria-label": ariaLabel = "Go to previous page", ...props }, ref) => {
+var PaginationPrevious = React39__default.default.forwardRef(({ className, label = "Previous", "aria-label": ariaLabel = "Go to previous page", ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     PaginationLink,
     {
       ref,
       "aria-label": ariaLabel,
-      className: clsx27__default.default("ds-pagination__prev", className),
+      className: clsx28__default.default("ds-pagination__prev", className),
       ...props,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -2238,13 +2363,13 @@ var PaginationPrevious = React38__default.default.forwardRef(({ className, label
   );
 });
 PaginationPrevious.displayName = "PaginationPrevious";
-var PaginationNext = React38__default.default.forwardRef(({ className, label = "Next", "aria-label": ariaLabel = "Go to next page", ...props }, ref) => {
+var PaginationNext = React39__default.default.forwardRef(({ className, label = "Next", "aria-label": ariaLabel = "Go to next page", ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     PaginationLink,
     {
       ref,
       "aria-label": ariaLabel,
-      className: clsx27__default.default("ds-pagination__next", className),
+      className: clsx28__default.default("ds-pagination__next", className),
       ...props,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
@@ -2269,13 +2394,13 @@ var PaginationNext = React38__default.default.forwardRef(({ className, label = "
   );
 });
 PaginationNext.displayName = "PaginationNext";
-var PaginationEllipsis = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var PaginationEllipsis = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
       ref,
       "aria-hidden": "true",
-      className: clsx27__default.default("ds-pagination__ellipsis", className),
+      className: clsx28__default.default("ds-pagination__ellipsis", className),
       ...props,
       children: "..."
     }
@@ -2291,14 +2416,14 @@ var levelToElement = {
   h5: "h5",
   h6: "h6"
 };
-var Heading = React38__default.default.forwardRef(
+var Heading = React39__default.default.forwardRef(
   ({ className, level = "h2", as, children, ...props }, ref) => {
     const Comp = as ?? levelToElement[level];
     return /* @__PURE__ */ jsxRuntime.jsx(
       Comp,
       {
         ref,
-        className: clsx27__default.default("ds-heading", `ds-heading--${level}`, className),
+        className: clsx28__default.default("ds-heading", `ds-heading--${level}`, className),
         ...props,
         children
       }
@@ -2306,14 +2431,14 @@ var Heading = React38__default.default.forwardRef(
   }
 );
 Heading.displayName = "Heading";
-var Text = React38__default.default.forwardRef(
+var Text = React39__default.default.forwardRef(
   ({ className, variant = "body", as = "p", children, ...props }, ref) => {
     const Comp = as;
     return /* @__PURE__ */ jsxRuntime.jsx(
       Comp,
       {
         ref,
-        className: clsx27__default.default("ds-text", `ds-text--${variant}`, className),
+        className: clsx28__default.default("ds-text", `ds-text--${variant}`, className),
         ...props,
         children
       }
@@ -2321,13 +2446,13 @@ var Text = React38__default.default.forwardRef(
   }
 );
 Text.displayName = "Text";
-var Prose = React38__default.default.forwardRef(
+var Prose = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-prose", className),
+        className: clsx28__default.default("ds-prose", className),
         ...props,
         children
       }
@@ -2335,24 +2460,24 @@ var Prose = React38__default.default.forwardRef(
   }
 );
 Prose.displayName = "Prose";
-var CarouselContext = React38__default.default.createContext(void 0);
+var CarouselContext = React39__default.default.createContext(void 0);
 function useCarouselContext() {
-  const ctx = React38__default.default.useContext(CarouselContext);
+  const ctx = React39__default.default.useContext(CarouselContext);
   if (!ctx) {
     throw new Error("Carousel compound components must be used within a <Carousel> parent.");
   }
   return ctx;
 }
-var Carousel = React38__default.default.forwardRef(
+var Carousel = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => {
-    const scrollRef = React38__default.default.useRef(null);
-    return /* @__PURE__ */ jsxRuntime.jsx(CarouselContext.Provider, { value: { scrollRef }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-carousel", className), ...props, children }) });
+    const scrollRef = React39__default.default.useRef(null);
+    return /* @__PURE__ */ jsxRuntime.jsx(CarouselContext.Provider, { value: { scrollRef }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-carousel", className), ...props, children }) });
   }
 );
 Carousel.displayName = "Carousel";
-var CarouselContent = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var CarouselContent = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   const { scrollRef } = useCarouselContext();
-  const mergedRef = React38__default.default.useCallback(
+  const mergedRef = React39__default.default.useCallback(
     (node) => {
       scrollRef.current = node;
       if (typeof ref === "function") {
@@ -2363,14 +2488,14 @@ var CarouselContent = React38__default.default.forwardRef(({ className, ...props
     },
     [ref, scrollRef]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: mergedRef, className: clsx27__default.default("ds-carousel__content", className), ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref: mergedRef, className: clsx28__default.default("ds-carousel__content", className), ...props });
 });
 CarouselContent.displayName = "CarouselContent";
-var CarouselItem = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-carousel__item", className), ...props })
+var CarouselItem = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-carousel__item", className), ...props })
 );
 CarouselItem.displayName = "CarouselItem";
-var CarouselPrevious = React38__default.default.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Previous slide", ...props }, ref) => {
+var CarouselPrevious = React39__default.default.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Previous slide", ...props }, ref) => {
   const { scrollRef } = useCarouselContext();
   const handleClick = (e) => {
     const container = scrollRef.current;
@@ -2386,7 +2511,7 @@ var CarouselPrevious = React38__default.default.forwardRef(({ className, onClick
     {
       ref,
       type: "button",
-      className: clsx27__default.default("ds-carousel__prev", className),
+      className: clsx28__default.default("ds-carousel__prev", className),
       "aria-label": ariaLabel,
       onClick: handleClick,
       ...props,
@@ -2404,7 +2529,7 @@ var CarouselPrevious = React38__default.default.forwardRef(({ className, onClick
   );
 });
 CarouselPrevious.displayName = "CarouselPrevious";
-var CarouselNext = React38__default.default.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Next slide", ...props }, ref) => {
+var CarouselNext = React39__default.default.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Next slide", ...props }, ref) => {
   const { scrollRef } = useCarouselContext();
   const handleClick = (e) => {
     const container = scrollRef.current;
@@ -2420,7 +2545,7 @@ var CarouselNext = React38__default.default.forwardRef(({ className, onClick, ch
     {
       ref,
       type: "button",
-      className: clsx27__default.default("ds-carousel__next", className),
+      className: clsx28__default.default("ds-carousel__next", className),
       "aria-label": ariaLabel,
       onClick: handleClick,
       ...props,
@@ -2446,9 +2571,9 @@ function mergeRefs(...refs) {
     });
   };
 }
-var CommandContext = React38__default.default.createContext(void 0);
+var CommandContext = React39__default.default.createContext(void 0);
 function useCommandContext() {
-  const ctx = React38__default.default.useContext(CommandContext);
+  const ctx = React39__default.default.useContext(CommandContext);
   if (!ctx) {
     throw new Error("Command compound components must be used within a <Command> parent.");
   }
@@ -2458,16 +2583,16 @@ function getOptionElements(listEl) {
   if (!listEl) return [];
   return Array.from(listEl.querySelectorAll('[role="option"]'));
 }
-var Command = React38__default.default.forwardRef(
+var Command = React39__default.default.forwardRef(
   ({ className, value: controlledValue, onValueChange, onKeyDown, children, ...props }, ref) => {
-    const [uncontrolledValue, setUncontrolledValue] = React38__default.default.useState("");
-    const [activeId, setActiveId] = React38__default.default.useState(null);
-    const listRef = React38__default.default.useRef(null);
+    const [uncontrolledValue, setUncontrolledValue] = React39__default.default.useState("");
+    const [activeId, setActiveId] = React39__default.default.useState(null);
+    const listRef = React39__default.default.useRef(null);
     const isControlled = controlledValue !== void 0;
     const search = isControlled ? controlledValue : uncontrolledValue;
-    const inputId = React38__default.default.useId();
-    const listId = React38__default.default.useId();
-    const setSearch = React38__default.default.useCallback(
+    const inputId = React39__default.default.useId();
+    const listId = React39__default.default.useId();
+    const setSearch = React39__default.default.useCallback(
       (next) => {
         if (!isControlled) {
           setUncontrolledValue(next);
@@ -2476,7 +2601,7 @@ var Command = React38__default.default.forwardRef(
       },
       [isControlled, onValueChange]
     );
-    React38__default.default.useEffect(() => {
+    React39__default.default.useEffect(() => {
       const frame = requestAnimationFrame(() => {
         const items = getOptionElements(listRef.current);
         if (items.length > 0) {
@@ -2487,7 +2612,7 @@ var Command = React38__default.default.forwardRef(
       });
       return () => cancelAnimationFrame(frame);
     }, [search]);
-    const handleKeyDown = React38__default.default.useCallback(
+    const handleKeyDown = React39__default.default.useCallback(
       (e) => {
         const items = getOptionElements(listRef.current);
         if (items.length === 0) {
@@ -2538,7 +2663,7 @@ var Command = React38__default.default.forwardRef(
       },
       [activeId, onKeyDown]
     );
-    const ctx = React38__default.default.useMemo(
+    const ctx = React39__default.default.useMemo(
       () => ({ search, setSearch, activeId, setActiveId, listRef, inputId, listId }),
       [search, setSearch, activeId, inputId, listId]
     );
@@ -2546,7 +2671,7 @@ var Command = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-command", className),
+        className: clsx28__default.default("ds-command", className),
         onKeyDown: handleKeyDown,
         ...props,
         children
@@ -2555,7 +2680,7 @@ var Command = React38__default.default.forwardRef(
   }
 );
 Command.displayName = "Command";
-var CommandInput = React38__default.default.forwardRef(({ className, onChange, ...props }, ref) => {
+var CommandInput = React39__default.default.forwardRef(({ className, onChange, ...props }, ref) => {
   const { search, setSearch, activeId, inputId, listId } = useCommandContext();
   const handleChange = (e) => {
     setSearch(e.target.value);
@@ -2597,7 +2722,7 @@ var CommandInput = React38__default.default.forwardRef(({ className, onChange, .
         "aria-activedescendant": activeId ?? void 0,
         "aria-autocomplete": "list",
         autoComplete: "off",
-        className: clsx27__default.default("ds-command__input", className),
+        className: clsx28__default.default("ds-command__input", className),
         value: search,
         onChange: handleChange,
         ...props
@@ -2606,7 +2731,7 @@ var CommandInput = React38__default.default.forwardRef(({ className, onChange, .
   ] });
 });
 CommandInput.displayName = "CommandInput";
-var CommandList = React38__default.default.forwardRef(
+var CommandList = React39__default.default.forwardRef(
   ({ className, ...props }, ref) => {
     const { listRef, listId } = useCommandContext();
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -2615,27 +2740,27 @@ var CommandList = React38__default.default.forwardRef(
         ref: mergeRefs(ref, listRef),
         id: listId,
         role: "listbox",
-        className: clsx27__default.default("ds-command__list", className),
+        className: clsx28__default.default("ds-command__list", className),
         ...props
       }
     );
   }
 );
 CommandList.displayName = "CommandList";
-var CommandEmpty = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-command__empty", className), ...props })
+var CommandEmpty = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-command__empty", className), ...props })
 );
 CommandEmpty.displayName = "CommandEmpty";
-var CommandGroup = React38__default.default.forwardRef(
-  ({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx27__default.default("ds-command__group", className), ...props, children: [
+var CommandGroup = React39__default.default.forwardRef(
+  ({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx28__default.default("ds-command__group", className), ...props, children: [
     heading && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-command__group-heading", children: heading }),
     children
   ] })
 );
 CommandGroup.displayName = "CommandGroup";
-var CommandItem = React38__default.default.forwardRef(
+var CommandItem = React39__default.default.forwardRef(
   ({ className, onSelect, onClick, onKeyDown, onPointerEnter, id: externalId, ...props }, ref) => {
-    const generatedId = React38__default.default.useId();
+    const generatedId = React39__default.default.useId();
     const { activeId, setActiveId } = useCommandContext();
     const itemId = externalId || generatedId;
     const isActive = activeId === itemId;
@@ -2662,7 +2787,7 @@ var CommandItem = React38__default.default.forwardRef(
         tabIndex: 0,
         "aria-selected": isActive,
         "data-active": isActive || void 0,
-        className: clsx27__default.default("ds-command__item", className),
+        className: clsx28__default.default("ds-command__item", className),
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         onPointerEnter: handlePointerEnter,
@@ -2672,7 +2797,7 @@ var CommandItem = React38__default.default.forwardRef(
   }
 );
 CommandItem.displayName = "CommandItem";
-var CommandSeparator = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-command__separator", className), ...props }));
+var CommandSeparator = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-command__separator", className), ...props }));
 CommandSeparator.displayName = "CommandSeparator";
 var SIZE_CLASSES = {
   sm: "ds-dialog__content--sm",
@@ -2689,7 +2814,7 @@ var CommandDialog = ({
 }) => /* @__PURE__ */ jsxRuntime.jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(
   DialogContent,
   {
-    className: clsx27__default.default("ds-command-dialog", SIZE_CLASSES[size], className),
+    className: clsx28__default.default("ds-command-dialog", SIZE_CLASSES[size], className),
     children: [
       /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: "ds-command-dialog__sr-title", children: title }),
       children
@@ -2697,19 +2822,19 @@ var CommandDialog = ({
   }
 ) });
 CommandDialog.displayName = "CommandDialog";
-var DrawerContext = React38__default.default.createContext(void 0);
+var DrawerContext = React39__default.default.createContext(void 0);
 function useDrawerContext() {
-  const ctx = React38__default.default.useContext(DrawerContext);
+  const ctx = React39__default.default.useContext(DrawerContext);
   if (!ctx) {
     throw new Error("Drawer compound components must be used within a <Drawer> parent.");
   }
   return ctx;
 }
 var Drawer = ({ open: controlledOpen, onOpenChange, children }) => {
-  const [uncontrolledOpen, setUncontrolledOpen] = React38__default.default.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React39__default.default.useState(false);
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : uncontrolledOpen;
-  const handleOpenChange = React38__default.default.useCallback(
+  const handleOpenChange = React39__default.default.useCallback(
     (next) => {
       if (!isControlled) {
         setUncontrolledOpen(next);
@@ -2721,7 +2846,7 @@ var Drawer = ({ open: controlledOpen, onOpenChange, children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(DrawerContext.Provider, { value: { open, onOpenChange: handleOpenChange }, children });
 };
 Drawer.displayName = "Drawer";
-var DrawerTrigger = React38__default.default.forwardRef(({ onClick, ...props }, ref) => {
+var DrawerTrigger = React39__default.default.forwardRef(({ onClick, ...props }, ref) => {
   const { onOpenChange } = useDrawerContext();
   const handleClick = (e) => {
     onOpenChange(true);
@@ -2730,7 +2855,7 @@ var DrawerTrigger = React38__default.default.forwardRef(({ onClick, ...props },
   return /* @__PURE__ */ jsxRuntime.jsx("button", { ref, type: "button", onClick: handleClick, ...props });
 });
 DrawerTrigger.displayName = "DrawerTrigger";
-var DrawerClose = React38__default.default.forwardRef(({ onClick, ...props }, ref) => {
+var DrawerClose = React39__default.default.forwardRef(({ onClick, ...props }, ref) => {
   const { onOpenChange } = useDrawerContext();
   const handleClick = (e) => {
     onOpenChange(false);
@@ -2739,7 +2864,7 @@ var DrawerClose = React38__default.default.forwardRef(({ onClick, ...props }, re
   return /* @__PURE__ */ jsxRuntime.jsx("button", { ref, type: "button", onClick: handleClick, ...props });
 });
 DrawerClose.displayName = "DrawerClose";
-var DrawerContent = React38__default.default.forwardRef(
+var DrawerContent = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => {
     const { open, onOpenChange } = useDrawerContext();
     if (!open) return null;
@@ -2758,7 +2883,7 @@ var DrawerContent = React38__default.default.forwardRef(
           {
             ref,
             role: "dialog",
-            className: clsx27__default.default("ds-drawer__content", className),
+            className: clsx28__default.default("ds-drawer__content", className),
             ...props,
             children: [
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-drawer__handle", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ds-drawer__handle-bar" }) }),
@@ -2772,16 +2897,16 @@ var DrawerContent = React38__default.default.forwardRef(
   }
 );
 DrawerContent.displayName = "DrawerContent";
-var DrawerHeader = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-drawer__header", className), ...props })
+var DrawerHeader = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-drawer__header", className), ...props })
 );
 DrawerHeader.displayName = "DrawerHeader";
-var DrawerTitle = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h2", { ref, className: clsx27__default.default("ds-drawer__title", className), ...props }));
+var DrawerTitle = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("h2", { ref, className: clsx28__default.default("ds-drawer__title", className), ...props }));
 DrawerTitle.displayName = "DrawerTitle";
-var DrawerDescription = React38__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: clsx27__default.default("ds-drawer__description", className), ...props }));
+var DrawerDescription = React39__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("p", { ref, className: clsx28__default.default("ds-drawer__description", className), ...props }));
 DrawerDescription.displayName = "DrawerDescription";
-var DrawerFooter = React38__default.default.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-drawer__footer", className), ...props })
+var DrawerFooter = React39__default.default.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-drawer__footer", className), ...props })
 );
 DrawerFooter.displayName = "DrawerFooter";
 var DEFAULT_WEEKDAY_LABELS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
@@ -2828,13 +2953,13 @@ function getCalendarGrid(year, month) {
   }
   return weeks;
 }
-var Calendar = React38__default.default.forwardRef(
+var Calendar = React39__default.default.forwardRef(
   ({ className, selected, onSelect, month, onMonthChange, labels, ...props }, ref) => {
     const weekdayLabels = labels?.weekdays ?? DEFAULT_WEEKDAY_LABELS;
     const monthNames = labels?.months ?? DEFAULT_MONTH_NAMES;
     const formatDayLabel = labels?.formatDayLabel ?? ((d) => d.toDateString());
     const today = /* @__PURE__ */ new Date();
-    const [internalMonth, setInternalMonth] = React38__default.default.useState(
+    const [internalMonth, setInternalMonth] = React39__default.default.useState(
       () => month ?? selected ?? /* @__PURE__ */ new Date()
     );
     const displayedMonth = month ?? internalMonth;
@@ -2852,7 +2977,7 @@ var Calendar = React38__default.default.forwardRef(
     const handleDayClick = (date) => {
       onSelect?.(date);
     };
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx27__default.default("ds-calendar", className), ...props, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: clsx28__default.default("ds-calendar", className), ...props, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ds-calendar__header", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "button",
@@ -2916,7 +3041,7 @@ var Calendar = React38__default.default.forwardRef(
             "button",
             {
               type: "button",
-              className: clsx27__default.default(
+              className: clsx28__default.default(
                 "ds-calendar__day",
                 isSelected && "ds-calendar__day--selected",
                 isToday && "ds-calendar__day--today",
@@ -2934,14 +3059,14 @@ var Calendar = React38__default.default.forwardRef(
   }
 );
 Calendar.displayName = "Calendar";
-var InputOTPContext = React38__default.default.createContext({
+var InputOTPContext = React39__default.default.createContext({
   value: "",
   activeIndex: -1
 });
-var InputOTP = React38__default.default.forwardRef(
+var InputOTP = React39__default.default.forwardRef(
   ({ className, length = 6, value = "", onChange, children, "aria-label": ariaLabel = "One-time password", ...props }, ref) => {
-    const inputRef = React38__default.default.useRef(null);
-    const [activeIndex, setActiveIndex] = React38__default.default.useState(-1);
+    const inputRef = React39__default.default.useRef(null);
+    const [activeIndex, setActiveIndex] = React39__default.default.useState(-1);
     const handleChange = (e) => {
       const newValue = e.target.value.replace(/[^0-9]/g, "").slice(0, length);
       onChange?.(newValue);
@@ -2960,7 +3085,7 @@ var InputOTP = React38__default.default.forwardRef(
     const handleContainerClick = () => {
       inputRef.current?.focus();
     };
-    const contextValue = React38__default.default.useMemo(
+    const contextValue = React39__default.default.useMemo(
       () => ({ value, activeIndex }),
       [value, activeIndex]
     );
@@ -2968,7 +3093,7 @@ var InputOTP = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default("ds-input-otp", className),
+        className: clsx28__default.default("ds-input-otp", className),
         onClick: handleContainerClick,
         ...props,
         children: [
@@ -2997,13 +3122,13 @@ var InputOTP = React38__default.default.forwardRef(
   }
 );
 InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-input-otp__group", className), ...props });
+var InputOTPGroup = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-input-otp__group", className), ...props });
 });
 InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React38__default.default.forwardRef(
+var InputOTPSlot = React39__default.default.forwardRef(
   ({ className, index, ...props }, ref) => {
-    const { value, activeIndex } = React38__default.default.useContext(InputOTPContext);
+    const { value, activeIndex } = React39__default.default.useContext(InputOTPContext);
     const char = value[index] ?? "";
     const isActive = activeIndex === index;
     const isFilled = char !== "";
@@ -3011,7 +3136,7 @@ var InputOTPSlot = React38__default.default.forwardRef(
       "div",
       {
         ref,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-input-otp__slot",
           isActive && "ds-input-otp__slot--active",
           isFilled && "ds-input-otp__slot--filled",
@@ -3024,8 +3149,8 @@ var InputOTPSlot = React38__default.default.forwardRef(
   }
 );
 InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-input-otp__separator", className), role: "separator", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+var InputOTPSeparator = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-input-otp__separator", className), role: "separator", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
     "svg",
     {
       width: "8",
@@ -3037,33 +3162,33 @@ var InputOTPSeparator = React38__default.default.forwardRef(({ className, ...pro
   ) });
 });
 InputOTPSeparator.displayName = "InputOTPSeparator";
-var ContextMenuContext = React38__default.default.createContext({
+var ContextMenuContext = React39__default.default.createContext({
   open: false,
   position: { x: 0, y: 0 },
   onClose: () => {
   }
 });
 function ContextMenu({ children }) {
-  const [open, setOpen] = React38__default.default.useState(false);
-  const [position, setPosition] = React38__default.default.useState({ x: 0, y: 0 });
-  const handleOpen = React38__default.default.useCallback((x, y) => {
+  const [open, setOpen] = React39__default.default.useState(false);
+  const [position, setPosition] = React39__default.default.useState({ x: 0, y: 0 });
+  const handleOpen = React39__default.default.useCallback((x, y) => {
     setPosition({ x, y });
     setOpen(true);
   }, []);
-  const handleClose = React38__default.default.useCallback(() => {
+  const handleClose = React39__default.default.useCallback(() => {
     setOpen(false);
   }, []);
-  const contextValue = React38__default.default.useMemo(
+  const contextValue = React39__default.default.useMemo(
     () => ({ open, position, onClose: handleClose }),
     [open, position, handleClose]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(ContextMenuInternalContext.Provider, { value: { onOpen: handleOpen }, children: /* @__PURE__ */ jsxRuntime.jsx(ContextMenuContext.Provider, { value: contextValue, children }) });
 }
 ContextMenu.displayName = "ContextMenu";
-var ContextMenuInternalContext = React38__default.default.createContext({ onOpen: () => {
+var ContextMenuInternalContext = React39__default.default.createContext({ onOpen: () => {
 } });
-var ContextMenuTrigger = React38__default.default.forwardRef(({ className, onContextMenu, ...props }, ref) => {
-  const { onOpen } = React38__default.default.useContext(ContextMenuInternalContext);
+var ContextMenuTrigger = React39__default.default.forwardRef(({ className, onContextMenu, ...props }, ref) => {
+  const { onOpen } = React39__default.default.useContext(ContextMenuInternalContext);
   const handleContextMenu = (e) => {
     e.preventDefault();
     onOpen(e.clientX, e.clientY);
@@ -3073,17 +3198,17 @@ var ContextMenuTrigger = React38__default.default.forwardRef(({ className, onCon
     "div",
     {
       ref,
-      className: clsx27__default.default("ds-context-menu__trigger", className),
+      className: clsx28__default.default("ds-context-menu__trigger", className),
       onContextMenu: handleContextMenu,
       ...props
     }
   );
 });
 ContextMenuTrigger.displayName = "ContextMenuTrigger";
-var ContextMenuContent = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  const { open, position, onClose } = React38__default.default.useContext(ContextMenuContext);
-  const contentRef = React38__default.default.useRef(null);
-  const mergedRef = React38__default.default.useCallback(
+var ContextMenuContent = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  const { open, position, onClose } = React39__default.default.useContext(ContextMenuContext);
+  const contentRef = React39__default.default.useRef(null);
+  const mergedRef = React39__default.default.useCallback(
     (node) => {
       contentRef.current = node;
       if (typeof ref === "function") ref(node);
@@ -3091,7 +3216,7 @@ var ContextMenuContent = React38__default.default.forwardRef(({ className, ...pr
     },
     [ref]
   );
-  React38__default.default.useEffect(() => {
+  React39__default.default.useEffect(() => {
     if (!open) return;
     const handleClickOutside = (e) => {
       if (contentRef.current && !contentRef.current.contains(e.target)) {
@@ -3120,7 +3245,7 @@ var ContextMenuContent = React38__default.default.forwardRef(({ className, ...pr
       {
         ref: mergedRef,
         role: "menu",
-        className: clsx27__default.default("ds-context-menu__content", className),
+        className: clsx28__default.default("ds-context-menu__content", className),
         style: { top: position.y, left: position.x },
         ...props
       }
@@ -3129,9 +3254,9 @@ var ContextMenuContent = React38__default.default.forwardRef(({ className, ...pr
   );
 });
 ContextMenuContent.displayName = "ContextMenuContent";
-var ContextMenuItem = React38__default.default.forwardRef(
+var ContextMenuItem = React39__default.default.forwardRef(
   ({ className, onSelect, onClick, ...props }, ref) => {
-    const { onClose } = React38__default.default.useContext(ContextMenuContext);
+    const { onClose } = React39__default.default.useContext(ContextMenuContext);
     const handleClick = (e) => {
       onSelect?.();
       onClose();
@@ -3142,7 +3267,7 @@ var ContextMenuItem = React38__default.default.forwardRef(
       {
         ref,
         role: "menuitem",
-        className: clsx27__default.default("ds-context-menu__item", className),
+        className: clsx28__default.default("ds-context-menu__item", className),
         onClick: handleClick,
         ...props
       }
@@ -3150,45 +3275,45 @@ var ContextMenuItem = React38__default.default.forwardRef(
   }
 );
 ContextMenuItem.displayName = "ContextMenuItem";
-var ContextMenuSeparator = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var ContextMenuSeparator = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       ref,
       role: "separator",
-      className: clsx27__default.default("ds-context-menu__separator", className),
+      className: clsx28__default.default("ds-context-menu__separator", className),
       ...props
     }
   );
 });
 ContextMenuSeparator.displayName = "ContextMenuSeparator";
-var ContextMenuLabel = React38__default.default.forwardRef(({ className, ...props }, ref) => {
+var ContextMenuLabel = React39__default.default.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       ref,
-      className: clsx27__default.default("ds-context-menu__label", className),
+      className: clsx28__default.default("ds-context-menu__label", className),
       ...props
     }
   );
 });
 ContextMenuLabel.displayName = "ContextMenuLabel";
-var FormFieldContext = React38__default.default.createContext(void 0);
+var FormFieldContext = React39__default.default.createContext(void 0);
 function useFormField() {
-  const ctx = React38__default.default.useContext(FormFieldContext);
+  const ctx = React39__default.default.useContext(FormFieldContext);
   if (!ctx) {
     throw new Error("useFormField must be used within a <FormField>");
   }
   return ctx;
 }
-var FormItemContext = React38__default.default.createContext(void 0);
+var FormItemContext = React39__default.default.createContext(void 0);
 function FormField({ name, children, value, onChange, onBlur, error }) {
-  const id = React38__default.default.useId();
-  const contextValue = React38__default.default.useMemo(
+  const id = React39__default.default.useId();
+  const contextValue = React39__default.default.useMemo(
     () => ({ id: `${id}-form-item`, name, error }),
     [id, name, error]
   );
-  const fieldProps = React38__default.default.useMemo(
+  const fieldProps = React39__default.default.useMemo(
     () => ({
       value: value ?? "",
       onChange: onChange ?? (() => {
@@ -3203,35 +3328,35 @@ function FormField({ name, children, value, onChange, onBlur, error }) {
   return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext.Provider, { value: contextValue, children: children(fieldProps) });
 }
 FormField.displayName = "FormField";
-var FormItem = React38__default.default.forwardRef(
+var FormItem = React39__default.default.forwardRef(
   ({ className, ...props }, ref) => {
-    const id = React38__default.default.useId();
-    const contextValue = React38__default.default.useMemo(() => ({ id }), [id]);
-    return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-form__item", className), ...props }) });
+    const id = React39__default.default.useId();
+    const contextValue = React39__default.default.useMemo(() => ({ id }), [id]);
+    return /* @__PURE__ */ jsxRuntime.jsx(FormItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-form__item", className), ...props }) });
   }
 );
 FormItem.displayName = "FormItem";
-var FormLabel = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  const fieldCtx = React38__default.default.useContext(FormFieldContext);
+var FormLabel = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  const fieldCtx = React39__default.default.useContext(FormFieldContext);
   const hasError = !!fieldCtx?.error;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "label",
     {
       ref,
       htmlFor: fieldCtx?.id,
-      className: clsx27__default.default("ds-form__label", hasError && "ds-form__label--error", className),
+      className: clsx28__default.default("ds-form__label", hasError && "ds-form__label--error", className),
       ...props
     }
   );
 });
 FormLabel.displayName = "FormLabel";
-var FormControl = React38__default.default.forwardRef(
+var FormControl = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => {
-    const fieldCtx = React38__default.default.useContext(FormFieldContext);
+    const fieldCtx = React39__default.default.useContext(FormFieldContext);
     const descriptionId = fieldCtx ? `${fieldCtx.id}-description` : void 0;
     const messageId = fieldCtx ? `${fieldCtx.id}-message` : void 0;
     const hasError = !!fieldCtx?.error;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx27__default.default("ds-form__control", className), ...props, children: React38__default.default.isValidElement(children) ? React38__default.default.cloneElement(children, {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: clsx28__default.default("ds-form__control", className), ...props, children: React39__default.default.isValidElement(children) ? React39__default.default.cloneElement(children, {
       id: fieldCtx?.id,
       "aria-describedby": descriptionId,
       "aria-invalid": hasError || void 0,
@@ -3240,21 +3365,21 @@ var FormControl = React38__default.default.forwardRef(
   }
 );
 FormControl.displayName = "FormControl";
-var FormDescription = React38__default.default.forwardRef(({ className, ...props }, ref) => {
-  const fieldCtx = React38__default.default.useContext(FormFieldContext);
+var FormDescription = React39__default.default.forwardRef(({ className, ...props }, ref) => {
+  const fieldCtx = React39__default.default.useContext(FormFieldContext);
   return /* @__PURE__ */ jsxRuntime.jsx(
     "p",
     {
       ref,
       id: fieldCtx ? `${fieldCtx.id}-description` : void 0,
-      className: clsx27__default.default("ds-form__description", className),
+      className: clsx28__default.default("ds-form__description", className),
       ...props
     }
   );
 });
 FormDescription.displayName = "FormDescription";
-var FormMessage = React38__default.default.forwardRef(({ className, children, ...props }, ref) => {
-  const fieldCtx = React38__default.default.useContext(FormFieldContext);
+var FormMessage = React39__default.default.forwardRef(({ className, children, ...props }, ref) => {
+  const fieldCtx = React39__default.default.useContext(FormFieldContext);
   const message = children ?? fieldCtx?.error;
   if (!message) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3263,7 +3388,7 @@ var FormMessage = React38__default.default.forwardRef(({ className, children, ..
       ref,
       id: fieldCtx ? `${fieldCtx.id}-message` : void 0,
       role: "alert",
-      className: clsx27__default.default("ds-form__message", className),
+      className: clsx28__default.default("ds-form__message", className),
       ...props,
       children: message
     }
@@ -3321,7 +3446,7 @@ function extractSpacingStyles(props) {
   if (props.gap !== void 0) styles.gap = resolveSpacing(props.gap);
   return styles;
 }
-var Box = React38.forwardRef(
+var Box = React39.forwardRef(
   ({ as: Component = "div", className, style, children, ...props }, ref) => {
     const spacingStyles = extractSpacingStyles(props);
     const { m, mt, mb, ml, mr, mx, my, p, pt, pb, pl, pr, px, py, gap, ...domProps } = props;
@@ -3329,7 +3454,7 @@ var Box = React38.forwardRef(
       Component,
       {
         ref,
-        className: clsx27__default.default("ds-box", className),
+        className: clsx28__default.default("ds-box", className),
         style: { ...spacingStyles, ...style },
         ...domProps,
         children
@@ -3338,13 +3463,13 @@ var Box = React38.forwardRef(
   }
 );
 Box.displayName = "Box";
-var Stack = React38.forwardRef(
+var Stack = React39.forwardRef(
   ({ direction = "column", align, justify, wrap, className, style, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       Box,
       {
         ref,
-        className: clsx27__default.default("ds-stack", direction === "row" && "ds-stack--horizontal", className),
+        className: clsx28__default.default("ds-stack", direction === "row" && "ds-stack--horizontal", className),
         style: {
           alignItems: align,
           justifyContent: justify === "between" ? "space-between" : justify,
@@ -3358,14 +3483,14 @@ var Stack = React38.forwardRef(
 );
 Stack.displayName = "Stack";
 var MAX_RESPONSIVE_COLS = 6;
-var Grid = React38.forwardRef(
+var Grid = React39.forwardRef(
   ({ columns, rows, align, justify, fixed, className, style, ...props }, ref) => {
     const useColClass = typeof columns === "number" && columns >= 1 && columns <= MAX_RESPONSIVE_COLS;
     return /* @__PURE__ */ jsxRuntime.jsx(
       Box,
       {
         ref,
-        className: clsx27__default.default(
+        className: clsx28__default.default(
           "ds-grid",
           useColClass && `ds-grid--cols-${columns}`,
           fixed && "ds-grid--fixed",
@@ -3395,7 +3520,7 @@ var CONTAINER_SIZE_MAP = {
   // 80rem — max-w-7xl
   full: "100%"
 };
-var Container = React38.forwardRef(
+var Container = React39.forwardRef(
   ({ size, fluid, maxWidth, className, style, ...props }, ref) => {
     let resolvedMaxWidth;
     if (fluid) {
@@ -3409,7 +3534,7 @@ var Container = React38.forwardRef(
       Box,
       {
         ref,
-        className: clsx27__default.default("ds-container", className),
+        className: clsx28__default.default("ds-container", className),
         style: {
           maxWidth: resolvedMaxWidth,
           ...style
@@ -3420,13 +3545,13 @@ var Container = React38.forwardRef(
   }
 );
 Container.displayName = "Container";
-var Section = React38.forwardRef(
+var Section = React39.forwardRef(
   ({ padding = "md", className, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "section",
       {
         ref,
-        className: clsx27__default.default("ds-section-block", `ds-section-block--${padding}`, className),
+        className: clsx28__default.default("ds-section-block", `ds-section-block--${padding}`, className),
         ...props,
         children
       }
@@ -3434,19 +3559,19 @@ var Section = React38.forwardRef(
   }
 );
 Section.displayName = "Section";
-var VisuallyHidden = React38.forwardRef(
+var VisuallyHidden = React39.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: clsx27__default.default("ds-visually-hidden", className), ...props });
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: clsx28__default.default("ds-visually-hidden", className), ...props });
   }
 );
 VisuallyHidden.displayName = "VisuallyHidden";
-var Tabs = React38__default.default.forwardRef(
+var Tabs = React39__default.default.forwardRef(
   ({ className, orientation = "horizontal", ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       tabs.Tabs.Root,
       {
         ref,
-        className: clsx27__default.default("ds-tabs", `ds-tabs--${orientation}`, className),
+        className: clsx28__default.default("ds-tabs", `ds-tabs--${orientation}`, className),
         orientation,
         ...props
       }
@@ -3454,21 +3579,21 @@ var Tabs = React38__default.default.forwardRef(
   }
 );
 Tabs.displayName = "Tabs";
-var TabsList = React38__default.default.forwardRef(
+var TabsList = React39__default.default.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(tabs.Tabs.List, { ref, className: clsx27__default.default("ds-tabs__list", className), ...props });
+    return /* @__PURE__ */ jsxRuntime.jsx(tabs.Tabs.List, { ref, className: clsx28__default.default("ds-tabs__list", className), ...props });
   }
 );
 TabsList.displayName = "TabsList";
-var TabsTrigger = React38__default.default.forwardRef(
+var TabsTrigger = React39__default.default.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(tabs.Tabs.Tab, { ref, className: clsx27__default.default("ds-tabs__trigger", className), ...props, children });
+    return /* @__PURE__ */ jsxRuntime.jsx(tabs.Tabs.Tab, { ref, className: clsx28__default.default("ds-tabs__trigger", className), ...props, children });
   }
 );
 TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React38__default.default.forwardRef(
+var TabsContent = React39__default.default.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(tabs.Tabs.Panel, { ref, className: clsx27__default.default("ds-tabs__content", className), ...props });
+    return /* @__PURE__ */ jsxRuntime.jsx(tabs.Tabs.Panel, { ref, className: clsx28__default.default("ds-tabs__content", className), ...props });
   }
 );
 TabsContent.displayName = "TabsContent";
@@ -3581,7 +3706,7 @@ function DSIntlProvider({
 }
 function useMessage() {
   const intl = reactIntl.useIntl();
-  const formatMessage = React38.useCallback(
+  const formatMessage = React39.useCallback(
     (descriptor, values) => {
       return intl.formatMessage(descriptor, values);
     },
@@ -3619,7 +3744,7 @@ function useTextDirection() {
 }
 function useNumberFormat() {
   const intl = reactIntl.useIntl();
-  const formatNumber = React38.useCallback(
+  const formatNumber = React39.useCallback(
     (value, options) => {
       return intl.formatNumber(value, options);
     },
@@ -3629,7 +3754,7 @@ function useNumberFormat() {
 }
 function useDateFormat() {
   const intl = reactIntl.useIntl();
-  const formatDate = React38.useCallback(
+  const formatDate = React39.useCallback(
     (value, options) => {
       return intl.formatDate(value, options);
     },
@@ -3639,7 +3764,7 @@ function useDateFormat() {
 }
 function useRelativeTime() {
   const intl = reactIntl.useIntl();
-  const formatRelativeTime = React38.useCallback(
+  const formatRelativeTime = React39.useCallback(
     (value, unit, options) => {
       return intl.formatRelativeTime(value, unit, options);
     },
@@ -4151,6 +4276,12 @@ exports.SPACING = SPACING;
 exports.ScrollArea = ScrollArea;
 exports.ScrollBar = ScrollBar;
 exports.Section = Section;
+exports.Select = Select;
+exports.SelectContent = SelectContent;
+exports.SelectGroup = SelectGroup;
+exports.SelectItem = SelectItem;
+exports.SelectSeparator = SelectSeparator;
+exports.SelectTrigger = SelectTrigger;
 exports.Separator = Separator;
 exports.Sheet = Sheet;
 exports.SheetClose = SheetClose;