@donkit-ai/design-system 1.1.23 → 1.1.24

package/dist/index.es.js

@@ -1,6 +1,6 @@
 import B, { useState as S, useRef as A, useEffect as L, useLayoutEffect as ve } from "react";
 import Q from "react-dom";
-import { ChevronDown as ee, Minus as je, Plus as _e, XCircle as fe, AlertTriangle as me, CheckCircle as pe, Info as he, X as le, Check as we, ChevronUp as Ne, ChevronsUpDown as ye } from "lucide-react";
+import { ChevronDown as ee, Minus as _e, Plus as je, XCircle as fe, AlertTriangle as me, CheckCircle as pe, Info as he, X as le, Check as we, ChevronUp as Ne, ChevronsUpDown as ye } from "lucide-react";
 const P = {
   1: 16,
   2: 20,
@@ -24,8 +24,8 @@ function Ee() {
   ce = 1;
   var s = Symbol.for("react.transitional.element"), e = Symbol.for("react.fragment");
   function r(l, n, a) {
-    var i = null;
-    if (a !== void 0 && (i = "" + a), n.key !== void 0 && (i = "" + n.key), "key" in n) {
+    var c = null;
+    if (a !== void 0 && (c = "" + a), n.key !== void 0 && (c = "" + n.key), "key" in n) {
       a = {};
       for (var d in n)
         d !== "key" && (a[d] = n[d]);
@@ -33,7 +33,7 @@ function Ee() {
     return n = a.ref, {
       $$typeof: s,
       type: l,
-      key: i,
+      key: c,
       ref: n !== void 0 ? n : null,
       props: a
     };
@@ -51,7 +51,7 @@ var X = {};
  * LICENSE file in the root directory of this source tree.
  */
 var ie;
-function Re() {
+function ge() {
   return ie || (ie = 1, process.env.NODE_ENV !== "production" && function() {
     function s(o) {
       if (o == null) return null;
@@ -61,7 +61,7 @@ function Re() {
       switch (o) {
         case y:
           return "Fragment";
-        case $:
+        case k:
           return "Profiler";
         case E:
           return "StrictMode";
@@ -69,16 +69,16 @@ function Re() {
           return "Suspense";
         case x:
           return "SuspenseList";
-        case C:
+        case M:
           return "Activity";
       }
       if (typeof o == "object")
         switch (typeof o.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), o.$$typeof) {
-          case j:
+          case _:
             return "Portal";
-          case g:
+          case $:
             return o.displayName || "Context";
           case w:
             return (o._context.displayName || "Context") + ".Consumer";
@@ -108,11 +108,11 @@ function Re() {
       }
       if (b) {
         b = console;
-        var N = b.error, R = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
+        var N = b.error, g = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
         return N.call(
           b,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          R
+          g
         ), e(o);
       }
     }
@@ -134,7 +134,7 @@ function Re() {
     function a() {
       return Error("react-stack-top-frame");
     }
-    function i(o) {
+    function c(o) {
       if (J.call(o, "key")) {
         var b = Object.getOwnPropertyDescriptor(o, "key").get;
         if (b && b.isReactWarning) return !1;
@@ -159,15 +159,15 @@ function Re() {
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), o = this.props.ref, o !== void 0 ? o : null;
     }
-    function u(o, b, N, R, Z, re) {
-      var k = N.ref;
+    function u(o, b, N, g, Z, re) {
+      var R = N.ref;
       return o = {
         $$typeof: v,
         type: o,
         key: b,
         props: N,
-        _owner: R
-      }, (k !== void 0 ? k : null) !== null ? Object.defineProperty(o, "ref", {
+        _owner: g
+      }, (R !== void 0 ? R : null) !== null ? Object.defineProperty(o, "ref", {
         enumerable: !1,
         get: p
       }) : Object.defineProperty(o, "ref", { enumerable: !1, value: null }), o._store = {}, Object.defineProperty(o._store, "validated", {
@@ -192,48 +192,48 @@ function Re() {
         value: re
       }), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
     }
-    function f(o, b, N, R, Z, re) {
-      var k = b.children;
-      if (k !== void 0)
-        if (R)
-          if (te(k)) {
-            for (R = 0; R < k.length; R++)
-              m(k[R]);
-            Object.freeze && Object.freeze(k);
+    function f(o, b, N, g, Z, re) {
+      var R = b.children;
+      if (R !== void 0)
+        if (g)
+          if (te(R)) {
+            for (g = 0; g < R.length; g++)
+              m(R[g]);
+            Object.freeze && Object.freeze(R);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else m(k);
+        else m(R);
       if (J.call(b, "key")) {
-        k = s(o);
+        R = s(o);
         var V = Object.keys(b).filter(function(xe) {
           return xe !== "key";
         });
-        R = 0 < V.length ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}", H[k + R] || (V = 0 < V.length ? "{" + V.join(": ..., ") + ": ...}" : "{}", console.error(
+        g = 0 < V.length ? "{key: someKey, " + V.join(": ..., ") + ": ...}" : "{key: someKey}", H[R + g] || (V = 0 < V.length ? "{" + V.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
+          g,
           R,
-          k,
           V,
-          k
-        ), H[k + R] = !0);
+          R
+        ), H[R + g] = !0);
       }
-      if (k = null, N !== void 0 && (r(N), k = "" + N), i(b) && (r(b.key), k = "" + b.key), "key" in b) {
+      if (R = null, N !== void 0 && (r(N), R = "" + N), c(b) && (r(b.key), R = "" + b.key), "key" in b) {
         N = {};
         for (var ne in b)
           ne !== "key" && (N[ne] = b[ne]);
       } else N = b;
-      return k && d(
+      return R && d(
         N,
         typeof o == "function" ? o.displayName || o.name || "Unknown" : o
       ), u(
         o,
-        k,
+        R,
         N,
         n(),
         Z,
@@ -246,44 +246,44 @@ React keys must be passed directly to JSX without using spread:
     function h(o) {
       return typeof o == "object" && o !== null && o.$$typeof === v;
     }
-    var c = B, v = Symbol.for("react.transitional.element"), j = Symbol.for("react.portal"), y = Symbol.for("react.fragment"), E = Symbol.for("react.strict_mode"), $ = Symbol.for("react.profiler"), w = Symbol.for("react.consumer"), g = Symbol.for("react.context"), W = Symbol.for("react.forward_ref"), z = Symbol.for("react.suspense"), x = Symbol.for("react.suspense_list"), T = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), C = Symbol.for("react.activity"), O = Symbol.for("react.client.reference"), D = c.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, J = Object.prototype.hasOwnProperty, te = Array.isArray, _ = console.createTask ? console.createTask : function() {
+    var i = B, v = Symbol.for("react.transitional.element"), _ = Symbol.for("react.portal"), y = Symbol.for("react.fragment"), E = Symbol.for("react.strict_mode"), k = Symbol.for("react.profiler"), w = Symbol.for("react.consumer"), $ = Symbol.for("react.context"), W = Symbol.for("react.forward_ref"), z = Symbol.for("react.suspense"), x = Symbol.for("react.suspense_list"), T = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), M = Symbol.for("react.activity"), O = Symbol.for("react.client.reference"), D = i.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, J = Object.prototype.hasOwnProperty, te = Array.isArray, j = console.createTask ? console.createTask : function() {
       return null;
     };
-    c = {
+    i = {
       react_stack_bottom_frame: function(o) {
         return o();
       }
     };
-    var F, q = {}, K = c.react_stack_bottom_frame.bind(
-      c,
+    var F, q = {}, K = i.react_stack_bottom_frame.bind(
+      i,
       a
-    )(), se = _(l(a)), H = {};
+    )(), se = j(l(a)), H = {};
     X.Fragment = y, X.jsx = function(o, b, N) {
-      var R = 1e4 > D.recentlyCreatedOwnerStacks++;
+      var g = 1e4 > D.recentlyCreatedOwnerStacks++;
       return f(
         o,
         b,
         N,
         !1,
-        R ? Error("react-stack-top-frame") : K,
-        R ? _(l(o)) : se
+        g ? Error("react-stack-top-frame") : K,
+        g ? j(l(o)) : se
       );
     }, X.jsxs = function(o, b, N) {
-      var R = 1e4 > D.recentlyCreatedOwnerStacks++;
+      var g = 1e4 > D.recentlyCreatedOwnerStacks++;
       return f(
         o,
         b,
         N,
         !0,
-        R ? Error("react-stack-top-frame") : K,
-        R ? _(l(o)) : se
+        g ? Error("react-stack-top-frame") : K,
+        g ? j(l(o)) : se
       );
     };
   }()), X;
 }
-process.env.NODE_ENV === "production" ? ae.exports = Ee() : ae.exports = Re();
+process.env.NODE_ENV === "production" ? ae.exports = Ee() : ae.exports = ge();
 var t = ae.exports;
-function ke({ size: s = "m", color: e = "default", className: r = "", ...l }) {
+function Re({ size: s = "m", color: e = "default", className: r = "", ...l }) {
   return /* @__PURE__ */ t.jsx(
     "span",
     {
@@ -294,35 +294,35 @@ function ke({ size: s = "m", color: e = "default", className: r = "", ...l }) {
     }
   );
 }
-function $e({
+function ke({
   children: s,
   variant: e = "primary",
   size: r = "m",
   fullWidth: l = !1,
   icon: n,
   disabled: a = !1,
-  state: i = "idle",
+  state: c = "idle",
   onClick: d,
   type: p = "button",
   href: u,
   "aria-label": f,
   ...m
 }) {
-  const h = n && !s, c = i === "loading", v = r === "l" ? "s" : "xs", j = [
+  const h = n && !s, i = c === "loading", v = r === "l" ? "s" : "xs", _ = [
     "ds-button",
     `ds-button--${e}`,
     `ds-button--${r}`,
     l && "ds-button--full",
     h && "ds-button--icon-only"
-  ].filter(Boolean).join(" "), y = i !== "idle" ? i : void 0, E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    c && /* @__PURE__ */ t.jsx(ke, { size: v }),
-    !c && n && !h && /* @__PURE__ */ t.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n }),
+  ].filter(Boolean).join(" "), y = c !== "idle" ? c : void 0, E = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    i && /* @__PURE__ */ t.jsx(Re, { size: v }),
+    !i && n && !h && /* @__PURE__ */ t.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n }),
     s,
-    !c && h && /* @__PURE__ */ t.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n })
+    !i && h && /* @__PURE__ */ t.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n })
   ] });
   if (u) {
-    const $ = (w) => {
-      if (a || c) {
+    const k = (w) => {
+      if (a || i) {
         w.preventDefault();
         return;
       }
@@ -331,12 +331,12 @@ function $e({
     return /* @__PURE__ */ t.jsx(
       "a",
       {
-        className: j,
-        href: a || c ? void 0 : u,
-        onClick: $,
+        className: _,
+        href: a || i ? void 0 : u,
+        onClick: k,
         "aria-label": f,
-        "aria-disabled": a || c ? "true" : void 0,
-        "aria-busy": c ? "true" : void 0,
+        "aria-disabled": a || i ? "true" : void 0,
+        "aria-busy": i ? "true" : void 0,
         "data-state": y,
         ...m,
         children: E
@@ -347,11 +347,11 @@ function $e({
     "button",
     {
       type: p,
-      className: j,
+      className: _,
       disabled: a,
-      onClick: c ? void 0 : d,
+      onClick: i ? void 0 : d,
       "aria-label": f,
-      "aria-busy": c ? "true" : void 0,
+      "aria-busy": i ? "true" : void 0,
       "data-state": y,
       ...m,
       children: E
@@ -365,13 +365,13 @@ function We({
   fullWidth: l = !0,
   icon: n,
   iconRight: a,
-  onIconRightClick: i,
+  onIconRightClick: c,
   size: d = "m",
   disabled: p,
   id: u,
   ...f
 }) {
-  const m = u || `input-${B.useId()}`, h = r ? `${m}-hint` : void 0, c = e ? `${m}-error` : void 0, v = c || h;
+  const m = u || `input-${B.useId()}`, h = r ? `${m}-hint` : void 0, i = e ? `${m}-error` : void 0, v = i || h;
   return /* @__PURE__ */ t.jsxs("div", { className: `ds-input-wrapper ${l ? "ds-input-wrapper--full" : ""} ${p ? "ds-input-wrapper--disabled" : ""} ${e ? "ds-input-wrapper--error" : ""}`, children: [
     s && /* @__PURE__ */ t.jsx("label", { className: "ds-input-label", htmlFor: m, children: s }),
     /* @__PURE__ */ t.jsxs("div", { className: "ds-input-container", children: [
@@ -392,7 +392,7 @@ function We({
         {
           type: "button",
           className: `ds-input-icon-right ds-input-icon-right--${d}`,
-          onClick: i,
+          onClick: c,
           tabIndex: -1,
           "aria-label": "Toggle visibility",
           children: a
@@ -400,7 +400,7 @@ function We({
       )
     ] }),
     r && !e && /* @__PURE__ */ t.jsx("span", { id: h, className: "ds-input-hint", children: r }),
-    /* @__PURE__ */ t.jsx("div", { className: "ds-input-error-wrap", children: /* @__PURE__ */ t.jsx("div", { className: "ds-input-error-inner", children: e && /* @__PURE__ */ t.jsx("span", { id: c, className: "ds-input-error", role: "alert", children: e }) }) })
+    /* @__PURE__ */ t.jsx("div", { className: "ds-input-error-wrap", children: /* @__PURE__ */ t.jsx("div", { className: "ds-input-error-inner", children: e && /* @__PURE__ */ t.jsx("span", { id: i, className: "ds-input-error", role: "alert", children: e }) }) })
   ] });
 }
 function ze({
@@ -410,12 +410,12 @@ function ze({
   fullWidth: l = !0,
   size: n = "m",
   disabled: a,
-  id: i,
+  id: c,
   resize: d = !0,
   rows: p = 3,
   ...u
 }) {
-  const f = i || `textarea-${B.useId()}`, m = r ? `${f}-hint` : void 0, h = e ? `${f}-error` : void 0, c = h || m;
+  const f = c || `textarea-${B.useId()}`, m = r ? `${f}-hint` : void 0, h = e ? `${f}-error` : void 0, i = h || m;
   return /* @__PURE__ */ t.jsxs("div", { className: `ds-textarea-wrapper ${l ? "ds-textarea-wrapper--full" : ""} ${a ? "ds-textarea-wrapper--disabled" : ""}`, children: [
     s && /* @__PURE__ */ t.jsx("label", { className: "ds-textarea-label", htmlFor: f, children: s }),
     /* @__PURE__ */ t.jsx(
@@ -425,7 +425,7 @@ function ze({
         className: `ds-textarea ds-textarea--${n} ${e ? "ds-textarea--error" : ""} ${d ? "" : "ds-textarea--no-resize"}`,
         disabled: a,
         "aria-invalid": e ? "true" : "false",
-        "aria-describedby": c,
+        "aria-describedby": i,
         rows: p,
         ...u
       }
@@ -441,25 +441,25 @@ function Ve({
   options: l = [],
   placeholder: n = "Select option",
   error: a,
-  fullWidth: i = !0,
+  fullWidth: c = !0,
   size: d = "m",
   disabled: p = !1,
   id: u,
   ...f
 }) {
-  const [m, h] = S(!1), [c, v] = S(!1), [j, y] = S({}), [E, $] = S("down"), w = A(null), g = A(null), W = A(null), z = u || `select-${B.useId()}`, x = `${z}-label`, T = a ? `${z}-error` : void 0, I = 150, C = () => {
-    c || (v(!0), W.current = setTimeout(() => {
+  const [m, h] = S(!1), [i, v] = S(!1), [_, y] = S({}), [E, k] = S("down"), w = A(null), $ = A(null), W = A(null), z = u || `select-${B.useId()}`, x = `${z}-label`, T = a ? `${z}-error` : void 0, I = 150, M = () => {
+    i || (v(!0), W.current = setTimeout(() => {
       h(!1), v(!1);
     }, I));
   };
   L(() => () => clearTimeout(W.current), []);
   const O = () => {
     var o;
-    const _ = (o = w.current) == null ? void 0 : o.getBoundingClientRect();
-    if (!_) return;
-    const F = window.innerHeight, q = F - _.bottom, K = _.top, H = q < 300 && K > q;
-    $(H ? "up" : "down"), y(
-      H ? { bottom: F - _.top + 4, left: _.left, width: _.width } : { top: _.bottom + 4, left: _.left, width: _.width }
+    const j = (o = w.current) == null ? void 0 : o.getBoundingClientRect();
+    if (!j) return;
+    const F = window.innerHeight, q = F - j.bottom, K = j.top, H = q < 300 && K > q;
+    k(H ? "up" : "down"), y(
+      H ? { bottom: F - j.top + 4, left: j.left, width: j.width } : { top: j.bottom + 4, left: j.left, width: j.width }
     );
   };
   L(() => {
@@ -468,41 +468,41 @@ function Ve({
         window.removeEventListener("scroll", O, !0), window.removeEventListener("resize", O);
       };
   }, [m]), L(() => {
-    const _ = (F) => {
-      w.current && !w.current.contains(F.target) && g.current && !g.current.contains(F.target) && C();
+    const j = (F) => {
+      w.current && !w.current.contains(F.target) && $.current && !$.current.contains(F.target) && M();
     };
-    return document.addEventListener("mousedown", _), () => document.removeEventListener("mousedown", _);
-  }, [c]);
-  const D = l.find((_) => _.value === e), J = d === "xs" ? P[1] : d === "small" ? P[2] : P[3], te = m && /* @__PURE__ */ t.jsx(
+    return document.addEventListener("mousedown", j), () => document.removeEventListener("mousedown", j);
+  }, [i]);
+  const D = l.find((j) => j.value === e), J = d === "xs" ? P[1] : d === "small" ? P[2] : P[3], te = m && /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: g,
+      ref: $,
       role: "listbox",
       "aria-labelledby": s ? x : void 0,
       className: [
         "ds-select-dropdown",
         `ds-select-dropdown--${d}`,
         `ds-select-dropdown--${E}`,
-        c && "ds-select-dropdown--closing"
+        i && "ds-select-dropdown--closing"
       ].filter(Boolean).join(" "),
-      style: j,
-      children: l.map((_) => /* @__PURE__ */ t.jsx(
+      style: _,
+      children: l.map((j) => /* @__PURE__ */ t.jsx(
         "button",
         {
           type: "button",
           role: "option",
-          "aria-selected": e === _.value,
-          className: `ds-select-option ds-select-option--${d} ${e === _.value ? "ds-select-option--selected" : ""}`,
+          "aria-selected": e === j.value,
+          className: `ds-select-option ds-select-option--${d} ${e === j.value ? "ds-select-option--selected" : ""}`,
           onClick: () => {
-            r == null || r(_.value), C();
+            r == null || r(j.value), M();
           },
-          children: _.label
+          children: j.label
         },
-        _.value
+        j.value
       ))
     }
   );
-  return /* @__PURE__ */ t.jsxs("div", { className: `ds-select-wrapper ${i ? "ds-select-wrapper--full" : ""} ${p ? "ds-select-wrapper--disabled" : ""}`, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: `ds-select-wrapper ${c ? "ds-select-wrapper--full" : ""} ${p ? "ds-select-wrapper--disabled" : ""}`, children: [
     s && /* @__PURE__ */ t.jsx("label", { id: x, className: "ds-select-label", children: s }),
     /* @__PURE__ */ t.jsx("div", { className: "ds-select-container", ref: w, children: /* @__PURE__ */ t.jsxs(
       "button",
@@ -517,7 +517,7 @@ function Ve({
         "aria-describedby": T,
         className: `ds-select-trigger ds-select-trigger--${d} ${a ? "ds-select-trigger--error" : ""}`,
         onClick: () => {
-          p || (m ? C() : (clearTimeout(W.current), v(!1), h(!0)));
+          p || (m ? M() : (clearTimeout(W.current), v(!1), h(!0)));
         },
         disabled: p,
         ...f,
@@ -546,7 +546,7 @@ function Ye({
   min: l = 0,
   max: n = 100,
   step: a = 1,
-  size: i = "m",
+  size: c = "m",
   disabled: d = !1,
   hint: p,
   error: u,
@@ -560,30 +560,30 @@ function Ye({
     if (d) return;
     const E = Math.max(Number(e) - a, l);
     r == null || r(E);
-  }, c = (E) => {
+  }, i = (E) => {
     if (d) return;
-    const $ = E.target.value;
-    if ($ === "") {
+    const k = E.target.value;
+    if (k === "") {
       r == null || r(l);
       return;
     }
-    const w = Number($);
+    const w = Number(k);
     if (!isNaN(w)) {
-      const g = Math.min(Math.max(w, l), n);
-      r == null || r(g);
+      const $ = Math.min(Math.max(w, l), n);
+      r == null || r($);
     }
   }, v = [
     "ds-stepper-wrapper",
     d && "ds-stepper-wrapper--disabled",
     u && "ds-stepper-wrapper--error"
-  ].filter(Boolean).join(" "), j = [
+  ].filter(Boolean).join(" "), _ = [
     "ds-stepper",
-    `ds-stepper--${i}`,
+    `ds-stepper--${c}`,
     d && "ds-stepper--disabled"
-  ].filter(Boolean).join(" "), y = i === "xs" ? P[1] : i === "small" ? P[2] : P[3];
+  ].filter(Boolean).join(" "), y = c === "xs" ? P[1] : c === "small" ? P[2] : P[3];
   return /* @__PURE__ */ t.jsxs("div", { className: v, children: [
     s && /* @__PURE__ */ t.jsx("label", { className: "ds-stepper-label", children: s }),
-    /* @__PURE__ */ t.jsxs("div", { className: j, children: [
+    /* @__PURE__ */ t.jsxs("div", { className: _, children: [
       /* @__PURE__ */ t.jsx(
         "button",
         {
@@ -592,7 +592,7 @@ function Ye({
           onClick: h,
           disabled: d || e <= l,
           "aria-label": "Decrease",
-          children: /* @__PURE__ */ t.jsx(je, { size: y, strokeWidth: 1.5 })
+          children: /* @__PURE__ */ t.jsx(_e, { size: y, strokeWidth: 1.5 })
         }
       ),
       /* @__PURE__ */ t.jsx(
@@ -601,7 +601,7 @@ function Ye({
           type: "number",
           className: "ds-stepper-input",
           value: e,
-          onChange: c,
+          onChange: i,
           min: l,
           max: n,
           step: a,
@@ -617,7 +617,7 @@ function Ye({
           onClick: m,
           disabled: d || e >= n,
           "aria-label": "Increase",
-          children: /* @__PURE__ */ t.jsx(_e, { size: y, strokeWidth: 1.5 })
+          children: /* @__PURE__ */ t.jsx(je, { size: y, strokeWidth: 1.5 })
         }
       )
     ] }),
@@ -633,7 +633,7 @@ function Ue({
   // deprecated, use variant="interactive"
   onClick: n,
   href: a,
-  disabled: i = !1,
+  disabled: c = !1,
   ...d
 }) {
   const u = (l ? "interactive" : r) === "interactive" || n || a, f = [
@@ -642,8 +642,8 @@ function Ue({
     u && "ds-card--interactive"
   ].filter(Boolean).join(" ");
   if (a) {
-    const c = (v) => {
-      if (i) {
+    const i = (v) => {
+      if (c) {
         v.preventDefault();
         return;
       }
@@ -653,9 +653,9 @@ function Ue({
       "a",
       {
         className: f,
-        href: i ? void 0 : a,
-        onClick: c,
-        "aria-disabled": i ? "true" : void 0,
+        href: c ? void 0 : a,
+        onClick: i,
+        "aria-disabled": c ? "true" : void 0,
         ...d,
         children: s
       }
@@ -664,7 +664,7 @@ function Ue({
   const m = u && n ? "button" : "div", h = u && n ? {
     type: "button",
     onClick: n,
-    disabled: i
+    disabled: c
   } : {};
   return /* @__PURE__ */ t.jsx(
     m,
@@ -709,10 +709,10 @@ function Qe({
     "ds-badge",
     `ds-badge--${e}`,
     `ds-badge--${r}`
-  ].filter(Boolean).join(" "), i = l || (["info", "success", "warning", "error"].includes(e) ? "status" : void 0);
-  return /* @__PURE__ */ t.jsx("span", { className: a, role: i, ...n, children: s });
+  ].filter(Boolean).join(" "), c = l || (["info", "success", "warning", "error"].includes(e) ? "status" : void 0);
+  return /* @__PURE__ */ t.jsx("span", { className: a, role: c, ...n, children: s });
 }
-const ge = {
+const $e = {
   info: he,
   success: pe,
   warning: me,
@@ -726,9 +726,9 @@ function et({
   role: n,
   ...a
 }) {
-  const i = ge[e], d = n || (e === "error" ? "alert" : "status");
+  const c = $e[e], d = n || (e === "error" ? "alert" : "status");
   return /* @__PURE__ */ t.jsxs("div", { className: `ds-alert ds-alert--${e} ${r ? "" : "ds-alert--no-title"}`, role: d, ...a, children: [
-    i && /* @__PURE__ */ t.jsx("div", { className: "ds-alert__icon", children: /* @__PURE__ */ t.jsx(i, { size: P[3], strokeWidth: 1.5 }) }),
+    c && /* @__PURE__ */ t.jsx("div", { className: "ds-alert__icon", children: /* @__PURE__ */ t.jsx(c, { size: P[3], strokeWidth: 1.5 }) }),
     /* @__PURE__ */ t.jsxs("div", { className: "ds-alert__content", children: [
       r && /* @__PURE__ */ t.jsx("div", { className: "ds-alert__title", children: r }),
       s && /* @__PURE__ */ t.jsx("div", { className: "ds-alert__message", children: s })
@@ -753,22 +753,22 @@ function tt({
   size: l = "m",
   ...n
 }) {
-  const a = A(null), i = B.useId(), [d, p] = S(!1), u = () => {
+  const a = A(null), c = B.useId(), [d, p] = S(!1), u = () => {
     !r || d || (p(!0), setTimeout(() => {
       p(!1), r();
     }, Te));
   };
   L(() => {
-    const c = (j) => {
-      j.key === "Escape" && u();
-    }, v = (j) => {
-      a.current && !a.current.contains(j.target) && u();
+    const i = (_) => {
+      _.key === "Escape" && u();
+    }, v = (_) => {
+      a.current && !a.current.contains(_.target) && u();
     };
-    return document.addEventListener("keydown", c), document.addEventListener("mousedown", v), () => {
-      document.removeEventListener("keydown", c), document.removeEventListener("mousedown", v);
+    return document.addEventListener("keydown", i), document.addEventListener("mousedown", v), () => {
+      document.removeEventListener("keydown", i), document.removeEventListener("mousedown", v);
     };
   }, [r, d]);
-  const f = B.Children.toArray(s), m = f.find((c) => (c == null ? void 0 : c.type) === de), h = f.filter((c) => (c == null ? void 0 : c.type) !== de);
+  const f = B.Children.toArray(s), m = f.find((i) => (i == null ? void 0 : i.type) === de), h = f.filter((i) => (i == null ? void 0 : i.type) !== de);
   return /* @__PURE__ */ t.jsx("div", { className: ["ds-modal-overlay", d && "ds-modal-overlay--closing"].filter(Boolean).join(" "), ...n, children: /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -776,12 +776,12 @@ function tt({
       ref: a,
       role: "dialog",
       "aria-modal": "true",
-      "aria-labelledby": e ? i : void 0,
+      "aria-labelledby": e ? c : void 0,
       children: [
         (e || r) && /* @__PURE__ */ t.jsxs("div", { className: "ds-modal__header", children: [
-          e && /* @__PURE__ */ t.jsx("h3", { id: i, className: "ds-modal__title", children: e }),
+          e && /* @__PURE__ */ t.jsx("h3", { id: c, className: "ds-modal__title", children: e }),
           r && /* @__PURE__ */ t.jsx(
-            $e,
+            ke,
             {
               variant: "ghost",
               size: "small",
@@ -807,18 +807,18 @@ function Se({
   expanded: l,
   onToggle: n,
   padding: a = "s",
-  className: i = "",
+  className: c = "",
   ...d
 }) {
   const [p, u] = S(r), f = l !== void 0, m = f ? l : p, h = () => {
     f ? n == null || n(!l) : u((v) => !v);
-  }, c = [
+  }, i = [
     "ds-code-accordion",
     `ds-code-accordion--${a}`,
     m && "ds-code-accordion--expanded",
-    i
+    c
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ t.jsxs("div", { className: c, ...d, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: i, ...d, children: [
     /* @__PURE__ */ t.jsxs(
       "button",
       {
@@ -863,24 +863,24 @@ function rt({ href: s, children: e, onClick: r, target: l, rel: n, ...a }) {
 function nt({ children: s, size: e = "m", variant: r = "ghost", ...l }) {
   return /* @__PURE__ */ t.jsx("div", { className: "ds-tabs", role: "tablist", ...l, children: B.Children.map(s, (n) => B.isValidElement(n) ? B.cloneElement(n, { size: e, variant: r }) : n) });
 }
-function at({ children: s, selected: e = !1, onClick: r, size: l = "m", variant: n = "ghost", disabled: a = !1, icon: i, href: d, ...p }) {
-  const u = i && !s, f = [
+function at({ children: s, selected: e = !1, onClick: r, size: l = "m", variant: n = "ghost", disabled: a = !1, icon: c, href: d, ...p }) {
+  const u = c && !s, f = [
     "ds-tab",
     `ds-tab--${l}`,
     `ds-tab--${n}`,
     e && "ds-tab--selected",
     u && "ds-tab--icon-only"
   ].filter(Boolean).join(" "), m = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    i && /* @__PURE__ */ t.jsx("span", { className: "ds-tab-icon", children: i }),
+    c && /* @__PURE__ */ t.jsx("span", { className: "ds-tab-icon", children: c }),
     s
   ] });
   if (d) {
-    const h = (c) => {
+    const h = (i) => {
       if (a) {
-        c.preventDefault();
+        i.preventDefault();
         return;
       }
-      c.metaKey || c.ctrlKey || c.button === 1 || (c.preventDefault(), r == null || r(c));
+      i.metaKey || i.ctrlKey || i.button === 1 || (i.preventDefault(), r == null || r(i));
     };
     return /* @__PURE__ */ t.jsx(
       "a",
@@ -910,28 +910,28 @@ function at({ children: s, selected: e = !1, onClick: r, size: l = "m", variant:
   );
 }
 function ot({ options: s, value: e, onChange: r, size: l = "m", disabled: n = !1 }) {
-  const a = A(null), i = A(null), [d, p] = S(!1), u = A(!1), f = A(null), m = A(null), h = () => {
+  const a = A(null), c = A(null), [d, p] = S(!1), u = A(!1), f = A(null), m = A(null), h = () => {
     if (!a.current) return;
-    const c = a.current.querySelector(`[data-value="${e}"]`);
-    if (!c) return;
-    const v = a.current.getBoundingClientRect(), j = c.getBoundingClientRect(), y = j.left - v.left, E = j.width;
-    i.current ? (i.current.style.transition = u.current ? "left var(--transition-normal), width var(--transition-normal)" : "none", i.current.style.left = y + "px", i.current.style.width = E + "px", u.current = !1) : (p(!0), requestAnimationFrame(() => {
-      if (!i.current || !a.current) return;
-      const $ = a.current.querySelector(`[data-value="${e}"]`);
-      if (!$) return;
-      const w = a.current.getBoundingClientRect(), g = $.getBoundingClientRect();
-      i.current.style.transition = "none", i.current.style.left = g.left - w.left + "px", i.current.style.width = g.width + "px";
+    const i = a.current.querySelector(`[data-value="${e}"]`);
+    if (!i) return;
+    const v = a.current.getBoundingClientRect(), _ = i.getBoundingClientRect(), y = _.left - v.left, E = _.width;
+    c.current ? (c.current.style.transition = u.current ? "left var(--transition-normal), width var(--transition-normal)" : "none", c.current.style.left = y + "px", c.current.style.width = E + "px", u.current = !1) : (p(!0), requestAnimationFrame(() => {
+      if (!c.current || !a.current) return;
+      const k = a.current.querySelector(`[data-value="${e}"]`);
+      if (!k) return;
+      const w = a.current.getBoundingClientRect(), $ = k.getBoundingClientRect();
+      c.current.style.transition = "none", c.current.style.left = $.left - w.left + "px", c.current.style.width = $.width + "px";
     }));
   };
   return m.current = h, ve(() => {
-    const c = f.current !== e;
-    f.current = e, u.current = d && c, h();
+    const i = f.current !== e;
+    f.current = e, u.current = d && i, h();
   }), L(() => {
     if (!a.current) return;
-    const c = new ResizeObserver(() => {
+    const i = new ResizeObserver(() => {
       u.current = !1, m.current();
     });
-    return c.observe(a.current), () => c.disconnect();
+    return i.observe(a.current), () => i.disconnect();
   }, []), /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -946,26 +946,26 @@ function ot({ options: s, value: e, onChange: r, size: l = "m", disabled: n = !1
         d && /* @__PURE__ */ t.jsx(
           "div",
           {
-            ref: i,
+            ref: c,
             className: "ds-seg__pill",
             "aria-hidden": "true"
           }
         ),
-        s.map((c) => /* @__PURE__ */ t.jsxs(
+        s.map((i) => /* @__PURE__ */ t.jsxs(
           "button",
           {
             type: "button",
-            "data-value": c.value,
-            className: ["ds-seg__btn", e === c.value && "ds-seg__btn--active"].filter(Boolean).join(" "),
-            onClick: () => !n && r(c.value),
-            "aria-pressed": e === c.value,
+            "data-value": i.value,
+            className: ["ds-seg__btn", e === i.value && "ds-seg__btn--active"].filter(Boolean).join(" "),
+            onClick: () => !n && r(i.value),
+            "aria-pressed": e === i.value,
             disabled: n,
             children: [
-              c.icon && /* @__PURE__ */ t.jsx("span", { className: "ds-seg__btn-icon", "aria-hidden": "true", children: c.icon }),
-              c.label
+              i.icon && /* @__PURE__ */ t.jsx("span", { className: "ds-seg__btn-icon", "aria-hidden": "true", children: i.icon }),
+              i.label
             ]
           },
-          c.value
+          i.value
         ))
       ]
     }
@@ -978,16 +978,16 @@ function lt({
   expanded: l,
   onToggle: n,
   padding: a = "m",
-  ...i
+  ...c
 }) {
   const [d, p] = S(r), u = l !== void 0, f = u ? l : d, m = () => {
-    u ? n == null || n(!l) : p((c) => !c);
+    u ? n == null || n(!l) : p((i) => !i);
   }, h = [
     "ds-accordion",
     `ds-accordion--${a}`,
     f && "ds-accordion--expanded"
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ t.jsxs("div", { className: h, ...i, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: h, ...c, children: [
     /* @__PURE__ */ t.jsxs(
       "button",
       {
@@ -1011,63 +1011,63 @@ function lt({
     /* @__PURE__ */ t.jsx("div", { className: "ds-accordion__content", children: /* @__PURE__ */ t.jsx("div", { className: "ds-accordion__content-inner", children: /* @__PURE__ */ t.jsx("div", { className: "ds-accordion__content-body", children: s }) }) })
   ] });
 }
-const M = 8, Y = 8;
+const C = 8, Y = 8;
 function Ie(s, e, r) {
   const l = window.innerWidth;
   let n, a;
   switch (s) {
     case "top":
-      n = e.top - r.height - M, a = e.left + e.width / 2 - r.width / 2;
+      n = e.top - r.height - C, a = e.left + e.width / 2 - r.width / 2;
       break;
     case "bottom":
-      n = e.bottom + M, a = e.left + e.width / 2 - r.width / 2;
+      n = e.bottom + C, a = e.left + e.width / 2 - r.width / 2;
       break;
     case "left":
-      n = e.top + e.height / 2 - r.height / 2, a = e.left - r.width - M;
+      n = e.top + e.height / 2 - r.height / 2, a = e.left - r.width - C;
       break;
     case "right":
-      n = e.top + e.height / 2 - r.height / 2, a = e.right + M;
+      n = e.top + e.height / 2 - r.height / 2, a = e.right + C;
       break;
     default:
-      n = e.bottom + M, a = e.left;
+      n = e.bottom + C, a = e.left;
   }
-  const i = Math.max(Y, Math.min(l - r.width - Y, a)), d = a - i;
-  return { top: n, left: i, arrowOffset: d };
+  const c = Math.max(Y, Math.min(l - r.width - Y, a)), d = a - c;
+  return { top: n, left: c, arrowOffset: d };
 }
 function Ae(s, e, r) {
   const l = window.innerWidth, n = window.innerHeight;
-  if (s.top >= e + M + Y) return "top";
-  if (n - s.bottom >= e + M + Y) return "bottom";
-  if (l - s.right >= r + M + Y) return "right";
-  if (s.left >= r + M + Y) return "left";
+  if (s.top >= e + C + Y) return "top";
+  if (n - s.bottom >= e + C + Y) return "bottom";
+  if (l - s.right >= r + C + Y) return "right";
+  if (s.left >= r + C + Y) return "left";
   const a = Math.max(s.top, n - s.bottom, s.left, l - s.right);
   return a === s.top ? "top" : a === n - s.bottom ? "bottom" : a === l - s.right ? "right" : "left";
 }
 function ct({ children: s, content: e, position: r, ...l }) {
-  const [n, a] = S(!1), [i, d] = S({ visibility: "hidden" }), [p, u] = S(r || "top"), f = A(null), m = A(null), h = A(!1), c = () => {
+  const [n, a] = S(!1), [c, d] = S({ visibility: "hidden" }), [p, u] = S(r || "top"), f = A(null), m = A(null), h = A(!1), i = () => {
     if (!f.current || !m.current) return;
-    const j = f.current.getBoundingClientRect(), y = m.current.getBoundingClientRect(), E = r || Ae(j, y.height, y.width), { top: $, left: w, arrowOffset: g } = Ie(E, j, y);
+    const _ = f.current.getBoundingClientRect(), y = m.current.getBoundingClientRect(), E = r || Ae(_, y.height, y.width), { top: k, left: w, arrowOffset: $ } = Ie(E, _, y);
     u(E), d({
       position: "fixed",
-      top: $,
+      top: k,
       left: w,
       visibility: "visible",
-      "--arrow-offset": `${g}px`
+      "--arrow-offset": `${$}px`
     });
   };
   if (L(() => {
     if (!n) return;
     d({ position: "fixed", visibility: "hidden" });
-    const j = requestAnimationFrame(c);
-    return window.addEventListener("scroll", c, !0), window.addEventListener("resize", c), () => {
-      cancelAnimationFrame(j), window.removeEventListener("scroll", c, !0), window.removeEventListener("resize", c);
+    const _ = requestAnimationFrame(i);
+    return window.addEventListener("scroll", i, !0), window.addEventListener("resize", i), () => {
+      cancelAnimationFrame(_), window.removeEventListener("scroll", i, !0), window.removeEventListener("resize", i);
     };
   }, [n, r]), L(() => {
     if (!n) return;
-    const j = (y) => {
+    const _ = (y) => {
       f.current && !f.current.contains(y.target) && a(!1);
     };
-    return document.addEventListener("touchstart", j), () => document.removeEventListener("touchstart", j);
+    return document.addEventListener("touchstart", _), () => document.removeEventListener("touchstart", _);
   }, [n]), !e) return s;
   const v = n && /* @__PURE__ */ t.jsx(
     "div",
@@ -1075,7 +1075,7 @@ function ct({ children: s, content: e, position: r, ...l }) {
       ref: m,
       className: `ds-tooltip ds-tooltip--${p}`,
       role: "tooltip",
-      style: i,
+      style: c,
       children: e
     }
   );
@@ -1091,7 +1091,7 @@ function ct({ children: s, content: e, position: r, ...l }) {
         h.current || a(!1);
       },
       onTouchStart: () => {
-        h.current = !0, a((j) => !j);
+        h.current = !0, a((_) => !_);
       },
       ...l,
       children: [
@@ -1108,7 +1108,7 @@ function it({
   disabled: l = !1,
   label: n,
   id: a,
-  ...i
+  ...c
 }) {
   const d = a || `toggle-${B.useId()}`, p = [
     "ds-toggle",
@@ -1125,7 +1125,7 @@ function it({
         checked: s,
         onChange: (u) => e == null ? void 0 : e(u.target.checked),
         disabled: l,
-        ...i
+        ...c
       }
     ),
     /* @__PURE__ */ t.jsx("span", { className: "ds-toggle__track", children: /* @__PURE__ */ t.jsx("span", { className: "ds-toggle__thumb" }) }),
@@ -1139,7 +1139,7 @@ function dt({
   disabled: l = !1,
   label: n,
   id: a,
-  ...i
+  ...c
 }) {
   const d = a || `checkbox-${B.useId()}`, p = [
     "ds-checkbox",
@@ -1156,7 +1156,7 @@ function dt({
         checked: s,
         onChange: (f) => e == null ? void 0 : e(f.target.checked),
         disabled: l,
-        ...i
+        ...c
       }
     ),
     /* @__PURE__ */ t.jsx("span", { className: "ds-checkbox__box", children: s && /* @__PURE__ */ t.jsx(
@@ -1177,7 +1177,7 @@ function ut({
   disabled: l = !1,
   label: n,
   name: a,
-  value: i,
+  value: c,
   id: d,
   ...p
 }) {
@@ -1197,7 +1197,7 @@ function ut({
         onChange: (m) => e == null ? void 0 : e(m.target.checked),
         disabled: l,
         name: a,
-        value: i,
+        value: c,
         ...p
       }
     ),
@@ -1227,7 +1227,7 @@ function Oe(s) {
   const e = s.trim().split(/\s+/);
   return e.length >= 2 ? (e[0][0] + e[1][0]).toUpperCase() : s[0].toUpperCase();
 }
-function mt({ seed: s, icon: e, src: r, size: l = 32, className: n = "", style: a = {}, ...i }) {
+function mt({ seed: s, icon: e, src: r, size: l = 32, className: n = "", style: a = {}, ...c }) {
   const d = Pe(s ?? ""), [p, u] = S(!1), f = e ?? /* @__PURE__ */ t.jsx("span", { className: "ds-avatar__initials", children: Oe(s) });
   return /* @__PURE__ */ t.jsx(
     "div",
@@ -1235,7 +1235,7 @@ function mt({ seed: s, icon: e, src: r, size: l = 32, className: n = "", style:
       className: ["ds-avatar", n].filter(Boolean).join(" "),
       style: { width: l, height: l, "--ds-avatar-h": d, ...a },
       "aria-hidden": "true",
-      ...i,
+      ...c,
       children: r && !p ? /* @__PURE__ */ t.jsx("img", { src: r, alt: "", onError: () => u(!0) }) : f
     }
   );
@@ -1247,7 +1247,7 @@ function pt({
   maxHeight: l,
   className: n = "",
   style: a = {},
-  ...i
+  ...c
 }) {
   const d = {
     ...l ? { maxHeight: l } : {},
@@ -1263,7 +1263,7 @@ function pt({
         "table",
         {
           className: ["ds-table", `ds-table--${e}`, n].filter(Boolean).join(" "),
-          ...i,
+          ...c,
           children: s
         }
       )
@@ -1276,7 +1276,7 @@ function ht({ children: s, ...e }) {
 function bt({ children: s, ...e }) {
   return /* @__PURE__ */ t.jsx("tbody", { ...e, children: s });
 }
-function xt({ children: s, interactive: e, selected: r, subheader: l, className: n = "", onClick: a, ...i }) {
+function xt({ children: s, interactive: e, selected: r, subheader: l, className: n = "", onClick: a, ...c }) {
   return /* @__PURE__ */ t.jsx(
     "tr",
     {
@@ -1288,7 +1288,7 @@ function xt({ children: s, interactive: e, selected: r, subheader: l, className:
         n
       ].filter(Boolean).join(" "),
       onClick: a,
-      ...i,
+      ...c,
       children: s
     }
   );
@@ -1296,7 +1296,7 @@ function xt({ children: s, interactive: e, selected: r, subheader: l, className:
 function vt({ children: s, colSpan: e = 999, ...r }) {
   return /* @__PURE__ */ t.jsx("tr", { className: "ds-table-row ds-table-row--subheader", ...r, children: /* @__PURE__ */ t.jsx("td", { colSpan: e, children: s }) });
 }
-function jt({ children: s, align: e = "left", sortDir: r, onSort: l, width: n, className: a = "", style: i = {}, ...d }) {
+function _t({ children: s, align: e = "left", sortDir: r, onSort: l, width: n, className: a = "", style: c = {}, ...d }) {
   const p = !!l || r !== void 0, u = r === "asc" ? Ne : r === "desc" ? ee : ye;
   return /* @__PURE__ */ t.jsx(
     "th",
@@ -1309,7 +1309,7 @@ function jt({ children: s, align: e = "left", sortDir: r, onSort: l, width: n, c
         a
       ].filter(Boolean).join(" "),
       onClick: l,
-      style: { width: n, ...i },
+      style: { width: n, ...c },
       ...d,
       children: p ? /* @__PURE__ */ t.jsxs("span", { className: "ds-th__inner", children: [
         s,
@@ -1318,7 +1318,7 @@ function jt({ children: s, align: e = "left", sortDir: r, onSort: l, width: n, c
     }
   );
 }
-function _t({ children: s, align: e = "left", secondary: r, muted: l, truncate: n, nowrap: a, className: i = "", ...d }) {
+function jt({ children: s, align: e = "left", secondary: r, muted: l, truncate: n, nowrap: a, className: c = "", ...d }) {
   return /* @__PURE__ */ t.jsx(
     "td",
     {
@@ -1329,7 +1329,7 @@ function _t({ children: s, align: e = "left", secondary: r, muted: l, truncate:
         l ? "ds-table-cell--muted" : "",
         n ? "ds-table-cell--truncate" : "",
         a ? "ds-table-cell--nowrap" : "",
-        i
+        c
       ].filter(Boolean).join(" "),
       ...d,
       children: s
@@ -1343,13 +1343,13 @@ function wt({
   action: l,
   size: n = "m",
   className: a = "",
-  ...i
+  ...c
 }) {
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: ["ds-empty-state", `ds-empty-state--${n}`, a].filter(Boolean).join(" "),
-      ...i,
+      ...c,
       children: [
         s && /* @__PURE__ */ t.jsx("div", { className: "ds-empty-state__icon", children: s }),
         /* @__PURE__ */ t.jsx("div", { className: "ds-empty-state__title", children: e }),
@@ -1366,24 +1366,24 @@ function Nt({
   onOpenChange: l,
   align: n = "left",
   className: a = "",
-  style: i,
+  style: c,
   ...d
 }) {
-  const [p, u] = S(!1), [f, m] = S(!1), h = r !== void 0, c = h ? r : p, v = A(null), j = A(null), [y, E] = S({}), $ = A(null), w = 150, g = () => {
+  const [p, u] = S(!1), [f, m] = S(!1), h = r !== void 0, i = h ? r : p, v = A(null), _ = A(null), [y, E] = S({}), k = A(null), w = 150, $ = () => {
     if (h)
       l == null || l(!1);
     else {
       if (f) return;
-      m(!0), $.current = setTimeout(() => {
+      m(!0), k.current = setTimeout(() => {
         u(!1), m(!1);
       }, w);
     }
   }, W = () => {
-    const x = !c;
-    h ? l == null || l(x) : x ? (clearTimeout($.current), m(!1), u(!0)) : g();
+    const x = !i;
+    h ? l == null || l(x) : x ? (clearTimeout(k.current), m(!1), u(!0)) : $();
   };
-  L(() => () => clearTimeout($.current), []), L(() => {
-    if (!c) return;
+  L(() => () => clearTimeout(k.current), []), L(() => {
+    if (!i) return;
     const x = () => {
       var I;
       const T = (I = v.current) == null ? void 0 : I.getBoundingClientRect();
@@ -1394,22 +1394,22 @@ function Nt({
     return x(), window.addEventListener("scroll", x, !0), window.addEventListener("resize", x), () => {
       window.removeEventListener("scroll", x, !0), window.removeEventListener("resize", x);
     };
-  }, [c, n]), L(() => {
-    if (!c) return;
+  }, [i, n]), L(() => {
+    if (!i) return;
     const x = (I) => {
-      var C, O;
-      !((C = v.current) != null && C.contains(I.target)) && !((O = j.current) != null && O.contains(I.target)) && g();
+      var M, O;
+      !((M = v.current) != null && M.contains(I.target)) && !((O = _.current) != null && O.contains(I.target)) && $();
     }, T = (I) => {
-      I.key === "Escape" && g();
+      I.key === "Escape" && $();
     };
     return document.addEventListener("mousedown", x), document.addEventListener("keydown", T), () => {
       document.removeEventListener("mousedown", x), document.removeEventListener("keydown", T);
     };
-  }, [c]);
-  const z = c && /* @__PURE__ */ t.jsx(
+  }, [i]);
+  const z = i && /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: j,
+      ref: _,
       className: [
         "ds-dropdown__menu",
         `ds-dropdown__menu--${n}`,
@@ -1424,9 +1424,9 @@ function Nt({
             x.label && /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__section-label", children: x.label }),
             /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__section-content", children: x.content })
           ] }, T);
-        const I = !!x.href, C = I ? "a" : "button", O = I ? { href: x.disabled ? void 0 : x.href, "aria-disabled": x.disabled ? "true" : void 0 } : { type: "button", disabled: x.disabled };
+        const I = !!x.href, M = I ? "a" : "button", O = I ? { href: x.disabled ? void 0 : x.href, "aria-disabled": x.disabled ? "true" : void 0 } : { type: "button", disabled: x.disabled };
         return /* @__PURE__ */ t.jsxs(
-          C,
+          M,
           {
             className: [
               "ds-dropdown__item",
@@ -1435,7 +1435,7 @@ function Nt({
             ...O,
             onClick: () => {
               var D;
-              (D = x.onClick) == null || D.call(x), g();
+              (D = x.onClick) == null || D.call(x), $();
             },
             children: [
               x.icon && /* @__PURE__ */ t.jsx("span", { className: "ds-dropdown__item-icon", children: x.icon }),
@@ -1453,7 +1453,7 @@ function Nt({
     {
       ref: v,
       className: ["ds-dropdown", a].filter(Boolean).join(" "),
-      style: i,
+      style: c,
       ...d,
       children: [
         /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__trigger", onClick: W, children: s }),
@@ -1462,6 +1462,43 @@ function Nt({
     }
   );
 }
+function yt({
+  value: s = 0,
+  size: e = "m",
+  variant: r = "default",
+  showValue: l = !1,
+  min: n = 2,
+  animate: a = !0
+}) {
+  const c = Math.min(100, Math.max(0, s)), d = Math.max(n, c), p = r === "auto" ? c >= 70 ? "success" : c >= 50 ? "warning" : "danger" : r;
+  return /* @__PURE__ */ t.jsxs(
+    "div",
+    {
+      className: [
+        "ds-progress",
+        `ds-progress--${e}`,
+        !a && "ds-progress--instant"
+      ].filter(Boolean).join(" "),
+      role: "progressbar",
+      "aria-valuenow": c,
+      "aria-valuemin": 0,
+      "aria-valuemax": 100,
+      children: [
+        /* @__PURE__ */ t.jsx("div", { className: "ds-progress__track", children: /* @__PURE__ */ t.jsx(
+          "div",
+          {
+            className: `ds-progress__fill ds-progress__fill--${p}`,
+            style: { width: `${d}%` }
+          }
+        ) }),
+        l && /* @__PURE__ */ t.jsxs("span", { className: "ds-progress__value", children: [
+          Math.round(c),
+          "%"
+        ] })
+      ]
+    }
+  );
+}
 const ue = {
   default: he,
   success: pe,
@@ -1479,7 +1516,7 @@ function Be(s) {
 function Le(s) {
   U = U.filter((e) => e.id !== s), be();
 }
-function yt() {
+function Et() {
   const s = (e, r = {}) => {
     Be({
       id: `${Date.now()}-${Math.random()}`,
@@ -1497,7 +1534,7 @@ function De({ data: s, onDismiss: e }) {
   function a() {
     l(!1), setTimeout(() => e(s.id), 250);
   }
-  const i = ue[s.type] ?? ue.default;
+  const c = ue[s.type] ?? ue.default;
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
@@ -1509,7 +1546,7 @@ function De({ data: s, onDismiss: e }) {
       role: s.type === "error" ? "alert" : "status",
       "aria-live": "polite",
       children: [
-        /* @__PURE__ */ t.jsx("div", { className: "ds-toast__icon", children: /* @__PURE__ */ t.jsx(i, { size: P[3], strokeWidth: 1.5 }) }),
+        /* @__PURE__ */ t.jsx("div", { className: "ds-toast__icon", children: /* @__PURE__ */ t.jsx(c, { size: P[3], strokeWidth: 1.5 }) }),
         /* @__PURE__ */ t.jsx("span", { className: "ds-toast__message", children: s.message }),
         /* @__PURE__ */ t.jsx(
           "button",
@@ -1524,7 +1561,7 @@ function De({ data: s, onDismiss: e }) {
     }
   );
 }
-function Et({ position: s = "bottom-right" }) {
+function gt({ position: s = "bottom-right" }) {
   const [e, r] = S(() => [...U]);
   return L(() => (oe.add(r), () => oe.delete(r)), []), !e.length || typeof document > "u" ? null : Q.createPortal(
     /* @__PURE__ */ t.jsx("div", { className: ["ds-toast-container", `ds-toast-container--${s}`].join(" "), children: e.map((l) => /* @__PURE__ */ t.jsx(De, { data: l, onDismiss: Le }, l.id)) }),
@@ -1536,7 +1573,7 @@ export {
   et as Alert,
   mt as Avatar,
   Qe as Badge,
-  $e as Button,
+  ke as Button,
   Ue as Card,
   dt as Checkbox,
   st as Code,
@@ -1554,11 +1591,12 @@ export {
   Je as P1,
   Ke as P2,
   Ze as P3,
+  yt as ProgressBar,
   ut as Radio,
   ot as SegmentedControl,
   Ve as Select,
   ft as Skeleton,
-  ke as Spinner,
+  Re as Spinner,
   Ye as Stepper,
   at as Tab,
   pt as Table,
@@ -1567,12 +1605,12 @@ export {
   xt as TableRow,
   vt as TableSubheaderRow,
   nt as Tabs,
-  _t as Td,
+  jt as Td,
   ze as Textarea,
-  jt as Th,
-  Et as ToastContainer,
+  _t as Th,
+  gt as ToastContainer,
   it as Toggle,
   ct as Tooltip,
   P as iconSizes,
-  yt as useToast
+  Et as useToast
 };