erp-pro-ui 0.2.4 → 0.2.6

package/dist/chunks/{overlay-DNnZywyR.cjs → overlay-DzE_GyYf.cjs}

@@ -57,4 +57,4 @@ Object.defineProperty(exports, "useOverlayEffects", {
 	}
 });
 
-//# sourceMappingURL=overlay-DNnZywyR.cjs.map
+//# sourceMappingURL=overlay-DzE_GyYf.cjs.map

package/dist/chunks/{overlay-DNnZywyR.cjs.map → overlay-DzE_GyYf.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"overlay-DNnZywyR.cjs","names":[],"sources":["../../src/components/shared/overlay.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport type { RefObject } from \"react\";\n\nconst focusableSelectors = [\n  \"a[href]\",\n  \"button:not([disabled])\",\n  \"textarea:not([disabled])\",\n  \"input:not([disabled])\",\n  \"select:not([disabled])\",\n  '[tabindex]:not([tabindex=\"-1\"])',\n];\n\nconst scheduleMicrotask = (callback: () => void) => {\n  if (typeof queueMicrotask === \"function\") {\n    queueMicrotask(callback);\n    return;\n  }\n  Promise.resolve()\n    .then(callback)\n    .catch(() => {\n      callback();\n    });\n};\n\nexport const useBodyScrollLock = (active: boolean) => {\n  useEffect(() => {\n    if (!active || typeof window === \"undefined\") return;\n    const { overflow } = document.body.style;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = overflow;\n    };\n  }, [active]);\n};\n\nexport const useFocusTrap = (\n  containerRef: RefObject<HTMLElement | null>,\n  active: boolean,\n) => {\n  useEffect(() => {\n    if (!active || typeof window === \"undefined\") return;\n    const container = containerRef.current;\n    if (!container) return;\n\n    const getFocusable = () =>\n      Array.from(\n        container.querySelectorAll<HTMLElement>(focusableSelectors.join(\",\")),\n      ).filter(\n        (el) => !el.hasAttribute(\"disabled\") && !el.getAttribute(\"aria-hidden\"),\n      );\n\n    const focusable = getFocusable();\n    const first = focusable[0];\n    const last = focusable[focusable.length - 1];\n    first?.focus();\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key !== \"Tab\" || focusable.length === 0) return;\n      if (event.shiftKey) {\n        if (document.activeElement === first) {\n          event.preventDefault();\n          (last || first)?.focus();\n        }\n      } else if (document.activeElement === last) {\n        event.preventDefault();\n        (first || last)?.focus();\n      }\n    };\n\n    container.addEventListener(\"keydown\", handleKeyDown);\n    return () => container.removeEventListener(\"keydown\", handleKeyDown);\n  }, [containerRef, active]);\n};\n\nexport const useOverlayEffects = (\n  containerRef: RefObject<HTMLElement | null>,\n  active: boolean,\n) => {\n  useBodyScrollLock(active);\n  useFocusTrap(containerRef, active);\n};\n\nexport const useOverlayTransition = (open: boolean, duration = 200) => {\n  const [closing, setClosing] = useState(false);\n\n  useEffect(() => {\n    if (open) {\n      return undefined;\n    }\n\n    scheduleMicrotask(() => setClosing(true));\n    const timer = setTimeout(() => setClosing(false), duration);\n\n    return () => {\n      clearTimeout(timer);\n      scheduleMicrotask(() => setClosing(false));\n    };\n  }, [open, duration]);\n\n  const shouldRender = open || closing;\n  const transitionState: \"open\" | \"closing\" | \"closed\" = open\n    ? \"open\"\n    : closing\n      ? \"closing\"\n      : \"closed\";\n\n  return { shouldRender, transitionState };\n};\n"],"mappings":";;;AAGA,IAAM,qBAAqB;CACzB;CACA;CACA;CACA;CACA;CACA;CACD;AAcD,IAAa,qBAAqB,WAAoB;AACpD,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,UAAU,OAAO,WAAW,YAAa;EAC9C,MAAM,EAAE,aAAa,SAAS,KAAK;AACnC,WAAS,KAAK,MAAM,WAAW;AAC/B,eAAa;AACX,YAAS,KAAK,MAAM,WAAW;;IAEhC,CAAC,OAAO,CAAC;;AAGd,IAAa,gBACX,cACA,WACG;AACH,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,UAAU,OAAO,WAAW,YAAa;EAC9C,MAAM,YAAY,aAAa;AAC/B,MAAI,CAAC,UAAW;EAEhB,MAAM,qBACJ,MAAM,KACJ,UAAU,iBAA8B,mBAAmB,KAAK,IAAI,CAAC,CACtE,CAAC,QACC,OAAO,CAAC,GAAG,aAAa,WAAW,IAAI,CAAC,GAAG,aAAa,cAAc,CACxE;EAEH,MAAM,YAAY,cAAc;EAChC,MAAM,QAAQ,UAAU;EACxB,MAAM,OAAO,UAAU,UAAU,SAAS;AAC1C,SAAO,OAAO;EAEd,MAAM,iBAAiB,UAAyB;AAC9C,OAAI,MAAM,QAAQ,SAAS,UAAU,WAAW,EAAG;AACnD,OAAI,MAAM;QACJ,SAAS,kBAAkB,OAAO;AACpC,WAAM,gBAAgB;AACtB,MAAC,QAAQ,QAAQ,OAAO;;cAEjB,SAAS,kBAAkB,MAAM;AAC1C,UAAM,gBAAgB;AACtB,KAAC,SAAS,OAAO,OAAO;;;AAI5B,YAAU,iBAAiB,WAAW,cAAc;AACpD,eAAa,UAAU,oBAAoB,WAAW,cAAc;IACnE,CAAC,cAAc,OAAO,CAAC;;AAG5B,IAAa,qBACX,cACA,WACG;AACH,mBAAkB,OAAO;AACzB,cAAa,cAAc,OAAO"}
+{"version":3,"file":"overlay-DzE_GyYf.cjs","names":[],"sources":["../../src/components/shared/overlay.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport type { RefObject } from \"react\";\n\nconst focusableSelectors = [\n  \"a[href]\",\n  \"button:not([disabled])\",\n  \"textarea:not([disabled])\",\n  \"input:not([disabled])\",\n  \"select:not([disabled])\",\n  '[tabindex]:not([tabindex=\"-1\"])',\n];\n\nconst scheduleMicrotask = (callback: () => void) => {\n  if (typeof queueMicrotask === \"function\") {\n    queueMicrotask(callback);\n    return;\n  }\n  Promise.resolve()\n    .then(callback)\n    .catch(() => {\n      callback();\n    });\n};\n\nexport const useBodyScrollLock = (active: boolean) => {\n  useEffect(() => {\n    if (!active || typeof window === \"undefined\") return;\n    const { overflow } = document.body.style;\n    document.body.style.overflow = \"hidden\";\n    return () => {\n      document.body.style.overflow = overflow;\n    };\n  }, [active]);\n};\n\nexport const useFocusTrap = (\n  containerRef: RefObject<HTMLElement | null>,\n  active: boolean,\n) => {\n  useEffect(() => {\n    if (!active || typeof window === \"undefined\") return;\n    const container = containerRef.current;\n    if (!container) return;\n\n    const getFocusable = () =>\n      Array.from(\n        container.querySelectorAll<HTMLElement>(focusableSelectors.join(\",\")),\n      ).filter(\n        (el) => !el.hasAttribute(\"disabled\") && !el.getAttribute(\"aria-hidden\"),\n      );\n\n    const focusable = getFocusable();\n    const first = focusable[0];\n    const last = focusable[focusable.length - 1];\n    first?.focus();\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key !== \"Tab\" || focusable.length === 0) return;\n      if (event.shiftKey) {\n        if (document.activeElement === first) {\n          event.preventDefault();\n          (last || first)?.focus();\n        }\n      } else if (document.activeElement === last) {\n        event.preventDefault();\n        (first || last)?.focus();\n      }\n    };\n\n    container.addEventListener(\"keydown\", handleKeyDown);\n    return () => container.removeEventListener(\"keydown\", handleKeyDown);\n  }, [containerRef, active]);\n};\n\nexport const useOverlayEffects = (\n  containerRef: RefObject<HTMLElement | null>,\n  active: boolean,\n) => {\n  useBodyScrollLock(active);\n  useFocusTrap(containerRef, active);\n};\n\nexport const useOverlayTransition = (open: boolean, duration = 200) => {\n  const [closing, setClosing] = useState(false);\n\n  useEffect(() => {\n    if (open) {\n      return undefined;\n    }\n\n    scheduleMicrotask(() => setClosing(true));\n    const timer = setTimeout(() => setClosing(false), duration);\n\n    return () => {\n      clearTimeout(timer);\n      scheduleMicrotask(() => setClosing(false));\n    };\n  }, [open, duration]);\n\n  const shouldRender = open || closing;\n  const transitionState: \"open\" | \"closing\" | \"closed\" = open\n    ? \"open\"\n    : closing\n      ? \"closing\"\n      : \"closed\";\n\n  return { shouldRender, transitionState };\n};\n"],"mappings":";;;AAGA,IAAM,qBAAqB;CACzB;CACA;CACA;CACA;CACA;CACA;CACD;AAcD,IAAa,qBAAqB,WAAoB;AACpD,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,UAAU,OAAO,WAAW,YAAa;EAC9C,MAAM,EAAE,aAAa,SAAS,KAAK;AACnC,WAAS,KAAK,MAAM,WAAW;AAC/B,eAAa;AACX,YAAS,KAAK,MAAM,WAAW;;IAEhC,CAAC,OAAO,CAAC;;AAGd,IAAa,gBACX,cACA,WACG;AACH,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,CAAC,UAAU,OAAO,WAAW,YAAa;EAC9C,MAAM,YAAY,aAAa;AAC/B,MAAI,CAAC,UAAW;EAEhB,MAAM,qBACJ,MAAM,KACJ,UAAU,iBAA8B,mBAAmB,KAAK,IAAI,CAAC,CACtE,CAAC,QACC,OAAO,CAAC,GAAG,aAAa,WAAW,IAAI,CAAC,GAAG,aAAa,cAAc,CACxE;EAEH,MAAM,YAAY,cAAc;EAChC,MAAM,QAAQ,UAAU;EACxB,MAAM,OAAO,UAAU,UAAU,SAAS;AAC1C,SAAO,OAAO;EAEd,MAAM,iBAAiB,UAAyB;AAC9C,OAAI,MAAM,QAAQ,SAAS,UAAU,WAAW,EAAG;AACnD,OAAI,MAAM;QACJ,SAAS,kBAAkB,OAAO;AACpC,WAAM,gBAAgB;AACtB,MAAC,QAAQ,QAAQ,OAAO;;cAEjB,SAAS,kBAAkB,MAAM;AAC1C,UAAM,gBAAgB;AACtB,KAAC,SAAS,OAAO,OAAO;;;AAI5B,YAAU,iBAAiB,WAAW,cAAc;AACpD,eAAa,UAAU,oBAAoB,WAAW,cAAc;IACnE,CAAC,cAAc,OAAO,CAAC;;AAG5B,IAAa,qBACX,cACA,WACG;AACH,mBAAkB,OAAO;AACzB,cAAa,cAAc,OAAO"}

package/dist/chunks/{password-strength-meter-BsvqQBAg.mjs → password-strength-meter-CH6uQAuK.mjs}

@@ -1,4 +1,4 @@
-import { J as CheckIcon, q as CloseIcon } from "./icons-bx3nrxNv.mjs";
+import { K as CloseIcon, q as CheckIcon } from "./icons-JzMKLygv.mjs";
 import { useMemo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/forms/password-strength-meter/PasswordCriteria.tsx
@@ -96,4 +96,4 @@ function PasswordStrengthMeter({ password }) {
 //#endregion
 export { PasswordStrengthMeter as t };
 
-//# sourceMappingURL=password-strength-meter-BsvqQBAg.mjs.map
+//# sourceMappingURL=password-strength-meter-CH6uQAuK.mjs.map

package/dist/chunks/{password-strength-meter-BsvqQBAg.mjs.map → password-strength-meter-CH6uQAuK.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"password-strength-meter-BsvqQBAg.mjs","names":[],"sources":["../../src/components/forms/password-strength-meter/PasswordCriteria.tsx","../../src/components/forms/password-strength-meter/PasswordStrengthMeter.tsx"],"sourcesContent":["import { CheckIcon, CloseIcon } from \"../../icons\";\n\ninterface PasswordCriteriaProps {\n  password: string;\n}\n\nexport const PasswordCriteria = ({ password }: PasswordCriteriaProps) => {\n  const criteria = [\n    { label: \"At least 6 characters\", met: password.length >= 6 },\n    { label: \"Contains uppercase letter\", met: /[A-Z]/.test(password) },\n    { label: \"Contains lowercase letter\", met: /[a-z]/.test(password) },\n    { label: \"Contains a number\", met: /\\d/.test(password) },\n    { label: \"Contains special character\", met: /[^A-Za-z0-9]/.test(password) },\n  ];\n\n  return (\n    <div className=\"mt-2 space-y-1\">\n      {criteria.map((item) => (\n        <div key={item.label} className=\"flex items-center text-xs\">\n          {item.met ? (\n            <CheckIcon className=\"me-2 size-4 text-success\" title=\"CheckIcon\" />\n          ) : (\n            <CloseIcon className=\"me-2 size-4 text-ds-3\" title=\"CloseIcon\" />\n          )}\n          <span className={item.met ? \"text-success\" : \"text-ds-2\"}>\n            {item.label}\n          </span>\n        </div>\n      ))}\n    </div>\n  );\n};\n","import { useMemo } from \"react\";\n\nimport { PasswordCriteria } from \"./PasswordCriteria\";\n\nexport interface PasswordStrengthMeterProps {\n  password: string;\n}\n\nexport function PasswordStrengthMeter({\n  password,\n}: PasswordStrengthMeterProps) {\n  // Calculate password strength using an object mapping approach\n  const getStrength = (pass: string): number => {\n    const criteria = {\n      minLength: pass.length >= 6,\n      hasMixedCase: /[a-z]/.test(pass) && /[A-Z]/.test(pass),\n      hasNumber: /\\d/.test(pass),\n      hasSpecialChar: /[^a-zA-Z\\d]/.test(pass),\n    };\n\n    // Count the number of criteria that pass\n    return Object.values(criteria).filter(Boolean).length;\n  };\n\n  // Memoize the strength calculation to avoid unnecessary recalculations\n  const strength = useMemo(() => getStrength(password), [password]);\n\n  // Determine strength color based on the calculated strength\n  const getColor = (strength: number): string => {\n    const colors = [\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-success\",\n    ];\n    return colors[strength] || \"bg-ds-surface-3\";\n  };\n\n  // Get a text label corresponding to the password strength\n  const getStrengthText = (strength: number): string => {\n    const strengthLevels = [\"Very Weak\", \"Weak\", \"Fair\", \"Good\", \"Strong\"];\n    return strengthLevels[strength] || \"Very Weak\";\n  };\n\n  return (\n    <div className=\"mt-2\">\n      {/* Strength Label */}\n      <div className=\"mb-1 flex items-center justify-between\">\n        <span className=\"text-xs text-ds-2\">Password strength</span>\n        <span className=\"text-xs text-ds-2\">{getStrengthText(strength)}</span>\n      </div>\n\n      {/* Strength Meter */}\n      <div className=\"flex gap-1\">\n        {Array.from({ length: 4 }, (_, index) => (\n          <div\n            key={index}\n            className={`h-1 w-1/4 rounded-full transition-colors duration-300 ${\n              index < strength ? getColor(strength) : \"bg-ds-surface-3\"\n            }`}\n          />\n        ))}\n      </div>\n\n      <PasswordCriteria password={password} />\n    </div>\n  );\n}\n"],"mappings":";;;;AAMA,IAAa,oBAAoB,EAAE,eAAsC;AASvE,QACE,oBAAC,OAAD;EAAK,WAAU;YACZ;GATH;IAAE,OAAO;IAAyB,KAAK,SAAS,UAAU;IAAG;GAC7D;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAAqB,KAAK,KAAK,KAAK,SAAS;IAAE;GACxD;IAAE,OAAO;IAA8B,KAAK,eAAe,KAAK,SAAS;IAAE;GAKxE,CAAS,KAAK,SACb,qBAAC,OAAD;GAAsB,WAAU;aAAhC,CACG,KAAK,MACJ,oBAAC,WAAD;IAAW,WAAU;IAA2B,OAAM;IAAc,CAAA,GAEpE,oBAAC,WAAD;IAAW,WAAU;IAAwB,OAAM;IAAc,CAAA,EAEnE,oBAAC,QAAD;IAAM,WAAW,KAAK,MAAM,iBAAiB;cAC1C,KAAK;IACD,CAAA,CACH;KATI,KAAK,MAST,CACN;EACE,CAAA;;;;ACrBV,SAAgB,sBAAsB,EACpC,YAC6B;CAE7B,MAAM,eAAe,SAAyB;EAC5C,MAAM,WAAW;GACf,WAAW,KAAK,UAAU;GAC1B,cAAc,QAAQ,KAAK,KAAK,IAAI,QAAQ,KAAK,KAAK;GACtD,WAAW,KAAK,KAAK,KAAK;GAC1B,gBAAgB,cAAc,KAAK,KAAK;GACzC;AAGD,SAAO,OAAO,OAAO,SAAS,CAAC,OAAO,QAAQ,CAAC;;CAIjD,MAAM,WAAW,cAAc,YAAY,SAAS,EAAE,CAAC,SAAS,CAAC;CAGjE,MAAM,YAAY,aAA6B;AAQ7C,SAAO;GANL;GACA;GACA;GACA;GACA;GAEK,CAAO,aAAa;;CAI7B,MAAM,mBAAmB,aAA6B;AAEpD,SAAO;GADiB;GAAa;GAAQ;GAAQ;GAAQ;GACtD,CAAe,aAAa;;AAGrC,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GAEE,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,QAAD;KAAM,WAAU;eAAoB;KAAwB,CAAA,EAC5D,oBAAC,QAAD;KAAM,WAAU;eAAqB,gBAAgB,SAAS;KAAQ,CAAA,CAClE;;GAGN,oBAAC,OAAD;IAAK,WAAU;cACZ,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,GAAG,UAC7B,oBAAC,OAAD,EAEE,WAAW,yDACT,QAAQ,WAAW,SAAS,SAAS,GAAG,qBAE1C,EAJK,MAIL,CACF;IACE,CAAA;GAEN,oBAAC,kBAAD,EAA4B,UAAY,CAAA;GACpC"}
+{"version":3,"file":"password-strength-meter-CH6uQAuK.mjs","names":[],"sources":["../../src/components/forms/password-strength-meter/PasswordCriteria.tsx","../../src/components/forms/password-strength-meter/PasswordStrengthMeter.tsx"],"sourcesContent":["import { CheckIcon, CloseIcon } from \"../../icons\";\n\ninterface PasswordCriteriaProps {\n  password: string;\n}\n\nexport const PasswordCriteria = ({ password }: PasswordCriteriaProps) => {\n  const criteria = [\n    { label: \"At least 6 characters\", met: password.length >= 6 },\n    { label: \"Contains uppercase letter\", met: /[A-Z]/.test(password) },\n    { label: \"Contains lowercase letter\", met: /[a-z]/.test(password) },\n    { label: \"Contains a number\", met: /\\d/.test(password) },\n    { label: \"Contains special character\", met: /[^A-Za-z0-9]/.test(password) },\n  ];\n\n  return (\n    <div className=\"mt-2 space-y-1\">\n      {criteria.map((item) => (\n        <div key={item.label} className=\"flex items-center text-xs\">\n          {item.met ? (\n            <CheckIcon className=\"me-2 size-4 text-success\" title=\"CheckIcon\" />\n          ) : (\n            <CloseIcon className=\"me-2 size-4 text-ds-3\" title=\"CloseIcon\" />\n          )}\n          <span className={item.met ? \"text-success\" : \"text-ds-2\"}>\n            {item.label}\n          </span>\n        </div>\n      ))}\n    </div>\n  );\n};\n","import { useMemo } from \"react\";\n\nimport { PasswordCriteria } from \"./PasswordCriteria\";\n\nexport interface PasswordStrengthMeterProps {\n  password: string;\n}\n\nexport function PasswordStrengthMeter({\n  password,\n}: PasswordStrengthMeterProps) {\n  // Calculate password strength using an object mapping approach\n  const getStrength = (pass: string): number => {\n    const criteria = {\n      minLength: pass.length >= 6,\n      hasMixedCase: /[a-z]/.test(pass) && /[A-Z]/.test(pass),\n      hasNumber: /\\d/.test(pass),\n      hasSpecialChar: /[^a-zA-Z\\d]/.test(pass),\n    };\n\n    // Count the number of criteria that pass\n    return Object.values(criteria).filter(Boolean).length;\n  };\n\n  // Memoize the strength calculation to avoid unnecessary recalculations\n  const strength = useMemo(() => getStrength(password), [password]);\n\n  // Determine strength color based on the calculated strength\n  const getColor = (strength: number): string => {\n    const colors = [\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-success\",\n    ];\n    return colors[strength] || \"bg-ds-surface-3\";\n  };\n\n  // Get a text label corresponding to the password strength\n  const getStrengthText = (strength: number): string => {\n    const strengthLevels = [\"Very Weak\", \"Weak\", \"Fair\", \"Good\", \"Strong\"];\n    return strengthLevels[strength] || \"Very Weak\";\n  };\n\n  return (\n    <div className=\"mt-2\">\n      {/* Strength Label */}\n      <div className=\"mb-1 flex items-center justify-between\">\n        <span className=\"text-xs text-ds-2\">Password strength</span>\n        <span className=\"text-xs text-ds-2\">{getStrengthText(strength)}</span>\n      </div>\n\n      {/* Strength Meter */}\n      <div className=\"flex gap-1\">\n        {Array.from({ length: 4 }, (_, index) => (\n          <div\n            key={index}\n            className={`h-1 w-1/4 rounded-full transition-colors duration-300 ${\n              index < strength ? getColor(strength) : \"bg-ds-surface-3\"\n            }`}\n          />\n        ))}\n      </div>\n\n      <PasswordCriteria password={password} />\n    </div>\n  );\n}\n"],"mappings":";;;;AAMA,IAAa,oBAAoB,EAAE,eAAsC;AASvE,QACE,oBAAC,OAAD;EAAK,WAAU;YACZ;GATH;IAAE,OAAO;IAAyB,KAAK,SAAS,UAAU;IAAG;GAC7D;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAAqB,KAAK,KAAK,KAAK,SAAS;IAAE;GACxD;IAAE,OAAO;IAA8B,KAAK,eAAe,KAAK,SAAS;IAAE;GAKxE,CAAS,KAAK,SACb,qBAAC,OAAD;GAAsB,WAAU;aAAhC,CACG,KAAK,MACJ,oBAAC,WAAD;IAAW,WAAU;IAA2B,OAAM;IAAc,CAAA,GAEpE,oBAAC,WAAD;IAAW,WAAU;IAAwB,OAAM;IAAc,CAAA,EAEnE,oBAAC,QAAD;IAAM,WAAW,KAAK,MAAM,iBAAiB;cAC1C,KAAK;IACD,CAAA,CACH;KATI,KAAK,MAST,CACN;EACE,CAAA;;;;ACrBV,SAAgB,sBAAsB,EACpC,YAC6B;CAE7B,MAAM,eAAe,SAAyB;EAC5C,MAAM,WAAW;GACf,WAAW,KAAK,UAAU;GAC1B,cAAc,QAAQ,KAAK,KAAK,IAAI,QAAQ,KAAK,KAAK;GACtD,WAAW,KAAK,KAAK,KAAK;GAC1B,gBAAgB,cAAc,KAAK,KAAK;GACzC;AAGD,SAAO,OAAO,OAAO,SAAS,CAAC,OAAO,QAAQ,CAAC;;CAIjD,MAAM,WAAW,cAAc,YAAY,SAAS,EAAE,CAAC,SAAS,CAAC;CAGjE,MAAM,YAAY,aAA6B;AAQ7C,SAAO;GANL;GACA;GACA;GACA;GACA;GAEK,CAAO,aAAa;;CAI7B,MAAM,mBAAmB,aAA6B;AAEpD,SAAO;GADiB;GAAa;GAAQ;GAAQ;GAAQ;GACtD,CAAe,aAAa;;AAGrC,QACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GAEE,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,QAAD;KAAM,WAAU;eAAoB;KAAwB,CAAA,EAC5D,oBAAC,QAAD;KAAM,WAAU;eAAqB,gBAAgB,SAAS;KAAQ,CAAA,CAClE;;GAGN,oBAAC,OAAD;IAAK,WAAU;cACZ,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,GAAG,UAC7B,oBAAC,OAAD,EAEE,WAAW,yDACT,QAAQ,WAAW,SAAS,SAAS,GAAG,qBAE1C,EAJK,MAIL,CACF;IACE,CAAA;GAEN,oBAAC,kBAAD,EAA4B,UAAY,CAAA;GACpC"}

package/dist/chunks/{password-strength-meter-DCi_BP7e.cjs → password-strength-meter-_o1T1HLO.cjs}

@@ -1,5 +1,5 @@
 require("./chunk-B_GkZjkl.cjs");
-const require_icons = require("./icons-CRanVZB1.cjs");
+const require_icons = require("./icons-ub9iu-JG.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/forms/password-strength-meter/PasswordCriteria.tsx
@@ -102,4 +102,4 @@ Object.defineProperty(exports, "PasswordStrengthMeter", {
 	}
 });
 
-//# sourceMappingURL=password-strength-meter-DCi_BP7e.cjs.map
+//# sourceMappingURL=password-strength-meter-_o1T1HLO.cjs.map

package/dist/chunks/{password-strength-meter-DCi_BP7e.cjs.map → password-strength-meter-_o1T1HLO.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"password-strength-meter-DCi_BP7e.cjs","names":[],"sources":["../../src/components/forms/password-strength-meter/PasswordCriteria.tsx","../../src/components/forms/password-strength-meter/PasswordStrengthMeter.tsx"],"sourcesContent":["import { CheckIcon, CloseIcon } from \"../../icons\";\n\ninterface PasswordCriteriaProps {\n  password: string;\n}\n\nexport const PasswordCriteria = ({ password }: PasswordCriteriaProps) => {\n  const criteria = [\n    { label: \"At least 6 characters\", met: password.length >= 6 },\n    { label: \"Contains uppercase letter\", met: /[A-Z]/.test(password) },\n    { label: \"Contains lowercase letter\", met: /[a-z]/.test(password) },\n    { label: \"Contains a number\", met: /\\d/.test(password) },\n    { label: \"Contains special character\", met: /[^A-Za-z0-9]/.test(password) },\n  ];\n\n  return (\n    <div className=\"mt-2 space-y-1\">\n      {criteria.map((item) => (\n        <div key={item.label} className=\"flex items-center text-xs\">\n          {item.met ? (\n            <CheckIcon className=\"me-2 size-4 text-success\" title=\"CheckIcon\" />\n          ) : (\n            <CloseIcon className=\"me-2 size-4 text-ds-3\" title=\"CloseIcon\" />\n          )}\n          <span className={item.met ? \"text-success\" : \"text-ds-2\"}>\n            {item.label}\n          </span>\n        </div>\n      ))}\n    </div>\n  );\n};\n","import { useMemo } from \"react\";\n\nimport { PasswordCriteria } from \"./PasswordCriteria\";\n\nexport interface PasswordStrengthMeterProps {\n  password: string;\n}\n\nexport function PasswordStrengthMeter({\n  password,\n}: PasswordStrengthMeterProps) {\n  // Calculate password strength using an object mapping approach\n  const getStrength = (pass: string): number => {\n    const criteria = {\n      minLength: pass.length >= 6,\n      hasMixedCase: /[a-z]/.test(pass) && /[A-Z]/.test(pass),\n      hasNumber: /\\d/.test(pass),\n      hasSpecialChar: /[^a-zA-Z\\d]/.test(pass),\n    };\n\n    // Count the number of criteria that pass\n    return Object.values(criteria).filter(Boolean).length;\n  };\n\n  // Memoize the strength calculation to avoid unnecessary recalculations\n  const strength = useMemo(() => getStrength(password), [password]);\n\n  // Determine strength color based on the calculated strength\n  const getColor = (strength: number): string => {\n    const colors = [\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-success\",\n    ];\n    return colors[strength] || \"bg-ds-surface-3\";\n  };\n\n  // Get a text label corresponding to the password strength\n  const getStrengthText = (strength: number): string => {\n    const strengthLevels = [\"Very Weak\", \"Weak\", \"Fair\", \"Good\", \"Strong\"];\n    return strengthLevels[strength] || \"Very Weak\";\n  };\n\n  return (\n    <div className=\"mt-2\">\n      {/* Strength Label */}\n      <div className=\"mb-1 flex items-center justify-between\">\n        <span className=\"text-xs text-ds-2\">Password strength</span>\n        <span className=\"text-xs text-ds-2\">{getStrengthText(strength)}</span>\n      </div>\n\n      {/* Strength Meter */}\n      <div className=\"flex gap-1\">\n        {Array.from({ length: 4 }, (_, index) => (\n          <div\n            key={index}\n            className={`h-1 w-1/4 rounded-full transition-colors duration-300 ${\n              index < strength ? getColor(strength) : \"bg-ds-surface-3\"\n            }`}\n          />\n        ))}\n      </div>\n\n      <PasswordCriteria password={password} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,IAAa,oBAAoB,EAAE,eAAsC;AASvE,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAU;YACZ;GATH;IAAE,OAAO;IAAyB,KAAK,SAAS,UAAU;IAAG;GAC7D;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAAqB,KAAK,KAAK,KAAK,SAAS;IAAE;GACxD;IAAE,OAAO;IAA8B,KAAK,eAAe,KAAK,SAAS;IAAE;GAKxE,CAAS,KAAK,SACb,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAsB,WAAU;aAAhC,CACG,KAAK,MACJ,iBAAA,GAAA,kBAAA,KAAC,cAAA,WAAD;IAAW,WAAU;IAA2B,OAAM;IAAc,CAAA,GAEpE,iBAAA,GAAA,kBAAA,KAAC,cAAA,WAAD;IAAW,WAAU;IAAwB,OAAM;IAAc,CAAA,EAEnE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,WAAW,KAAK,MAAM,iBAAiB;cAC1C,KAAK;IACD,CAAA,CACH;KATI,KAAK,MAST,CACN;EACE,CAAA;;;;ACrBV,SAAgB,sBAAsB,EACpC,YAC6B;CAE7B,MAAM,eAAe,SAAyB;EAC5C,MAAM,WAAW;GACf,WAAW,KAAK,UAAU;GAC1B,cAAc,QAAQ,KAAK,KAAK,IAAI,QAAQ,KAAK,KAAK;GACtD,WAAW,KAAK,KAAK,KAAK;GAC1B,gBAAgB,cAAc,KAAK,KAAK;GACzC;AAGD,SAAO,OAAO,OAAO,SAAS,CAAC,OAAO,QAAQ,CAAC;;CAIjD,MAAM,YAAA,GAAA,MAAA,eAAyB,YAAY,SAAS,EAAE,CAAC,SAAS,CAAC;CAGjE,MAAM,YAAY,aAA6B;AAQ7C,SAAO;GANL;GACA;GACA;GACA;GACA;GAEK,CAAO,aAAa;;CAI7B,MAAM,mBAAmB,aAA6B;AAEpD,SAAO;GADiB;GAAa;GAAQ;GAAQ;GAAQ;GACtD,CAAe,aAAa;;AAGrC,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WAAU;YAAf;GAEE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAU;eAAoB;KAAwB,CAAA,EAC5D,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAU;eAAqB,gBAAgB,SAAS;KAAQ,CAAA,CAClE;;GAGN,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cACZ,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,GAAG,UAC7B,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAEE,WAAW,yDACT,QAAQ,WAAW,SAAS,SAAS,GAAG,qBAE1C,EAJK,MAIL,CACF;IACE,CAAA;GAEN,iBAAA,GAAA,kBAAA,KAAC,kBAAD,EAA4B,UAAY,CAAA;GACpC"}
+{"version":3,"file":"password-strength-meter-_o1T1HLO.cjs","names":[],"sources":["../../src/components/forms/password-strength-meter/PasswordCriteria.tsx","../../src/components/forms/password-strength-meter/PasswordStrengthMeter.tsx"],"sourcesContent":["import { CheckIcon, CloseIcon } from \"../../icons\";\n\ninterface PasswordCriteriaProps {\n  password: string;\n}\n\nexport const PasswordCriteria = ({ password }: PasswordCriteriaProps) => {\n  const criteria = [\n    { label: \"At least 6 characters\", met: password.length >= 6 },\n    { label: \"Contains uppercase letter\", met: /[A-Z]/.test(password) },\n    { label: \"Contains lowercase letter\", met: /[a-z]/.test(password) },\n    { label: \"Contains a number\", met: /\\d/.test(password) },\n    { label: \"Contains special character\", met: /[^A-Za-z0-9]/.test(password) },\n  ];\n\n  return (\n    <div className=\"mt-2 space-y-1\">\n      {criteria.map((item) => (\n        <div key={item.label} className=\"flex items-center text-xs\">\n          {item.met ? (\n            <CheckIcon className=\"me-2 size-4 text-success\" title=\"CheckIcon\" />\n          ) : (\n            <CloseIcon className=\"me-2 size-4 text-ds-3\" title=\"CloseIcon\" />\n          )}\n          <span className={item.met ? \"text-success\" : \"text-ds-2\"}>\n            {item.label}\n          </span>\n        </div>\n      ))}\n    </div>\n  );\n};\n","import { useMemo } from \"react\";\n\nimport { PasswordCriteria } from \"./PasswordCriteria\";\n\nexport interface PasswordStrengthMeterProps {\n  password: string;\n}\n\nexport function PasswordStrengthMeter({\n  password,\n}: PasswordStrengthMeterProps) {\n  // Calculate password strength using an object mapping approach\n  const getStrength = (pass: string): number => {\n    const criteria = {\n      minLength: pass.length >= 6,\n      hasMixedCase: /[a-z]/.test(pass) && /[A-Z]/.test(pass),\n      hasNumber: /\\d/.test(pass),\n      hasSpecialChar: /[^a-zA-Z\\d]/.test(pass),\n    };\n\n    // Count the number of criteria that pass\n    return Object.values(criteria).filter(Boolean).length;\n  };\n\n  // Memoize the strength calculation to avoid unnecessary recalculations\n  const strength = useMemo(() => getStrength(password), [password]);\n\n  // Determine strength color based on the calculated strength\n  const getColor = (strength: number): string => {\n    const colors = [\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-danger\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-warning\",\n      \"bg-ds-state-success\",\n    ];\n    return colors[strength] || \"bg-ds-surface-3\";\n  };\n\n  // Get a text label corresponding to the password strength\n  const getStrengthText = (strength: number): string => {\n    const strengthLevels = [\"Very Weak\", \"Weak\", \"Fair\", \"Good\", \"Strong\"];\n    return strengthLevels[strength] || \"Very Weak\";\n  };\n\n  return (\n    <div className=\"mt-2\">\n      {/* Strength Label */}\n      <div className=\"mb-1 flex items-center justify-between\">\n        <span className=\"text-xs text-ds-2\">Password strength</span>\n        <span className=\"text-xs text-ds-2\">{getStrengthText(strength)}</span>\n      </div>\n\n      {/* Strength Meter */}\n      <div className=\"flex gap-1\">\n        {Array.from({ length: 4 }, (_, index) => (\n          <div\n            key={index}\n            className={`h-1 w-1/4 rounded-full transition-colors duration-300 ${\n              index < strength ? getColor(strength) : \"bg-ds-surface-3\"\n            }`}\n          />\n        ))}\n      </div>\n\n      <PasswordCriteria password={password} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AAMA,IAAa,oBAAoB,EAAE,eAAsC;AASvE,QACE,iBAAA,GAAA,kBAAA,KAAC,OAAD;EAAK,WAAU;YACZ;GATH;IAAE,OAAO;IAAyB,KAAK,SAAS,UAAU;IAAG;GAC7D;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAA6B,KAAK,QAAQ,KAAK,SAAS;IAAE;GACnE;IAAE,OAAO;IAAqB,KAAK,KAAK,KAAK,SAAS;IAAE;GACxD;IAAE,OAAO;IAA8B,KAAK,eAAe,KAAK,SAAS;IAAE;GAKxE,CAAS,KAAK,SACb,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAsB,WAAU;aAAhC,CACG,KAAK,MACJ,iBAAA,GAAA,kBAAA,KAAC,cAAA,WAAD;IAAW,WAAU;IAA2B,OAAM;IAAc,CAAA,GAEpE,iBAAA,GAAA,kBAAA,KAAC,cAAA,WAAD;IAAW,WAAU;IAAwB,OAAM;IAAc,CAAA,EAEnE,iBAAA,GAAA,kBAAA,KAAC,QAAD;IAAM,WAAW,KAAK,MAAM,iBAAiB;cAC1C,KAAK;IACD,CAAA,CACH;KATI,KAAK,MAST,CACN;EACE,CAAA;;;;ACrBV,SAAgB,sBAAsB,EACpC,YAC6B;CAE7B,MAAM,eAAe,SAAyB;EAC5C,MAAM,WAAW;GACf,WAAW,KAAK,UAAU;GAC1B,cAAc,QAAQ,KAAK,KAAK,IAAI,QAAQ,KAAK,KAAK;GACtD,WAAW,KAAK,KAAK,KAAK;GAC1B,gBAAgB,cAAc,KAAK,KAAK;GACzC;AAGD,SAAO,OAAO,OAAO,SAAS,CAAC,OAAO,QAAQ,CAAC;;CAIjD,MAAM,YAAA,GAAA,MAAA,eAAyB,YAAY,SAAS,EAAE,CAAC,SAAS,CAAC;CAGjE,MAAM,YAAY,aAA6B;AAQ7C,SAAO;GANL;GACA;GACA;GACA;GACA;GAEK,CAAO,aAAa;;CAI7B,MAAM,mBAAmB,aAA6B;AAEpD,SAAO;GADiB;GAAa;GAAQ;GAAQ;GAAQ;GACtD,CAAe,aAAa;;AAGrC,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EAAK,WAAU;YAAf;GAEE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf,CACE,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAU;eAAoB;KAAwB,CAAA,EAC5D,iBAAA,GAAA,kBAAA,KAAC,QAAD;KAAM,WAAU;eAAqB,gBAAgB,SAAS;KAAQ,CAAA,CAClE;;GAGN,iBAAA,GAAA,kBAAA,KAAC,OAAD;IAAK,WAAU;cACZ,MAAM,KAAK,EAAE,QAAQ,GAAG,GAAG,GAAG,UAC7B,iBAAA,GAAA,kBAAA,KAAC,OAAD,EAEE,WAAW,yDACT,QAAQ,WAAW,SAAS,SAAS,GAAG,qBAE1C,EAJK,MAIL,CACF;IACE,CAAA;GAEN,iBAAA,GAAA,kBAAA,KAAC,kBAAD,EAA4B,UAAY,CAAA;GACpC"}

package/dist/chunks/{progress-bar-DQ5ZKk2Y.mjs → progress-bar-BAvRSW1b.mjs}

@@ -153,4 +153,4 @@ function CircularProgress({ value, max = 100, size = 24, strokeWidth = 3, tone =
 //#endregion
 export { ProgressBar as n, CircularProgress as t };
 
-//# sourceMappingURL=progress-bar-DQ5ZKk2Y.mjs.map
+//# sourceMappingURL=progress-bar-BAvRSW1b.mjs.map

package/dist/chunks/{progress-bar-DQ5ZKk2Y.mjs.map → progress-bar-BAvRSW1b.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"progress-bar-DQ5ZKk2Y.mjs","names":[],"sources":["../../src/components/data-display/progress-bar/ProgressBar.tsx","../../src/components/data-display/progress-bar/CircularProgress.tsx"],"sourcesContent":["import React from \"react\";\n\nexport type ProgressBarSize = \"sm\" | \"md\" | \"lg\";\nexport type ProgressBarTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface ProgressBarProps {\n  value: number;\n  max?: number;\n  label?: React.ReactNode;\n  percentageLabel?: React.ReactNode;\n  showPercentage?: boolean;\n  size?: ProgressBarSize;\n  tone?: ProgressBarTone;\n  className?: string;\n  trackClassName?: string;\n  fillClassName?: string;\n  ariaLabel?: string;\n}\n\nconst sizeStyles: Record<\n  ProgressBarSize,\n  {\n    track: string;\n    label: string;\n    percentage: string;\n  }\n> = {\n  sm: {\n    track: \"h-1.5\",\n    label: \"text-xs\",\n    percentage: \"text-xs\",\n  },\n  md: {\n    track: \"h-2.5\",\n    label: \"text-sm\",\n    percentage: \"text-sm\",\n  },\n  lg: {\n    track: \"h-3.5\",\n    label: \"text-base\",\n    percentage: \"text-base\",\n  },\n};\n\nconst toneStyles: Record<\n  ProgressBarTone,\n  {\n    color: string;\n    trackBackground: string;\n  }\n> = {\n  default: {\n    color: \"var(--ds-chart-1)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(15, 23, 42, 0.08) 0%, rgba(30, 41, 59, 0.14) 100%)\",\n  },\n  success: {\n    color: \"var(--ds-chart-3)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(20, 83, 45, 0.12) 0%, rgba(34, 197, 94, 0.18) 100%)\",\n  },\n  warning: {\n    color: \"var(--ds-chart-4)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(120, 53, 15, 0.12) 0%, rgba(245, 158, 11, 0.18) 100%)\",\n  },\n  danger: {\n    color: \"var(--ds-chart-5)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(127, 29, 29, 0.12) 0%, rgba(239, 68, 68, 0.18) 100%)\",\n  },\n  info: {\n    color: \"var(--ds-chart-2)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(30, 64, 175, 0.12) 0%, rgba(59, 130, 246, 0.18) 100%)\",\n  },\n};\n\nfunction clampValue(value: number, max: number): number {\n  if (!Number.isFinite(value)) {\n    return 0;\n  }\n\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function ProgressBar({\n  value,\n  max = 100,\n  label,\n  percentageLabel,\n  showPercentage = true,\n  size = \"md\",\n  tone = \"default\",\n  className = \"\",\n  trackClassName = \"\",\n  fillClassName = \"\",\n  ariaLabel = \"Progress\",\n}: ProgressBarProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const clampedValue = clampValue(value, safeMax);\n  const percentage = (clampedValue / safeMax) * 100;\n  const roundedPercentage = Math.round(percentage);\n  const toneStyle = toneStyles[tone];\n  const resolvedPercentageLabel = percentageLabel ?? `${roundedPercentage}%`;\n\n  return (\n    <div className={`w-full space-y-3 ${className}`}>\n      {(label || showPercentage) && (\n        <div className=\"flex items-center justify-between gap-4\">\n          <div\n            className={`font-mono font-semibold tracking-[0.08em] text-ds-1 ${sizeStyles[size].label}`}\n          >\n            {label}\n          </div>\n          {showPercentage && (\n            <div\n              className={`font-mono font-medium tracking-[0.08em] text-ds-2 ${sizeStyles[size].percentage}`}\n            >\n              {resolvedPercentageLabel}\n            </div>\n          )}\n        </div>\n      )}\n\n      <div\n        role=\"progressbar\"\n        aria-label={ariaLabel}\n        aria-valuemin={0}\n        aria-valuemax={safeMax}\n        aria-valuenow={Math.round(clampedValue)}\n        aria-valuetext={`${roundedPercentage}%`}\n        className={`relative overflow-hidden rounded-full border border-ds-border-2/50 bg-ds-surface-2/80 shadow-[inset_0_1px_1px_rgba(255,255,255,0.2)] ${sizeStyles[size].track} ${trackClassName}`}\n        style={{ background: toneStyle.trackBackground }}\n      >\n        <div\n          className={`h-full rounded-full transition-[width,filter,box-shadow] duration-500 ease-out ${fillClassName}`}\n          style={{\n            width: `${percentage}%`,\n            background: `linear-gradient(90deg, color-mix(in srgb, ${toneStyle.color} 68%, white 32%) 0%, ${toneStyle.color} 100%)`,\n            boxShadow: `inset 0 1px 0 rgba(255,255,255,0.4), 0 0 14px color-mix(in srgb, ${toneStyle.color} 32%, transparent)`,\n            filter: percentage > 0 ? \"saturate(1.05) brightness(1.02)\" : \"none\",\n          }}\n        />\n      </div>\n    </div>\n  );\n}\n","import { mergeClassNames } from \"../../../utils\";\n\nexport type CircularProgressTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface CircularProgressProps {\n  value: number;\n  max?: number;\n  size?: number;\n  strokeWidth?: number;\n  tone?: CircularProgressTone;\n  showValue?: boolean;\n  valueLabel?: string;\n  className?: string;\n  trackClassName?: string;\n  progressClassName?: string;\n  ariaLabel?: string;\n}\n\nconst toneColorMap: Record<CircularProgressTone, string> = {\n  default: \"var(--ds-chart-1)\",\n  success: \"var(--ds-chart-3)\",\n  warning: \"var(--ds-chart-4)\",\n  danger: \"var(--ds-chart-5)\",\n  info: \"var(--ds-chart-2)\",\n};\n\nfunction clamp(value: number, max: number): number {\n  if (!Number.isFinite(value)) return 0;\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function CircularProgress({\n  value,\n  max = 100,\n  size = 24,\n  strokeWidth = 3,\n  tone = \"default\",\n  showValue = false,\n  valueLabel,\n  className,\n  trackClassName,\n  progressClassName,\n  ariaLabel = \"Circular progress\",\n}: CircularProgressProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const safeValue = clamp(value, safeMax);\n  const percentage = (safeValue / safeMax) * 100;\n\n  const center = size / 2;\n  const radius = center - strokeWidth / 2;\n  const circumference = 2 * Math.PI * radius;\n  const dashOffset = circumference - (percentage / 100) * circumference;\n  const label = valueLabel ?? `${Math.round(percentage)}%`;\n\n  return (\n    <span\n      role=\"progressbar\"\n      aria-label={ariaLabel}\n      aria-valuemin={0}\n      aria-valuemax={safeMax}\n      aria-valuenow={Math.round(safeValue)}\n      aria-valuetext={label}\n      className={mergeClassNames(\n        \"relative inline-flex items-center justify-center\",\n        className,\n      )}\n      style={{ width: size, height: size }}\n    >\n      <svg\n        width={size}\n        height={size}\n        viewBox={`0 0 ${size} ${size}`}\n        className=\"-rotate-90\"\n      >\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke=\"var(--ds-border-2)\"\n          strokeOpacity={0.5}\n          strokeWidth={strokeWidth}\n          className={trackClassName}\n        />\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke={toneColorMap[tone]}\n          strokeWidth={strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={dashOffset}\n          className={mergeClassNames(\n            \"transition-[stroke-dashoffset] duration-500 ease-out\",\n            progressClassName,\n          )}\n        />\n      </svg>\n\n      {showValue ? (\n        <span className=\"absolute text-[10px] font-semibold leading-none text-ds-1\">\n          {Math.round(percentage)}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n\nexport { CircularProgress };\n"],"mappings":"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"}
+{"version":3,"file":"progress-bar-BAvRSW1b.mjs","names":[],"sources":["../../src/components/data-display/progress-bar/ProgressBar.tsx","../../src/components/data-display/progress-bar/CircularProgress.tsx"],"sourcesContent":["import React from \"react\";\n\nexport type ProgressBarSize = \"sm\" | \"md\" | \"lg\";\nexport type ProgressBarTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface ProgressBarProps {\n  value: number;\n  max?: number;\n  label?: React.ReactNode;\n  percentageLabel?: React.ReactNode;\n  showPercentage?: boolean;\n  size?: ProgressBarSize;\n  tone?: ProgressBarTone;\n  className?: string;\n  trackClassName?: string;\n  fillClassName?: string;\n  ariaLabel?: string;\n}\n\nconst sizeStyles: Record<\n  ProgressBarSize,\n  {\n    track: string;\n    label: string;\n    percentage: string;\n  }\n> = {\n  sm: {\n    track: \"h-1.5\",\n    label: \"text-xs\",\n    percentage: \"text-xs\",\n  },\n  md: {\n    track: \"h-2.5\",\n    label: \"text-sm\",\n    percentage: \"text-sm\",\n  },\n  lg: {\n    track: \"h-3.5\",\n    label: \"text-base\",\n    percentage: \"text-base\",\n  },\n};\n\nconst toneStyles: Record<\n  ProgressBarTone,\n  {\n    color: string;\n    trackBackground: string;\n  }\n> = {\n  default: {\n    color: \"var(--ds-chart-1)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(15, 23, 42, 0.08) 0%, rgba(30, 41, 59, 0.14) 100%)\",\n  },\n  success: {\n    color: \"var(--ds-chart-3)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(20, 83, 45, 0.12) 0%, rgba(34, 197, 94, 0.18) 100%)\",\n  },\n  warning: {\n    color: \"var(--ds-chart-4)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(120, 53, 15, 0.12) 0%, rgba(245, 158, 11, 0.18) 100%)\",\n  },\n  danger: {\n    color: \"var(--ds-chart-5)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(127, 29, 29, 0.12) 0%, rgba(239, 68, 68, 0.18) 100%)\",\n  },\n  info: {\n    color: \"var(--ds-chart-2)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(30, 64, 175, 0.12) 0%, rgba(59, 130, 246, 0.18) 100%)\",\n  },\n};\n\nfunction clampValue(value: number, max: number): number {\n  if (!Number.isFinite(value)) {\n    return 0;\n  }\n\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function ProgressBar({\n  value,\n  max = 100,\n  label,\n  percentageLabel,\n  showPercentage = true,\n  size = \"md\",\n  tone = \"default\",\n  className = \"\",\n  trackClassName = \"\",\n  fillClassName = \"\",\n  ariaLabel = \"Progress\",\n}: ProgressBarProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const clampedValue = clampValue(value, safeMax);\n  const percentage = (clampedValue / safeMax) * 100;\n  const roundedPercentage = Math.round(percentage);\n  const toneStyle = toneStyles[tone];\n  const resolvedPercentageLabel = percentageLabel ?? `${roundedPercentage}%`;\n\n  return (\n    <div className={`w-full space-y-3 ${className}`}>\n      {(label || showPercentage) && (\n        <div className=\"flex items-center justify-between gap-4\">\n          <div\n            className={`font-mono font-semibold tracking-[0.08em] text-ds-1 ${sizeStyles[size].label}`}\n          >\n            {label}\n          </div>\n          {showPercentage && (\n            <div\n              className={`font-mono font-medium tracking-[0.08em] text-ds-2 ${sizeStyles[size].percentage}`}\n            >\n              {resolvedPercentageLabel}\n            </div>\n          )}\n        </div>\n      )}\n\n      <div\n        role=\"progressbar\"\n        aria-label={ariaLabel}\n        aria-valuemin={0}\n        aria-valuemax={safeMax}\n        aria-valuenow={Math.round(clampedValue)}\n        aria-valuetext={`${roundedPercentage}%`}\n        className={`relative overflow-hidden rounded-full border border-ds-border-2/50 bg-ds-surface-2/80 shadow-[inset_0_1px_1px_rgba(255,255,255,0.2)] ${sizeStyles[size].track} ${trackClassName}`}\n        style={{ background: toneStyle.trackBackground }}\n      >\n        <div\n          className={`h-full rounded-full transition-[width,filter,box-shadow] duration-500 ease-out ${fillClassName}`}\n          style={{\n            width: `${percentage}%`,\n            background: `linear-gradient(90deg, color-mix(in srgb, ${toneStyle.color} 68%, white 32%) 0%, ${toneStyle.color} 100%)`,\n            boxShadow: `inset 0 1px 0 rgba(255,255,255,0.4), 0 0 14px color-mix(in srgb, ${toneStyle.color} 32%, transparent)`,\n            filter: percentage > 0 ? \"saturate(1.05) brightness(1.02)\" : \"none\",\n          }}\n        />\n      </div>\n    </div>\n  );\n}\n","import { mergeClassNames } from \"../../../utils\";\n\nexport type CircularProgressTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface CircularProgressProps {\n  value: number;\n  max?: number;\n  size?: number;\n  strokeWidth?: number;\n  tone?: CircularProgressTone;\n  showValue?: boolean;\n  valueLabel?: string;\n  className?: string;\n  trackClassName?: string;\n  progressClassName?: string;\n  ariaLabel?: string;\n}\n\nconst toneColorMap: Record<CircularProgressTone, string> = {\n  default: \"var(--ds-chart-1)\",\n  success: \"var(--ds-chart-3)\",\n  warning: \"var(--ds-chart-4)\",\n  danger: \"var(--ds-chart-5)\",\n  info: \"var(--ds-chart-2)\",\n};\n\nfunction clamp(value: number, max: number): number {\n  if (!Number.isFinite(value)) return 0;\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function CircularProgress({\n  value,\n  max = 100,\n  size = 24,\n  strokeWidth = 3,\n  tone = \"default\",\n  showValue = false,\n  valueLabel,\n  className,\n  trackClassName,\n  progressClassName,\n  ariaLabel = \"Circular progress\",\n}: CircularProgressProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const safeValue = clamp(value, safeMax);\n  const percentage = (safeValue / safeMax) * 100;\n\n  const center = size / 2;\n  const radius = center - strokeWidth / 2;\n  const circumference = 2 * Math.PI * radius;\n  const dashOffset = circumference - (percentage / 100) * circumference;\n  const label = valueLabel ?? `${Math.round(percentage)}%`;\n\n  return (\n    <span\n      role=\"progressbar\"\n      aria-label={ariaLabel}\n      aria-valuemin={0}\n      aria-valuemax={safeMax}\n      aria-valuenow={Math.round(safeValue)}\n      aria-valuetext={label}\n      className={mergeClassNames(\n        \"relative inline-flex items-center justify-center\",\n        className,\n      )}\n      style={{ width: size, height: size }}\n    >\n      <svg\n        width={size}\n        height={size}\n        viewBox={`0 0 ${size} ${size}`}\n        className=\"-rotate-90\"\n      >\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke=\"var(--ds-border-2)\"\n          strokeOpacity={0.5}\n          strokeWidth={strokeWidth}\n          className={trackClassName}\n        />\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke={toneColorMap[tone]}\n          strokeWidth={strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={dashOffset}\n          className={mergeClassNames(\n            \"transition-[stroke-dashoffset] duration-500 ease-out\",\n            progressClassName,\n          )}\n        />\n      </svg>\n\n      {showValue ? (\n        <span className=\"absolute text-[10px] font-semibold leading-none text-ds-1\">\n          {Math.round(percentage)}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n\nexport { CircularProgress };\n"],"mappings":"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"}

package/dist/chunks/{progress-bar-CYaBO_lS.cjs → progress-bar-FfdFVvTT.cjs}

@@ -166,4 +166,4 @@ Object.defineProperty(exports, "ProgressBar", {
 	}
 });
 
-//# sourceMappingURL=progress-bar-CYaBO_lS.cjs.map
+//# sourceMappingURL=progress-bar-FfdFVvTT.cjs.map

package/dist/chunks/{progress-bar-CYaBO_lS.cjs.map → progress-bar-FfdFVvTT.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"progress-bar-CYaBO_lS.cjs","names":[],"sources":["../../src/components/data-display/progress-bar/ProgressBar.tsx","../../src/components/data-display/progress-bar/CircularProgress.tsx"],"sourcesContent":["import React from \"react\";\n\nexport type ProgressBarSize = \"sm\" | \"md\" | \"lg\";\nexport type ProgressBarTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface ProgressBarProps {\n  value: number;\n  max?: number;\n  label?: React.ReactNode;\n  percentageLabel?: React.ReactNode;\n  showPercentage?: boolean;\n  size?: ProgressBarSize;\n  tone?: ProgressBarTone;\n  className?: string;\n  trackClassName?: string;\n  fillClassName?: string;\n  ariaLabel?: string;\n}\n\nconst sizeStyles: Record<\n  ProgressBarSize,\n  {\n    track: string;\n    label: string;\n    percentage: string;\n  }\n> = {\n  sm: {\n    track: \"h-1.5\",\n    label: \"text-xs\",\n    percentage: \"text-xs\",\n  },\n  md: {\n    track: \"h-2.5\",\n    label: \"text-sm\",\n    percentage: \"text-sm\",\n  },\n  lg: {\n    track: \"h-3.5\",\n    label: \"text-base\",\n    percentage: \"text-base\",\n  },\n};\n\nconst toneStyles: Record<\n  ProgressBarTone,\n  {\n    color: string;\n    trackBackground: string;\n  }\n> = {\n  default: {\n    color: \"var(--ds-chart-1)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(15, 23, 42, 0.08) 0%, rgba(30, 41, 59, 0.14) 100%)\",\n  },\n  success: {\n    color: \"var(--ds-chart-3)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(20, 83, 45, 0.12) 0%, rgba(34, 197, 94, 0.18) 100%)\",\n  },\n  warning: {\n    color: \"var(--ds-chart-4)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(120, 53, 15, 0.12) 0%, rgba(245, 158, 11, 0.18) 100%)\",\n  },\n  danger: {\n    color: \"var(--ds-chart-5)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(127, 29, 29, 0.12) 0%, rgba(239, 68, 68, 0.18) 100%)\",\n  },\n  info: {\n    color: \"var(--ds-chart-2)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(30, 64, 175, 0.12) 0%, rgba(59, 130, 246, 0.18) 100%)\",\n  },\n};\n\nfunction clampValue(value: number, max: number): number {\n  if (!Number.isFinite(value)) {\n    return 0;\n  }\n\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function ProgressBar({\n  value,\n  max = 100,\n  label,\n  percentageLabel,\n  showPercentage = true,\n  size = \"md\",\n  tone = \"default\",\n  className = \"\",\n  trackClassName = \"\",\n  fillClassName = \"\",\n  ariaLabel = \"Progress\",\n}: ProgressBarProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const clampedValue = clampValue(value, safeMax);\n  const percentage = (clampedValue / safeMax) * 100;\n  const roundedPercentage = Math.round(percentage);\n  const toneStyle = toneStyles[tone];\n  const resolvedPercentageLabel = percentageLabel ?? `${roundedPercentage}%`;\n\n  return (\n    <div className={`w-full space-y-3 ${className}`}>\n      {(label || showPercentage) && (\n        <div className=\"flex items-center justify-between gap-4\">\n          <div\n            className={`font-mono font-semibold tracking-[0.08em] text-ds-1 ${sizeStyles[size].label}`}\n          >\n            {label}\n          </div>\n          {showPercentage && (\n            <div\n              className={`font-mono font-medium tracking-[0.08em] text-ds-2 ${sizeStyles[size].percentage}`}\n            >\n              {resolvedPercentageLabel}\n            </div>\n          )}\n        </div>\n      )}\n\n      <div\n        role=\"progressbar\"\n        aria-label={ariaLabel}\n        aria-valuemin={0}\n        aria-valuemax={safeMax}\n        aria-valuenow={Math.round(clampedValue)}\n        aria-valuetext={`${roundedPercentage}%`}\n        className={`relative overflow-hidden rounded-full border border-ds-border-2/50 bg-ds-surface-2/80 shadow-[inset_0_1px_1px_rgba(255,255,255,0.2)] ${sizeStyles[size].track} ${trackClassName}`}\n        style={{ background: toneStyle.trackBackground }}\n      >\n        <div\n          className={`h-full rounded-full transition-[width,filter,box-shadow] duration-500 ease-out ${fillClassName}`}\n          style={{\n            width: `${percentage}%`,\n            background: `linear-gradient(90deg, color-mix(in srgb, ${toneStyle.color} 68%, white 32%) 0%, ${toneStyle.color} 100%)`,\n            boxShadow: `inset 0 1px 0 rgba(255,255,255,0.4), 0 0 14px color-mix(in srgb, ${toneStyle.color} 32%, transparent)`,\n            filter: percentage > 0 ? \"saturate(1.05) brightness(1.02)\" : \"none\",\n          }}\n        />\n      </div>\n    </div>\n  );\n}\n","import { mergeClassNames } from \"../../../utils\";\n\nexport type CircularProgressTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface CircularProgressProps {\n  value: number;\n  max?: number;\n  size?: number;\n  strokeWidth?: number;\n  tone?: CircularProgressTone;\n  showValue?: boolean;\n  valueLabel?: string;\n  className?: string;\n  trackClassName?: string;\n  progressClassName?: string;\n  ariaLabel?: string;\n}\n\nconst toneColorMap: Record<CircularProgressTone, string> = {\n  default: \"var(--ds-chart-1)\",\n  success: \"var(--ds-chart-3)\",\n  warning: \"var(--ds-chart-4)\",\n  danger: \"var(--ds-chart-5)\",\n  info: \"var(--ds-chart-2)\",\n};\n\nfunction clamp(value: number, max: number): number {\n  if (!Number.isFinite(value)) return 0;\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function CircularProgress({\n  value,\n  max = 100,\n  size = 24,\n  strokeWidth = 3,\n  tone = \"default\",\n  showValue = false,\n  valueLabel,\n  className,\n  trackClassName,\n  progressClassName,\n  ariaLabel = \"Circular progress\",\n}: CircularProgressProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const safeValue = clamp(value, safeMax);\n  const percentage = (safeValue / safeMax) * 100;\n\n  const center = size / 2;\n  const radius = center - strokeWidth / 2;\n  const circumference = 2 * Math.PI * radius;\n  const dashOffset = circumference - (percentage / 100) * circumference;\n  const label = valueLabel ?? `${Math.round(percentage)}%`;\n\n  return (\n    <span\n      role=\"progressbar\"\n      aria-label={ariaLabel}\n      aria-valuemin={0}\n      aria-valuemax={safeMax}\n      aria-valuenow={Math.round(safeValue)}\n      aria-valuetext={label}\n      className={mergeClassNames(\n        \"relative inline-flex items-center justify-center\",\n        className,\n      )}\n      style={{ width: size, height: size }}\n    >\n      <svg\n        width={size}\n        height={size}\n        viewBox={`0 0 ${size} ${size}`}\n        className=\"-rotate-90\"\n      >\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke=\"var(--ds-border-2)\"\n          strokeOpacity={0.5}\n          strokeWidth={strokeWidth}\n          className={trackClassName}\n        />\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke={toneColorMap[tone]}\n          strokeWidth={strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={dashOffset}\n          className={mergeClassNames(\n            \"transition-[stroke-dashoffset] duration-500 ease-out\",\n            progressClassName,\n          )}\n        />\n      </svg>\n\n      {showValue ? (\n        <span className=\"absolute text-[10px] font-semibold leading-none text-ds-1\">\n          {Math.round(percentage)}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n\nexport { CircularProgress };\n"],"mappings":"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"}
+{"version":3,"file":"progress-bar-FfdFVvTT.cjs","names":[],"sources":["../../src/components/data-display/progress-bar/ProgressBar.tsx","../../src/components/data-display/progress-bar/CircularProgress.tsx"],"sourcesContent":["import React from \"react\";\n\nexport type ProgressBarSize = \"sm\" | \"md\" | \"lg\";\nexport type ProgressBarTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface ProgressBarProps {\n  value: number;\n  max?: number;\n  label?: React.ReactNode;\n  percentageLabel?: React.ReactNode;\n  showPercentage?: boolean;\n  size?: ProgressBarSize;\n  tone?: ProgressBarTone;\n  className?: string;\n  trackClassName?: string;\n  fillClassName?: string;\n  ariaLabel?: string;\n}\n\nconst sizeStyles: Record<\n  ProgressBarSize,\n  {\n    track: string;\n    label: string;\n    percentage: string;\n  }\n> = {\n  sm: {\n    track: \"h-1.5\",\n    label: \"text-xs\",\n    percentage: \"text-xs\",\n  },\n  md: {\n    track: \"h-2.5\",\n    label: \"text-sm\",\n    percentage: \"text-sm\",\n  },\n  lg: {\n    track: \"h-3.5\",\n    label: \"text-base\",\n    percentage: \"text-base\",\n  },\n};\n\nconst toneStyles: Record<\n  ProgressBarTone,\n  {\n    color: string;\n    trackBackground: string;\n  }\n> = {\n  default: {\n    color: \"var(--ds-chart-1)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(15, 23, 42, 0.08) 0%, rgba(30, 41, 59, 0.14) 100%)\",\n  },\n  success: {\n    color: \"var(--ds-chart-3)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(20, 83, 45, 0.12) 0%, rgba(34, 197, 94, 0.18) 100%)\",\n  },\n  warning: {\n    color: \"var(--ds-chart-4)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(120, 53, 15, 0.12) 0%, rgba(245, 158, 11, 0.18) 100%)\",\n  },\n  danger: {\n    color: \"var(--ds-chart-5)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(127, 29, 29, 0.12) 0%, rgba(239, 68, 68, 0.18) 100%)\",\n  },\n  info: {\n    color: \"var(--ds-chart-2)\",\n    trackBackground:\n      \"linear-gradient(90deg, rgba(30, 64, 175, 0.12) 0%, rgba(59, 130, 246, 0.18) 100%)\",\n  },\n};\n\nfunction clampValue(value: number, max: number): number {\n  if (!Number.isFinite(value)) {\n    return 0;\n  }\n\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function ProgressBar({\n  value,\n  max = 100,\n  label,\n  percentageLabel,\n  showPercentage = true,\n  size = \"md\",\n  tone = \"default\",\n  className = \"\",\n  trackClassName = \"\",\n  fillClassName = \"\",\n  ariaLabel = \"Progress\",\n}: ProgressBarProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const clampedValue = clampValue(value, safeMax);\n  const percentage = (clampedValue / safeMax) * 100;\n  const roundedPercentage = Math.round(percentage);\n  const toneStyle = toneStyles[tone];\n  const resolvedPercentageLabel = percentageLabel ?? `${roundedPercentage}%`;\n\n  return (\n    <div className={`w-full space-y-3 ${className}`}>\n      {(label || showPercentage) && (\n        <div className=\"flex items-center justify-between gap-4\">\n          <div\n            className={`font-mono font-semibold tracking-[0.08em] text-ds-1 ${sizeStyles[size].label}`}\n          >\n            {label}\n          </div>\n          {showPercentage && (\n            <div\n              className={`font-mono font-medium tracking-[0.08em] text-ds-2 ${sizeStyles[size].percentage}`}\n            >\n              {resolvedPercentageLabel}\n            </div>\n          )}\n        </div>\n      )}\n\n      <div\n        role=\"progressbar\"\n        aria-label={ariaLabel}\n        aria-valuemin={0}\n        aria-valuemax={safeMax}\n        aria-valuenow={Math.round(clampedValue)}\n        aria-valuetext={`${roundedPercentage}%`}\n        className={`relative overflow-hidden rounded-full border border-ds-border-2/50 bg-ds-surface-2/80 shadow-[inset_0_1px_1px_rgba(255,255,255,0.2)] ${sizeStyles[size].track} ${trackClassName}`}\n        style={{ background: toneStyle.trackBackground }}\n      >\n        <div\n          className={`h-full rounded-full transition-[width,filter,box-shadow] duration-500 ease-out ${fillClassName}`}\n          style={{\n            width: `${percentage}%`,\n            background: `linear-gradient(90deg, color-mix(in srgb, ${toneStyle.color} 68%, white 32%) 0%, ${toneStyle.color} 100%)`,\n            boxShadow: `inset 0 1px 0 rgba(255,255,255,0.4), 0 0 14px color-mix(in srgb, ${toneStyle.color} 32%, transparent)`,\n            filter: percentage > 0 ? \"saturate(1.05) brightness(1.02)\" : \"none\",\n          }}\n        />\n      </div>\n    </div>\n  );\n}\n","import { mergeClassNames } from \"../../../utils\";\n\nexport type CircularProgressTone =\n  | \"default\"\n  | \"success\"\n  | \"warning\"\n  | \"danger\"\n  | \"info\";\n\nexport interface CircularProgressProps {\n  value: number;\n  max?: number;\n  size?: number;\n  strokeWidth?: number;\n  tone?: CircularProgressTone;\n  showValue?: boolean;\n  valueLabel?: string;\n  className?: string;\n  trackClassName?: string;\n  progressClassName?: string;\n  ariaLabel?: string;\n}\n\nconst toneColorMap: Record<CircularProgressTone, string> = {\n  default: \"var(--ds-chart-1)\",\n  success: \"var(--ds-chart-3)\",\n  warning: \"var(--ds-chart-4)\",\n  danger: \"var(--ds-chart-5)\",\n  info: \"var(--ds-chart-2)\",\n};\n\nfunction clamp(value: number, max: number): number {\n  if (!Number.isFinite(value)) return 0;\n  return Math.min(Math.max(value, 0), max);\n}\n\nexport default function CircularProgress({\n  value,\n  max = 100,\n  size = 24,\n  strokeWidth = 3,\n  tone = \"default\",\n  showValue = false,\n  valueLabel,\n  className,\n  trackClassName,\n  progressClassName,\n  ariaLabel = \"Circular progress\",\n}: CircularProgressProps) {\n  const safeMax = Number.isFinite(max) && max > 0 ? max : 100;\n  const safeValue = clamp(value, safeMax);\n  const percentage = (safeValue / safeMax) * 100;\n\n  const center = size / 2;\n  const radius = center - strokeWidth / 2;\n  const circumference = 2 * Math.PI * radius;\n  const dashOffset = circumference - (percentage / 100) * circumference;\n  const label = valueLabel ?? `${Math.round(percentage)}%`;\n\n  return (\n    <span\n      role=\"progressbar\"\n      aria-label={ariaLabel}\n      aria-valuemin={0}\n      aria-valuemax={safeMax}\n      aria-valuenow={Math.round(safeValue)}\n      aria-valuetext={label}\n      className={mergeClassNames(\n        \"relative inline-flex items-center justify-center\",\n        className,\n      )}\n      style={{ width: size, height: size }}\n    >\n      <svg\n        width={size}\n        height={size}\n        viewBox={`0 0 ${size} ${size}`}\n        className=\"-rotate-90\"\n      >\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke=\"var(--ds-border-2)\"\n          strokeOpacity={0.5}\n          strokeWidth={strokeWidth}\n          className={trackClassName}\n        />\n        <circle\n          cx={center}\n          cy={center}\n          r={radius}\n          fill=\"none\"\n          stroke={toneColorMap[tone]}\n          strokeWidth={strokeWidth}\n          strokeLinecap=\"round\"\n          strokeDasharray={circumference}\n          strokeDashoffset={dashOffset}\n          className={mergeClassNames(\n            \"transition-[stroke-dashoffset] duration-500 ease-out\",\n            progressClassName,\n          )}\n        />\n      </svg>\n\n      {showValue ? (\n        <span className=\"absolute text-[10px] font-semibold leading-none text-ds-1\">\n          {Math.round(percentage)}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n\nexport { CircularProgress };\n"],"mappings":"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"}

package/dist/chunks/{radio-CuiM_gDv.mjs → radio-BMOnxnUS.mjs}

@@ -47,4 +47,4 @@ Radio.displayName = "Radio";
 //#endregion
 export { Radio as t };
 
-//# sourceMappingURL=radio-CuiM_gDv.mjs.map
+//# sourceMappingURL=radio-BMOnxnUS.mjs.map

package/dist/chunks/{radio-CuiM_gDv.mjs.map → radio-BMOnxnUS.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"radio-CuiM_gDv.mjs","names":[],"sources":["../../src/components/forms/radio/Radio.tsx"],"sourcesContent":["import type { RadioProps, RadioColor } from \"./types\";\nimport { forwardRef, useId } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\n\nconst colorMap: Record<RadioColor, string> = {\n  red: \"var(--ds-color-danger)\",\n  blue: \"var(--ds-color-info)\",\n  green: \"var(--ds-color-success)\",\n  yellow: \"var(--ds-color-warning)\",\n  teal: \"var(--ds-brand-teal)\",\n  primary: \"var(--ds-color-accent)\",\n};\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n  (\n    {\n      className = \"\",\n      label,\n      error,\n      id,\n      color = \"primary\",\n      bgClassName = \"\",\n      ...props\n    },\n    ref,\n  ) => {\n    const generatedId = useId();\n    const radioId = id || `radio-${sanitizeId(generatedId)}`;\n\n    return (\n      <div\n        className=\"flex flex-col\"\n        style={{ \"--radio-accent\": colorMap[color] } as React.CSSProperties}\n      >\n        <div className=\"flex items-center gap-2\">\n          {/* Custom radio visual — keeps native input for full a11y */}\n          <div className=\"relative h-5 w-5 shrink-0\">\n            <input\n              ref={ref}\n              type=\"radio\"\n              id={radioId}\n              className={mergeClassNames(\n                \"peer absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed\",\n                className,\n              )}\n              {...props}\n            />\n            {/* Outer ring: surface-1 bg + border when idle, accent fill when checked */}\n            <span\n              className={mergeClassNames(\n                \"pointer-events-none absolute inset-0 rounded-full border-2 transition-colors duration-150\",\n                \"border-ds-border-field bg-ds-surface-1\",\n                \"peer-checked:border-(--radio-accent) peer-checked:bg-(--radio-accent)\",\n                \"peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2\",\n                \"peer-focus-visible:ring-[var(--radio-accent)] peer-focus-visible:ring-offset-ds-surface-1\",\n                \"peer-disabled:opacity-50\",\n                bgClassName,\n              )}\n            />\n            {/* Inner dot: always white, scales in/out with checked state */}\n            <span className=\"pointer-events-none absolute left-1/2 top-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 scale-0 rounded-full bg-white transition-transform duration-150 peer-checked:scale-100 peer-disabled:opacity-50\" />\n          </div>\n\n          {label && (\n            <label\n              htmlFor={radioId}\n              className=\"cursor-pointer text-sm font-medium leading-none text-ds-1\"\n            >\n              {label}\n            </label>\n          )}\n        </div>\n\n        {error && (\n          <p className=\"ms-7 mt-1 text-sm font-medium text-destructive\">\n            {error}\n          </p>\n        )}\n      </div>\n    );\n  },\n);\n\nRadio.displayName = \"Radio\";\n"],"mappings":";;;;AAKA,IAAM,cAAc,UAAkB,MAAM,QAAQ,mBAAmB,IAAI;AAE3E,IAAM,WAAuC;CAC3C,KAAK;CACL,MAAM;CACN,OAAO;CACP,QAAQ;CACR,MAAM;CACN,SAAS;CACV;AAED,IAAa,QAAQ,YAEjB,EACE,YAAY,IACZ,OACA,OACA,IACA,QAAQ,WACR,cAAc,IACd,GAAG,SAEL,QACG;CACH,MAAM,cAAc,OAAO;CAC3B,MAAM,UAAU,MAAM,SAAS,WAAW,YAAY;AAEtD,QACE,qBAAC,OAAD;EACE,WAAU;EACV,OAAO,EAAE,kBAAkB,SAAS,QAAQ;YAF9C,CAIE,qBAAC,OAAD;GAAK,WAAU;aAAf,CAEE,qBAAC,OAAD;IAAK,WAAU;cAAf;KACE,oBAAC,SAAD;MACO;MACL,MAAK;MACL,IAAI;MACJ,WAAW,gBACT,4FACA,UACD;MACD,GAAI;MACJ,CAAA;KAEF,oBAAC,QAAD,EACE,WAAW,gBACT,6FACA,0CACA,yEACA,8DACA,6FACA,4BACA,YACD,EACD,CAAA;KAEF,oBAAC,QAAD,EAAM,WAAU,2MAA4M,CAAA;KACxN;OAEL,SACC,oBAAC,SAAD;IACE,SAAS;IACT,WAAU;cAET;IACK,CAAA,CAEN;MAEL,SACC,oBAAC,KAAD;GAAG,WAAU;aACV;GACC,CAAA,CAEF;;EAGX;AAED,MAAM,cAAc"}
+{"version":3,"file":"radio-BMOnxnUS.mjs","names":[],"sources":["../../src/components/forms/radio/Radio.tsx"],"sourcesContent":["import type { RadioProps, RadioColor } from \"./types\";\nimport { forwardRef, useId } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\n\nconst colorMap: Record<RadioColor, string> = {\n  red: \"var(--ds-color-danger)\",\n  blue: \"var(--ds-color-info)\",\n  green: \"var(--ds-color-success)\",\n  yellow: \"var(--ds-color-warning)\",\n  teal: \"var(--ds-brand-teal)\",\n  primary: \"var(--ds-color-accent)\",\n};\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n  (\n    {\n      className = \"\",\n      label,\n      error,\n      id,\n      color = \"primary\",\n      bgClassName = \"\",\n      ...props\n    },\n    ref,\n  ) => {\n    const generatedId = useId();\n    const radioId = id || `radio-${sanitizeId(generatedId)}`;\n\n    return (\n      <div\n        className=\"flex flex-col\"\n        style={{ \"--radio-accent\": colorMap[color] } as React.CSSProperties}\n      >\n        <div className=\"flex items-center gap-2\">\n          {/* Custom radio visual — keeps native input for full a11y */}\n          <div className=\"relative h-5 w-5 shrink-0\">\n            <input\n              ref={ref}\n              type=\"radio\"\n              id={radioId}\n              className={mergeClassNames(\n                \"peer absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed\",\n                className,\n              )}\n              {...props}\n            />\n            {/* Outer ring: surface-1 bg + border when idle, accent fill when checked */}\n            <span\n              className={mergeClassNames(\n                \"pointer-events-none absolute inset-0 rounded-full border-2 transition-colors duration-150\",\n                \"border-ds-border-field bg-ds-surface-1\",\n                \"peer-checked:border-(--radio-accent) peer-checked:bg-(--radio-accent)\",\n                \"peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2\",\n                \"peer-focus-visible:ring-[var(--radio-accent)] peer-focus-visible:ring-offset-ds-surface-1\",\n                \"peer-disabled:opacity-50\",\n                bgClassName,\n              )}\n            />\n            {/* Inner dot: always white, scales in/out with checked state */}\n            <span className=\"pointer-events-none absolute left-1/2 top-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 scale-0 rounded-full bg-white transition-transform duration-150 peer-checked:scale-100 peer-disabled:opacity-50\" />\n          </div>\n\n          {label && (\n            <label\n              htmlFor={radioId}\n              className=\"cursor-pointer text-sm font-medium leading-none text-ds-1\"\n            >\n              {label}\n            </label>\n          )}\n        </div>\n\n        {error && (\n          <p className=\"ms-7 mt-1 text-sm font-medium text-destructive\">\n            {error}\n          </p>\n        )}\n      </div>\n    );\n  },\n);\n\nRadio.displayName = \"Radio\";\n"],"mappings":";;;;AAKA,IAAM,cAAc,UAAkB,MAAM,QAAQ,mBAAmB,IAAI;AAE3E,IAAM,WAAuC;CAC3C,KAAK;CACL,MAAM;CACN,OAAO;CACP,QAAQ;CACR,MAAM;CACN,SAAS;CACV;AAED,IAAa,QAAQ,YAEjB,EACE,YAAY,IACZ,OACA,OACA,IACA,QAAQ,WACR,cAAc,IACd,GAAG,SAEL,QACG;CACH,MAAM,cAAc,OAAO;CAC3B,MAAM,UAAU,MAAM,SAAS,WAAW,YAAY;AAEtD,QACE,qBAAC,OAAD;EACE,WAAU;EACV,OAAO,EAAE,kBAAkB,SAAS,QAAQ;YAF9C,CAIE,qBAAC,OAAD;GAAK,WAAU;aAAf,CAEE,qBAAC,OAAD;IAAK,WAAU;cAAf;KACE,oBAAC,SAAD;MACO;MACL,MAAK;MACL,IAAI;MACJ,WAAW,gBACT,4FACA,UACD;MACD,GAAI;MACJ,CAAA;KAEF,oBAAC,QAAD,EACE,WAAW,gBACT,6FACA,0CACA,yEACA,8DACA,6FACA,4BACA,YACD,EACD,CAAA;KAEF,oBAAC,QAAD,EAAM,WAAU,2MAA4M,CAAA;KACxN;OAEL,SACC,oBAAC,SAAD;IACE,SAAS;IACT,WAAU;cAET;IACK,CAAA,CAEN;MAEL,SACC,oBAAC,KAAD;GAAG,WAAU;aACV;GACC,CAAA,CAEF;;EAGX;AAED,MAAM,cAAc"}

package/dist/chunks/{radio-zx9xEW_C.cjs → radio-wagafWwx.cjs}

@@ -53,4 +53,4 @@ Object.defineProperty(exports, "Radio", {
 	}
 });
 
-//# sourceMappingURL=radio-zx9xEW_C.cjs.map
+//# sourceMappingURL=radio-wagafWwx.cjs.map

package/dist/chunks/{radio-zx9xEW_C.cjs.map → radio-wagafWwx.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"radio-zx9xEW_C.cjs","names":[],"sources":["../../src/components/forms/radio/Radio.tsx"],"sourcesContent":["import type { RadioProps, RadioColor } from \"./types\";\nimport { forwardRef, useId } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\n\nconst colorMap: Record<RadioColor, string> = {\n  red: \"var(--ds-color-danger)\",\n  blue: \"var(--ds-color-info)\",\n  green: \"var(--ds-color-success)\",\n  yellow: \"var(--ds-color-warning)\",\n  teal: \"var(--ds-brand-teal)\",\n  primary: \"var(--ds-color-accent)\",\n};\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n  (\n    {\n      className = \"\",\n      label,\n      error,\n      id,\n      color = \"primary\",\n      bgClassName = \"\",\n      ...props\n    },\n    ref,\n  ) => {\n    const generatedId = useId();\n    const radioId = id || `radio-${sanitizeId(generatedId)}`;\n\n    return (\n      <div\n        className=\"flex flex-col\"\n        style={{ \"--radio-accent\": colorMap[color] } as React.CSSProperties}\n      >\n        <div className=\"flex items-center gap-2\">\n          {/* Custom radio visual — keeps native input for full a11y */}\n          <div className=\"relative h-5 w-5 shrink-0\">\n            <input\n              ref={ref}\n              type=\"radio\"\n              id={radioId}\n              className={mergeClassNames(\n                \"peer absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed\",\n                className,\n              )}\n              {...props}\n            />\n            {/* Outer ring: surface-1 bg + border when idle, accent fill when checked */}\n            <span\n              className={mergeClassNames(\n                \"pointer-events-none absolute inset-0 rounded-full border-2 transition-colors duration-150\",\n                \"border-ds-border-field bg-ds-surface-1\",\n                \"peer-checked:border-(--radio-accent) peer-checked:bg-(--radio-accent)\",\n                \"peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2\",\n                \"peer-focus-visible:ring-[var(--radio-accent)] peer-focus-visible:ring-offset-ds-surface-1\",\n                \"peer-disabled:opacity-50\",\n                bgClassName,\n              )}\n            />\n            {/* Inner dot: always white, scales in/out with checked state */}\n            <span className=\"pointer-events-none absolute left-1/2 top-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 scale-0 rounded-full bg-white transition-transform duration-150 peer-checked:scale-100 peer-disabled:opacity-50\" />\n          </div>\n\n          {label && (\n            <label\n              htmlFor={radioId}\n              className=\"cursor-pointer text-sm font-medium leading-none text-ds-1\"\n            >\n              {label}\n            </label>\n          )}\n        </div>\n\n        {error && (\n          <p className=\"ms-7 mt-1 text-sm font-medium text-destructive\">\n            {error}\n          </p>\n        )}\n      </div>\n    );\n  },\n);\n\nRadio.displayName = \"Radio\";\n"],"mappings":";;;;;AAKA,IAAM,cAAc,UAAkB,MAAM,QAAQ,mBAAmB,IAAI;AAE3E,IAAM,WAAuC;CAC3C,KAAK;CACL,MAAM;CACN,OAAO;CACP,QAAQ;CACR,MAAM;CACN,SAAS;CACV;AAED,IAAa,SAAA,GAAA,MAAA,aAET,EACE,YAAY,IACZ,OACA,OACA,IACA,QAAQ,WACR,cAAc,IACd,GAAG,SAEL,QACG;CACH,MAAM,eAAA,GAAA,MAAA,QAAqB;CAC3B,MAAM,UAAU,MAAM,SAAS,WAAW,YAAY;AAEtD,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAU;EACV,OAAO,EAAE,kBAAkB,SAAS,QAAQ;YAF9C,CAIE,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf,CAEE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf;KACE,iBAAA,GAAA,kBAAA,KAAC,SAAD;MACO;MACL,MAAK;MACL,IAAI;MACJ,WAAW,cAAA,gBACT,4FACA,UACD;MACD,GAAI;MACJ,CAAA;KAEF,iBAAA,GAAA,kBAAA,KAAC,QAAD,EACE,WAAW,cAAA,gBACT,6FACA,0CACA,yEACA,8DACA,6FACA,4BACA,YACD,EACD,CAAA;KAEF,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,WAAU,2MAA4M,CAAA;KACxN;OAEL,SACC,iBAAA,GAAA,kBAAA,KAAC,SAAD;IACE,SAAS;IACT,WAAU;cAET;IACK,CAAA,CAEN;MAEL,SACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;GAAG,WAAU;aACV;GACC,CAAA,CAEF;;EAGX;AAED,MAAM,cAAc"}
+{"version":3,"file":"radio-wagafWwx.cjs","names":[],"sources":["../../src/components/forms/radio/Radio.tsx"],"sourcesContent":["import type { RadioProps, RadioColor } from \"./types\";\nimport { forwardRef, useId } from \"react\";\n\nimport { mergeClassNames } from \"../../../utils\";\n\nconst sanitizeId = (value: string) => value.replace(/[^a-zA-Z0-9_-]/g, \"-\");\n\nconst colorMap: Record<RadioColor, string> = {\n  red: \"var(--ds-color-danger)\",\n  blue: \"var(--ds-color-info)\",\n  green: \"var(--ds-color-success)\",\n  yellow: \"var(--ds-color-warning)\",\n  teal: \"var(--ds-brand-teal)\",\n  primary: \"var(--ds-color-accent)\",\n};\n\nexport const Radio = forwardRef<HTMLInputElement, RadioProps>(\n  (\n    {\n      className = \"\",\n      label,\n      error,\n      id,\n      color = \"primary\",\n      bgClassName = \"\",\n      ...props\n    },\n    ref,\n  ) => {\n    const generatedId = useId();\n    const radioId = id || `radio-${sanitizeId(generatedId)}`;\n\n    return (\n      <div\n        className=\"flex flex-col\"\n        style={{ \"--radio-accent\": colorMap[color] } as React.CSSProperties}\n      >\n        <div className=\"flex items-center gap-2\">\n          {/* Custom radio visual — keeps native input for full a11y */}\n          <div className=\"relative h-5 w-5 shrink-0\">\n            <input\n              ref={ref}\n              type=\"radio\"\n              id={radioId}\n              className={mergeClassNames(\n                \"peer absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed\",\n                className,\n              )}\n              {...props}\n            />\n            {/* Outer ring: surface-1 bg + border when idle, accent fill when checked */}\n            <span\n              className={mergeClassNames(\n                \"pointer-events-none absolute inset-0 rounded-full border-2 transition-colors duration-150\",\n                \"border-ds-border-field bg-ds-surface-1\",\n                \"peer-checked:border-(--radio-accent) peer-checked:bg-(--radio-accent)\",\n                \"peer-focus-visible:ring-2 peer-focus-visible:ring-offset-2\",\n                \"peer-focus-visible:ring-[var(--radio-accent)] peer-focus-visible:ring-offset-ds-surface-1\",\n                \"peer-disabled:opacity-50\",\n                bgClassName,\n              )}\n            />\n            {/* Inner dot: always white, scales in/out with checked state */}\n            <span className=\"pointer-events-none absolute left-1/2 top-1/2 h-2 w-2 -translate-x-1/2 -translate-y-1/2 scale-0 rounded-full bg-white transition-transform duration-150 peer-checked:scale-100 peer-disabled:opacity-50\" />\n          </div>\n\n          {label && (\n            <label\n              htmlFor={radioId}\n              className=\"cursor-pointer text-sm font-medium leading-none text-ds-1\"\n            >\n              {label}\n            </label>\n          )}\n        </div>\n\n        {error && (\n          <p className=\"ms-7 mt-1 text-sm font-medium text-destructive\">\n            {error}\n          </p>\n        )}\n      </div>\n    );\n  },\n);\n\nRadio.displayName = \"Radio\";\n"],"mappings":";;;;;AAKA,IAAM,cAAc,UAAkB,MAAM,QAAQ,mBAAmB,IAAI;AAE3E,IAAM,WAAuC;CAC3C,KAAK;CACL,MAAM;CACN,OAAO;CACP,QAAQ;CACR,MAAM;CACN,SAAS;CACV;AAED,IAAa,SAAA,GAAA,MAAA,aAET,EACE,YAAY,IACZ,OACA,OACA,IACA,QAAQ,WACR,cAAc,IACd,GAAG,SAEL,QACG;CACH,MAAM,eAAA,GAAA,MAAA,QAAqB;CAC3B,MAAM,UAAU,MAAM,SAAS,WAAW,YAAY;AAEtD,QACE,iBAAA,GAAA,kBAAA,MAAC,OAAD;EACE,WAAU;EACV,OAAO,EAAE,kBAAkB,SAAS,QAAQ;YAF9C,CAIE,iBAAA,GAAA,kBAAA,MAAC,OAAD;GAAK,WAAU;aAAf,CAEE,iBAAA,GAAA,kBAAA,MAAC,OAAD;IAAK,WAAU;cAAf;KACE,iBAAA,GAAA,kBAAA,KAAC,SAAD;MACO;MACL,MAAK;MACL,IAAI;MACJ,WAAW,cAAA,gBACT,4FACA,UACD;MACD,GAAI;MACJ,CAAA;KAEF,iBAAA,GAAA,kBAAA,KAAC,QAAD,EACE,WAAW,cAAA,gBACT,6FACA,0CACA,yEACA,8DACA,6FACA,4BACA,YACD,EACD,CAAA;KAEF,iBAAA,GAAA,kBAAA,KAAC,QAAD,EAAM,WAAU,2MAA4M,CAAA;KACxN;OAEL,SACC,iBAAA,GAAA,kBAAA,KAAC,SAAD;IACE,SAAS;IACT,WAAU;cAET;IACK,CAAA,CAEN;MAEL,SACC,iBAAA,GAAA,kBAAA,KAAC,KAAD;GAAG,WAAU;aACV;GACC,CAAA,CAEF;;EAGX;AAED,MAAM,cAAc"}

package/dist/chunks/{select-CUaSNR09.mjs → select--DeSgPdn.mjs}

@@ -1,7 +1,7 @@
 import { n as mergeClassNames } from "./utils-7S0u48mU.mjs";
-import { t as TruncatedText } from "./truncated-text-C9t9o9IA.mjs";
-import { J as CheckIcon, N as ChevronDownIcon } from "./icons-bx3nrxNv.mjs";
-import { t as DropdownMenu } from "./DropdownMenu-BtTOri-A.mjs";
+import { t as TruncatedText } from "./truncated-text-DUYTW1KP.mjs";
+import { M as ChevronDownIcon, q as CheckIcon } from "./icons-JzMKLygv.mjs";
+import { t as DropdownMenu } from "./DropdownMenu-BQ4WlaGp.mjs";
 import { forwardRef, useEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { motion, useMotionTemplate, useMotionValue } from "framer-motion";
@@ -168,4 +168,4 @@ Select.displayName = "Select";
 //#endregion
 export { Select as t };
 
-//# sourceMappingURL=select-CUaSNR09.mjs.map
+//# sourceMappingURL=select--DeSgPdn.mjs.map

package/dist/chunks/{select-CUaSNR09.mjs.map → select--DeSgPdn.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"select-CUaSNR09.mjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n  {\n    className = \"\",\n    containerClassName = \"\",\n    triggerClassName = \"\",\n    dropdownClassName = \"\",\n    optionClassName = \"\",\n    label,\n    error,\n    helperText,\n    options,\n    value,\n    onChange,\n    placeholder = \"Select...\",\n    noOptionsText = \"No options\",\n    disabled,\n    bgClassName = \"bg-ds-surface-1\",\n    size = \"default\",\n    selectionIndicator = \"check\",\n    ...props\n  }: SelectProps,\n  ref: ForwardedRef<HTMLSelectElement>,\n) {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n  const selectedOptionRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const isCompact = size === \"compact\";\n  const selectedOption = options.find((option) => option.value === value);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") {\n      ref(hiddenSelectRef.current);\n      return;\n    }\n\n    if (ref) {\n      ref.current = hiddenSelectRef.current;\n    }\n  }, [ref]);\n\n  useEffect(() => {\n    if (!open || !selectedOptionRef.current) {\n      return;\n    }\n\n    const frameId = window.requestAnimationFrame(() => {\n      selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n    };\n  }, [open, value]);\n\n  const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handleSelect = (optionValue: string) => {\n    if (onChange && hiddenSelectRef.current) {\n      const syntheticEvent = {\n        target: { value: optionValue, name: props.name },\n        currentTarget: { value: optionValue, name: props.name },\n      } as ChangeEvent<HTMLSelectElement>;\n\n      onChange(syntheticEvent);\n    }\n\n    setOpen(false);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen((current) => !current);\n    }\n\n    if (event.key === \"Escape\") {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"w-full\",\n        isCompact ? \"min-w-0\" : \"min-w-48\",\n        containerClassName,\n      )}\n    >\n      {label ? (\n        <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n          {label}\n        </label>\n      ) : null}\n\n      <select\n        ref={hiddenSelectRef}\n        className=\"sr-only\"\n        value={value}\n        onChange={onChange}\n        disabled={disabled}\n        {...props}\n      >\n        <option value=\"\">{placeholder}</option>\n        {options.map((option) => (\n          <option key={option.value} value={option.value}>\n            {option.label}\n          </option>\n        ))}\n      </select>\n\n      <DropdownMenu\n        className={mergeClassNames(\"w-full\", className)}\n        open={open}\n        onOpenChange={(nextOpen) => {\n          if (disabled) {\n            setOpen(false);\n            return;\n          }\n\n          setOpen(nextOpen);\n        }}\n        panelClassName={mergeClassNames(\n          \"start-0 top-[40px] z-20 mt-1 flex w-full flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n          isCompact ? \"max-h-56\" : \"max-h-60\",\n          dropdownClassName,\n        )}\n        animationClassName=\"origin-top-left\"\n        trigger={\n          <motion.div\n            style={{\n              backgroundImage: disabled\n                ? \"none\"\n                : useMotionTemplate`\n                  radial-gradient(\n                    ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n            }}\n            onMouseMove={!disabled ? handleMouseMove : undefined}\n            onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n            onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n            className={mergeClassNames(\n              \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n              disabled\n                ? \"border-none bg-ds-surface-1\"\n                : error\n                  ? \"border-ds-state-error-border\"\n                  : \"border-ds-border-2\",\n            )}\n          >\n            <div\n              className={mergeClassNames(\n                \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n                isCompact\n                  ? \"h-9 px-2.5 py-2 text-sm\"\n                  : \"h-10 px-3 py-2 text-sm\",\n                bgClassName,\n                disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n                error\n                  ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n                  : \"\",\n                triggerClassName,\n              )}\n              onKeyDown={handleKeyDown}\n              role=\"button\"\n              tabIndex={disabled ? -1 : 0}\n              aria-haspopup=\"listbox\"\n              aria-expanded={open}\n            >\n              {selectedOption ? (\n                <TruncatedText\n                  as=\"span\"\n                  showTitleOnHover\n                  className=\"flex-1 text-ds-1\"\n                >\n                  {selectedOption.label}\n                </TruncatedText>\n              ) : (\n                <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n                  {placeholder}\n                </TruncatedText>\n              )}\n\n              <span\n                className={mergeClassNames(\n                  \"ms-2 shrink-0 text-ds-2 transition-transform duration-300\",\n                  open ? \"rotate-180\" : \"rotate-0\",\n                )}\n              >\n                <ChevronDownIcon\n                  width={24}\n                  height={24}\n                  color=\"currentColor\"\n                  className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n                />\n              </span>\n            </div>\n          </motion.div>\n        }\n      >\n        {!disabled ? (\n          <>\n            {options.length === 0 ? (\n              <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n            ) : null}\n\n            {options.map((option) => (\n              <div\n                key={option.value}\n                ref={option.value === value ? selectedOptionRef : null}\n                className={mergeClassNames(\n                  \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n                  isCompact\n                    ? \"gap-1.5 px-2.5 py-2 text-sm\"\n                    : \"gap-2 px-3 py-2 text-sm\",\n                  option.value === value\n                    ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n                    : \"\",\n                  \"hover:bg-ds-accent hover:text-ds-on-accent\",\n                  optionClassName,\n                )}\n                onClick={() => handleSelect(option.value)}\n              >\n                {selectionIndicator === \"check\" ? (\n                  <span\n                    className={mergeClassNames(\n                      \"flex items-center justify-center\",\n                      isCompact ? \"w-4\" : \"w-5\",\n                    )}\n                  >\n                    {option.value === value ? (\n                      <CheckIcon\n                        className=\"text-ds-1\"\n                        width={isCompact ? 16 : 18}\n                        height={isCompact ? 16 : 18}\n                      />\n                    ) : null}\n                  </span>\n                ) : null}\n                <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n                  {option.label}\n                </TruncatedText>\n              </div>\n            ))}\n          </>\n        ) : null}\n      </DropdownMenu>\n\n      {error ? (\n        <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n          {error}\n        </p>\n      ) : null}\n      {helperText && !error ? (\n        <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n      ) : null}\n    </div>\n  );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}
+{"version":3,"file":"select--DeSgPdn.mjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n  {\n    className = \"\",\n    containerClassName = \"\",\n    triggerClassName = \"\",\n    dropdownClassName = \"\",\n    optionClassName = \"\",\n    label,\n    error,\n    helperText,\n    options,\n    value,\n    onChange,\n    placeholder = \"Select...\",\n    noOptionsText = \"No options\",\n    disabled,\n    bgClassName = \"bg-ds-surface-1\",\n    size = \"default\",\n    selectionIndicator = \"check\",\n    ...props\n  }: SelectProps,\n  ref: ForwardedRef<HTMLSelectElement>,\n) {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n  const selectedOptionRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const isCompact = size === \"compact\";\n  const selectedOption = options.find((option) => option.value === value);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") {\n      ref(hiddenSelectRef.current);\n      return;\n    }\n\n    if (ref) {\n      ref.current = hiddenSelectRef.current;\n    }\n  }, [ref]);\n\n  useEffect(() => {\n    if (!open || !selectedOptionRef.current) {\n      return;\n    }\n\n    const frameId = window.requestAnimationFrame(() => {\n      selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n    };\n  }, [open, value]);\n\n  const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handleSelect = (optionValue: string) => {\n    if (onChange && hiddenSelectRef.current) {\n      const syntheticEvent = {\n        target: { value: optionValue, name: props.name },\n        currentTarget: { value: optionValue, name: props.name },\n      } as ChangeEvent<HTMLSelectElement>;\n\n      onChange(syntheticEvent);\n    }\n\n    setOpen(false);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen((current) => !current);\n    }\n\n    if (event.key === \"Escape\") {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"w-full\",\n        isCompact ? \"min-w-0\" : \"min-w-48\",\n        containerClassName,\n      )}\n    >\n      {label ? (\n        <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n          {label}\n        </label>\n      ) : null}\n\n      <select\n        ref={hiddenSelectRef}\n        className=\"sr-only\"\n        value={value}\n        onChange={onChange}\n        disabled={disabled}\n        {...props}\n      >\n        <option value=\"\">{placeholder}</option>\n        {options.map((option) => (\n          <option key={option.value} value={option.value}>\n            {option.label}\n          </option>\n        ))}\n      </select>\n\n      <DropdownMenu\n        className={mergeClassNames(\"w-full\", className)}\n        open={open}\n        onOpenChange={(nextOpen) => {\n          if (disabled) {\n            setOpen(false);\n            return;\n          }\n\n          setOpen(nextOpen);\n        }}\n        panelClassName={mergeClassNames(\n          \"start-0 top-[40px] z-20 mt-1 flex w-full flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n          isCompact ? \"max-h-56\" : \"max-h-60\",\n          dropdownClassName,\n        )}\n        animationClassName=\"origin-top-left\"\n        trigger={\n          <motion.div\n            style={{\n              backgroundImage: disabled\n                ? \"none\"\n                : useMotionTemplate`\n                  radial-gradient(\n                    ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n            }}\n            onMouseMove={!disabled ? handleMouseMove : undefined}\n            onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n            onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n            className={mergeClassNames(\n              \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n              disabled\n                ? \"border-none bg-ds-surface-1\"\n                : error\n                  ? \"border-ds-state-error-border\"\n                  : \"border-ds-border-2\",\n            )}\n          >\n            <div\n              className={mergeClassNames(\n                \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n                isCompact\n                  ? \"h-9 px-2.5 py-2 text-sm\"\n                  : \"h-10 px-3 py-2 text-sm\",\n                bgClassName,\n                disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n                error\n                  ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n                  : \"\",\n                triggerClassName,\n              )}\n              onKeyDown={handleKeyDown}\n              role=\"button\"\n              tabIndex={disabled ? -1 : 0}\n              aria-haspopup=\"listbox\"\n              aria-expanded={open}\n            >\n              {selectedOption ? (\n                <TruncatedText\n                  as=\"span\"\n                  showTitleOnHover\n                  className=\"flex-1 text-ds-1\"\n                >\n                  {selectedOption.label}\n                </TruncatedText>\n              ) : (\n                <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n                  {placeholder}\n                </TruncatedText>\n              )}\n\n              <span\n                className={mergeClassNames(\n                  \"ms-2 shrink-0 text-ds-2 transition-transform duration-300\",\n                  open ? \"rotate-180\" : \"rotate-0\",\n                )}\n              >\n                <ChevronDownIcon\n                  width={24}\n                  height={24}\n                  color=\"currentColor\"\n                  className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n                />\n              </span>\n            </div>\n          </motion.div>\n        }\n      >\n        {!disabled ? (\n          <>\n            {options.length === 0 ? (\n              <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n            ) : null}\n\n            {options.map((option) => (\n              <div\n                key={option.value}\n                ref={option.value === value ? selectedOptionRef : null}\n                className={mergeClassNames(\n                  \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n                  isCompact\n                    ? \"gap-1.5 px-2.5 py-2 text-sm\"\n                    : \"gap-2 px-3 py-2 text-sm\",\n                  option.value === value\n                    ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n                    : \"\",\n                  \"hover:bg-ds-accent hover:text-ds-on-accent\",\n                  optionClassName,\n                )}\n                onClick={() => handleSelect(option.value)}\n              >\n                {selectionIndicator === \"check\" ? (\n                  <span\n                    className={mergeClassNames(\n                      \"flex items-center justify-center\",\n                      isCompact ? \"w-4\" : \"w-5\",\n                    )}\n                  >\n                    {option.value === value ? (\n                      <CheckIcon\n                        className=\"text-ds-1\"\n                        width={isCompact ? 16 : 18}\n                        height={isCompact ? 16 : 18}\n                      />\n                    ) : null}\n                  </span>\n                ) : null}\n                <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n                  {option.label}\n                </TruncatedText>\n              </div>\n            ))}\n          </>\n        ) : null}\n      </DropdownMenu>\n\n      {error ? (\n        <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n          {error}\n        </p>\n      ) : null}\n      {helperText && !error ? (\n        <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n      ) : null}\n    </div>\n  );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}

package/dist/chunks/{select-bZ9WqLOc.cjs → select-zFFyNmlY.cjs}

@@ -1,8 +1,8 @@
 require("./chunk-B_GkZjkl.cjs");
 const require_utils = require("./utils-LRbEQHYs.cjs");
-const require_truncated_text = require("./truncated-text-BIXqNfOL.cjs");
-const require_icons = require("./icons-CRanVZB1.cjs");
-const require_DropdownMenu = require("./DropdownMenu-BDrNYO-D.cjs");
+const require_truncated_text = require("./truncated-text-CswjmrHZ.cjs");
+const require_icons = require("./icons-ub9iu-JG.cjs");
+const require_DropdownMenu = require("./DropdownMenu-yh04burS.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let framer_motion = require("framer-motion");
@@ -174,4 +174,4 @@ Object.defineProperty(exports, "Select", {
 	}
 });
 
-//# sourceMappingURL=select-bZ9WqLOc.cjs.map
+//# sourceMappingURL=select-zFFyNmlY.cjs.map

package/dist/chunks/{select-bZ9WqLOc.cjs.map → select-zFFyNmlY.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"select-bZ9WqLOc.cjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n  {\n    className = \"\",\n    containerClassName = \"\",\n    triggerClassName = \"\",\n    dropdownClassName = \"\",\n    optionClassName = \"\",\n    label,\n    error,\n    helperText,\n    options,\n    value,\n    onChange,\n    placeholder = \"Select...\",\n    noOptionsText = \"No options\",\n    disabled,\n    bgClassName = \"bg-ds-surface-1\",\n    size = \"default\",\n    selectionIndicator = \"check\",\n    ...props\n  }: SelectProps,\n  ref: ForwardedRef<HTMLSelectElement>,\n) {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n  const selectedOptionRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const isCompact = size === \"compact\";\n  const selectedOption = options.find((option) => option.value === value);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") {\n      ref(hiddenSelectRef.current);\n      return;\n    }\n\n    if (ref) {\n      ref.current = hiddenSelectRef.current;\n    }\n  }, [ref]);\n\n  useEffect(() => {\n    if (!open || !selectedOptionRef.current) {\n      return;\n    }\n\n    const frameId = window.requestAnimationFrame(() => {\n      selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n    };\n  }, [open, value]);\n\n  const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handleSelect = (optionValue: string) => {\n    if (onChange && hiddenSelectRef.current) {\n      const syntheticEvent = {\n        target: { value: optionValue, name: props.name },\n        currentTarget: { value: optionValue, name: props.name },\n      } as ChangeEvent<HTMLSelectElement>;\n\n      onChange(syntheticEvent);\n    }\n\n    setOpen(false);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen((current) => !current);\n    }\n\n    if (event.key === \"Escape\") {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"w-full\",\n        isCompact ? \"min-w-0\" : \"min-w-48\",\n        containerClassName,\n      )}\n    >\n      {label ? (\n        <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n          {label}\n        </label>\n      ) : null}\n\n      <select\n        ref={hiddenSelectRef}\n        className=\"sr-only\"\n        value={value}\n        onChange={onChange}\n        disabled={disabled}\n        {...props}\n      >\n        <option value=\"\">{placeholder}</option>\n        {options.map((option) => (\n          <option key={option.value} value={option.value}>\n            {option.label}\n          </option>\n        ))}\n      </select>\n\n      <DropdownMenu\n        className={mergeClassNames(\"w-full\", className)}\n        open={open}\n        onOpenChange={(nextOpen) => {\n          if (disabled) {\n            setOpen(false);\n            return;\n          }\n\n          setOpen(nextOpen);\n        }}\n        panelClassName={mergeClassNames(\n          \"start-0 top-[40px] z-20 mt-1 flex w-full flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n          isCompact ? \"max-h-56\" : \"max-h-60\",\n          dropdownClassName,\n        )}\n        animationClassName=\"origin-top-left\"\n        trigger={\n          <motion.div\n            style={{\n              backgroundImage: disabled\n                ? \"none\"\n                : useMotionTemplate`\n                  radial-gradient(\n                    ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n            }}\n            onMouseMove={!disabled ? handleMouseMove : undefined}\n            onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n            onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n            className={mergeClassNames(\n              \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n              disabled\n                ? \"border-none bg-ds-surface-1\"\n                : error\n                  ? \"border-ds-state-error-border\"\n                  : \"border-ds-border-2\",\n            )}\n          >\n            <div\n              className={mergeClassNames(\n                \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n                isCompact\n                  ? \"h-9 px-2.5 py-2 text-sm\"\n                  : \"h-10 px-3 py-2 text-sm\",\n                bgClassName,\n                disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n                error\n                  ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n                  : \"\",\n                triggerClassName,\n              )}\n              onKeyDown={handleKeyDown}\n              role=\"button\"\n              tabIndex={disabled ? -1 : 0}\n              aria-haspopup=\"listbox\"\n              aria-expanded={open}\n            >\n              {selectedOption ? (\n                <TruncatedText\n                  as=\"span\"\n                  showTitleOnHover\n                  className=\"flex-1 text-ds-1\"\n                >\n                  {selectedOption.label}\n                </TruncatedText>\n              ) : (\n                <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n                  {placeholder}\n                </TruncatedText>\n              )}\n\n              <span\n                className={mergeClassNames(\n                  \"ms-2 shrink-0 text-ds-2 transition-transform duration-300\",\n                  open ? \"rotate-180\" : \"rotate-0\",\n                )}\n              >\n                <ChevronDownIcon\n                  width={24}\n                  height={24}\n                  color=\"currentColor\"\n                  className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n                />\n              </span>\n            </div>\n          </motion.div>\n        }\n      >\n        {!disabled ? (\n          <>\n            {options.length === 0 ? (\n              <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n            ) : null}\n\n            {options.map((option) => (\n              <div\n                key={option.value}\n                ref={option.value === value ? selectedOptionRef : null}\n                className={mergeClassNames(\n                  \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n                  isCompact\n                    ? \"gap-1.5 px-2.5 py-2 text-sm\"\n                    : \"gap-2 px-3 py-2 text-sm\",\n                  option.value === value\n                    ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n                    : \"\",\n                  \"hover:bg-ds-accent hover:text-ds-on-accent\",\n                  optionClassName,\n                )}\n                onClick={() => handleSelect(option.value)}\n              >\n                {selectionIndicator === \"check\" ? (\n                  <span\n                    className={mergeClassNames(\n                      \"flex items-center justify-center\",\n                      isCompact ? \"w-4\" : \"w-5\",\n                    )}\n                  >\n                    {option.value === value ? (\n                      <CheckIcon\n                        className=\"text-ds-1\"\n                        width={isCompact ? 16 : 18}\n                        height={isCompact ? 16 : 18}\n                      />\n                    ) : null}\n                  </span>\n                ) : null}\n                <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n                  {option.label}\n                </TruncatedText>\n              </div>\n            ))}\n          </>\n        ) : null}\n      </DropdownMenu>\n\n      {error ? (\n        <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n          {error}\n        </p>\n      ) : null}\n      {helperText && !error ? (\n        <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n      ) : null}\n    </div>\n  );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}
+{"version":3,"file":"select-zFFyNmlY.cjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n  {\n    className = \"\",\n    containerClassName = \"\",\n    triggerClassName = \"\",\n    dropdownClassName = \"\",\n    optionClassName = \"\",\n    label,\n    error,\n    helperText,\n    options,\n    value,\n    onChange,\n    placeholder = \"Select...\",\n    noOptionsText = \"No options\",\n    disabled,\n    bgClassName = \"bg-ds-surface-1\",\n    size = \"default\",\n    selectionIndicator = \"check\",\n    ...props\n  }: SelectProps,\n  ref: ForwardedRef<HTMLSelectElement>,\n) {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n  const selectedOptionRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const isCompact = size === \"compact\";\n  const selectedOption = options.find((option) => option.value === value);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") {\n      ref(hiddenSelectRef.current);\n      return;\n    }\n\n    if (ref) {\n      ref.current = hiddenSelectRef.current;\n    }\n  }, [ref]);\n\n  useEffect(() => {\n    if (!open || !selectedOptionRef.current) {\n      return;\n    }\n\n    const frameId = window.requestAnimationFrame(() => {\n      selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n    };\n  }, [open, value]);\n\n  const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handleSelect = (optionValue: string) => {\n    if (onChange && hiddenSelectRef.current) {\n      const syntheticEvent = {\n        target: { value: optionValue, name: props.name },\n        currentTarget: { value: optionValue, name: props.name },\n      } as ChangeEvent<HTMLSelectElement>;\n\n      onChange(syntheticEvent);\n    }\n\n    setOpen(false);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen((current) => !current);\n    }\n\n    if (event.key === \"Escape\") {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"w-full\",\n        isCompact ? \"min-w-0\" : \"min-w-48\",\n        containerClassName,\n      )}\n    >\n      {label ? (\n        <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n          {label}\n        </label>\n      ) : null}\n\n      <select\n        ref={hiddenSelectRef}\n        className=\"sr-only\"\n        value={value}\n        onChange={onChange}\n        disabled={disabled}\n        {...props}\n      >\n        <option value=\"\">{placeholder}</option>\n        {options.map((option) => (\n          <option key={option.value} value={option.value}>\n            {option.label}\n          </option>\n        ))}\n      </select>\n\n      <DropdownMenu\n        className={mergeClassNames(\"w-full\", className)}\n        open={open}\n        onOpenChange={(nextOpen) => {\n          if (disabled) {\n            setOpen(false);\n            return;\n          }\n\n          setOpen(nextOpen);\n        }}\n        panelClassName={mergeClassNames(\n          \"start-0 top-[40px] z-20 mt-1 flex w-full flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n          isCompact ? \"max-h-56\" : \"max-h-60\",\n          dropdownClassName,\n        )}\n        animationClassName=\"origin-top-left\"\n        trigger={\n          <motion.div\n            style={{\n              backgroundImage: disabled\n                ? \"none\"\n                : useMotionTemplate`\n                  radial-gradient(\n                    ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n            }}\n            onMouseMove={!disabled ? handleMouseMove : undefined}\n            onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n            onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n            className={mergeClassNames(\n              \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n              disabled\n                ? \"border-none bg-ds-surface-1\"\n                : error\n                  ? \"border-ds-state-error-border\"\n                  : \"border-ds-border-2\",\n            )}\n          >\n            <div\n              className={mergeClassNames(\n                \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n                isCompact\n                  ? \"h-9 px-2.5 py-2 text-sm\"\n                  : \"h-10 px-3 py-2 text-sm\",\n                bgClassName,\n                disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n                error\n                  ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n                  : \"\",\n                triggerClassName,\n              )}\n              onKeyDown={handleKeyDown}\n              role=\"button\"\n              tabIndex={disabled ? -1 : 0}\n              aria-haspopup=\"listbox\"\n              aria-expanded={open}\n            >\n              {selectedOption ? (\n                <TruncatedText\n                  as=\"span\"\n                  showTitleOnHover\n                  className=\"flex-1 text-ds-1\"\n                >\n                  {selectedOption.label}\n                </TruncatedText>\n              ) : (\n                <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n                  {placeholder}\n                </TruncatedText>\n              )}\n\n              <span\n                className={mergeClassNames(\n                  \"ms-2 shrink-0 text-ds-2 transition-transform duration-300\",\n                  open ? \"rotate-180\" : \"rotate-0\",\n                )}\n              >\n                <ChevronDownIcon\n                  width={24}\n                  height={24}\n                  color=\"currentColor\"\n                  className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n                />\n              </span>\n            </div>\n          </motion.div>\n        }\n      >\n        {!disabled ? (\n          <>\n            {options.length === 0 ? (\n              <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n            ) : null}\n\n            {options.map((option) => (\n              <div\n                key={option.value}\n                ref={option.value === value ? selectedOptionRef : null}\n                className={mergeClassNames(\n                  \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n                  isCompact\n                    ? \"gap-1.5 px-2.5 py-2 text-sm\"\n                    : \"gap-2 px-3 py-2 text-sm\",\n                  option.value === value\n                    ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n                    : \"\",\n                  \"hover:bg-ds-accent hover:text-ds-on-accent\",\n                  optionClassName,\n                )}\n                onClick={() => handleSelect(option.value)}\n              >\n                {selectionIndicator === \"check\" ? (\n                  <span\n                    className={mergeClassNames(\n                      \"flex items-center justify-center\",\n                      isCompact ? \"w-4\" : \"w-5\",\n                    )}\n                  >\n                    {option.value === value ? (\n                      <CheckIcon\n                        className=\"text-ds-1\"\n                        width={isCompact ? 16 : 18}\n                        height={isCompact ? 16 : 18}\n                      />\n                    ) : null}\n                  </span>\n                ) : null}\n                <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n                  {option.label}\n                </TruncatedText>\n              </div>\n            ))}\n          </>\n        ) : null}\n      </DropdownMenu>\n\n      {error ? (\n        <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n          {error}\n        </p>\n      ) : null}\n      {helperText && !error ? (\n        <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n      ) : null}\n    </div>\n  );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}

package/dist/chunks/{sidebar-Kkr45nuN.cjs → sidebar-Cq7UbKJT.cjs}

@@ -1,10 +1,10 @@
 require("./chunk-B_GkZjkl.cjs");
 const require_utils = require("./utils-LRbEQHYs.cjs");
-const require_icons = require("./icons-CRanVZB1.cjs");
-const require_button = require("./button-C4MXPxsC.cjs");
-const require_DropdownMenu = require("./DropdownMenu-BDrNYO-D.cjs");
-const require_typography = require("./typography-LwwY_MOy.cjs");
-const require_SunToMoonButton = require("./SunToMoonButton-jS4BJD9q.cjs");
+const require_icons = require("./icons-ub9iu-JG.cjs");
+const require_button = require("./button-uD87K76W.cjs");
+const require_DropdownMenu = require("./DropdownMenu-yh04burS.cjs");
+const require_typography = require("./typography-CFIiYk1d.cjs");
+const require_SunToMoonButton = require("./SunToMoonButton-gX4Kk_5B.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/navigation/sidebar/HamburgerIcon.tsx
@@ -85,6 +85,7 @@ function SidebarLinks({ items, activePath, onItemSelect, direction = "auto", cla
 					onClick: (event) => {
 						item.onSelect?.(event);
 						onItemSelect?.(item, event);
+						if (onItemSelect) event.preventDefault();
 					},
 					children: [
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
@@ -133,7 +134,7 @@ function Sidebar({ items, open, defaultOpen = false, onOpenChange, activePath, o
 	const [resolvedOpen, setOpen] = useControllableOpenState$1(open, defaultOpen, onOpenChange);
 	const content = (0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("aside", {
 		dir: direction === "auto" ? void 0 : direction,
-		className: require_utils.mergeClassNames("fixed inset-y-2 z-50 flex w-72 flex-col rounded-xl border border-ds-border-3 bg-ds-surface-1/92 p-3 shadow-[0_10px_28px_color-mix(in_srgb,var(--ds-color-fg)_9%,transparent)] backdrop-blur-xl", "transition-transform duration-200 ease-out xl:translate-x-0", direction === "rtl" ? "right-2" : "left-2", resolvedOpen ? "translate-x-0" : direction === "rtl" ? "translate-x-[110%] xl:translate-x-0" : "-translate-x-[110%] xl:translate-x-0", className),
+		className: require_utils.mergeClassNames("fixed inset-y-2 z-70 flex w-72 flex-col rounded-xl border border-ds-border-3 bg-ds-surface-1/92 p-3 shadow-[0_10px_28px_color-mix(in_srgb,var(--ds-color-fg)_9%,transparent)] backdrop-blur-xl", "transition-transform duration-200 ease-out xl:translate-x-0", direction === "rtl" ? "right-2" : "left-2", resolvedOpen ? "translate-x-0" : direction === "rtl" ? "translate-x-[110%] xl:translate-x-0" : "-translate-x-[110%] xl:translate-x-0", className),
 		style: {
 			backdropFilter: "blur(14px) saturate(120%)",
 			WebkitBackdropFilter: "blur(14px) saturate(120%)"
@@ -197,7 +198,7 @@ function Sidebar({ items, open, defaultOpen = false, onOpenChange, activePath, o
 		size: "small",
 		"aria-hidden": !resolvedOpen,
 		tabIndex: resolvedOpen ? 0 : -1,
-		className: require_utils.mergeClassNames("fixed inset-0 z-40 p-0! bg-black/30 backdrop-blur-[2px] transition-opacity duration-200 xl:hidden", resolvedOpen ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0", overlayClassName),
+		className: require_utils.mergeClassNames("fixed inset-0 z-65 p-0! bg-black/30 backdrop-blur-[2px] transition-opacity duration-200 xl:hidden", resolvedOpen ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0", overlayClassName),
 		onClick: () => setOpen(false)
 	})] });
 }
@@ -247,7 +248,7 @@ function useControllableOpenState(open, defaultOpen, onOpenChange) {
 		onOpenChange?.(nextOpen);
 	}, [isControlled, onOpenChange])];
 }
-function DashboardSidebarShell({ items, open, defaultOpen = false, onOpenChange, direction = "auto", activePath, onItemSelect, brand, sidebarNavbar, sidebarFooter, sidebarClassName, sidebarLinksClassName, sidebarItemClassName, sidebarActiveItemClassName, sidebarOverlayClassName, sidebarCloseLabel, showSidebarOverlay, header, headerLeading, headerActions, headerClassName, headerTitleClassName, headerActionsClassName, breadcrumb = "Pages / Dashboard", title = "Dashboard", children, className, contentClassName, mainClassName, autoHideOnMobileBreakpoint = true }) {
+function DashboardSidebarShell({ items, open, defaultOpen = false, onOpenChange, direction = "auto", activePath, onItemSelect, brand, sidebarNavbar, sidebarFooter, sidebarClassName, sidebarLinksClassName, sidebarItemClassName, sidebarActiveItemClassName, sidebarOverlayClassName, sidebarCloseLabel, showSidebarOverlay, header, headerLeading, headerActions, headerActionsLeading, headerActionsTrailing, headerClassName, headerTitleClassName, headerActionsClassName, breadcrumb = "Pages / Dashboard", title = "Dashboard", children, className, contentClassName, mainClassName, autoHideOnMobileBreakpoint = true }) {
 	const [resolvedOpen, setOpen] = useControllableOpenState(open, defaultOpen, onOpenChange);
 	const resolvedDirection = resolveDirection(direction);
 	const isRtl = resolvedDirection === "rtl";
@@ -352,17 +353,7 @@ function DashboardSidebarShell({ items, open, defaultOpen = false, onOpenChange,
 				})]
 			})
 		}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
-			type: "button",
-			variant: "tertiary",
-			size: "small",
-			className: "h-9 w-9 rounded-full p-0!",
-			"aria-label": "Toggle theme",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: "flex cursor-pointer rounded-full",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SunToMoonButton.SunToMoonButton, { showLabelAndImage: false })
-			})
-		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SunToMoonButton.SunToMoonButton, { showLabelAndImage: false }),
 		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_button.Button, {
 			type: "button",
 			variant: "tertiary",
@@ -444,7 +435,13 @@ function DashboardSidebarShell({ items, open, defaultOpen = false, onOpenChange,
 		toggleSidebar
 	]);
 	const resolvedHeaderLeading = resolveSlot(headerLeading, headerContext);
-	const resolvedHeaderActions = headerActions === void 0 ? defaultHeaderActions : resolveSlot(headerActions, headerContext);
+	const resolvedHeaderActionsLeading = headerActionsLeading ? resolveSlot(headerActionsLeading, headerContext) : null;
+	const resolvedHeaderActionsTrailing = headerActionsTrailing ? resolveSlot(headerActionsTrailing, headerContext) : null;
+	const resolvedHeaderActions = headerActions === void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		resolvedHeaderActionsLeading,
+		defaultHeaderActions,
+		resolvedHeaderActionsTrailing
+	] }) : resolveSlot(headerActions, headerContext);
 	const defaultHeader = (0, react.useMemo)(() => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("nav", {
 		dir: resolvedDirection,
 		className: require_utils.mergeClassNames("sticky top-2 z-40 mb-4 flex items-center rounded-md border border-ds-border-3 bg-ds-surface-1/95 px-4 py-3 shadow-[0_4px_14px_color-mix(in_srgb,var(--ds-color-fg)_8%,transparent)] backdrop-blur-md", headerClassName),
@@ -546,4 +543,4 @@ Object.defineProperty(exports, "SidebarLinks", {
 	}
 });
 
-//# sourceMappingURL=sidebar-Kkr45nuN.cjs.map
+//# sourceMappingURL=sidebar-Cq7UbKJT.cjs.map