@salesmind-ai/design-system 0.3.0 → 0.3.2

package/dist/core/index.js

@@ -1,4132 +1,16 @@
-import React39, { createContext, useId, forwardRef, useContext, useState, useEffect, useCallback, useRef } from 'react';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import clsx28 from 'clsx';
-import { Slot } from '@radix-ui/react-slot';
-import { Input } from '@base-ui/react/input';
-import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
-import { Switch as Switch$1 } from '@base-ui/react/switch';
-import { Select as Select$1 } from '@base-ui/react/select';
-import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
-import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
-import ReactDOM, { createPortal } from 'react-dom';
-import { Menu } from '@base-ui/react/menu';
-import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
-import { defineMessages, IntlProvider, useIntl } from 'react-intl';
-export { FormattedDate, FormattedMessage, FormattedNumber, defineMessages } from 'react-intl';
-
-// src/tokens/motion.ts
-var DURATION = {
-  micro: 0.15,
-  // 150ms
-  short: 0.25,
-  // 250ms
-  medium: 0.5,
-  // 500ms
-  long: 1
-  // 1000ms
-};
-var EASING = {
-  standard: [0.16, 1, 0.3, 1],
-  // Smooth, premium feel
-  emphasis: [0.34, 1.56, 0.64, 1],
-  // Slight spring/overshoot
-  exit: [0.4, 0, 0.2, 1],
-  // Quick, decisive exit
-  linear: [0, 0, 1, 1]
-};
-var TRANSITION = {
-  standard: {
-    duration: DURATION.medium,
-    ease: EASING.standard
-  },
-  emphasis: {
-    duration: DURATION.medium,
-    ease: EASING.emphasis
-  },
-  quick: {
-    duration: DURATION.short,
-    ease: EASING.standard
-  },
-  spring: {
-    type: "spring",
-    stiffness: 200,
-    damping: 20
-  }
-};
-var VARIANTS = {
-  fadeIn: {
-    hidden: { opacity: 0 },
-    visible: { opacity: 1, transition: { duration: DURATION.medium, ease: EASING.standard } }
-  },
-  fadeUp: {
-    hidden: { opacity: 0, y: 12 },
-    visible: { opacity: 1, y: 0, transition: { duration: DURATION.medium, ease: EASING.standard } }
-  },
-  scaleIn: {
-    hidden: { opacity: 0, scale: 0.95 },
-    visible: {
-      opacity: 1,
-      scale: 1,
-      transition: { duration: DURATION.short, ease: EASING.emphasis }
-    }
-  },
-  staggerContainer: {
-    hidden: { opacity: 0 },
-    visible: {
-      opacity: 1,
-      transition: {
-        staggerChildren: 0.08,
-        delayChildren: 0.1
-      }
-    }
-  },
-  pulse: {
-    hidden: { scale: 1 },
-    visible: {
-      scale: [1, 1.05, 1],
-      transition: { duration: 1.5, repeat: Infinity, ease: "easeInOut" }
-    }
-  },
-  impact: {
-    hidden: { scale: 1 },
-    trigger: {
-      scale: [1, 0.95, 1.05, 1],
-      transition: { duration: 0.4, ease: "backOut" }
-    }
-  }
-};
-var DISTANCE = {
-  sm: 4,
-  md: 12,
-  lg: 24,
-  xl: 48
-};
-var MOTION = {
-  DURATION,
-  EASING,
-  TRANSITION,
-  VARIANTS,
-  DISTANCE
-};
-
-// src/tokens/colors.ts
-var COLORS = {
-  text: {
-    primary: "var(--text-primary)",
-    secondary: "var(--text-secondary)",
-    tertiary: "var(--text-tertiary)",
-    disabled: "var(--text-disabled)"
-  },
-  glass: {
-    base: "var(--glass-base)",
-    baseHover: "var(--glass-base-hover)",
-    baseActive: "var(--glass-base-active)",
-    backdrop: "var(--glass-backdrop)"
-  },
-  rim: {
-    top: "var(--rim-light-top)",
-    bottom: "var(--rim-light-bottom)"
-  },
-  brand: {
-    pink: "var(--brand-pink)",
-    yellow: "var(--brand-yellow)",
-    pinkGlow: "var(--brand-pink-glow)"
-  },
-  status: {
-    success: "var(--status-success)",
-    warning: "var(--status-warning)",
-    error: "var(--status-error)",
-    info: "var(--status-info)"
-  },
-  button: {
-    primaryBg: "var(--btn-primary-bg)",
-    primaryBgHover: "var(--btn-primary-bg-hover)",
-    secondaryBg: "var(--btn-secondary-bg)",
-    secondaryBgHover: "var(--btn-secondary-bg-hover)"
-  }
-};
-
-// src/tokens/spacing.ts
-var SPACING = {
-  1: "var(--space-1)",
-  2: "var(--space-2)",
-  3: "var(--space-3)",
-  4: "var(--space-4)",
-  5: "var(--space-5)",
-  6: "var(--space-6)",
-  8: "var(--space-8)",
-  10: "var(--space-10)",
-  12: "var(--space-12)",
-  16: "var(--space-16)",
-  20: "var(--space-20)"
-};
-
-// src/tokens/typography.ts
-var FONT_FAMILY = {
-  sans: "var(--font-family)",
-  mono: "var(--font-family-mono)"
-};
-var FONT_SIZE = {
-  xs: "var(--font-size-xs)",
-  sm: "var(--font-size-sm)",
-  base: "var(--font-size-base)",
-  lg: "var(--font-size-lg)",
-  xl: "var(--font-size-xl)",
-  "2xl": "var(--font-size-2xl)",
-  "3xl": "var(--font-size-3xl)"
-};
-var FONT_WEIGHT = {
-  normal: "var(--font-weight-normal)",
-  medium: "var(--font-weight-medium)",
-  semibold: "var(--font-weight-semibold)",
-  bold: "var(--font-weight-bold)"
-};
-var LINE_HEIGHT = {
-  tight: "var(--line-height-tight)",
-  normal: "var(--line-height-normal)",
-  relaxed: "var(--line-height-relaxed)"
-};
-
-// src/tokens/radius.ts
-var RADIUS = {
-  panel: "var(--radius-panel)",
-  card: "var(--radius-card)",
-  button: "var(--radius-button)",
-  badge: "var(--radius-badge)",
-  pill: "var(--radius-pill)"
-};
-
-// src/tokens/shadows.ts
-var SHADOWS = {
-  glass: {
-    outer: "var(--glass-shadow-outer)",
-    inner: "var(--glass-shadow-inner)",
-    combined: "var(--glass-shadow-combined)",
-    elevated: "var(--glass-shadow-elevated)",
-    elevatedCombined: "var(--glass-shadow-elevated-combined)"
-  },
-  interactive: {
-    rest: "var(--shadow-interactive-rest)",
-    restSubtle: "var(--shadow-interactive-rest-subtle)",
-    restLight: "var(--shadow-interactive-rest-light)",
-    hover: "var(--shadow-interactive-hover)",
-    hoverSubtle: "var(--shadow-interactive-hover-subtle)",
-    active: "var(--shadow-interactive-active)"
-  }
-};
-
-// src/tokens/z-index.ts
-var Z_INDEX = {
-  void: "var(--z-void)",
-  glassPanel: "var(--z-glass-panel)",
-  ornament: "var(--z-ornament)",
-  dropdown: "var(--z-dropdown)",
-  modalBackdrop: "var(--z-modal-backdrop)",
-  modal: "var(--z-modal)",
-  tooltip: "var(--z-tooltip)"
-};
-
-// src/tokens/breakpoints.ts
-var BREAKPOINTS = {
-  "3xs": 320,
-  "2xs": 375,
-  xs: 480,
-  sm: 640,
-  md: 768,
-  lg: 1024,
-  xl: 1280,
-  "2xl": 1536,
-  "3xl": 1920,
-  "4xl": 2560,
-  "5xl": 3840
-};
-var MEDIA_QUERIES = {
-  "3xs": `(min-width: ${BREAKPOINTS["3xs"]}px)`,
-  "2xs": `(min-width: ${BREAKPOINTS["2xs"]}px)`,
-  xs: `(min-width: ${BREAKPOINTS.xs}px)`,
-  sm: `(min-width: ${BREAKPOINTS.sm}px)`,
-  md: `(min-width: ${BREAKPOINTS.md}px)`,
-  lg: `(min-width: ${BREAKPOINTS.lg}px)`,
-  xl: `(min-width: ${BREAKPOINTS.xl}px)`,
-  "2xl": `(min-width: ${BREAKPOINTS["2xl"]}px)`,
-  "3xl": `(min-width: ${BREAKPOINTS["3xl"]}px)`,
-  "4xl": `(min-width: ${BREAKPOINTS["4xl"]}px)`,
-  "5xl": `(min-width: ${BREAKPOINTS["5xl"]}px)`
-};
-var STORAGE_KEY = "void-appearance-settings";
-var DEFAULT_SETTINGS = {
-  theme: "dark",
-  brand: "default",
-  navPlacement: "left",
-  density: "comfortable",
-  radius: "playful",
-  customColor: "#f97316"
-  // Default orange as fallback
-};
-function hexToRgb(hex) {
-  const cleanHex = hex.replace(/^#/, "");
-  const r = parseInt(cleanHex.substring(0, 2), 16);
-  const g = parseInt(cleanHex.substring(2, 4), 16);
-  const b = parseInt(cleanHex.substring(4, 6), 16);
-  if (isNaN(r) || isNaN(g) || isNaN(b)) {
-    return "249, 115, 22";
-  }
-  return `${r}, ${g}, ${b}`;
-}
-function generateSecondaryColor(hex) {
-  const cleanHex = hex.replace(/^#/, "");
-  const r = parseInt(cleanHex.substring(0, 2), 16);
-  const g = parseInt(cleanHex.substring(2, 4), 16);
-  const b = parseInt(cleanHex.substring(4, 6), 16);
-  if (isNaN(r) || isNaN(g) || isNaN(b)) {
-    return "255, 208, 0";
-  }
-  const secondary = {
-    r: Math.min(255, g + 50),
-    g: Math.min(255, b + 100),
-    b: Math.min(255, r)
-  };
-  return `${secondary.r}, ${secondary.g}, ${secondary.b}`;
-}
-function loadSettings() {
-  if (typeof window === "undefined") return DEFAULT_SETTINGS;
-  try {
-    const stored = localStorage.getItem(STORAGE_KEY);
-    if (stored) {
-      const parsed = JSON.parse(stored);
-      return {
-        theme: parsed.theme || DEFAULT_SETTINGS.theme,
-        brand: parsed.brand || DEFAULT_SETTINGS.brand,
-        navPlacement: parsed.navPlacement || DEFAULT_SETTINGS.navPlacement,
-        density: parsed.density || DEFAULT_SETTINGS.density,
-        radius: parsed.radius || DEFAULT_SETTINGS.radius,
-        customColor: parsed.customColor || DEFAULT_SETTINGS.customColor
-      };
-    }
-  } catch {
-  }
-  return {
-    ...DEFAULT_SETTINGS,
-    theme: "dark"
-  };
-}
-function saveSettings(settings) {
-  if (typeof window === "undefined") return;
-  try {
-    localStorage.setItem(STORAGE_KEY, JSON.stringify(settings));
-  } catch {
-  }
-}
-function applySettings(settings) {
-  if (typeof document === "undefined") return;
-  const root = document.documentElement;
-  root.setAttribute("data-theme", settings.theme);
-  root.setAttribute("data-brand", settings.brand);
-  root.setAttribute("data-nav", settings.navPlacement);
-  root.setAttribute("data-density", settings.density);
-  root.setAttribute("data-radius", settings.radius);
-  if (settings.brand === "custom") {
-    const primaryRgb = hexToRgb(settings.customColor);
-    const secondaryRgb = generateSecondaryColor(settings.customColor);
-    root.style.setProperty("--custom-accent-rgb", primaryRgb);
-    root.style.setProperty("--custom-accent2-rgb", secondaryRgb);
-  } else {
-    root.style.removeProperty("--custom-accent-rgb");
-    root.style.removeProperty("--custom-accent2-rgb");
-  }
-}
-function prefersReducedMotion() {
-  if (typeof window === "undefined") return false;
-  return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
-}
-var AppearanceContext = createContext(null);
-function AppearanceProvider({
-  initialSettings,
-  disablePersistence = false,
-  children
-}) {
-  const [settings, setSettings] = useState(() => ({
-    ...DEFAULT_SETTINGS,
-    ...initialSettings
-  }));
-  const [hydrated, setHydrated] = useState(false);
-  useEffect(() => {
-    if (!disablePersistence) {
-      const loaded = loadSettings();
-      setSettings({
-        ...loaded,
-        // initialSettings still take priority over localStorage
-        ...initialSettings
-      });
-    }
-    setHydrated(true);
-  }, []);
-  useEffect(() => {
-    applySettings(settings);
-    if (!disablePersistence && hydrated) {
-      saveSettings(settings);
-    }
-  }, [settings, disablePersistence, hydrated]);
-  useEffect(() => {
-    if (typeof window === "undefined") return;
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: light)");
-    const handleChange = (e) => {
-      setSettings((prev) => {
-        if (prev.theme === "light-contrast" || prev.theme === "dark-contrast") {
-          return prev;
-        }
-        return {
-          ...prev,
-          theme: e.matches ? "light" : "dark"
-        };
-      });
-    };
-    mediaQuery.addEventListener("change", handleChange);
-    return () => mediaQuery.removeEventListener("change", handleChange);
-  }, []);
-  useEffect(() => {
-    if (typeof window === "undefined") return;
-    const mediaQuery = window.matchMedia("(prefers-reduced-motion: reduce)");
-    const handleChange = () => {
-      applySettings(settings);
-    };
-    mediaQuery.addEventListener("change", handleChange);
-    return () => mediaQuery.removeEventListener("change", handleChange);
-  }, [settings]);
-  const setTheme = useCallback((theme) => {
-    setSettings((prev) => ({ ...prev, theme }));
-  }, []);
-  const setBrand = useCallback((brand) => {
-    setSettings((prev) => ({ ...prev, brand }));
-  }, []);
-  const setNavPlacement = useCallback((navPlacement) => {
-    setSettings((prev) => ({ ...prev, navPlacement }));
-  }, []);
-  const setDensity = useCallback((density) => {
-    setSettings((prev) => ({ ...prev, density }));
-  }, []);
-  const setRadius = useCallback((radius) => {
-    setSettings((prev) => ({ ...prev, radius }));
-  }, []);
-  const setCustomColor = useCallback((customColor) => {
-    setSettings((prev) => ({ ...prev, customColor, brand: "custom" }));
-  }, []);
-  const setAppearance = useCallback((partial) => {
-    setSettings((prev) => ({ ...prev, ...partial }));
-  }, []);
-  const resetToDefaults = useCallback(() => {
-    setSettings(DEFAULT_SETTINGS);
-  }, []);
-  const contextValue = {
-    ...settings,
-    setTheme,
-    setBrand,
-    setNavPlacement,
-    setDensity,
-    setRadius,
-    setCustomColor,
-    setAppearance,
-    resetToDefaults
-  };
-  return /* @__PURE__ */ jsx(AppearanceContext.Provider, { value: contextValue, children });
-}
-function useAppearance() {
-  const context = useContext(AppearanceContext);
-  if (!context) {
-    throw new Error("useAppearance must be used within an AppearanceProvider");
-  }
-  return context;
-}
-function initializeAppearance(settings) {
-  const loaded = loadSettings();
-  const merged = { ...loaded, ...settings };
-  applySettings(merged);
-}
-var AppearancePanel = React39.forwardRef(
-  ({ className, labels: l }, ref) => {
-    const {
-      theme,
-      brand,
-      navPlacement,
-      density,
-      radius,
-      customColor,
-      setTheme,
-      setBrand,
-      setNavPlacement,
-      setDensity,
-      setRadius,
-      setCustomColor,
-      resetToDefaults
-    } = useAppearance();
-    const colorPickerId = useId();
-    const themeOptions = [
-      { value: "light", label: l?.themeLight ?? "Light" },
-      { value: "light-contrast", label: l?.themeLightContrast ?? "Light (High Contrast)" },
-      { value: "dark", label: l?.themeDark ?? "Dark" },
-      { value: "dark-contrast", label: l?.themeDarkContrast ?? "Dark (High Contrast)" }
-    ];
-    const brandOptions = [
-      { value: "default", label: l?.brandDefault ?? "Default", description: l?.brandDefaultDescription ?? "Warm Intelligence" },
-      { value: "salesmind", label: l?.brandSalesmind ?? "SalesMind", description: l?.brandSalesmindDescription ?? "Pink-red + Gold" },
-      { value: "custom", label: l?.brandCustom ?? "Custom", description: l?.brandCustomDescription ?? "Your color" }
-    ];
-    const navOptions = [
-      { value: "left", label: l?.navLeft ?? "Left Sidebar" },
-      { value: "right", label: l?.navRight ?? "Right Sidebar" },
-      { value: "bottom", label: l?.navBottom ?? "Bottom Tabs" }
-    ];
-    const densityOptions = [
-      { value: "comfortable", label: l?.densityComfortable ?? "Comfortable", description: l?.densityComfortableDescription ?? "Generous spacing" },
-      { value: "compact", label: l?.densityCompact ?? "Compact", description: l?.densityCompactDescription ?? "Higher density" }
-    ];
-    const radiusOptions = [
-      { value: "playful", label: l?.radiusPlayful ?? "Playful", description: l?.radiusPlayfulDescription ?? "Rounded corners" },
-      { value: "sharp", label: l?.radiusSharp ?? "Sharp", description: l?.radiusSharpDescription ?? "Technical feel" }
-    ];
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx28("ds-appearance-panel", className), children: [
-      /* @__PURE__ */ jsx("h3", { className: "ds-appearance-panel__title", children: l?.title ?? "Appearance Settings" }),
-      /* @__PURE__ */ jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
-        /* @__PURE__ */ jsx("legend", { className: "ds-appearance-panel__legend", children: l?.themeHeading ?? "Theme" }),
-        /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options", children: themeOptions.map((option) => /* @__PURE__ */ jsxs(
-          "label",
-          {
-            className: clsx28(
-              "ds-appearance-panel__option",
-              theme === option.value && "ds-appearance-panel__option--active"
-            ),
-            children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "radio",
-                  name: "theme",
-                  value: option.value,
-                  checked: theme === option.value,
-                  onChange: () => setTheme(option.value),
-                  className: "ds-appearance-panel__radio"
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-label", children: option.label })
-            ]
-          },
-          option.value
-        )) })
-      ] }),
-      /* @__PURE__ */ jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
-        /* @__PURE__ */ jsx("legend", { className: "ds-appearance-panel__legend", children: l?.brandHeading ?? "Brand" }),
-        /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options", children: brandOptions.map((option) => /* @__PURE__ */ jsxs(
-          "label",
-          {
-            className: clsx28(
-              "ds-appearance-panel__option",
-              brand === option.value && "ds-appearance-panel__option--active"
-            ),
-            children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "radio",
-                  name: "brand",
-                  value: option.value,
-                  checked: brand === option.value,
-                  onChange: () => setBrand(option.value),
-                  className: "ds-appearance-panel__radio"
-                }
-              ),
-              /* @__PURE__ */ jsxs("span", { className: "ds-appearance-panel__option-content", children: [
-                /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-label", children: option.label }),
-                /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-description", children: option.description })
-              ] })
-            ]
-          },
-          option.value
-        )) }),
-        brand === "custom" && /* @__PURE__ */ jsxs("div", { className: "ds-appearance-panel__color-picker", children: [
-          /* @__PURE__ */ jsx("label", { htmlFor: colorPickerId, className: "ds-appearance-panel__color-label", children: l?.accentColorLabel ?? "Accent Color" }),
-          /* @__PURE__ */ jsxs("div", { className: "ds-appearance-panel__color-input-wrapper", children: [
-            /* @__PURE__ */ jsx(
-              "input",
-              {
-                type: "color",
-                id: colorPickerId,
-                value: customColor,
-                onChange: (e) => setCustomColor(e.target.value),
-                className: "ds-appearance-panel__color-input"
-              }
-            ),
-            /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__color-value", children: customColor.toUpperCase() })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
-        /* @__PURE__ */ jsx("legend", { className: "ds-appearance-panel__legend", children: l?.densityHeading ?? "Density" }),
-        /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: densityOptions.map((option) => /* @__PURE__ */ jsxs(
-          "label",
-          {
-            className: clsx28(
-              "ds-appearance-panel__option",
-              "ds-appearance-panel__option--toggle",
-              density === option.value && "ds-appearance-panel__option--active"
-            ),
-            children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "radio",
-                  name: "density",
-                  value: option.value,
-                  checked: density === option.value,
-                  onChange: () => setDensity(option.value),
-                  className: "ds-appearance-panel__radio"
-                }
-              ),
-              /* @__PURE__ */ jsxs("span", { className: "ds-appearance-panel__option-content", children: [
-                /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-label", children: option.label }),
-                /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-description", children: option.description })
-              ] })
-            ]
-          },
-          option.value
-        )) })
-      ] }),
-      /* @__PURE__ */ jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
-        /* @__PURE__ */ jsx("legend", { className: "ds-appearance-panel__legend", children: l?.geometryHeading ?? "Geometry" }),
-        /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: radiusOptions.map((option) => /* @__PURE__ */ jsxs(
-          "label",
-          {
-            className: clsx28(
-              "ds-appearance-panel__option",
-              "ds-appearance-panel__option--toggle",
-              radius === option.value && "ds-appearance-panel__option--active"
-            ),
-            children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "radio",
-                  name: "radius",
-                  value: option.value,
-                  checked: radius === option.value,
-                  onChange: () => setRadius(option.value),
-                  className: "ds-appearance-panel__radio"
-                }
-              ),
-              /* @__PURE__ */ jsxs("span", { className: "ds-appearance-panel__option-content", children: [
-                /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-label", children: option.label }),
-                /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-description", children: option.description })
-              ] })
-            ]
-          },
-          option.value
-        )) })
-      ] }),
-      /* @__PURE__ */ jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
-        /* @__PURE__ */ jsx("legend", { className: "ds-appearance-panel__legend", children: l?.navHeading ?? "Navigation Layout" }),
-        /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options", children: navOptions.map((option) => /* @__PURE__ */ jsxs(
-          "label",
-          {
-            className: clsx28(
-              "ds-appearance-panel__option",
-              navPlacement === option.value && "ds-appearance-panel__option--active"
-            ),
-            children: [
-              /* @__PURE__ */ jsx(
-                "input",
-                {
-                  type: "radio",
-                  name: "nav",
-                  value: option.value,
-                  checked: navPlacement === option.value,
-                  onChange: () => setNavPlacement(option.value),
-                  className: "ds-appearance-panel__radio"
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "ds-appearance-panel__option-label", children: option.label })
-            ]
-          },
-          option.value
-        )) })
-      ] }),
-      /* @__PURE__ */ jsx("button", { type: "button", onClick: resetToDefaults, className: "ds-appearance-panel__reset", children: l?.resetLabel ?? "Reset to Defaults" })
-    ] });
-  }
-);
-AppearancePanel.displayName = "AppearancePanel";
-var Button = React39.forwardRef(
-  ({ className, variant = "primary", size = "md", asChild = false, isLoading = false, children, disabled, ...props }, ref) => {
-    const buttonClass = clsx28(
-      "ds-button",
-      `ds-button--${variant}`,
-      size === "icon" ? "ds-button--icon ds-button--md" : `ds-button--${size}`,
-      isLoading && "ds-button--loading",
-      className
-    );
-    if (asChild) {
-      return /* @__PURE__ */ jsx(
-        Slot,
-        {
-          ref,
-          "aria-disabled": isLoading || disabled || void 0,
-          className: buttonClass,
-          ...props,
-          children
-        }
-      );
-    }
-    return /* @__PURE__ */ jsxs(
-      "button",
-      {
-        ref,
-        disabled: isLoading || disabled,
-        className: buttonClass,
-        ...props,
-        children: [
-          isLoading && /* @__PURE__ */ jsx(
-            "svg",
-            {
-              className: "ds-button__spinner",
-              xmlns: "http://www.w3.org/2000/svg",
-              width: "1em",
-              height: "1em",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round",
-              children: /* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
-            }
-          ),
-          /* @__PURE__ */ jsx("span", { className: clsx28("ds-button__content", isLoading && "ds-button__content--hidden"), children })
-        ]
-      }
-    );
-  }
-);
-Button.displayName = "Button";
-var ButtonGroup = React39.forwardRef(
-  ({ orientation = "horizontal", fullWidth = false, size = "md", className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "group",
-        className: clsx28(
-          "ds-button-group",
-          `ds-button-group--${orientation}`,
-          fullWidth && "ds-button-group--full-width",
-          className
-        ),
-        "data-size": size,
-        ...props,
-        children
-      }
-    );
-  }
-);
-ButtonGroup.displayName = "ButtonGroup";
-var TextField = React39.forwardRef(
-  ({ className, label, error, helperText, endAdornment, id, ...props }, ref) => {
-    const generatedId = React39.useId();
-    const inputId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx28("ds-textfield", className), children: [
-      label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "ds-textfield__label", children: label }),
-      /* @__PURE__ */ jsxs("div", { className: "ds-textfield__input-wrapper", children: [
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            id: inputId,
-            ref,
-            className: clsx28(
-              "ds-textfield__input",
-              error && "ds-textfield__input--error",
-              endAdornment && "ds-textfield__input--adorned"
-            ),
-            ...props
-          }
-        ),
-        endAdornment && /* @__PURE__ */ jsx("div", { className: "ds-textfield__adornment", children: endAdornment })
-      ] }),
-      helperText && /* @__PURE__ */ jsx("span", { className: clsx28("ds-textfield__helper", error && "ds-textfield__helper--error"), children: helperText })
-    ] });
-  }
-);
-TextField.displayName = "TextField";
-var TextArea = forwardRef(
-  ({ className, label, error, helperText, id, ...props }, ref) => {
-    const generatedId = useId();
-    const inputId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx28("ds-textarea", className), children: [
-      label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "ds-textarea__label", children: label }),
-      /* @__PURE__ */ jsx("div", { className: "ds-textarea__input-wrapper", children: /* @__PURE__ */ jsx(
-        "textarea",
-        {
-          id: inputId,
-          ref,
-          className: clsx28("ds-textarea__input", error && "ds-textarea__input--error"),
-          ...props
-        }
-      ) }),
-      helperText && /* @__PURE__ */ jsx("span", { className: clsx28("ds-textarea__helper", error && "ds-textarea__helper--error"), children: helperText })
-    ] });
-  }
-);
-TextArea.displayName = "TextArea";
-var Checkbox = React39.forwardRef(
-  ({ className, label, id, ...props }, ref) => {
-    const generatedId = React39.useId();
-    const checkboxId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx28("ds-checkbox-wrapper", className), children: [
-      /* @__PURE__ */ jsx(Checkbox$1.Root, { id: checkboxId, ref, className: "ds-checkbox", ...props, children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: "ds-checkbox__indicator", children: /* @__PURE__ */ jsx(
-        "svg",
-        {
-          viewBox: "0 0 14 14",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          className: "ds-checkbox__icon",
-          children: /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: "M11.6666 3.5L5.24992 9.91667L2.33325 7",
-              stroke: "currentColor",
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        }
-      ) }) }),
-      label && /* @__PURE__ */ jsx("label", { htmlFor: checkboxId, className: "ds-checkbox__label", children: label })
-    ] });
-  }
-);
-Checkbox.displayName = "Checkbox";
-var RadioGroupContext = createContext(null);
-var RadioGroup = forwardRef(
-  ({
-    className,
-    name,
-    value,
-    onValueChange,
-    orientation = "vertical",
-    children,
-    ...props
-  }, ref) => {
-    const generatedName = useId();
-    const groupName = name || generatedName;
-    return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: { name: groupName, value, onChange: onValueChange }, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "radiogroup",
-        className: clsx28(
-          "ds-radio-group",
-          orientation === "horizontal" && "ds-radio-group--horizontal",
-          className
-        ),
-        ...props,
-        children
-      }
-    ) });
-  }
-);
-RadioGroup.displayName = "RadioGroup";
-var Radio = forwardRef(
-  ({ className, label, value, disabled, id, onChange, ...props }, ref) => {
-    const context = useContext(RadioGroupContext);
-    const generatedId = useId();
-    const radioId = id || generatedId;
-    const name = context?.name || props.name;
-    const isChecked = context?.value !== void 0 ? context.value === value : props.checked;
-    const handleChange = (e) => {
-      onChange?.(e);
-      context?.onChange?.(value);
-    };
-    return /* @__PURE__ */ jsxs(
-      "label",
-      {
-        className: clsx28("ds-radio-wrapper", disabled && "ds-radio-wrapper--disabled", className),
-        children: [
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              ref,
-              type: "radio",
-              className: "ds-radio-input",
-              id: radioId,
-              name,
-              value,
-              checked: isChecked,
-              onChange: handleChange,
-              disabled,
-              ...props
-            }
-          ),
-          /* @__PURE__ */ jsx("div", { className: clsx28("ds-radio", isChecked && "ds-radio--checked"), children: /* @__PURE__ */ jsx("div", { className: "ds-radio__indicator" }) }),
-          label && /* @__PURE__ */ jsx("span", { className: "ds-radio__label", children: label })
-        ]
-      }
-    );
-  }
-);
-Radio.displayName = "Radio";
-var Switch = React39.forwardRef(
-  ({ className, label, id, ...props }, ref) => {
-    const generatedId = React39.useId();
-    const switchId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx28("ds-switch-wrapper", className), children: [
-      /* @__PURE__ */ jsx(Switch$1.Root, { id: switchId, ref, className: "ds-switch", ...props, children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "ds-switch__thumb" }) }),
-      label && /* @__PURE__ */ 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__ */ jsx(
-    Select$1.Root,
-    {
-      value,
-      defaultValue,
-      onValueChange: onValueChange ? (val) => onValueChange(val) : void 0,
-      disabled,
-      required,
-      name,
-      items,
-      children
-    }
-  );
-}
-Select.displayName = "Select";
-var SelectTrigger = React39.forwardRef(
-  ({ className, placeholder = "Select...", size = "md", ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { className: "ds-select__trigger-wrapper", children: /* @__PURE__ */ jsxs(
-      Select$1.Trigger,
-      {
-        ref,
-        className: clsx28("ds-select__trigger", `ds-select__trigger--${size}`, className),
-        "aria-label": props["aria-label"] || (typeof placeholder === "string" ? placeholder : "Select"),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx(Select$1.Value, { className: "ds-select__value", placeholder }),
-          /* @__PURE__ */ jsx(Select$1.Icon, { className: "ds-select__icon", "aria-hidden": true, children: /* @__PURE__ */ jsx(ChevronDownIcon, {}) })
-        ]
-      }
-    ) });
-  }
-);
-SelectTrigger.displayName = "SelectTrigger";
-var SelectContent = React39.forwardRef(
-  ({ className, side = "bottom", sideOffset = 4, align = "start", children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Select$1.Portal, { children: /* @__PURE__ */ jsx(
-      Select$1.Positioner,
-      {
-        side,
-        sideOffset,
-        align,
-        alignItemWithTrigger: false,
-        children: /* @__PURE__ */ jsx(Select$1.Popup, { ref, className: clsx28("ds-select__content", className), ...props, children: /* @__PURE__ */ jsx(Select$1.List, { className: "ds-select__list", children }) })
-      }
-    ) });
-  }
-);
-SelectContent.displayName = "SelectContent";
-var SelectItem = React39.forwardRef(
-  ({ className, value, children, disabled, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs(
-      Select$1.Item,
-      {
-        ref,
-        value,
-        disabled,
-        className: clsx28("ds-select__item", className),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx(Select$1.ItemIndicator, { className: "ds-select__item-indicator", children: /* @__PURE__ */ jsx(CheckIcon, {}) }),
-          /* @__PURE__ */ jsx(Select$1.ItemText, { children })
-        ]
-      }
-    );
-  }
-);
-SelectItem.displayName = "SelectItem";
-var SelectGroup = React39.forwardRef(
-  ({ className, label, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs(Select$1.Group, { ref, className: clsx28("ds-select__group", className), ...props, children: [
-      label && /* @__PURE__ */ jsx(Select$1.GroupLabel, { className: "ds-select__group-label", children: label }),
-      children
-    ] });
-  }
-);
-SelectGroup.displayName = "SelectGroup";
-var SelectSeparator = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-select__separator", className), ...props });
-});
-SelectSeparator.displayName = "SelectSeparator";
-function ChevronDownIcon() {
-  return /* @__PURE__ */ 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__ */ jsx("path", { d: "m6 9 6 6 6-6" })
-    }
-  );
-}
-function CheckIcon() {
-  return /* @__PURE__ */ 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__ */ jsx("polyline", { points: "20 6 9 17 4 12" })
-    }
-  );
-}
-var Dialog = Dialog$1.Root;
-var DialogTrigger = Dialog$1.Trigger;
-var DialogClose = Dialog$1.Close;
-var DialogTitle = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Dialog$1.Title, { ref, className: clsx28("ds-dialog__title", className), ...props }));
-DialogTitle.displayName = "DialogTitle";
-var DialogDescription = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  Dialog$1.Description,
-  {
-    ref,
-    className: clsx28("ds-dialog__description", className),
-    ...props
-  }
-));
-DialogDescription.displayName = "DialogDescription";
-var DialogContent = React39.forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(Dialog$1.Portal, { children: [
-    /* @__PURE__ */ jsx(Dialog$1.Backdrop, { className: "ds-dialog__backdrop" }),
-    /* @__PURE__ */ jsx(Dialog$1.Popup, { ref, className: clsx28("ds-dialog__content", className), ...props, children })
-  ] })
-);
-DialogContent.displayName = "DialogContent";
-var DialogHeader = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-dialog__header", className), ...props })
-);
-DialogHeader.displayName = "DialogHeader";
-var DialogFooter = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-dialog__footer", className), ...props })
-);
-DialogFooter.displayName = "DialogFooter";
-var TooltipProvider = Tooltip$1.Provider;
-var TooltipRoot = Tooltip$1.Root;
-var TooltipTrigger = Tooltip$1.Trigger;
-var TooltipContent = React39.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { sideOffset: 5, children: /* @__PURE__ */ jsxs(Tooltip$1.Popup, { ref, className: clsx28("ds-tooltip__content", className), ...props, children: [
-  children,
-  /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "ds-tooltip__arrow" })
-] }) }) }));
-TooltipContent.displayName = "TooltipContent";
-var Tooltip = ({ content, children, delay = 200 }) => {
-  return /* @__PURE__ */ jsx(Tooltip$1.Provider, { delay, children: /* @__PURE__ */ jsxs(Tooltip$1.Root, { children: [
-    /* @__PURE__ */ jsx(Tooltip$1.Trigger, { render: children }),
-    /* @__PURE__ */ jsx(TooltipContent, { children: content })
-  ] }) });
-};
-var Badge = React39.forwardRef(
-  ({ className, variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        ref,
-        className: clsx28("ds-badge", `ds-badge--${variant}`, className),
-        ...props
-      }
-    );
-  }
-);
-Badge.displayName = "Badge";
-var StatusBadge = React39.forwardRef(
-  ({ variant = "default", size = "md", dot = false, className, children }, ref) => {
-    return /* @__PURE__ */ jsxs(
-      "span",
-      {
-        ref,
-        className: clsx28(
-          "ds-status-badge",
-          `ds-status-badge--${variant}`,
-          `ds-status-badge--${size}`,
-          dot && "ds-status-badge--dot",
-          className
-        ),
-        children: [
-          dot && /* @__PURE__ */ jsx("span", { className: "ds-status-badge__dot" }),
-          children
-        ]
-      }
-    );
-  }
-);
-StatusBadge.displayName = "StatusBadge";
-var DefaultIcons = {
-  info: /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
-        /* @__PURE__ */ jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
-      ]
-    }
-  ),
-  success: /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
-        /* @__PURE__ */ jsx("polyline", { points: "22 4 12 14.01 9 11.01" })
-      ]
-    }
-  ),
-  warning: /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
-        /* @__PURE__ */ jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
-        /* @__PURE__ */ jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
-      ]
-    }
-  ),
-  error: /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "20",
-      height: "20",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      children: [
-        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
-        /* @__PURE__ */ jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
-        /* @__PURE__ */ jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
-      ]
-    }
-  )
-};
-var Alert = React39.forwardRef(
-  ({ className, variant = "info", title, icon, children, ...props }, ref) => {
-    const renderedIcon = icon || DefaultIcons[variant];
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        role: "alert",
-        className: clsx28("ds-alert", `ds-alert--${variant}`, className),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "ds-alert__icon", "aria-hidden": "true", children: renderedIcon }),
-          /* @__PURE__ */ jsxs("div", { className: "ds-alert__content", children: [
-            title && /* @__PURE__ */ jsx("div", { className: "ds-alert__title", children: title }),
-            children && /* @__PURE__ */ jsx("div", { className: "ds-alert__description", children })
-          ] })
-        ]
-      }
-    );
-  }
-);
-Alert.displayName = "Alert";
-var ToastContext = createContext(void 0);
-var useToast = () => {
-  const context = useContext(ToastContext);
-  if (!context) {
-    throw new Error("useToast must be used within a ToastProvider");
-  }
-  return context;
-};
-var ToastItem = ({
-  title,
-  description,
-  variant = "info",
-  action,
-  onDismiss,
-  dismissLabel = "Close"
-}) => {
-  return /* @__PURE__ */ jsxs("div", { className: clsx28("ds-toast-root", `ds-toast--${variant}`), "data-state": "open", role: "alert", children: [
-    title && /* @__PURE__ */ jsx("div", { className: "ds-toast-title", children: title }),
-    description && /* @__PURE__ */ jsx("div", { className: "ds-toast-description", children: description }),
-    action && /* @__PURE__ */ jsx("div", { className: "ds-toast-action", children: action }),
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        onClick: onDismiss,
-        style: {
-          background: "transparent",
-          border: "none",
-          color: "var(--text-tertiary)",
-          cursor: "pointer",
-          padding: "4px",
-          marginLeft: "auto",
-          gridColumn: "action",
-          alignSelf: "start"
-        },
-        "aria-label": dismissLabel,
-        children: /* @__PURE__ */ jsxs(
-          "svg",
-          {
-            width: "14",
-            height: "14",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            children: [
-              /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-              /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-            ]
-          }
-        )
-      }
-    )
-  ] });
-};
-var ToastProvider = ({ children }) => {
-  const [toasts, setToasts] = useState([]);
-  const [mounted, setMounted] = useState(false);
-  const idCounter = useRef(0);
-  useEffect(() => setMounted(true), []);
-  const removeToast = useCallback((id) => {
-    setToasts((prev) => prev.filter((t) => t.id !== id));
-  }, []);
-  const addToast = useCallback(
-    ({ duration = 5e3, ...props }) => {
-      const id = `toast-${++idCounter.current}`;
-      const newToast = { ...props, id, duration };
-      setToasts((prev) => [...prev, newToast]);
-      if (duration !== Infinity) {
-        setTimeout(() => {
-          removeToast(id);
-        }, duration);
-      }
-    },
-    [removeToast]
-  );
-  return /* @__PURE__ */ jsxs(ToastContext.Provider, { value: { addToast, removeToast }, children: [
-    children,
-    mounted && createPortal(
-      /* @__PURE__ */ jsx("div", { className: "ds-toast-viewport", children: toasts.map((toast) => /* @__PURE__ */ jsx(ToastItem, { ...toast, onDismiss: () => removeToast(toast.id) }, toast.id)) }),
-      document.body
-    )
-  ] });
-};
-var DropdownMenu = Menu.Root;
-var DropdownMenuTrigger = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    Menu.Trigger,
-    {
-      ref,
-      className: clsx28("ds-dropdown-menu__trigger", className),
-      ...props
-    }
-  );
-});
-DropdownMenuTrigger.displayName = "DropdownMenuTrigger";
-var DropdownMenuContent = React39.forwardRef(
-  ({ className, side = "bottom", align = "start", sideOffset = 4, alignOffset = 0, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(
-      Menu.Positioner,
-      {
-        side,
-        align,
-        sideOffset,
-        alignOffset,
-        children: /* @__PURE__ */ jsx(
-          Menu.Popup,
-          {
-            ref,
-            className: clsx28("ds-dropdown-menu__content", className),
-            ...props
-          }
-        )
-      }
-    ) });
-  }
-);
-DropdownMenuContent.displayName = "DropdownMenuContent";
-var DropdownMenuItem = React39.forwardRef(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Menu.Item, { ref, className: clsx28("ds-dropdown-menu__item", className), ...props });
-  }
-);
-DropdownMenuItem.displayName = "DropdownMenuItem";
-var DropdownMenuSeparator = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-dropdown-menu__separator", className), ...props });
-});
-DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
-var DropdownMenuLabel = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-dropdown-menu__label", className), ...props });
-});
-DropdownMenuLabel.displayName = "DropdownMenuLabel";
-var EmptyState = React39.forwardRef(
-  ({ icon, title, description, action, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx28("ds-empty-state", className), ...props, children: [
-      icon && /* @__PURE__ */ jsx("div", { className: "ds-empty-state__icon", children: icon }),
-      /* @__PURE__ */ jsx("h3", { className: "ds-empty-state__title", children: title }),
-      description && /* @__PURE__ */ jsx("p", { className: "ds-empty-state__description", children: description }),
-      action && /* @__PURE__ */ jsx("div", { className: "ds-empty-state__action", children: action })
-    ] });
-  }
-);
-EmptyState.displayName = "EmptyState";
-var Card = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-card", className), ...props })
-);
-Card.displayName = "Card";
-var CardHeader = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-card__header", className), ...props })
-);
-CardHeader.displayName = "CardHeader";
-var CardTitle = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h3", { ref, className: clsx28("ds-card__title", className), ...props }));
-CardTitle.displayName = "CardTitle";
-var CardDescription = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx28("ds-card__description", className), ...props }));
-CardDescription.displayName = "CardDescription";
-var CardContent = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-card__content", className), ...props })
-);
-CardContent.displayName = "CardContent";
-var CardFooter = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-card__footer", className), ...props })
-);
-CardFooter.displayName = "CardFooter";
-var AccordionContext = React39.createContext(null);
-function useAccordionContext() {
-  const ctx = React39.useContext(AccordionContext);
-  if (!ctx) {
-    throw new Error("Accordion compound components must be used within <Accordion>");
-  }
-  return ctx;
-}
-var AccordionItemContext = React39.createContext(null);
-function useAccordionItemContext() {
-  const ctx = React39.useContext(AccordionItemContext);
-  if (!ctx) {
-    throw new Error("AccordionTrigger/AccordionContent must be used within <AccordionItem>");
-  }
-  return ctx;
-}
-var Accordion = React39.forwardRef(
-  ({ className, type = "single", defaultValue = [], collapsible: _collapsible, children, ...props }, ref) => {
-    const [openItems, setOpenItems] = React39.useState(
-      () => new Set(defaultValue)
-    );
-    const toggle = React39.useCallback(
-      (value) => {
-        setOpenItems((prev) => {
-          const next = new Set(prev);
-          if (next.has(value)) {
-            next.delete(value);
-          } else {
-            if (type === "single") {
-              next.clear();
-            }
-            next.add(value);
-          }
-          return next;
-        });
-      },
-      [type]
-    );
-    const contextValue = React39.useMemo(
-      () => ({ openItems, toggle }),
-      [openItems, toggle]
-    );
-    return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-accordion", className), ...props, children }) });
-  }
-);
-Accordion.displayName = "Accordion";
-var AccordionItem = React39.forwardRef(
-  ({ className, value, children, ...props }, ref) => {
-    const { openItems } = useAccordionContext();
-    const isOpen = openItems.has(value);
-    const contextValue = React39.useMemo(
-      () => ({ value, isOpen }),
-      [value, isOpen]
-    );
-    return /* @__PURE__ */ jsx(AccordionItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-accordion__item", className),
-        "data-state": isOpen ? "open" : "closed",
-        ...props,
-        children
-      }
-    ) });
-  }
-);
-AccordionItem.displayName = "AccordionItem";
-var AccordionTrigger = React39.forwardRef(({ className, children, ...props }, ref) => {
-  const { toggle } = useAccordionContext();
-  const { value, isOpen } = useAccordionItemContext();
-  return /* @__PURE__ */ jsxs(
-    "button",
-    {
-      ref,
-      type: "button",
-      className: clsx28("ds-accordion__trigger", className),
-      "aria-expanded": isOpen,
-      onClick: () => toggle(value),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx("span", { className: "ds-accordion__trigger-text", children }),
-        /* @__PURE__ */ jsx(
-          "svg",
-          {
-            className: "ds-accordion__chevron",
-            width: "16",
-            height: "16",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth: "2",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            "aria-hidden": "true",
-            children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
-          }
-        )
-      ]
-    }
-  );
-});
-AccordionTrigger.displayName = "AccordionTrigger";
-var AccordionContent = React39.forwardRef(({ className, children, ...props }, ref) => {
-  const { isOpen } = useAccordionItemContext();
-  const contentRef = React39.useRef(null);
-  const [height, setHeight] = React39.useState(
-    isOpen ? void 0 : 0
-  );
-  React39.useEffect(() => {
-    const el = contentRef.current;
-    if (!el) return;
-    if (isOpen) {
-      const scrollHeight = el.scrollHeight;
-      setHeight(scrollHeight);
-      const timer = setTimeout(() => setHeight(void 0), 200);
-      return () => clearTimeout(timer);
-    } else {
-      const scrollHeight = el.scrollHeight;
-      setHeight(scrollHeight);
-      requestAnimationFrame(() => {
-        requestAnimationFrame(() => {
-          setHeight(0);
-        });
-      });
-    }
-  }, [isOpen]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: contentRef,
-      className: clsx28("ds-accordion__content", className),
-      style: {
-        height: height !== void 0 ? `${height}px` : "auto"
-      },
-      hidden: !isOpen && height === 0,
-      ...props,
-      children: /* @__PURE__ */ jsx("div", { ref, className: "ds-accordion__content-inner", children })
-    }
-  );
-});
-AccordionContent.displayName = "AccordionContent";
-var Label = React39.forwardRef(
-  ({ className, disabled, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "label",
-      {
-        ref,
-        className: clsx28("ds-label", disabled && "ds-label--disabled", className),
-        "data-disabled": disabled || void 0,
-        ...props
-      }
-    );
-  }
-);
-Label.displayName = "Label";
-var Skeleton = React39.forwardRef(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-skeleton", className),
-        ...props
-      }
-    );
-  }
-);
-Skeleton.displayName = "Skeleton";
-var Separator = React39.forwardRef(
-  ({ className, orientation = "horizontal", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "separator",
-        "aria-orientation": orientation,
-        className: clsx28(
-          "ds-separator",
-          `ds-separator--${orientation}`,
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-Separator.displayName = "Separator";
-var SheetContext = React39.createContext(void 0);
-function useSheetContext() {
-  const ctx = React39.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] = React39.useState(false);
-  const isControlled = controlledOpen !== void 0;
-  const open = isControlled ? controlledOpen : uncontrolledOpen;
-  const handleOpenChange = React39.useCallback(
-    (next) => {
-      if (!isControlled) {
-        setUncontrolledOpen(next);
-      }
-      onOpenChange?.(next);
-    },
-    [isControlled, onOpenChange]
-  );
-  return /* @__PURE__ */ jsx(SheetContext.Provider, { value: { open, onOpenChange: handleOpenChange }, children });
-};
-Sheet.displayName = "Sheet";
-var SheetTrigger = React39.forwardRef(
-  ({ onClick, asChild = false, ...props }, ref) => {
-    const { onOpenChange } = useSheetContext();
-    const handleClick = (e) => {
-      onOpenChange(true);
-      onClick?.(e);
-    };
-    const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsx(Comp, { ref, type: "button", onClick: handleClick, ...props });
-  }
-);
-SheetTrigger.displayName = "SheetTrigger";
-var SheetClose = React39.forwardRef(
-  ({ onClick, asChild = false, ...props }, ref) => {
-    const { onOpenChange } = useSheetContext();
-    const handleClick = (e) => {
-      onOpenChange(false);
-      onClick?.(e);
-    };
-    const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsx(Comp, { ref, type: "button", onClick: handleClick, ...props });
-  }
-);
-SheetClose.displayName = "SheetClose";
-var SheetContent = React39.forwardRef(
-  ({ side = "right", className, children, ...props }, ref) => {
-    const { open, onOpenChange } = useSheetContext();
-    if (!open) return null;
-    return createPortal(
-      /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "ds-sheet__backdrop",
-            onClick: () => onOpenChange(false),
-            "aria-hidden": "true"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            ref,
-            role: "dialog",
-            className: clsx28("ds-sheet__content", `ds-sheet__content--${side}`, className),
-            ...props,
-            children
-          }
-        )
-      ] }),
-      document.body
-    );
-  }
-);
-SheetContent.displayName = "SheetContent";
-var SheetHeader = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-sheet__header", className), ...props })
-);
-SheetHeader.displayName = "SheetHeader";
-var SheetTitle = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx28("ds-sheet__title", className), ...props }));
-SheetTitle.displayName = "SheetTitle";
-var SheetDescription = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx28("ds-sheet__description", className), ...props }));
-SheetDescription.displayName = "SheetDescription";
-var SheetFooter = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-sheet__footer", className), ...props })
-);
-SheetFooter.displayName = "SheetFooter";
-var AvatarContext = React39.createContext({
-  hasImage: false,
-  imageError: false,
-  onImageError: () => {
-  }
-});
-var Avatar = React39.forwardRef(
-  ({ size = "md", className, children, ...props }, ref) => {
-    const [imageError, setImageError] = React39.useState(false);
-    const [hasImage, setHasImage] = React39.useState(false);
-    React39.useEffect(() => {
-      let found = false;
-      React39.Children.forEach(children, (child) => {
-        if (React39.isValidElement(child) && child.type === AvatarImage) {
-          found = true;
-        }
-      });
-      setHasImage(found);
-    }, [children]);
-    const onImageError = React39.useCallback(() => {
-      setImageError(true);
-    }, []);
-    return /* @__PURE__ */ jsx(AvatarContext.Provider, { value: { hasImage, imageError, onImageError }, children: /* @__PURE__ */ jsx(
-      "span",
-      {
-        ref,
-        className: clsx28("ds-avatar", `ds-avatar--${size}`, className),
-        ...props,
-        children
-      }
-    ) });
-  }
-);
-Avatar.displayName = "Avatar";
-var AvatarImage = React39.forwardRef(({ className, onError, ...props }, ref) => {
-  const { imageError, onImageError } = React39.useContext(AvatarContext);
-  const handleError = (e) => {
-    onImageError();
-    onError?.(e);
-  };
-  if (imageError) return null;
-  return /* @__PURE__ */ jsx(
-    "img",
-    {
-      ref,
-      className: clsx28("ds-avatar__image", className),
-      onError: handleError,
-      ...props
-    }
-  );
-});
-AvatarImage.displayName = "AvatarImage";
-var AvatarFallback = React39.forwardRef(({ className, ...props }, ref) => {
-  const { hasImage, imageError } = React39.useContext(AvatarContext);
-  if (hasImage && !imageError) return null;
-  return /* @__PURE__ */ jsx("span", { ref, className: clsx28("ds-avatar__fallback", className), ...props });
-});
-AvatarFallback.displayName = "AvatarFallback";
-var PopoverContext = React39.createContext(null);
-function usePopoverContext() {
-  const context = React39.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] = React39.useState(false);
-  const isControlled = controlledOpen !== void 0;
-  const open = isControlled ? controlledOpen : uncontrolledOpen;
-  const setOpen = React39.useCallback(
-    (value) => {
-      if (!isControlled) {
-        setUncontrolledOpen(value);
-      }
-      onOpenChange?.(value);
-    },
-    [isControlled, onOpenChange]
-  );
-  const toggle = React39.useCallback(() => {
-    setOpen(!open);
-  }, [open, setOpen]);
-  const contextValue = React39.useMemo(
-    () => ({ open, setOpen, toggle }),
-    [open, setOpen, toggle]
-  );
-  return /* @__PURE__ */ jsx(PopoverContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: "ds-popover", children }) });
-};
-Popover.displayName = "Popover";
-var PopoverTrigger = React39.forwardRef(
-  ({ className, onClick, asChild = false, ...props }, ref) => {
-    const { toggle } = usePopoverContext();
-    const handleClick = (e) => {
-      toggle();
-      onClick?.(e);
-    };
-    const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsx(
-      Comp,
-      {
-        ref,
-        type: "button",
-        className: clsx28("ds-popover__trigger", className),
-        onClick: handleClick,
-        ...props
-      }
-    );
-  }
-);
-PopoverTrigger.displayName = "PopoverTrigger";
-var PopoverContent = React39.forwardRef(
-  ({ className, side = "bottom", align = "center", ...props }, ref) => {
-    const { open } = usePopoverContext();
-    if (!open) return null;
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28(
-          "ds-popover__content",
-          `ds-popover__content--${side}`,
-          `ds-popover__content--align-${align}`,
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-PopoverContent.displayName = "PopoverContent";
-var PopoverClose = React39.forwardRef(({ className, onClick, ...props }, ref) => {
-  const { setOpen } = usePopoverContext();
-  const handleClick = (e) => {
-    setOpen(false);
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref,
-      type: "button",
-      className: clsx28("ds-popover__close", className),
-      onClick: handleClick,
-      ...props
-    }
-  );
-});
-PopoverClose.displayName = "PopoverClose";
-var Progress = React39.forwardRef(
-  ({ className, value = 0, max = 100, ...props }, ref) => {
-    const percentage = max > 0 ? Math.min(100, Math.max(0, value / max * 100)) : 0;
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "progressbar",
-        "aria-valuenow": value,
-        "aria-valuemin": 0,
-        "aria-valuemax": max,
-        className: clsx28("ds-progress", className),
-        ...props,
-        children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "ds-progress__indicator",
-            style: { width: `${percentage}%` }
-          }
-        )
-      }
-    );
-  }
-);
-Progress.displayName = "Progress";
-var ScrollArea = React39.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-scroll-area", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "ds-scroll-area__viewport", children }) });
-  }
-);
-ScrollArea.displayName = "ScrollArea";
-var ScrollBar = React39.forwardRef(
-  ({ className, orientation = "vertical", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28(
-          "ds-scroll-area__scrollbar",
-          `ds-scroll-area__scrollbar--${orientation}`,
-          className
-        ),
-        ...props
-      }
-    );
-  }
-);
-ScrollBar.displayName = "ScrollBar";
-var Breadcrumb = React39.forwardRef(
-  ({ className, "aria-label": ariaLabel = "Breadcrumb", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "nav",
-      {
-        ref,
-        "aria-label": ariaLabel,
-        className: clsx28("ds-breadcrumb", className),
-        ...props
-      }
-    );
-  }
-);
-Breadcrumb.displayName = "Breadcrumb";
-var BreadcrumbList = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "ol",
-    {
-      ref,
-      className: clsx28("ds-breadcrumb__list", className),
-      ...props
-    }
-  );
-});
-BreadcrumbList.displayName = "BreadcrumbList";
-var BreadcrumbItem = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "li",
-    {
-      ref,
-      className: clsx28("ds-breadcrumb__item", className),
-      ...props
-    }
-  );
-});
-BreadcrumbItem.displayName = "BreadcrumbItem";
-var BreadcrumbLink = React39.forwardRef(({ className, asChild = false, ...props }, ref) => {
-  const Comp = asChild ? Slot : "a";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      ref,
-      className: clsx28("ds-breadcrumb__link", className),
-      ...props
-    }
-  );
-});
-BreadcrumbLink.displayName = "BreadcrumbLink";
-var BreadcrumbPage = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      ref,
-      role: "link",
-      "aria-current": "page",
-      "aria-disabled": "true",
-      className: clsx28("ds-breadcrumb__page", className),
-      ...props
-    }
-  );
-});
-BreadcrumbPage.displayName = "BreadcrumbPage";
-var BreadcrumbSeparator = React39.forwardRef(({ className, children, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "li",
-    {
-      ref,
-      role: "presentation",
-      "aria-hidden": "true",
-      className: clsx28("ds-breadcrumb__separator", className),
-      ...props,
-      children: children ?? "/"
-    }
-  );
-});
-BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
-var BreadcrumbEllipsis = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      ref,
-      className: clsx28("ds-breadcrumb__ellipsis", className),
-      ...props,
-      children: "\u2026"
-    }
-  );
-});
-BreadcrumbEllipsis.displayName = "BreadcrumbEllipsis";
-var Toggle = React39.forwardRef(
-  ({
-    className,
-    pressed: controlledPressed,
-    onPressedChange,
-    variant = "default",
-    size = "md",
-    onClick,
-    ...props
-  }, ref) => {
-    const [uncontrolledPressed, setUncontrolledPressed] = React39.useState(false);
-    const isControlled = controlledPressed !== void 0;
-    const pressed = isControlled ? controlledPressed : uncontrolledPressed;
-    const handleClick = (e) => {
-      const next = !pressed;
-      if (!isControlled) {
-        setUncontrolledPressed(next);
-      }
-      onPressedChange?.(next);
-      onClick?.(e);
-    };
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        ref,
-        type: "button",
-        className: clsx28(
-          "ds-toggle",
-          `ds-toggle--${variant}`,
-          `ds-toggle--${size}`,
-          className
-        ),
-        "aria-pressed": pressed,
-        "data-state": pressed ? "on" : "off",
-        onClick: handleClick,
-        ...props
-      }
-    );
-  }
-);
-Toggle.displayName = "Toggle";
-var ToggleGroupContext = React39.createContext({
-  type: "single",
-  value: [],
-  onItemToggle: () => {
-  }
-});
-var ToggleGroup = React39.forwardRef(
-  ({ className, type, value, onValueChange, children, ...props }, ref) => {
-    const normalizedValue = React39.useMemo(() => {
-      if (value === void 0) return [];
-      return Array.isArray(value) ? value : [value];
-    }, [value]);
-    const onItemToggle = React39.useCallback(
-      (itemValue) => {
-        if (type === "single") {
-          const next = normalizedValue.includes(itemValue) ? "" : itemValue;
-          onValueChange?.(next);
-        } else {
-          const next = normalizedValue.includes(itemValue) ? normalizedValue.filter((v) => v !== itemValue) : [...normalizedValue, itemValue];
-          onValueChange?.(next);
-        }
-      },
-      [type, normalizedValue, onValueChange]
-    );
-    const ctx = React39.useMemo(
-      () => ({ type, value: normalizedValue, onItemToggle }),
-      [type, normalizedValue, onItemToggle]
-    );
-    return /* @__PURE__ */ jsx(ToggleGroupContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "group",
-        className: clsx28("ds-toggle-group", className),
-        ...props,
-        children
-      }
-    ) });
-  }
-);
-ToggleGroup.displayName = "ToggleGroup";
-var ToggleGroupItem = React39.forwardRef(({ className, value, children, onClick, ...props }, ref) => {
-  const ctx = React39.useContext(ToggleGroupContext);
-  const pressed = ctx.value.includes(value);
-  const handleClick = (e) => {
-    ctx.onItemToggle(value);
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref,
-      type: "button",
-      "aria-pressed": pressed,
-      className: clsx28(
-        "ds-toggle-group__item",
-        pressed && "ds-toggle-group__item--pressed",
-        className
-      ),
-      onClick: handleClick,
-      ...props,
-      children
-    }
-  );
-});
-ToggleGroupItem.displayName = "ToggleGroupItem";
-var Slider = React39.forwardRef(
-  ({
-    className,
-    value: controlledValue,
-    defaultValue = 50,
-    min = 0,
-    max = 100,
-    step = 1,
-    onValueChange,
-    disabled = false,
-    ...props
-  }, ref) => {
-    const [uncontrolledValue, setUncontrolledValue] = React39.useState(defaultValue);
-    const isControlled = controlledValue !== void 0;
-    const value = isControlled ? controlledValue : uncontrolledValue;
-    const handleChange = (e) => {
-      const next = Number(e.target.value);
-      if (!isControlled) {
-        setUncontrolledValue(next);
-      }
-      onValueChange?.(next);
-    };
-    const percentage = (value - min) / (max - min) * 100;
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-slider", disabled && "ds-slider--disabled", className),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "ds-slider__track", children: /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "ds-slider__range",
-              style: { width: `${percentage}%` }
-            }
-          ) }),
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              type: "range",
-              className: "ds-slider__thumb",
-              role: "slider",
-              min,
-              max,
-              step,
-              value,
-              disabled,
-              onChange: handleChange,
-              "aria-valuemin": min,
-              "aria-valuemax": max,
-              "aria-valuenow": value
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-Slider.displayName = "Slider";
-var CollapsibleContext = React39.createContext(null);
-function useCollapsibleContext() {
-  const context = React39.useContext(CollapsibleContext);
-  if (!context) {
-    throw new Error("Collapsible compound components must be used within <Collapsible>");
-  }
-  return context;
-}
-var Collapsible = React39.forwardRef(
-  ({ className, open: controlledOpen, onOpenChange, children, ...props }, ref) => {
-    const [uncontrolledOpen, setUncontrolledOpen] = React39.useState(false);
-    const isControlled = controlledOpen !== void 0;
-    const open = isControlled ? controlledOpen : uncontrolledOpen;
-    const toggle = React39.useCallback(() => {
-      const next = !open;
-      if (!isControlled) {
-        setUncontrolledOpen(next);
-      }
-      onOpenChange?.(next);
-    }, [open, isControlled, onOpenChange]);
-    const contextValue = React39.useMemo(
-      () => ({ open, toggle }),
-      [open, toggle]
-    );
-    return /* @__PURE__ */ jsx(CollapsibleContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-collapsible", className),
-        "data-state": open ? "open" : "closed",
-        ...props,
-        children
-      }
-    ) });
-  }
-);
-Collapsible.displayName = "Collapsible";
-var CollapsibleTrigger = React39.forwardRef(({ className, onClick, ...props }, ref) => {
-  const { toggle } = useCollapsibleContext();
-  const handleClick = (e) => {
-    toggle();
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref,
-      type: "button",
-      className: clsx28("ds-collapsible__trigger", className),
-      onClick: handleClick,
-      ...props
-    }
-  );
-});
-CollapsibleTrigger.displayName = "CollapsibleTrigger";
-var CollapsibleContent = React39.forwardRef(({ className, children, ...props }, ref) => {
-  const { open } = useCollapsibleContext();
-  const contentRef = React39.useRef(null);
-  const [maxHeight, setMaxHeight] = React39.useState(
-    open ? void 0 : 0
-  );
-  React39.useEffect(() => {
-    const el = contentRef.current;
-    if (!el) return;
-    if (open) {
-      const scrollHeight = el.scrollHeight;
-      setMaxHeight(scrollHeight);
-      const timer = setTimeout(() => setMaxHeight(void 0), 200);
-      return () => clearTimeout(timer);
-    } else {
-      const scrollHeight = el.scrollHeight;
-      setMaxHeight(scrollHeight);
-      requestAnimationFrame(() => {
-        requestAnimationFrame(() => {
-          setMaxHeight(0);
-        });
-      });
-    }
-  }, [open]);
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: contentRef,
-      className: clsx28("ds-collapsible__content", className),
-      "data-state": open ? "open" : "closed",
-      style: {
-        maxHeight: maxHeight !== void 0 ? `${maxHeight}px` : "none"
-      },
-      hidden: !open && maxHeight === 0,
-      ...props,
-      children: /* @__PURE__ */ jsx("div", { ref, className: "ds-collapsible__content-inner", children })
-    }
-  );
-});
-CollapsibleContent.displayName = "CollapsibleContent";
-var HoverCardContext = React39.createContext(null);
-function useHoverCardContext() {
-  const context = React39.useContext(HoverCardContext);
-  if (!context) {
-    throw new Error("HoverCard compound components must be used within <HoverCard>");
-  }
-  return context;
-}
-var HoverCard = ({
-  openDelay = 200,
-  closeDelay = 100,
-  children
-}) => {
-  const [open, setOpen] = React39.useState(false);
-  const openTimerRef = React39.useRef();
-  const closeTimerRef = React39.useRef();
-  const onOpen = React39.useCallback(() => {
-    clearTimeout(closeTimerRef.current);
-    openTimerRef.current = setTimeout(() => setOpen(true), openDelay);
-  }, [openDelay]);
-  const onClose = React39.useCallback(() => {
-    clearTimeout(openTimerRef.current);
-    closeTimerRef.current = setTimeout(() => setOpen(false), closeDelay);
-  }, [closeDelay]);
-  React39.useEffect(() => {
-    return () => {
-      clearTimeout(openTimerRef.current);
-      clearTimeout(closeTimerRef.current);
-    };
-  }, []);
-  const contextValue = React39.useMemo(
-    () => ({ open, onOpen, onClose }),
-    [open, onOpen, onClose]
-  );
-  return /* @__PURE__ */ jsx(HoverCardContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: "ds-hover-card", children }) });
-};
-HoverCard.displayName = "HoverCard";
-var HoverCardTrigger = React39.forwardRef(({ className, onMouseEnter, onMouseLeave, ...props }, ref) => {
-  const { onOpen, onClose } = useHoverCardContext();
-  const handleMouseEnter = (e) => {
-    onOpen();
-    onMouseEnter?.(e);
-  };
-  const handleMouseLeave = (e) => {
-    onClose();
-    onMouseLeave?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      ref,
-      className: clsx28("ds-hover-card__trigger", className),
-      onMouseEnter: handleMouseEnter,
-      onMouseLeave: handleMouseLeave,
-      ...props
-    }
-  );
-});
-HoverCardTrigger.displayName = "HoverCardTrigger";
-var HoverCardContent = React39.forwardRef(
-  ({ className, side = "bottom", align = "center", onMouseEnter, onMouseLeave, ...props }, ref) => {
-    const { open, onOpen, onClose } = useHoverCardContext();
-    const handleMouseEnter = (e) => {
-      onOpen();
-      onMouseEnter?.(e);
-    };
-    const handleMouseLeave = (e) => {
-      onClose();
-      onMouseLeave?.(e);
-    };
-    if (!open) return null;
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28(
-          "ds-hover-card__content",
-          `ds-hover-card__content--${side}`,
-          `ds-hover-card__content--align-${align}`,
-          className
-        ),
-        onMouseEnter: handleMouseEnter,
-        onMouseLeave: handleMouseLeave,
-        ...props
-      }
-    );
-  }
-);
-HoverCardContent.displayName = "HoverCardContent";
-var AspectRatio = React39.forwardRef(
-  ({ className, ratio = 1, style, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-aspect-ratio", className),
-        style: { ...style, paddingBottom: `${1 / ratio * 100}%` },
-        ...props,
-        children
-      }
-    );
-  }
-);
-AspectRatio.displayName = "AspectRatio";
-var Pagination = React39.forwardRef(
-  ({ className, "aria-label": ariaLabel = "pagination", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "nav",
-      {
-        ref,
-        role: "navigation",
-        "aria-label": ariaLabel,
-        className: clsx28("ds-pagination", className),
-        ...props
-      }
-    );
-  }
-);
-Pagination.displayName = "Pagination";
-var PaginationContent = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "ul",
-    {
-      ref,
-      className: clsx28("ds-pagination__content", className),
-      ...props
-    }
-  );
-});
-PaginationContent.displayName = "PaginationContent";
-var PaginationItem = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "li",
-    {
-      ref,
-      className: clsx28("ds-pagination__item", className),
-      ...props
-    }
-  );
-});
-PaginationItem.displayName = "PaginationItem";
-var PaginationLink = React39.forwardRef(({ className, isActive = false, size = "md", asChild = false, ...props }, ref) => {
-  const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ jsx(
-    Comp,
-    {
-      ref,
-      "aria-current": isActive ? "page" : void 0,
-      className: clsx28(
-        "ds-pagination__link",
-        `ds-pagination__link--${size}`,
-        isActive && "ds-pagination__link--active",
-        className
-      ),
-      ...props
-    }
-  );
-});
-PaginationLink.displayName = "PaginationLink";
-var PaginationPrevious = React39.forwardRef(({ className, label = "Previous", "aria-label": ariaLabel = "Go to previous page", ...props }, ref) => {
-  return /* @__PURE__ */ jsxs(
-    PaginationLink,
-    {
-      ref,
-      "aria-label": ariaLabel,
-      className: clsx28("ds-pagination__prev", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ 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",
-            "aria-hidden": "true",
-            children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" })
-          }
-        ),
-        /* @__PURE__ */ jsx("span", { children: label })
-      ]
-    }
-  );
-});
-PaginationPrevious.displayName = "PaginationPrevious";
-var PaginationNext = React39.forwardRef(({ className, label = "Next", "aria-label": ariaLabel = "Go to next page", ...props }, ref) => {
-  return /* @__PURE__ */ jsxs(
-    PaginationLink,
-    {
-      ref,
-      "aria-label": ariaLabel,
-      className: clsx28("ds-pagination__next", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx("span", { children: label }),
-        /* @__PURE__ */ 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",
-            "aria-hidden": "true",
-            children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
-          }
-        )
-      ]
-    }
-  );
-});
-PaginationNext.displayName = "PaginationNext";
-var PaginationEllipsis = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      ref,
-      "aria-hidden": "true",
-      className: clsx28("ds-pagination__ellipsis", className),
-      ...props,
-      children: "..."
-    }
-  );
-});
-PaginationEllipsis.displayName = "PaginationEllipsis";
-var levelToElement = {
-  display: "h1",
-  h1: "h1",
-  h2: "h2",
-  h3: "h3",
-  h4: "h4",
-  h5: "h5",
-  h6: "h6"
-};
-var Heading = React39.forwardRef(
-  ({ className, level = "h2", as, children, ...props }, ref) => {
-    const Comp = as ?? levelToElement[level];
-    return /* @__PURE__ */ jsx(
-      Comp,
-      {
-        ref,
-        className: clsx28("ds-heading", `ds-heading--${level}`, className),
-        ...props,
-        children
-      }
-    );
-  }
-);
-Heading.displayName = "Heading";
-var Text = React39.forwardRef(
-  ({ className, variant = "body", as = "p", children, ...props }, ref) => {
-    const Comp = as;
-    return /* @__PURE__ */ jsx(
-      Comp,
-      {
-        ref,
-        className: clsx28("ds-text", `ds-text--${variant}`, className),
-        ...props,
-        children
-      }
-    );
-  }
-);
-Text.displayName = "Text";
-var Prose = React39.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-prose", className),
-        ...props,
-        children
-      }
-    );
-  }
-);
-Prose.displayName = "Prose";
-var CarouselContext = React39.createContext(void 0);
-function useCarouselContext() {
-  const ctx = React39.useContext(CarouselContext);
-  if (!ctx) {
-    throw new Error("Carousel compound components must be used within a <Carousel> parent.");
-  }
-  return ctx;
-}
-var Carousel = React39.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    const scrollRef = React39.useRef(null);
-    return /* @__PURE__ */ jsx(CarouselContext.Provider, { value: { scrollRef }, children: /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-carousel", className), ...props, children }) });
-  }
-);
-Carousel.displayName = "Carousel";
-var CarouselContent = React39.forwardRef(({ className, ...props }, ref) => {
-  const { scrollRef } = useCarouselContext();
-  const mergedRef = React39.useCallback(
-    (node) => {
-      scrollRef.current = node;
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-    },
-    [ref, scrollRef]
-  );
-  return /* @__PURE__ */ jsx("div", { ref: mergedRef, className: clsx28("ds-carousel__content", className), ...props });
-});
-CarouselContent.displayName = "CarouselContent";
-var CarouselItem = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-carousel__item", className), ...props })
-);
-CarouselItem.displayName = "CarouselItem";
-var CarouselPrevious = React39.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Previous slide", ...props }, ref) => {
-  const { scrollRef } = useCarouselContext();
-  const handleClick = (e) => {
-    const container = scrollRef.current;
-    if (container) {
-      const firstItem = container.querySelector(".ds-carousel__item");
-      const scrollAmount = firstItem ? firstItem.clientWidth : container.clientWidth;
-      container.scrollBy({ left: -scrollAmount, behavior: "smooth" });
-    }
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref,
-      type: "button",
-      className: clsx28("ds-carousel__prev", className),
-      "aria-label": ariaLabel,
-      onClick: handleClick,
-      ...props,
-      children: children ?? /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
-        "path",
-        {
-          d: "M10 12L6 8L10 4",
-          stroke: "currentColor",
-          strokeWidth: "1.5",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      ) })
-    }
-  );
-});
-CarouselPrevious.displayName = "CarouselPrevious";
-var CarouselNext = React39.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Next slide", ...props }, ref) => {
-  const { scrollRef } = useCarouselContext();
-  const handleClick = (e) => {
-    const container = scrollRef.current;
-    if (container) {
-      const firstItem = container.querySelector(".ds-carousel__item");
-      const scrollAmount = firstItem ? firstItem.clientWidth : container.clientWidth;
-      container.scrollBy({ left: scrollAmount, behavior: "smooth" });
-    }
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      ref,
-      type: "button",
-      className: clsx28("ds-carousel__next", className),
-      "aria-label": ariaLabel,
-      onClick: handleClick,
-      ...props,
-      children: children ?? /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
-        "path",
-        {
-          d: "M6 4L10 8L6 12",
-          stroke: "currentColor",
-          strokeWidth: "1.5",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      ) })
-    }
-  );
-});
-CarouselNext.displayName = "CarouselNext";
-function mergeRefs(...refs) {
-  return (node) => {
-    refs.forEach((ref) => {
-      if (typeof ref === "function") ref(node);
-      else if (ref) ref.current = node;
-    });
-  };
-}
-var CommandContext = React39.createContext(void 0);
-function useCommandContext() {
-  const ctx = React39.useContext(CommandContext);
-  if (!ctx) {
-    throw new Error("Command compound components must be used within a <Command> parent.");
-  }
-  return ctx;
-}
-function getOptionElements(listEl) {
-  if (!listEl) return [];
-  return Array.from(listEl.querySelectorAll('[role="option"]'));
-}
-var Command = React39.forwardRef(
-  ({ className, value: controlledValue, onValueChange, onKeyDown, children, ...props }, ref) => {
-    const [uncontrolledValue, setUncontrolledValue] = React39.useState("");
-    const [activeId, setActiveId] = React39.useState(null);
-    const listRef = React39.useRef(null);
-    const isControlled = controlledValue !== void 0;
-    const search = isControlled ? controlledValue : uncontrolledValue;
-    const inputId = React39.useId();
-    const listId = React39.useId();
-    const setSearch = React39.useCallback(
-      (next) => {
-        if (!isControlled) {
-          setUncontrolledValue(next);
-        }
-        onValueChange?.(next);
-      },
-      [isControlled, onValueChange]
-    );
-    React39.useEffect(() => {
-      const frame = requestAnimationFrame(() => {
-        const items = getOptionElements(listRef.current);
-        if (items.length > 0) {
-          setActiveId(items[0].id);
-        } else {
-          setActiveId(null);
-        }
-      });
-      return () => cancelAnimationFrame(frame);
-    }, [search]);
-    const handleKeyDown = React39.useCallback(
-      (e) => {
-        const items = getOptionElements(listRef.current);
-        if (items.length === 0) {
-          onKeyDown?.(e);
-          return;
-        }
-        const currentIndex = items.findIndex((el) => el.id === activeId);
-        switch (e.key) {
-          case "ArrowDown": {
-            e.preventDefault();
-            const nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;
-            setActiveId(items[nextIndex].id);
-            items[nextIndex].scrollIntoView?.({ block: "nearest" });
-            break;
-          }
-          case "ArrowUp": {
-            e.preventDefault();
-            const prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;
-            setActiveId(items[prevIndex].id);
-            items[prevIndex].scrollIntoView?.({ block: "nearest" });
-            break;
-          }
-          case "Home": {
-            e.preventDefault();
-            setActiveId(items[0].id);
-            items[0].scrollIntoView?.({ block: "nearest" });
-            break;
-          }
-          case "End": {
-            e.preventDefault();
-            const lastItem = items[items.length - 1];
-            setActiveId(lastItem.id);
-            lastItem.scrollIntoView?.({ block: "nearest" });
-            break;
-          }
-          case "Enter": {
-            const target = e.target;
-            if (target.getAttribute("role") === "option") break;
-            const activeEl = activeId ? document.getElementById(activeId) : null;
-            if (activeEl) {
-              e.preventDefault();
-              activeEl.click();
-            }
-            break;
-          }
-        }
-        onKeyDown?.(e);
-      },
-      [activeId, onKeyDown]
-    );
-    const ctx = React39.useMemo(
-      () => ({ search, setSearch, activeId, setActiveId, listRef, inputId, listId }),
-      [search, setSearch, activeId, inputId, listId]
-    );
-    return /* @__PURE__ */ jsx(CommandContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-command", className),
-        onKeyDown: handleKeyDown,
-        ...props,
-        children
-      }
-    ) });
-  }
-);
-Command.displayName = "Command";
-var CommandInput = React39.forwardRef(({ className, onChange, ...props }, ref) => {
-  const { search, setSearch, activeId, inputId, listId } = useCommandContext();
-  const handleChange = (e) => {
-    setSearch(e.target.value);
-    onChange?.(e);
-  };
-  return /* @__PURE__ */ jsxs("div", { className: "ds-command__input-wrapper", children: [
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        className: "ds-command__input-icon",
-        width: "16",
-        height: "16",
-        viewBox: "0 0 16 16",
-        fill: "none",
-        "aria-hidden": "true",
-        children: [
-          /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "5", stroke: "currentColor", strokeWidth: "1.5" }),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: "M11 11L14 14",
-              stroke: "currentColor",
-              strokeWidth: "1.5",
-              strokeLinecap: "round"
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "input",
-      {
-        ref,
-        id: inputId,
-        type: "text",
-        role: "combobox",
-        "aria-expanded": "true",
-        "aria-controls": listId,
-        "aria-activedescendant": activeId ?? void 0,
-        "aria-autocomplete": "list",
-        autoComplete: "off",
-        className: clsx28("ds-command__input", className),
-        value: search,
-        onChange: handleChange,
-        ...props
-      }
-    )
-  ] });
-});
-CommandInput.displayName = "CommandInput";
-var CommandList = React39.forwardRef(
-  ({ className, ...props }, ref) => {
-    const { listRef, listId } = useCommandContext();
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref: mergeRefs(ref, listRef),
-        id: listId,
-        role: "listbox",
-        className: clsx28("ds-command__list", className),
-        ...props
-      }
-    );
-  }
-);
-CommandList.displayName = "CommandList";
-var CommandEmpty = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-command__empty", className), ...props })
-);
-CommandEmpty.displayName = "CommandEmpty";
-var CommandGroup = React39.forwardRef(
-  ({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxs("div", { ref, className: clsx28("ds-command__group", className), ...props, children: [
-    heading && /* @__PURE__ */ jsx("div", { className: "ds-command__group-heading", children: heading }),
-    children
-  ] })
-);
-CommandGroup.displayName = "CommandGroup";
-var CommandItem = React39.forwardRef(
-  ({ className, onSelect, onClick, onKeyDown, onPointerEnter, id: externalId, ...props }, ref) => {
-    const generatedId = React39.useId();
-    const { activeId, setActiveId } = useCommandContext();
-    const itemId = externalId || generatedId;
-    const isActive = activeId === itemId;
-    const handleClick = (e) => {
-      onSelect?.();
-      onClick?.(e);
-    };
-    const handleKeyDown = (e) => {
-      if (e.key === "Enter") {
-        onSelect?.();
-      }
-      onKeyDown?.(e);
-    };
-    const handlePointerEnter = (e) => {
-      setActiveId(itemId);
-      onPointerEnter?.(e);
-    };
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        id: itemId,
-        role: "option",
-        tabIndex: 0,
-        "aria-selected": isActive,
-        "data-active": isActive || void 0,
-        className: clsx28("ds-command__item", className),
-        onClick: handleClick,
-        onKeyDown: handleKeyDown,
-        onPointerEnter: handlePointerEnter,
-        ...props
-      }
-    );
-  }
-);
-CommandItem.displayName = "CommandItem";
-var CommandSeparator = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-command__separator", className), ...props }));
-CommandSeparator.displayName = "CommandSeparator";
-var SIZE_CLASSES = {
-  sm: "ds-dialog__content--sm",
-  lg: "ds-dialog__content--lg",
-  xl: "ds-dialog__content--xl"
-};
-var CommandDialog = ({
-  open,
-  onOpenChange,
-  title = "Search",
-  size = "lg",
-  className,
-  children
-}) => /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
-  DialogContent,
-  {
-    className: clsx28("ds-command-dialog", SIZE_CLASSES[size], className),
-    children: [
-      /* @__PURE__ */ jsx(DialogTitle, { className: "ds-command-dialog__sr-title", children: title }),
-      children
-    ]
-  }
-) });
-CommandDialog.displayName = "CommandDialog";
-var DrawerContext = React39.createContext(void 0);
-function useDrawerContext() {
-  const ctx = React39.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] = React39.useState(false);
-  const isControlled = controlledOpen !== void 0;
-  const open = isControlled ? controlledOpen : uncontrolledOpen;
-  const handleOpenChange = React39.useCallback(
-    (next) => {
-      if (!isControlled) {
-        setUncontrolledOpen(next);
-      }
-      onOpenChange?.(next);
-    },
-    [isControlled, onOpenChange]
-  );
-  return /* @__PURE__ */ jsx(DrawerContext.Provider, { value: { open, onOpenChange: handleOpenChange }, children });
-};
-Drawer.displayName = "Drawer";
-var DrawerTrigger = React39.forwardRef(({ onClick, ...props }, ref) => {
-  const { onOpenChange } = useDrawerContext();
-  const handleClick = (e) => {
-    onOpenChange(true);
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx("button", { ref, type: "button", onClick: handleClick, ...props });
-});
-DrawerTrigger.displayName = "DrawerTrigger";
-var DrawerClose = React39.forwardRef(({ onClick, ...props }, ref) => {
-  const { onOpenChange } = useDrawerContext();
-  const handleClick = (e) => {
-    onOpenChange(false);
-    onClick?.(e);
-  };
-  return /* @__PURE__ */ jsx("button", { ref, type: "button", onClick: handleClick, ...props });
-});
-DrawerClose.displayName = "DrawerClose";
-var DrawerContent = React39.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    const { open, onOpenChange } = useDrawerContext();
-    if (!open) return null;
-    return createPortal(
-      /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: "ds-drawer__backdrop",
-            onClick: () => onOpenChange(false),
-            "aria-hidden": "true"
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            ref,
-            role: "dialog",
-            className: clsx28("ds-drawer__content", className),
-            ...props,
-            children: [
-              /* @__PURE__ */ jsx("div", { className: "ds-drawer__handle", "aria-hidden": "true", children: /* @__PURE__ */ jsx("div", { className: "ds-drawer__handle-bar" }) }),
-              children
-            ]
-          }
-        )
-      ] }),
-      document.body
-    );
-  }
-);
-DrawerContent.displayName = "DrawerContent";
-var DrawerHeader = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-drawer__header", className), ...props })
-);
-DrawerHeader.displayName = "DrawerHeader";
-var DrawerTitle = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx28("ds-drawer__title", className), ...props }));
-DrawerTitle.displayName = "DrawerTitle";
-var DrawerDescription = React39.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx28("ds-drawer__description", className), ...props }));
-DrawerDescription.displayName = "DrawerDescription";
-var DrawerFooter = React39.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-drawer__footer", className), ...props })
-);
-DrawerFooter.displayName = "DrawerFooter";
-var DEFAULT_WEEKDAY_LABELS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
-var DEFAULT_MONTH_NAMES = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December"
-];
-function isSameDay(a, b) {
-  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-}
-function getDaysInMonth(year, month) {
-  return new Date(year, month + 1, 0).getDate();
-}
-function getCalendarGrid(year, month) {
-  const firstDay = new Date(year, month, 1).getDay();
-  const daysInMonth = getDaysInMonth(year, month);
-  const daysInPrevMonth = getDaysInMonth(year, month - 1);
-  const days = [];
-  for (let i = firstDay - 1; i >= 0; i--) {
-    days.push(new Date(year, month - 1, daysInPrevMonth - i));
-  }
-  for (let d = 1; d <= daysInMonth; d++) {
-    days.push(new Date(year, month, d));
-  }
-  const remaining = 7 - days.length % 7;
-  if (remaining < 7) {
-    for (let d = 1; d <= remaining; d++) {
-      days.push(new Date(year, month + 1, d));
-    }
-  }
-  const weeks = [];
-  for (let i = 0; i < days.length; i += 7) {
-    weeks.push(days.slice(i, i + 7));
-  }
-  return weeks;
-}
-var Calendar = React39.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] = React39.useState(
-      () => month ?? selected ?? /* @__PURE__ */ new Date()
-    );
-    const displayedMonth = month ?? internalMonth;
-    const displayYear = displayedMonth.getFullYear();
-    const displayMonthIndex = displayedMonth.getMonth();
-    const weeks = getCalendarGrid(displayYear, displayMonthIndex);
-    const navigateMonth = (delta) => {
-      const next = new Date(displayYear, displayMonthIndex + delta, 1);
-      if (onMonthChange) {
-        onMonthChange(next);
-      } else {
-        setInternalMonth(next);
-      }
-    };
-    const handleDayClick = (date) => {
-      onSelect?.(date);
-    };
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx28("ds-calendar", className), ...props, children: [
-      /* @__PURE__ */ jsxs("div", { className: "ds-calendar__header", children: [
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "ds-calendar__nav-button",
-            onClick: () => navigateMonth(-1),
-            "aria-label": labels?.previousMonth ?? "Previous month",
-            children: /* @__PURE__ */ jsx(
-              "svg",
-              {
-                width: "16",
-                height: "16",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                children: /* @__PURE__ */ jsx("polyline", { points: "15 18 9 12 15 6" })
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxs("div", { className: "ds-calendar__title", children: [
-          monthNames[displayMonthIndex],
-          " ",
-          displayYear
-        ] }),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            className: "ds-calendar__nav-button",
-            onClick: () => navigateMonth(1),
-            "aria-label": labels?.nextMonth ?? "Next month",
-            children: /* @__PURE__ */ jsx(
-              "svg",
-              {
-                width: "16",
-                height: "16",
-                viewBox: "0 0 24 24",
-                fill: "none",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                children: /* @__PURE__ */ jsx("polyline", { points: "9 18 15 12 9 6" })
-              }
-            )
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "ds-calendar__grid", role: "grid", children: [
-        /* @__PURE__ */ jsx("div", { className: "ds-calendar__head-row", role: "row", children: weekdayLabels.map((wdLabel) => /* @__PURE__ */ jsx("div", { className: "ds-calendar__head-cell", role: "columnheader", children: wdLabel }, wdLabel)) }),
-        /* @__PURE__ */ jsx("div", { className: "ds-calendar__body", children: weeks.map((week, wi) => /* @__PURE__ */ jsx("div", { className: "ds-calendar__row", role: "row", children: week.map((date, di) => {
-          const isOutside = date.getMonth() !== displayMonthIndex;
-          const isSelected = selected ? isSameDay(date, selected) : false;
-          const isToday = isSameDay(date, today);
-          return /* @__PURE__ */ jsx("div", { className: "ds-calendar__cell", role: "gridcell", children: /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              className: clsx28(
-                "ds-calendar__day",
-                isSelected && "ds-calendar__day--selected",
-                isToday && "ds-calendar__day--today",
-                isOutside && "ds-calendar__day--outside"
-              ),
-              onClick: () => handleDayClick(date),
-              tabIndex: isOutside ? -1 : 0,
-              "aria-label": formatDayLabel(date),
-              children: date.getDate()
-            }
-          ) }, di);
-        }) }, wi)) })
-      ] })
-    ] });
-  }
-);
-Calendar.displayName = "Calendar";
-var InputOTPContext = React39.createContext({
-  value: "",
-  activeIndex: -1
-});
-var InputOTP = React39.forwardRef(
-  ({ className, length = 6, value = "", onChange, children, "aria-label": ariaLabel = "One-time password", ...props }, ref) => {
-    const inputRef = React39.useRef(null);
-    const [activeIndex, setActiveIndex] = React39.useState(-1);
-    const handleChange = (e) => {
-      const newValue = e.target.value.replace(/[^0-9]/g, "").slice(0, length);
-      onChange?.(newValue);
-    };
-    const handleFocus = () => {
-      setActiveIndex(Math.min(value.length, length - 1));
-    };
-    const handleBlur = () => {
-      setActiveIndex(-1);
-    };
-    const handleKeyDown = (e) => {
-      if (e.key === "Backspace" && value.length > 0) {
-        onChange?.(value.slice(0, -1));
-      }
-    };
-    const handleContainerClick = () => {
-      inputRef.current?.focus();
-    };
-    const contextValue = React39.useMemo(
-      () => ({ value, activeIndex }),
-      [value, activeIndex]
-    );
-    return /* @__PURE__ */ jsx(InputOTPContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        className: clsx28("ds-input-otp", className),
-        onClick: handleContainerClick,
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              ref: inputRef,
-              type: "text",
-              inputMode: "numeric",
-              autoComplete: "one-time-code",
-              pattern: "[0-9]*",
-              maxLength: length,
-              value,
-              onChange: handleChange,
-              onFocus: handleFocus,
-              onBlur: handleBlur,
-              onKeyDown: handleKeyDown,
-              className: "ds-input-otp__hidden-input",
-              "aria-label": ariaLabel
-            }
-          ),
-          children
-        ]
-      }
-    ) });
-  }
-);
-InputOTP.displayName = "InputOTP";
-var InputOTPGroup = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-input-otp__group", className), ...props });
-});
-InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React39.forwardRef(
-  ({ className, index, ...props }, ref) => {
-    const { value, activeIndex } = React39.useContext(InputOTPContext);
-    const char = value[index] ?? "";
-    const isActive = activeIndex === index;
-    const isFilled = char !== "";
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        className: clsx28(
-          "ds-input-otp__slot",
-          isActive && "ds-input-otp__slot--active",
-          isFilled && "ds-input-otp__slot--filled",
-          className
-        ),
-        ...props,
-        children: char
-      }
-    );
-  }
-);
-InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-input-otp__separator", className), role: "separator", ...props, children: /* @__PURE__ */ jsx(
-    "svg",
-    {
-      width: "8",
-      height: "8",
-      viewBox: "0 0 8 8",
-      fill: "currentColor",
-      children: /* @__PURE__ */ jsx("circle", { cx: "4", cy: "4", r: "2" })
-    }
-  ) });
-});
-InputOTPSeparator.displayName = "InputOTPSeparator";
-var ContextMenuContext = React39.createContext({
-  open: false,
-  position: { x: 0, y: 0 },
-  onClose: () => {
-  }
-});
-function ContextMenu({ children }) {
-  const [open, setOpen] = React39.useState(false);
-  const [position, setPosition] = React39.useState({ x: 0, y: 0 });
-  const handleOpen = React39.useCallback((x, y) => {
-    setPosition({ x, y });
-    setOpen(true);
-  }, []);
-  const handleClose = React39.useCallback(() => {
-    setOpen(false);
-  }, []);
-  const contextValue = React39.useMemo(
-    () => ({ open, position, onClose: handleClose }),
-    [open, position, handleClose]
-  );
-  return /* @__PURE__ */ jsx(ContextMenuInternalContext.Provider, { value: { onOpen: handleOpen }, children: /* @__PURE__ */ jsx(ContextMenuContext.Provider, { value: contextValue, children }) });
-}
-ContextMenu.displayName = "ContextMenu";
-var ContextMenuInternalContext = React39.createContext({ onOpen: () => {
-} });
-var ContextMenuTrigger = React39.forwardRef(({ className, onContextMenu, ...props }, ref) => {
-  const { onOpen } = React39.useContext(ContextMenuInternalContext);
-  const handleContextMenu = (e) => {
-    e.preventDefault();
-    onOpen(e.clientX, e.clientY);
-    onContextMenu?.(e);
-  };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      className: clsx28("ds-context-menu__trigger", className),
-      onContextMenu: handleContextMenu,
-      ...props
-    }
-  );
-});
-ContextMenuTrigger.displayName = "ContextMenuTrigger";
-var ContextMenuContent = React39.forwardRef(({ className, ...props }, ref) => {
-  const { open, position, onClose } = React39.useContext(ContextMenuContext);
-  const contentRef = React39.useRef(null);
-  const mergedRef = React39.useCallback(
-    (node) => {
-      contentRef.current = node;
-      if (typeof ref === "function") ref(node);
-      else if (ref) ref.current = node;
-    },
-    [ref]
-  );
-  React39.useEffect(() => {
-    if (!open) return;
-    const handleClickOutside = (e) => {
-      if (contentRef.current && !contentRef.current.contains(e.target)) {
-        onClose();
-      }
-    };
-    const handleEscape = (e) => {
-      if (e.key === "Escape") {
-        onClose();
-      }
-    };
-    const timer = setTimeout(() => {
-      document.addEventListener("mousedown", handleClickOutside);
-    }, 0);
-    document.addEventListener("keydown", handleEscape);
-    return () => {
-      clearTimeout(timer);
-      document.removeEventListener("mousedown", handleClickOutside);
-      document.removeEventListener("keydown", handleEscape);
-    };
-  }, [open, onClose]);
-  if (!open) return null;
-  return ReactDOM.createPortal(
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref: mergedRef,
-        role: "menu",
-        className: clsx28("ds-context-menu__content", className),
-        style: { top: position.y, left: position.x },
-        ...props
-      }
-    ),
-    document.body
-  );
-});
-ContextMenuContent.displayName = "ContextMenuContent";
-var ContextMenuItem = React39.forwardRef(
-  ({ className, onSelect, onClick, ...props }, ref) => {
-    const { onClose } = React39.useContext(ContextMenuContext);
-    const handleClick = (e) => {
-      onSelect?.();
-      onClose();
-      onClick?.(e);
-    };
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        role: "menuitem",
-        className: clsx28("ds-context-menu__item", className),
-        onClick: handleClick,
-        ...props
-      }
-    );
-  }
-);
-ContextMenuItem.displayName = "ContextMenuItem";
-var ContextMenuSeparator = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      role: "separator",
-      className: clsx28("ds-context-menu__separator", className),
-      ...props
-    }
-  );
-});
-ContextMenuSeparator.displayName = "ContextMenuSeparator";
-var ContextMenuLabel = React39.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      className: clsx28("ds-context-menu__label", className),
-      ...props
-    }
-  );
-});
-ContextMenuLabel.displayName = "ContextMenuLabel";
-var FormFieldContext = React39.createContext(void 0);
-function useFormField() {
-  const ctx = React39.useContext(FormFieldContext);
-  if (!ctx) {
-    throw new Error("useFormField must be used within a <FormField>");
-  }
-  return ctx;
-}
-var FormItemContext = React39.createContext(void 0);
-function FormField({ name, children, value, onChange, onBlur, error }) {
-  const id = React39.useId();
-  const contextValue = React39.useMemo(
-    () => ({ id: `${id}-form-item`, name, error }),
-    [id, name, error]
-  );
-  const fieldProps = React39.useMemo(
-    () => ({
-      value: value ?? "",
-      onChange: onChange ?? (() => {
-      }),
-      onBlur: onBlur ?? (() => {
-      }),
-      error,
-      id: `${id}-form-item`
-    }),
-    [value, onChange, onBlur, error, id]
-  );
-  return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: contextValue, children: children(fieldProps) });
-}
-FormField.displayName = "FormField";
-var FormItem = React39.forwardRef(
-  ({ className, ...props }, ref) => {
-    const id = React39.useId();
-    const contextValue = React39.useMemo(() => ({ id }), [id]);
-    return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-form__item", className), ...props }) });
-  }
-);
-FormItem.displayName = "FormItem";
-var FormLabel = React39.forwardRef(({ className, ...props }, ref) => {
-  const fieldCtx = React39.useContext(FormFieldContext);
-  const hasError = !!fieldCtx?.error;
-  return /* @__PURE__ */ jsx(
-    "label",
-    {
-      ref,
-      htmlFor: fieldCtx?.id,
-      className: clsx28("ds-form__label", hasError && "ds-form__label--error", className),
-      ...props
-    }
-  );
-});
-FormLabel.displayName = "FormLabel";
-var FormControl = React39.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    const fieldCtx = React39.useContext(FormFieldContext);
-    const descriptionId = fieldCtx ? `${fieldCtx.id}-description` : void 0;
-    const messageId = fieldCtx ? `${fieldCtx.id}-message` : void 0;
-    const hasError = !!fieldCtx?.error;
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx28("ds-form__control", className), ...props, children: React39.isValidElement(children) ? React39.cloneElement(children, {
-      id: fieldCtx?.id,
-      "aria-describedby": descriptionId,
-      "aria-invalid": hasError || void 0,
-      "aria-errormessage": hasError ? messageId : void 0
-    }) : children });
-  }
-);
-FormControl.displayName = "FormControl";
-var FormDescription = React39.forwardRef(({ className, ...props }, ref) => {
-  const fieldCtx = React39.useContext(FormFieldContext);
-  return /* @__PURE__ */ jsx(
-    "p",
-    {
-      ref,
-      id: fieldCtx ? `${fieldCtx.id}-description` : void 0,
-      className: clsx28("ds-form__description", className),
-      ...props
-    }
-  );
-});
-FormDescription.displayName = "FormDescription";
-var FormMessage = React39.forwardRef(({ className, children, ...props }, ref) => {
-  const fieldCtx = React39.useContext(FormFieldContext);
-  const message = children ?? fieldCtx?.error;
-  if (!message) return null;
-  return /* @__PURE__ */ jsx(
-    "p",
-    {
-      ref,
-      id: fieldCtx ? `${fieldCtx.id}-message` : void 0,
-      role: "alert",
-      className: clsx28("ds-form__message", className),
-      ...props,
-      children: message
-    }
-  );
-});
-FormMessage.displayName = "FormMessage";
-
-// src/components/LayoutPrimitives/utils.ts
-var SPACING_ALIASES = {
-  xs: "var(--space-2)",
-  sm: "var(--space-3)",
-  md: "var(--space-4)",
-  lg: "var(--space-6)",
-  xl: "var(--space-8)",
-  "2xl": "var(--space-12)"
-};
-function resolveSpacing(value) {
-  if (value === void 0) return void 0;
-  if (typeof value === "number" && SPACING[value]) {
-    return SPACING[value];
-  }
-  if (typeof value === "string" && value in SPACING_ALIASES) {
-    return SPACING_ALIASES[value];
-  }
-  return String(value);
-}
-function extractSpacingStyles(props) {
-  const styles = {};
-  if (props.m !== void 0) styles.margin = resolveSpacing(props.m);
-  if (props.mt !== void 0) styles.marginTop = resolveSpacing(props.mt);
-  if (props.mb !== void 0) styles.marginBottom = resolveSpacing(props.mb);
-  if (props.ml !== void 0) styles.marginLeft = resolveSpacing(props.ml);
-  if (props.mr !== void 0) styles.marginRight = resolveSpacing(props.mr);
-  if (props.mx !== void 0) {
-    styles.marginLeft = resolveSpacing(props.mx);
-    styles.marginRight = resolveSpacing(props.mx);
-  }
-  if (props.my !== void 0) {
-    styles.marginTop = resolveSpacing(props.my);
-    styles.marginBottom = resolveSpacing(props.my);
-  }
-  if (props.p !== void 0) styles.padding = resolveSpacing(props.p);
-  if (props.pt !== void 0) styles.paddingTop = resolveSpacing(props.pt);
-  if (props.pb !== void 0) styles.paddingBottom = resolveSpacing(props.pb);
-  if (props.pl !== void 0) styles.paddingLeft = resolveSpacing(props.pl);
-  if (props.pr !== void 0) styles.paddingRight = resolveSpacing(props.pr);
-  if (props.px !== void 0) {
-    styles.paddingLeft = resolveSpacing(props.px);
-    styles.paddingRight = resolveSpacing(props.px);
-  }
-  if (props.py !== void 0) {
-    styles.paddingTop = resolveSpacing(props.py);
-    styles.paddingBottom = resolveSpacing(props.py);
-  }
-  if (props.gap !== void 0) styles.gap = resolveSpacing(props.gap);
-  return styles;
-}
-var Box = 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;
-    return /* @__PURE__ */ jsx(
-      Component,
-      {
-        ref,
-        className: clsx28("ds-box", className),
-        style: { ...spacingStyles, ...style },
-        ...domProps,
-        children
-      }
-    );
-  }
-);
-Box.displayName = "Box";
-var Stack = forwardRef(
-  ({ direction = "column", align, justify, wrap, className, style, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      Box,
-      {
-        ref,
-        className: clsx28("ds-stack", direction === "row" && "ds-stack--horizontal", className),
-        style: {
-          alignItems: align,
-          justifyContent: justify === "between" ? "space-between" : justify,
-          flexWrap: wrap ? "wrap" : void 0,
-          ...style
-        },
-        ...props
-      }
-    );
-  }
-);
-Stack.displayName = "Stack";
-var MAX_RESPONSIVE_COLS = 6;
-var Grid = forwardRef(
-  ({ columns, rows, align, justify, fixed, className, style, ...props }, ref) => {
-    const useColClass = typeof columns === "number" && columns >= 1 && columns <= MAX_RESPONSIVE_COLS;
-    return /* @__PURE__ */ jsx(
-      Box,
-      {
-        ref,
-        className: clsx28(
-          "ds-grid",
-          useColClass && `ds-grid--cols-${columns}`,
-          fixed && "ds-grid--fixed",
-          className
-        ),
-        style: {
-          gridTemplateColumns: useColClass ? void 0 : typeof columns === "number" ? `repeat(${columns}, 1fr)` : columns,
-          gridTemplateRows: typeof rows === "number" ? `repeat(${rows}, 1fr)` : rows,
-          alignItems: align,
-          justifyItems: justify,
-          ...style
-        },
-        ...props
-      }
-    );
-  }
-);
-Grid.displayName = "Grid";
-var CONTAINER_SIZE_MAP = {
-  sm: "768px",
-  // 48rem — max-w-3xl
-  md: "1024px",
-  // 64rem — max-w-5xl
-  lg: "1152px",
-  // 72rem — max-w-6xl
-  xl: "1280px",
-  // 80rem — max-w-7xl
-  full: "100%"
-};
-var Container = forwardRef(
-  ({ size, fluid, maxWidth, className, style, ...props }, ref) => {
-    let resolvedMaxWidth;
-    if (fluid) {
-      resolvedMaxWidth = "100%";
-    } else if (size) {
-      resolvedMaxWidth = CONTAINER_SIZE_MAP[size];
-    } else {
-      resolvedMaxWidth = maxWidth || "var(--container-default-max, 1200px)";
-    }
-    return /* @__PURE__ */ jsx(
-      Box,
-      {
-        ref,
-        className: clsx28("ds-container", className),
-        style: {
-          maxWidth: resolvedMaxWidth,
-          ...style
-        },
-        ...props
-      }
-    );
-  }
-);
-Container.displayName = "Container";
-var Section = forwardRef(
-  ({ padding = "md", className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "section",
-      {
-        ref,
-        className: clsx28("ds-section-block", `ds-section-block--${padding}`, className),
-        ...props,
-        children
-      }
-    );
-  }
-);
-Section.displayName = "Section";
-var VisuallyHidden = forwardRef(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("span", { ref, className: clsx28("ds-visually-hidden", className), ...props });
-  }
-);
-VisuallyHidden.displayName = "VisuallyHidden";
-var Tabs = React39.forwardRef(
-  ({ className, orientation = "horizontal", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      Tabs$1.Root,
-      {
-        ref,
-        className: clsx28("ds-tabs", `ds-tabs--${orientation}`, className),
-        orientation,
-        ...props
-      }
-    );
-  }
-);
-Tabs.displayName = "Tabs";
-var TabsList = React39.forwardRef(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Tabs$1.List, { ref, className: clsx28("ds-tabs__list", className), ...props });
-  }
-);
-TabsList.displayName = "TabsList";
-var TabsTrigger = React39.forwardRef(
-  ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Tabs$1.Tab, { ref, className: clsx28("ds-tabs__trigger", className), ...props, children });
-  }
-);
-TabsTrigger.displayName = "TabsTrigger";
-var TabsContent = React39.forwardRef(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Tabs$1.Panel, { ref, className: clsx28("ds-tabs__content", className), ...props });
-  }
-);
-TabsContent.displayName = "TabsContent";
-var defaultMessages = {
-  // Common
-  "ds.common.loading": "Loading...",
-  "ds.common.error": "An error occurred",
-  "ds.common.retry": "Retry",
-  "ds.common.cancel": "Cancel",
-  "ds.common.confirm": "Confirm",
-  "ds.common.close": "Close",
-  "ds.common.save": "Save",
-  "ds.common.delete": "Delete",
-  "ds.common.edit": "Edit",
-  "ds.common.submit": "Submit",
-  "ds.common.required": "Required",
-  "ds.common.optional": "Optional",
-  // Alert
-  "ds.alert.dismissLabel": "Dismiss alert",
-  "ds.alert.successTitle": "Success",
-  "ds.alert.errorTitle": "Error",
-  "ds.alert.warningTitle": "Warning",
-  "ds.alert.infoTitle": "Information",
-  // Toast
-  "ds.toast.dismissLabel": "Dismiss notification",
-  // Dialog
-  "ds.dialog.closeLabel": "Close dialog",
-  // Form
-  "ds.form.showPassword": "Show password",
-  "ds.form.hidePassword": "Hide password",
-  "ds.form.clearInput": "Clear input",
-  "ds.form.invalidEmail": "Please enter a valid email address",
-  "ds.form.passwordRequired": "Password is required",
-  // Auth
-  "ds.auth.loginTitle": "Sign in to your account",
-  "ds.auth.signupTitle": "Create your account",
-  "ds.auth.forgotPasswordTitle": "Reset your password",
-  "ds.auth.emailLabel": "Email address",
-  "ds.auth.passwordLabel": "Password",
-  "ds.auth.rememberMe": "Remember me",
-  "ds.auth.forgotPassword": "Forgot your password?",
-  "ds.auth.signIn": "Sign in",
-  "ds.auth.signUp": "Sign up",
-  "ds.auth.sendResetLink": "Send reset link",
-  "ds.auth.backToLogin": "Back to login",
-  // Navigation
-  "ds.nav.menuLabel": "Navigation menu",
-  "ds.nav.toggleSidebar": "Toggle sidebar",
-  "ds.nav.expandSubmenu": "Expand submenu",
-  "ds.nav.collapseSubmenu": "Collapse submenu",
-  // Report
-  "ds.report.confidenceLabel": "Confidence score",
-  "ds.report.dataCoverageLabel": "Data coverage",
-  "ds.report.insufficientData": "Insufficient data",
-  "ds.report.exportPdf": "Export as PDF",
-  "ds.report.exportCsv": "Export as CSV",
-  "ds.report.exportPptx": "Export as PowerPoint",
-  // Appearance
-  "ds.appearance.themeLabel": "Theme",
-  "ds.appearance.darkTheme": "Dark",
-  "ds.appearance.lightTheme": "Light",
-  "ds.appearance.highContrastTheme": "High contrast",
-  "ds.appearance.densityLabel": "Density",
-  "ds.appearance.comfortableDensity": "Comfortable",
-  "ds.appearance.compactDensity": "Compact",
-  // Pagination
-  "ds.pagination.previous": "Previous",
-  "ds.pagination.next": "Next",
-  "ds.pagination.goToPreviousPage": "Go to previous page",
-  "ds.pagination.goToNextPage": "Go to next page",
-  // Calendar
-  "ds.calendar.previousMonth": "Previous month",
-  "ds.calendar.nextMonth": "Next month",
-  // Carousel
-  "ds.carousel.previousSlide": "Previous slide",
-  "ds.carousel.nextSlide": "Next slide",
-  // Methodology
-  "ds.methodology.title": "Methodology",
-  "ds.methodology.sampleSize": "Sample Size",
-  "ds.methodology.dataSources": "Data Sources",
-  "ds.methodology.calculation": "Calculation"
-};
-function DSIntlProvider({
-  locale = "en",
-  messages,
-  intlConfig,
-  children
-}) {
-  const mergedMessages = {
-    ...defaultMessages,
-    ...messages
-  };
-  return /* @__PURE__ */ jsx(
-    IntlProvider,
-    {
-      locale,
-      messages: mergedMessages,
-      defaultLocale: "en",
-      onError: (err) => {
-        if (process.env.NODE_ENV === "development") {
-          if (err.code !== "MISSING_TRANSLATION") {
-            console.error(err);
-          }
-        }
-      },
-      ...intlConfig,
-      children
-    }
-  );
-}
-function useMessage() {
-  const intl = useIntl();
-  const formatMessage = useCallback(
-    (descriptor, values) => {
-      return intl.formatMessage(descriptor, values);
-    },
-    [intl]
-  );
-  return formatMessage;
-}
-function useLocale() {
-  const intl = useIntl();
-  return intl.locale;
-}
-function useIsRTL() {
-  const locale = useLocale();
-  const rtlLocales = [
-    "ar",
-    // Arabic
-    "he",
-    // Hebrew
-    "fa",
-    // Persian/Farsi
-    "ur",
-    // Urdu
-    "ps",
-    // Pashto
-    "sd",
-    // Sindhi
-    "yi"
-    // Yiddish
-  ];
-  return rtlLocales.some((rtl) => locale === rtl || locale.startsWith(`${rtl}-`));
-}
-function useTextDirection() {
-  const isRTL = useIsRTL();
-  return isRTL ? "rtl" : "ltr";
-}
-function useNumberFormat() {
-  const intl = useIntl();
-  const formatNumber = useCallback(
-    (value, options) => {
-      return intl.formatNumber(value, options);
-    },
-    [intl]
-  );
-  return formatNumber;
-}
-function useDateFormat() {
-  const intl = useIntl();
-  const formatDate = useCallback(
-    (value, options) => {
-      return intl.formatDate(value, options);
-    },
-    [intl]
-  );
-  return formatDate;
-}
-function useRelativeTime() {
-  const intl = useIntl();
-  const formatRelativeTime = useCallback(
-    (value, unit, options) => {
-      return intl.formatRelativeTime(value, unit, options);
-    },
-    [intl]
-  );
-  return formatRelativeTime;
-}
-var commonMessages = defineMessages({
-  loading: {
-    id: "ds.common.loading",
-    defaultMessage: "Loading...",
-    description: "Generic loading state text"
-  },
-  error: {
-    id: "ds.common.error",
-    defaultMessage: "An error occurred",
-    description: "Generic error message"
-  },
-  retry: {
-    id: "ds.common.retry",
-    defaultMessage: "Retry",
-    description: "Retry action button text"
-  },
-  cancel: {
-    id: "ds.common.cancel",
-    defaultMessage: "Cancel",
-    description: "Cancel action button text"
-  },
-  confirm: {
-    id: "ds.common.confirm",
-    defaultMessage: "Confirm",
-    description: "Confirm action button text"
-  },
-  close: {
-    id: "ds.common.close",
-    defaultMessage: "Close",
-    description: "Close action button text"
-  },
-  save: {
-    id: "ds.common.save",
-    defaultMessage: "Save",
-    description: "Save action button text"
-  },
-  delete: {
-    id: "ds.common.delete",
-    defaultMessage: "Delete",
-    description: "Delete action button text"
-  },
-  edit: {
-    id: "ds.common.edit",
-    defaultMessage: "Edit",
-    description: "Edit action button text"
-  },
-  submit: {
-    id: "ds.common.submit",
-    defaultMessage: "Submit",
-    description: "Submit action button text"
-  },
-  required: {
-    id: "ds.common.required",
-    defaultMessage: "Required",
-    description: "Field required indicator"
-  },
-  optional: {
-    id: "ds.common.optional",
-    defaultMessage: "Optional",
-    description: "Field optional indicator"
-  }
-});
-var alertMessages = defineMessages({
-  dismissLabel: {
-    id: "ds.alert.dismissLabel",
-    defaultMessage: "Dismiss alert",
-    description: "Accessible label for alert dismiss button"
-  },
-  successTitle: {
-    id: "ds.alert.successTitle",
-    defaultMessage: "Success",
-    description: "Default title for success alerts"
-  },
-  errorTitle: {
-    id: "ds.alert.errorTitle",
-    defaultMessage: "Error",
-    description: "Default title for error alerts"
-  },
-  warningTitle: {
-    id: "ds.alert.warningTitle",
-    defaultMessage: "Warning",
-    description: "Default title for warning alerts"
-  },
-  infoTitle: {
-    id: "ds.alert.infoTitle",
-    defaultMessage: "Information",
-    description: "Default title for info alerts"
-  }
-});
-var toastMessages = defineMessages({
-  dismissLabel: {
-    id: "ds.toast.dismissLabel",
-    defaultMessage: "Dismiss notification",
-    description: "Accessible label for toast dismiss button"
-  }
-});
-var dialogMessages = defineMessages({
-  closeLabel: {
-    id: "ds.dialog.closeLabel",
-    defaultMessage: "Close dialog",
-    description: "Accessible label for dialog close button"
-  }
-});
-var formMessages = defineMessages({
-  showPassword: {
-    id: "ds.form.showPassword",
-    defaultMessage: "Show password",
-    description: "Toggle to show password text"
-  },
-  hidePassword: {
-    id: "ds.form.hidePassword",
-    defaultMessage: "Hide password",
-    description: "Toggle to hide password text"
-  },
-  clearInput: {
-    id: "ds.form.clearInput",
-    defaultMessage: "Clear input",
-    description: "Clear input field button"
-  },
-  invalidEmail: {
-    id: "ds.form.invalidEmail",
-    defaultMessage: "Please enter a valid email address",
-    description: "Email validation error"
-  },
-  passwordRequired: {
-    id: "ds.form.passwordRequired",
-    defaultMessage: "Password is required",
-    description: "Password required validation error"
-  }
-});
-var authMessages = defineMessages({
-  loginTitle: {
-    id: "ds.auth.loginTitle",
-    defaultMessage: "Sign in to your account",
-    description: "Login page title"
-  },
-  signupTitle: {
-    id: "ds.auth.signupTitle",
-    defaultMessage: "Create your account",
-    description: "Signup page title"
-  },
-  forgotPasswordTitle: {
-    id: "ds.auth.forgotPasswordTitle",
-    defaultMessage: "Reset your password",
-    description: "Forgot password page title"
-  },
-  emailLabel: {
-    id: "ds.auth.emailLabel",
-    defaultMessage: "Email address",
-    description: "Email field label"
-  },
-  passwordLabel: {
-    id: "ds.auth.passwordLabel",
-    defaultMessage: "Password",
-    description: "Password field label"
-  },
-  rememberMe: {
-    id: "ds.auth.rememberMe",
-    defaultMessage: "Remember me",
-    description: "Remember me checkbox label"
-  },
-  forgotPassword: {
-    id: "ds.auth.forgotPassword",
-    defaultMessage: "Forgot your password?",
-    description: "Forgot password link text"
-  },
-  signIn: {
-    id: "ds.auth.signIn",
-    defaultMessage: "Sign in",
-    description: "Sign in button text"
-  },
-  signUp: {
-    id: "ds.auth.signUp",
-    defaultMessage: "Sign up",
-    description: "Sign up button text"
-  },
-  sendResetLink: {
-    id: "ds.auth.sendResetLink",
-    defaultMessage: "Send reset link",
-    description: "Send password reset link button"
-  },
-  backToLogin: {
-    id: "ds.auth.backToLogin",
-    defaultMessage: "Back to login",
-    description: "Back to login link text"
-  }
-});
-var navigationMessages = defineMessages({
-  menuLabel: {
-    id: "ds.nav.menuLabel",
-    defaultMessage: "Navigation menu",
-    description: "Accessible label for navigation menu"
-  },
-  toggleSidebar: {
-    id: "ds.nav.toggleSidebar",
-    defaultMessage: "Toggle sidebar",
-    description: "Toggle sidebar button label"
-  },
-  expandSubmenu: {
-    id: "ds.nav.expandSubmenu",
-    defaultMessage: "Expand submenu",
-    description: "Expand submenu button label"
-  },
-  collapseSubmenu: {
-    id: "ds.nav.collapseSubmenu",
-    defaultMessage: "Collapse submenu",
-    description: "Collapse submenu button label"
-  }
-});
-var reportMessages = defineMessages({
-  confidenceLabel: {
-    id: "ds.report.confidenceLabel",
-    defaultMessage: "Confidence score",
-    description: "Label for confidence indicator"
-  },
-  dataCoverageLabel: {
-    id: "ds.report.dataCoverageLabel",
-    defaultMessage: "Data coverage",
-    description: "Label for data coverage badge"
-  },
-  insufficientData: {
-    id: "ds.report.insufficientData",
-    defaultMessage: "Insufficient data",
-    description: "Message when data is insufficient for analysis"
-  },
-  exportPdf: {
-    id: "ds.report.exportPdf",
-    defaultMessage: "Export as PDF",
-    description: "Export to PDF option"
-  },
-  exportCsv: {
-    id: "ds.report.exportCsv",
-    defaultMessage: "Export as CSV",
-    description: "Export to CSV option"
-  },
-  exportPptx: {
-    id: "ds.report.exportPptx",
-    defaultMessage: "Export as PowerPoint",
-    description: "Export to PowerPoint option"
-  }
-});
-var appearanceMessages = defineMessages({
-  themeLabel: {
-    id: "ds.appearance.themeLabel",
-    defaultMessage: "Theme",
-    description: "Theme selector label"
-  },
-  darkTheme: {
-    id: "ds.appearance.darkTheme",
-    defaultMessage: "Dark",
-    description: "Dark theme option"
-  },
-  lightTheme: {
-    id: "ds.appearance.lightTheme",
-    defaultMessage: "Light",
-    description: "Light theme option"
-  },
-  highContrastTheme: {
-    id: "ds.appearance.highContrastTheme",
-    defaultMessage: "High contrast",
-    description: "High contrast theme option"
-  },
-  densityLabel: {
-    id: "ds.appearance.densityLabel",
-    defaultMessage: "Density",
-    description: "Density selector label"
-  },
-  comfortableDensity: {
-    id: "ds.appearance.comfortableDensity",
-    defaultMessage: "Comfortable",
-    description: "Comfortable density option"
-  },
-  compactDensity: {
-    id: "ds.appearance.compactDensity",
-    defaultMessage: "Compact",
-    description: "Compact density option"
-  }
-});
-var paginationMessages = defineMessages({
-  previous: {
-    id: "ds.pagination.previous",
-    defaultMessage: "Previous",
-    description: "Pagination previous button label"
-  },
-  next: {
-    id: "ds.pagination.next",
-    defaultMessage: "Next",
-    description: "Pagination next button label"
-  },
-  goToPreviousPage: {
-    id: "ds.pagination.goToPreviousPage",
-    defaultMessage: "Go to previous page",
-    description: "Accessible label for previous page button"
-  },
-  goToNextPage: {
-    id: "ds.pagination.goToNextPage",
-    defaultMessage: "Go to next page",
-    description: "Accessible label for next page button"
-  }
-});
-var calendarMessages = defineMessages({
-  previousMonth: {
-    id: "ds.calendar.previousMonth",
-    defaultMessage: "Previous month",
-    description: "Accessible label for previous month button"
-  },
-  nextMonth: {
-    id: "ds.calendar.nextMonth",
-    defaultMessage: "Next month",
-    description: "Accessible label for next month button"
-  }
-});
-var carouselMessages = defineMessages({
-  previousSlide: {
-    id: "ds.carousel.previousSlide",
-    defaultMessage: "Previous slide",
-    description: "Accessible label for previous slide button"
-  },
-  nextSlide: {
-    id: "ds.carousel.nextSlide",
-    defaultMessage: "Next slide",
-    description: "Accessible label for next slide button"
-  }
-});
-var methodologyMessages = defineMessages({
-  title: {
-    id: "ds.methodology.title",
-    defaultMessage: "Methodology",
-    description: "Methodology note title"
-  },
-  sampleSize: {
-    id: "ds.methodology.sampleSize",
-    defaultMessage: "Sample Size",
-    description: "Methodology sample size label"
-  },
-  dataSources: {
-    id: "ds.methodology.dataSources",
-    defaultMessage: "Data Sources",
-    description: "Methodology data sources label"
-  },
-  calculation: {
-    id: "ds.methodology.calculation",
-    defaultMessage: "Calculation",
-    description: "Methodology calculation label"
-  }
-});
-var allMessages = {
-  ...commonMessages,
-  ...alertMessages,
-  ...toastMessages,
-  ...dialogMessages,
-  ...formMessages,
-  ...authMessages,
-  ...navigationMessages,
-  ...reportMessages,
-  ...appearanceMessages,
-  ...paginationMessages,
-  ...calendarMessages,
-  ...carouselMessages,
-  ...methodologyMessages
-};
-
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AppearancePanel, AppearanceProvider, AspectRatio, Avatar, AvatarFallback, AvatarImage, BREAKPOINTS, Badge, Box, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, COLORS, CONTAINER_SIZE_MAP, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, Container, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuTrigger, DISTANCE, DSIntlProvider, DURATION, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EASING, EmptyState, FONT_FAMILY, FONT_SIZE, FONT_WEIGHT, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Grid, Heading, HoverCard, HoverCardContent, HoverCardTrigger, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, LINE_HEIGHT, Label, MEDIA_QUERIES, MOTION, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverContent, PopoverTrigger, Progress, Prose, RADIUS, Radio, RadioGroup, SHADOWS, SPACING, ScrollArea, ScrollBar, Section, Select, SelectContent, SelectGroup, SelectItem, SelectSeparator, SelectTrigger, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, Stack, StatusBadge, Switch, TRANSITION, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextArea, TextField, ToastContext, ToastItem, ToastProvider, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, VARIANTS, VisuallyHidden, Z_INDEX, alertMessages, allMessages, appearanceMessages, authMessages, calendarMessages, carouselMessages, commonMessages, dialogMessages, extractSpacingStyles, formMessages, hexToRgb, initializeAppearance, methodologyMessages, navigationMessages, paginationMessages, prefersReducedMotion, reportMessages, resolveSpacing, toastMessages, useAppearance, useDateFormat, useFormField, useIsRTL, useLocale, useMessage, useNumberFormat, useRelativeTime, useTextDirection, useToast };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AspectRatio, BREAKPOINTS, ButtonGroup, COLORS, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, EmptyState, FONT_FAMILY, FONT_SIZE, FONT_WEIGHT, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Grid, Heading, HoverCard, HoverCardContent, HoverCardTrigger, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, LINE_HEIGHT, Label, MEDIA_QUERIES, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverContent, PopoverTrigger, Progress, Prose, RADIUS, Radio, RadioGroup, SHADOWS, ScrollArea, ScrollBar, Section, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, StatusBadge, Switch, Text, TextArea, ToastContext, ToastItem, ToastProvider, Toggle, VisuallyHidden, Z_INDEX, useFormField, useToast } from '../chunk-MU6GW5ZV.js';
+export { Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger } from '../chunk-C2BCDNAV.js';
+export { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Select, SelectContent, SelectGroup, SelectItem, SelectSeparator, SelectTrigger } from '../chunk-FAFAP4L5.js';
+export { Checkbox } from '../chunk-7PX2AZ6Y.js';
+export { AppearancePanel, AppearanceProvider, hexToRgb, initializeAppearance, prefersReducedMotion, useAppearance } from '../chunk-JPJN4YBC.js';
+export { Stack } from '../chunk-NN3TUHIH.js';
+export { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from '../chunk-XU3OMQ7V.js';
+export { DISTANCE, DURATION, EASING, MOTION, TRANSITION, VARIANTS } from '../chunk-YNVRDD2P.js';
+export { Badge, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Slider, Tabs, TabsContent, TabsList, TabsTrigger, ToggleGroup, ToggleGroupItem } from '../chunk-HRENHNDJ.js';
+export { TextField } from '../chunk-3NKRFUAR.js';
+export { Button } from '../chunk-SICKWUWB.js';
+export { DSIntlProvider, FormattedDate, FormattedMessage, FormattedNumber, alertMessages, allMessages, appearanceMessages, authMessages, calendarMessages, carouselMessages, commonMessages, defineMessages, dialogMessages, formMessages, methodologyMessages, navigationMessages, paginationMessages, reportMessages, toastMessages, useDateFormat, useIsRTL, useLocale, useMessage, useNumberFormat, useRelativeTime, useTextDirection } from '../chunk-P5BOFE5A.js';
+export { Avatar, AvatarFallback, AvatarImage } from '../chunk-Y3CPKNB7.js';
+export { Box, CONTAINER_SIZE_MAP, Container, SPACING, extractSpacingStyles, resolveSpacing } from '../chunk-HN4PHABT.js';
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.js.map