@donkit-ai/design-system 1.0.5 → 1.0.7

package/dist/index.es.js

@@ -1,7 +1,7 @@
-import A, { useState as I, useRef as L, useEffect as B } from "react";
+import A, { useState as T, useRef as L, useEffect as B } from "react";
 import C from "react-dom";
 import { ChevronDown as K, Minus as ve, Plus as je, XCircle as fe, AlertTriangle as me, CheckCircle as pe, Info as be, X as se, Check as _e, ChevronUp as we, ChevronsUpDown as Ne } from "lucide-react";
-const T = {
+const S = {
   1: 16,
   2: 20,
   3: 24,
@@ -22,23 +22,23 @@ var le;
 function ye() {
   if (le) return G;
   le = 1;
-  var t = Symbol.for("react.transitional.element"), e = Symbol.for("react.fragment");
-  function s(c, n, a) {
-    var l = null;
-    if (a !== void 0 && (l = "" + a), n.key !== void 0 && (l = "" + n.key), "key" in n) {
+  var s = Symbol.for("react.transitional.element"), e = Symbol.for("react.fragment");
+  function r(c, n, a) {
+    var i = null;
+    if (a !== void 0 && (i = "" + a), n.key !== void 0 && (i = "" + n.key), "key" in n) {
       a = {};
-      for (var i in n)
-        i !== "key" && (a[i] = n[i]);
+      for (var l in n)
+        l !== "key" && (a[l] = n[l]);
     } else a = n;
     return n = a.ref, {
-      $$typeof: t,
+      $$typeof: s,
       type: c,
-      key: l,
+      key: i,
       ref: n !== void 0 ? n : null,
       props: a
     };
   }
-  return G.Fragment = e, G.jsx = s, G.jsxs = s, G;
+  return G.Fragment = e, G.jsx = r, G.jsxs = r, G;
 }
 var q = {};
 /**
@@ -53,7 +53,7 @@ var q = {};
 var ie;
 function Ee() {
   return ie || (ie = 1, process.env.NODE_ENV !== "production" && function() {
-    function t(o) {
+    function s(o) {
       if (o == null) return null;
       if (typeof o == "function")
         return o.$$typeof === D ? null : o.displayName || o.name || null;
@@ -61,11 +61,11 @@ function Ee() {
       switch (o) {
         case k:
           return "Fragment";
-        case S:
+        case g:
           return "Profiler";
         case $:
           return "StrictMode";
-        case g:
+        case I:
           return "Suspense";
         case P:
           return "SuspenseList";
@@ -86,11 +86,11 @@ function Ee() {
             var h = o.render;
             return o = o.displayName, o || (o = h.displayName || h.name || "", o = o !== "" ? "ForwardRef(" + o + ")" : "ForwardRef"), o;
           case M:
-            return h = o.displayName || null, h !== null ? h : t(o.type) || "Memo";
+            return h = o.displayName || null, h !== null ? h : s(o.type) || "Memo";
           case U:
             h = o._payload, o = o._init;
             try {
-              return t(o(h));
+              return s(o(h));
             } catch {
             }
         }
@@ -99,7 +99,7 @@ function Ee() {
     function e(o) {
       return "" + o;
     }
-    function s(o) {
+    function r(o) {
       try {
         e(o);
         var h = !1;
@@ -121,7 +121,7 @@ function Ee() {
       if (typeof o == "object" && o !== null && o.$$typeof === U)
         return "<...>";
       try {
-        var h = t(o);
+        var h = s(o);
         return h ? "<" + h + ">" : "<...>";
       } catch {
         return "<...>";
@@ -134,14 +134,14 @@ function Ee() {
     function a() {
       return Error("react-stack-top-frame");
     }
-    function l(o) {
+    function i(o) {
       if (X.call(o, "key")) {
         var h = Object.getOwnPropertyDescriptor(o, "key").get;
         if (h && h.isReactWarning) return !1;
       }
       return o.key !== void 0;
     }
-    function i(o, h) {
+    function l(o, h) {
       function N() {
         H || (H = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
@@ -154,7 +154,7 @@ function Ee() {
       });
     }
     function p() {
-      var o = t(this.type);
+      var o = s(this.type);
       return ne[o] || (ne[o] = !0, console.error(
         "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;
@@ -206,7 +206,7 @@ function Ee() {
             );
         else u(E);
       if (X.call(h, "key")) {
-        E = t(o);
+        E = s(o);
         var Y = Object.keys(h).filter(function(xe) {
           return xe !== "key";
         });
@@ -223,12 +223,12 @@ React keys must be passed directly to JSX without using spread:
           E
         ), ce[E + y] = !0);
       }
-      if (E = null, N !== void 0 && (s(N), E = "" + N), l(h) && (s(h.key), E = "" + h.key), "key" in h) {
+      if (E = null, N !== void 0 && (r(N), E = "" + N), i(h) && (r(h.key), E = "" + h.key), "key" in h) {
         N = {};
         for (var Q in h)
           Q !== "key" && (N[Q] = h[Q]);
       } else N = h;
-      return E && i(
+      return E && l(
         N,
         typeof o == "function" ? o.displayName || o.name || "Unknown" : o
       ), f(
@@ -246,7 +246,7 @@ React keys must be passed directly to JSX without using spread:
     function x(o) {
       return typeof o == "object" && o !== null && o.$$typeof === j;
     }
-    var b = A, j = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), k = Symbol.for("react.fragment"), $ = Symbol.for("react.strict_mode"), S = Symbol.for("react.profiler"), m = Symbol.for("react.consumer"), _ = Symbol.for("react.context"), R = Symbol.for("react.forward_ref"), g = Symbol.for("react.suspense"), P = Symbol.for("react.suspense_list"), M = Symbol.for("react.memo"), U = Symbol.for("react.lazy"), w = Symbol.for("react.activity"), D = Symbol.for("react.client.reference"), F = b.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, X = Object.prototype.hasOwnProperty, re = Array.isArray, W = console.createTask ? console.createTask : function() {
+    var b = A, j = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), k = Symbol.for("react.fragment"), $ = Symbol.for("react.strict_mode"), g = Symbol.for("react.profiler"), m = Symbol.for("react.consumer"), _ = Symbol.for("react.context"), R = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), P = Symbol.for("react.suspense_list"), M = Symbol.for("react.memo"), U = Symbol.for("react.lazy"), w = Symbol.for("react.activity"), D = Symbol.for("react.client.reference"), F = b.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, X = Object.prototype.hasOwnProperty, re = Array.isArray, W = console.createTask ? console.createTask : function() {
       return null;
     };
     b = {
@@ -282,30 +282,30 @@ React keys must be passed directly to JSX without using spread:
   }()), q;
 }
 process.env.NODE_ENV === "production" ? ee.exports = ye() : ee.exports = Ee();
-var r = ee.exports;
+var t = ee.exports;
 function ke({
-  children: t,
+  children: s,
   variant: e = "primary",
-  size: s = "m",
+  size: r = "m",
   fullWidth: c = !1,
   icon: n,
   disabled: a = !1,
-  onClick: l,
-  type: i = "button",
+  onClick: i,
+  type: l = "button",
   href: p,
   "aria-label": f,
   ...d
 }) {
-  const u = n && !t, x = [
+  const u = n && !s, x = [
     "ds-button",
     `ds-button--${e}`,
-    `ds-button--${s}`,
+    `ds-button--${r}`,
     c && "ds-button--full",
     u && "ds-button--icon-only"
-  ].filter(Boolean).join(" "), b = /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    n && !u && /* @__PURE__ */ r.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n }),
-    t,
-    u && /* @__PURE__ */ r.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n })
+  ].filter(Boolean).join(" "), b = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    n && !u && /* @__PURE__ */ t.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n }),
+    s,
+    u && /* @__PURE__ */ t.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n })
   ] });
   if (p) {
     const j = (v) => {
@@ -313,9 +313,9 @@ function ke({
         v.preventDefault();
         return;
       }
-      v.metaKey || v.ctrlKey || v.button === 1 || (v.preventDefault(), l == null || l(v));
+      v.metaKey || v.ctrlKey || v.button === 1 || (v.preventDefault(), i == null || i(v));
     };
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ t.jsx(
       "a",
       {
         className: x,
@@ -328,13 +328,13 @@ function ke({
       }
     );
   }
-  return /* @__PURE__ */ r.jsx(
+  return /* @__PURE__ */ t.jsx(
     "button",
     {
-      type: i,
+      type: l,
       className: x,
       disabled: a,
-      onClick: l,
+      onClick: i,
       "aria-label": f,
       ...d,
       children: b
@@ -342,70 +342,70 @@ function ke({
   );
 }
 function De({
-  label: t,
+  label: s,
   error: e,
-  hint: s,
+  hint: r,
   fullWidth: c = !0,
   icon: n,
   iconRight: a,
-  onIconRightClick: l,
-  size: i = "m",
+  onIconRightClick: i,
+  size: l = "m",
   disabled: p,
   id: f,
   ...d
 }) {
-  const u = f || `input-${A.useId()}`, x = s ? `${u}-hint` : void 0, b = e ? `${u}-error` : void 0, j = b || x;
-  return /* @__PURE__ */ r.jsxs("div", { className: `ds-input-wrapper ${c ? "ds-input-wrapper--full" : ""} ${p ? "ds-input-wrapper--disabled" : ""}`, children: [
-    t && /* @__PURE__ */ r.jsx("label", { className: "ds-input-label", htmlFor: u, children: t }),
-    /* @__PURE__ */ r.jsxs("div", { className: "ds-input-container", children: [
-      n && /* @__PURE__ */ r.jsx("span", { className: `ds-input-icon ds-input-icon--${i}`, "aria-hidden": "true", children: n }),
-      /* @__PURE__ */ r.jsx(
+  const u = f || `input-${A.useId()}`, x = r ? `${u}-hint` : void 0, b = e ? `${u}-error` : void 0, j = b || x;
+  return /* @__PURE__ */ t.jsxs("div", { className: `ds-input-wrapper ${c ? "ds-input-wrapper--full" : ""} ${p ? "ds-input-wrapper--disabled" : ""}`, children: [
+    s && /* @__PURE__ */ t.jsx("label", { className: "ds-input-label", htmlFor: u, children: s }),
+    /* @__PURE__ */ t.jsxs("div", { className: "ds-input-container", children: [
+      n && /* @__PURE__ */ t.jsx("span", { className: `ds-input-icon ds-input-icon--${l}`, "aria-hidden": "true", children: n }),
+      /* @__PURE__ */ t.jsx(
         "input",
         {
           id: u,
-          className: `ds-input ds-input--${i} ${n ? "ds-input--with-icon" : ""} ${a ? "ds-input--with-icon-right" : ""} ${e ? "ds-input--error" : ""}`,
+          className: `ds-input ds-input--${l} ${n ? "ds-input--with-icon" : ""} ${a ? "ds-input--with-icon-right" : ""} ${e ? "ds-input--error" : ""}`,
           disabled: p,
           "aria-invalid": e ? "true" : "false",
           "aria-describedby": j,
           ...d
         }
       ),
-      a && /* @__PURE__ */ r.jsx(
+      a && /* @__PURE__ */ t.jsx(
         "button",
         {
           type: "button",
-          className: `ds-input-icon-right ds-input-icon-right--${i}`,
-          onClick: l,
+          className: `ds-input-icon-right ds-input-icon-right--${l}`,
+          onClick: i,
           tabIndex: -1,
           "aria-label": "Toggle visibility",
           children: a
         }
       )
     ] }),
-    s && !e && /* @__PURE__ */ r.jsx("span", { id: x, className: "ds-input-hint", children: s }),
-    e && /* @__PURE__ */ r.jsx("span", { id: b, className: "ds-input-error", role: "alert", children: e })
+    r && !e && /* @__PURE__ */ t.jsx("span", { id: x, className: "ds-input-hint", children: r }),
+    e && /* @__PURE__ */ t.jsx("span", { id: b, className: "ds-input-error", role: "alert", children: e })
   ] });
 }
 function Me({
-  label: t,
+  label: s,
   error: e,
-  hint: s,
+  hint: r,
   fullWidth: c = !0,
   size: n = "m",
   disabled: a,
-  id: l,
-  resize: i = !0,
+  id: i,
+  resize: l = !0,
   rows: p = 3,
   ...f
 }) {
-  const d = l || `textarea-${A.useId()}`, u = s ? `${d}-hint` : void 0, x = e ? `${d}-error` : void 0, b = x || u;
-  return /* @__PURE__ */ r.jsxs("div", { className: `ds-textarea-wrapper ${c ? "ds-textarea-wrapper--full" : ""} ${a ? "ds-textarea-wrapper--disabled" : ""}`, children: [
-    t && /* @__PURE__ */ r.jsx("label", { className: "ds-textarea-label", htmlFor: d, children: t }),
-    /* @__PURE__ */ r.jsx(
+  const d = i || `textarea-${A.useId()}`, u = r ? `${d}-hint` : void 0, x = e ? `${d}-error` : void 0, b = x || u;
+  return /* @__PURE__ */ t.jsxs("div", { className: `ds-textarea-wrapper ${c ? "ds-textarea-wrapper--full" : ""} ${a ? "ds-textarea-wrapper--disabled" : ""}`, children: [
+    s && /* @__PURE__ */ t.jsx("label", { className: "ds-textarea-label", htmlFor: d, children: s }),
+    /* @__PURE__ */ t.jsx(
       "textarea",
       {
         id: d,
-        className: `ds-textarea ds-textarea--${n} ${e ? "ds-textarea--error" : ""} ${i ? "" : "ds-textarea--no-resize"}`,
+        className: `ds-textarea ds-textarea--${n} ${e ? "ds-textarea--error" : ""} ${l ? "" : "ds-textarea--no-resize"}`,
         disabled: a,
         "aria-invalid": e ? "true" : "false",
         "aria-describedby": b,
@@ -413,24 +413,24 @@ function Me({
         ...f
       }
     ),
-    s && !e && /* @__PURE__ */ r.jsx("span", { id: u, className: "ds-textarea-hint", children: s }),
-    e && /* @__PURE__ */ r.jsx("span", { id: x, className: "ds-textarea-error", role: "alert", children: e })
+    r && !e && /* @__PURE__ */ t.jsx("span", { id: u, className: "ds-textarea-hint", children: r }),
+    e && /* @__PURE__ */ t.jsx("span", { id: x, className: "ds-textarea-error", role: "alert", children: e })
   ] });
 }
 function Fe({
-  label: t,
+  label: s,
   value: e,
-  onChange: s,
+  onChange: r,
   options: c = [],
   placeholder: n = "Select option",
   error: a,
-  fullWidth: l = !0,
-  size: i = "m",
+  fullWidth: i = !0,
+  size: l = "m",
   disabled: p = !1,
   id: f,
   ...d
 }) {
-  const [u, x] = I(!1), [b, j] = I({}), [v, k] = I("down"), $ = L(null), S = L(null), m = f || `select-${A.useId()}`, _ = `${m}-label`, R = a ? `${m}-error` : void 0, g = () => {
+  const [u, x] = T(!1), [b, j] = T({}), [v, k] = T("down"), $ = L(null), g = L(null), m = f || `select-${A.useId()}`, _ = `${m}-label`, R = a ? `${m}-error` : void 0, I = () => {
     var H;
     const w = (H = $.current) == null ? void 0 : H.getBoundingClientRect();
     if (!w) return;
@@ -441,32 +441,32 @@ function Fe({
   };
   B(() => {
     if (u)
-      return g(), window.addEventListener("scroll", g, !0), window.addEventListener("resize", g), () => {
-        window.removeEventListener("scroll", g, !0), window.removeEventListener("resize", g);
+      return I(), window.addEventListener("scroll", I, !0), window.addEventListener("resize", I), () => {
+        window.removeEventListener("scroll", I, !0), window.removeEventListener("resize", I);
       };
   }, [u]), B(() => {
     const w = (D) => {
-      $.current && !$.current.contains(D.target) && S.current && !S.current.contains(D.target) && x(!1);
+      $.current && !$.current.contains(D.target) && g.current && !g.current.contains(D.target) && x(!1);
     };
     return document.addEventListener("mousedown", w), () => document.removeEventListener("mousedown", w);
   }, []);
-  const P = c.find((w) => w.value === e), M = i === "xs" ? T[1] : i === "small" ? T[2] : T[3], U = u && /* @__PURE__ */ r.jsx(
+  const P = c.find((w) => w.value === e), M = l === "xs" ? S[1] : l === "small" ? S[2] : S[3], U = u && /* @__PURE__ */ t.jsx(
     "div",
     {
-      ref: S,
+      ref: g,
       role: "listbox",
-      "aria-labelledby": t ? _ : void 0,
-      className: `ds-select-dropdown ds-select-dropdown--${i} ds-select-dropdown--${v}`,
+      "aria-labelledby": s ? _ : void 0,
+      className: `ds-select-dropdown ds-select-dropdown--${l} ds-select-dropdown--${v}`,
       style: b,
-      children: c.map((w) => /* @__PURE__ */ r.jsx(
+      children: c.map((w) => /* @__PURE__ */ t.jsx(
         "button",
         {
           type: "button",
           role: "option",
           "aria-selected": e === w.value,
-          className: `ds-select-option ds-select-option--${i} ${e === w.value ? "ds-select-option--selected" : ""}`,
+          className: `ds-select-option ds-select-option--${l} ${e === w.value ? "ds-select-option--selected" : ""}`,
           onClick: () => {
-            s == null || s(w.value), x(!1);
+            r == null || r(w.value), x(!1);
           },
           children: w.label
         },
@@ -474,9 +474,9 @@ function Fe({
       ))
     }
   );
-  return /* @__PURE__ */ r.jsxs("div", { className: `ds-select-wrapper ${l ? "ds-select-wrapper--full" : ""} ${p ? "ds-select-wrapper--disabled" : ""}`, children: [
-    t && /* @__PURE__ */ r.jsx("label", { id: _, className: "ds-select-label", children: t }),
-    /* @__PURE__ */ r.jsx("div", { className: "ds-select-container", ref: $, children: /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ t.jsxs("div", { className: `ds-select-wrapper ${i ? "ds-select-wrapper--full" : ""} ${p ? "ds-select-wrapper--disabled" : ""}`, children: [
+    s && /* @__PURE__ */ t.jsx("label", { id: _, className: "ds-select-label", children: s }),
+    /* @__PURE__ */ t.jsx("div", { className: "ds-select-container", ref: $, children: /* @__PURE__ */ t.jsxs(
       "button",
       {
         type: "button",
@@ -484,16 +484,16 @@ function Fe({
         role: "combobox",
         "aria-haspopup": "listbox",
         "aria-expanded": u,
-        "aria-labelledby": t ? _ : void 0,
+        "aria-labelledby": s ? _ : void 0,
         "aria-invalid": a ? "true" : "false",
         "aria-describedby": R,
-        className: `ds-select-trigger ds-select-trigger--${i} ${a ? "ds-select-trigger--error" : ""}`,
+        className: `ds-select-trigger ds-select-trigger--${l} ${a ? "ds-select-trigger--error" : ""}`,
         onClick: () => !p && x(!u),
         disabled: p,
         ...d,
         children: [
-          /* @__PURE__ */ r.jsx("span", { className: P ? "" : "ds-select-placeholder", children: (P == null ? void 0 : P.label) || n }),
-          /* @__PURE__ */ r.jsx(
+          /* @__PURE__ */ t.jsx("span", { className: P ? "" : "ds-select-placeholder", children: (P == null ? void 0 : P.label) || n }),
+          /* @__PURE__ */ t.jsx(
             K,
             {
               size: M,
@@ -505,67 +505,67 @@ function Fe({
         ]
       }
     ) }),
-    a && /* @__PURE__ */ r.jsx("span", { id: R, className: "ds-select-error", role: "alert", children: a }),
+    a && /* @__PURE__ */ t.jsx("span", { id: R, className: "ds-select-error", role: "alert", children: a }),
     typeof document < "u" && C.createPortal(U, document.body)
   ] });
 }
 function We({
-  label: t,
+  label: s,
   value: e = 0,
-  onChange: s,
+  onChange: r,
   min: c = 0,
   max: n = 100,
   step: a = 1,
-  size: l = "m",
-  disabled: i = !1,
+  size: i = "m",
+  disabled: l = !1,
   hint: p,
   error: f,
   ...d
 }) {
   const u = () => {
-    if (i) return;
+    if (l) return;
     const $ = Math.min(Number(e) + a, n);
-    s == null || s($);
+    r == null || r($);
   }, x = () => {
-    if (i) return;
+    if (l) return;
     const $ = Math.max(Number(e) - a, c);
-    s == null || s($);
+    r == null || r($);
   }, b = ($) => {
-    if (i) return;
-    const S = $.target.value;
-    if (S === "") {
-      s == null || s(c);
+    if (l) return;
+    const g = $.target.value;
+    if (g === "") {
+      r == null || r(c);
       return;
     }
-    const m = Number(S);
+    const m = Number(g);
     if (!isNaN(m)) {
       const _ = Math.min(Math.max(m, c), n);
-      s == null || s(_);
+      r == null || r(_);
     }
   }, j = [
     "ds-stepper-wrapper",
-    i && "ds-stepper-wrapper--disabled",
+    l && "ds-stepper-wrapper--disabled",
     f && "ds-stepper-wrapper--error"
   ].filter(Boolean).join(" "), v = [
     "ds-stepper",
-    `ds-stepper--${l}`,
-    i && "ds-stepper--disabled"
-  ].filter(Boolean).join(" "), k = l === "xs" ? T[1] : l === "small" ? T[2] : T[3];
-  return /* @__PURE__ */ r.jsxs("div", { className: j, children: [
-    t && /* @__PURE__ */ r.jsx("label", { className: "ds-stepper-label", children: t }),
-    /* @__PURE__ */ r.jsxs("div", { className: v, children: [
-      /* @__PURE__ */ r.jsx(
+    `ds-stepper--${i}`,
+    l && "ds-stepper--disabled"
+  ].filter(Boolean).join(" "), k = i === "xs" ? S[1] : i === "small" ? S[2] : S[3];
+  return /* @__PURE__ */ t.jsxs("div", { className: j, children: [
+    s && /* @__PURE__ */ t.jsx("label", { className: "ds-stepper-label", children: s }),
+    /* @__PURE__ */ t.jsxs("div", { className: v, children: [
+      /* @__PURE__ */ t.jsx(
         "button",
         {
           type: "button",
           className: "ds-stepper-button ds-stepper-button--minus",
           onClick: x,
-          disabled: i || e <= c,
+          disabled: l || e <= c,
           "aria-label": "Decrease",
-          children: /* @__PURE__ */ r.jsx(ve, { size: k, strokeWidth: 1.5 })
+          children: /* @__PURE__ */ t.jsx(ve, { size: k, strokeWidth: 1.5 })
         }
       ),
-      /* @__PURE__ */ r.jsx(
+      /* @__PURE__ */ t.jsx(
         "input",
         {
           type: "number",
@@ -575,112 +575,112 @@ function We({
           min: c,
           max: n,
           step: a,
-          disabled: i,
+          disabled: l,
           ...d
         }
       ),
-      /* @__PURE__ */ r.jsx(
+      /* @__PURE__ */ t.jsx(
         "button",
         {
           type: "button",
           className: "ds-stepper-button ds-stepper-button--plus",
           onClick: u,
-          disabled: i || e >= n,
+          disabled: l || e >= n,
           "aria-label": "Increase",
-          children: /* @__PURE__ */ r.jsx(je, { size: k, strokeWidth: 1.5 })
+          children: /* @__PURE__ */ t.jsx(je, { size: k, strokeWidth: 1.5 })
         }
       )
     ] }),
-    p && !f && /* @__PURE__ */ r.jsx("div", { className: "ds-stepper-hint", children: p }),
-    f && /* @__PURE__ */ r.jsx("div", { className: "ds-stepper-error", children: f })
+    p && !f && /* @__PURE__ */ t.jsx("div", { className: "ds-stepper-hint", children: p }),
+    f && /* @__PURE__ */ t.jsx("div", { className: "ds-stepper-error", children: f })
   ] });
 }
 function Ye({
-  children: t,
+  children: s,
   padding: e = "m",
-  variant: s = "info",
+  variant: r = "info",
   hover: c = !1,
   // deprecated, use variant="interactive"
   onClick: n,
   href: a,
-  disabled: l = !1,
-  ...i
+  disabled: i = !1,
+  ...l
 }) {
-  const f = (c ? "interactive" : s) === "interactive" || n || a, d = [
+  const f = (c ? "interactive" : r) === "interactive" || n || a, d = [
     "ds-card",
     `ds-card--${e}`,
     f && "ds-card--interactive"
   ].filter(Boolean).join(" ");
   if (a) {
     const b = (j) => {
-      if (l) {
+      if (i) {
         j.preventDefault();
         return;
       }
       j.metaKey || j.ctrlKey || j.button === 1 || (j.preventDefault(), n == null || n(j));
     };
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ t.jsx(
       "a",
       {
         className: d,
-        href: l ? void 0 : a,
+        href: i ? void 0 : a,
         onClick: b,
-        "aria-disabled": l ? "true" : void 0,
-        ...i,
-        children: t
+        "aria-disabled": i ? "true" : void 0,
+        ...l,
+        children: s
       }
     );
   }
   const u = f && n ? "button" : "div", x = f && n ? {
     type: "button",
     onClick: n,
-    disabled: l
+    disabled: i
   } : {};
-  return /* @__PURE__ */ r.jsx(
+  return /* @__PURE__ */ t.jsx(
     u,
     {
       className: d,
       role: f && !n ? "article" : void 0,
       ...x,
-      ...i,
-      children: t
+      ...l,
+      children: s
     }
   );
 }
-function ze({ children: t, ...e }) {
-  return /* @__PURE__ */ r.jsx("h1", { className: "ds-h1", ...e, children: t });
+function ze({ children: s, ...e }) {
+  return /* @__PURE__ */ t.jsx("h1", { className: "ds-h1", ...e, children: s });
 }
-function Ve({ children: t, ...e }) {
-  return /* @__PURE__ */ r.jsx("h2", { className: "ds-h2", ...e, children: t });
+function Ve({ children: s, ...e }) {
+  return /* @__PURE__ */ t.jsx("h2", { className: "ds-h2", ...e, children: s });
 }
-function Ue({ children: t, ...e }) {
-  return /* @__PURE__ */ r.jsx("h3", { className: "ds-h3", ...e, children: t });
+function Ue({ children: s, ...e }) {
+  return /* @__PURE__ */ t.jsx("h3", { className: "ds-h3", ...e, children: s });
 }
-function He({ children: t, ...e }) {
-  return /* @__PURE__ */ r.jsx("h4", { className: "ds-h4", ...e, children: t });
+function He({ children: s, ...e }) {
+  return /* @__PURE__ */ t.jsx("h4", { className: "ds-h4", ...e, children: s });
 }
-function Ge({ children: t, secondary: e = !1, ...s }) {
-  return /* @__PURE__ */ r.jsx("p", { className: `ds-p1 ${e ? "ds-p1--secondary" : ""}`, ...s, children: t });
+function Ge({ children: s, secondary: e = !1, ...r }) {
+  return /* @__PURE__ */ t.jsx("p", { className: `ds-p1 ${e ? "ds-p1--secondary" : ""}`, ...r, children: s });
 }
-function qe({ children: t, secondary: e = !1, ...s }) {
-  return /* @__PURE__ */ r.jsx("p", { className: `ds-p2 ${e ? "ds-p2--secondary" : ""}`, ...s, children: t });
+function qe({ children: s, secondary: e = !1, ...r }) {
+  return /* @__PURE__ */ t.jsx("p", { className: `ds-p2 ${e ? "ds-p2--secondary" : ""}`, ...r, children: s });
 }
-function Xe({ children: t, secondary: e = !1, ...s }) {
-  return /* @__PURE__ */ r.jsx("p", { className: `ds-p3 ${e ? "ds-p3--secondary" : ""}`, ...s, children: t });
+function Xe({ children: s, secondary: e = !1, ...r }) {
+  return /* @__PURE__ */ t.jsx("p", { className: `ds-p3 ${e ? "ds-p3--secondary" : ""}`, ...r, children: s });
 }
 function Je({
-  children: t,
+  children: s,
   variant: e = "default",
-  size: s = "m",
+  size: r = "m",
   role: c,
   ...n
 }) {
   const a = [
     "ds-badge",
     `ds-badge--${e}`,
-    `ds-badge--${s}`
-  ].filter(Boolean).join(" "), l = c || (["info", "success", "warning", "error"].includes(e) ? "status" : void 0);
-  return /* @__PURE__ */ r.jsx("span", { className: a, role: l, ...n, children: t });
+    `ds-badge--${r}`
+  ].filter(Boolean).join(" "), i = c || (["info", "success", "warning", "error"].includes(e) ? "status" : void 0);
+  return /* @__PURE__ */ t.jsx("span", { className: a, role: i, ...n, children: s });
 }
 const $e = {
   info: be,
@@ -689,101 +689,101 @@ const $e = {
   error: fe
 };
 function Ce({
-  children: t,
+  children: s,
   variant: e = "info",
-  title: s,
+  title: r,
   onClose: c,
   role: n,
   ...a
 }) {
-  const l = $e[e], i = n || (e === "error" ? "alert" : "status");
-  return /* @__PURE__ */ r.jsxs("div", { className: `ds-alert ds-alert--${e} ${s ? "" : "ds-alert--no-title"}`, role: i, ...a, children: [
-    l && /* @__PURE__ */ r.jsx("div", { className: "ds-alert__icon", children: /* @__PURE__ */ r.jsx(l, { size: T[3], strokeWidth: 1.5 }) }),
-    /* @__PURE__ */ r.jsxs("div", { className: "ds-alert__content", children: [
-      s && /* @__PURE__ */ r.jsx("div", { className: "ds-alert__title", children: s }),
-      t && /* @__PURE__ */ r.jsx("div", { className: "ds-alert__message", children: t })
+  const i = $e[e], l = n || (e === "error" ? "alert" : "status");
+  return /* @__PURE__ */ t.jsxs("div", { className: `ds-alert ds-alert--${e} ${r ? "" : "ds-alert--no-title"}`, role: l, ...a, children: [
+    i && /* @__PURE__ */ t.jsx("div", { className: "ds-alert__icon", children: /* @__PURE__ */ t.jsx(i, { size: S[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 })
     ] }),
-    c && /* @__PURE__ */ r.jsx(
+    c && /* @__PURE__ */ t.jsx(
       "button",
       {
         type: "button",
         className: "ds-alert__close",
         onClick: c,
         "aria-label": "Close alert",
-        children: /* @__PURE__ */ r.jsx(se, { size: T[3], strokeWidth: 1.5 })
+        children: /* @__PURE__ */ t.jsx(se, { size: S[3], strokeWidth: 1.5 })
       }
     )
   ] });
 }
 function Ke({
-  children: t,
+  children: s,
   title: e,
-  onClose: s,
+  onClose: r,
   size: c = "m",
   ...n
 }) {
-  const a = L(null), l = A.useId();
+  const a = L(null), i = A.useId();
   B(() => {
     const d = (x) => {
-      x.key === "Escape" && (s == null || s());
+      x.key === "Escape" && (r == null || r());
     }, u = (x) => {
-      a.current && !a.current.contains(x.target) && (s == null || s());
+      a.current && !a.current.contains(x.target) && (r == null || r());
     };
     return document.addEventListener("keydown", d), document.addEventListener("mousedown", u), () => {
       document.removeEventListener("keydown", d), document.removeEventListener("mousedown", u);
     };
-  }, [s]);
-  const i = A.Children.toArray(t), p = i.find((d) => (d == null ? void 0 : d.type) === de), f = i.filter((d) => (d == null ? void 0 : d.type) !== de);
-  return /* @__PURE__ */ r.jsx("div", { className: "ds-modal-overlay", ...n, children: /* @__PURE__ */ r.jsxs(
+  }, [r]);
+  const l = A.Children.toArray(s), p = l.find((d) => (d == null ? void 0 : d.type) === de), f = l.filter((d) => (d == null ? void 0 : d.type) !== de);
+  return /* @__PURE__ */ t.jsx("div", { className: "ds-modal-overlay", ...n, children: /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: `ds-modal ds-modal--${c}`,
       ref: a,
       role: "dialog",
       "aria-modal": "true",
-      "aria-labelledby": e ? l : void 0,
+      "aria-labelledby": e ? i : void 0,
       children: [
-        (e || s) && /* @__PURE__ */ r.jsxs("div", { className: "ds-modal__header", children: [
-          e && /* @__PURE__ */ r.jsx("h3", { id: l, className: "ds-modal__title", children: e }),
-          s && /* @__PURE__ */ r.jsx(
+        (e || r) && /* @__PURE__ */ t.jsxs("div", { className: "ds-modal__header", children: [
+          e && /* @__PURE__ */ t.jsx("h3", { id: i, className: "ds-modal__title", children: e }),
+          r && /* @__PURE__ */ t.jsx(
             ke,
             {
               variant: "ghost",
               size: "small",
-              icon: /* @__PURE__ */ r.jsx(se, { size: T[2], strokeWidth: 1.5 }),
-              onClick: s,
+              icon: /* @__PURE__ */ t.jsx(se, { size: S[2], strokeWidth: 1.5 }),
+              onClick: r,
               "aria-label": "Close modal"
             }
           )
         ] }),
-        /* @__PURE__ */ r.jsx("div", { className: "ds-modal__body", children: f }),
+        /* @__PURE__ */ t.jsx("div", { className: "ds-modal__body", children: f }),
         p
       ]
     }
   ) });
 }
-function de({ children: t }) {
-  return /* @__PURE__ */ r.jsx("div", { className: "ds-modal__footer", children: t });
+function de({ children: s }) {
+  return /* @__PURE__ */ t.jsx("div", { className: "ds-modal__footer", children: s });
 }
 function Re({
-  children: t,
+  children: s,
   title: e = "Code",
-  defaultExpanded: s = !1,
+  defaultExpanded: r = !1,
   expanded: c,
   onToggle: n,
   padding: a = "s",
-  className: l = "",
-  ...i
+  className: i = "",
+  ...l
 }) {
-  const [p, f] = I(s), d = c !== void 0, u = d ? c : p, x = () => {
+  const [p, f] = T(r), d = c !== void 0, u = d ? c : p, x = () => {
     d ? n == null || n(!c) : f((j) => !j);
   }, b = [
     "ds-code-accordion",
     `ds-code-accordion--${a}`,
-    l
+    i
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r.jsxs("div", { className: b, ...i, children: [
-    /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ t.jsxs("div", { className: b, ...l, children: [
+    /* @__PURE__ */ t.jsxs(
       "button",
       {
         type: "button",
@@ -791,11 +791,11 @@ function Re({
         onClick: x,
         "aria-expanded": u,
         children: [
-          /* @__PURE__ */ r.jsx("span", { className: "ds-code-accordion__title", children: e }),
-          /* @__PURE__ */ r.jsx(
+          /* @__PURE__ */ t.jsx("span", { className: "ds-code-accordion__title", children: e }),
+          /* @__PURE__ */ t.jsx(
             K,
             {
-              size: T[2],
+              size: S[2],
               strokeWidth: 1.5,
               className: `ds-code-accordion__icon ${u ? "ds-code-accordion__icon--expanded" : ""}`
             }
@@ -803,70 +803,70 @@ function Re({
         ]
       }
     ),
-    u && /* @__PURE__ */ r.jsx("pre", { className: "ds-code-accordion__content", children: /* @__PURE__ */ r.jsx("code", { children: t }) })
+    u && /* @__PURE__ */ t.jsx("pre", { className: "ds-code-accordion__content", children: /* @__PURE__ */ t.jsx("code", { children: s }) })
   ] });
 }
-function Ze({ children: t, block: e = !1, collapsible: s = !1, title: c = "Code", defaultExpanded: n = !1, ...a }) {
-  return e ? s ? /* @__PURE__ */ r.jsx(Re, { title: c, defaultExpanded: n, ...a, children: t }) : /* @__PURE__ */ r.jsx("pre", { className: "ds-code-block", ...a, children: /* @__PURE__ */ r.jsx("code", { children: t }) }) : /* @__PURE__ */ r.jsx("code", { className: "ds-code-inline", ...a, children: t });
+function Ze({ children: s, block: e = !1, collapsible: r = !1, title: c = "Code", defaultExpanded: n = !1, ...a }) {
+  return e ? r ? /* @__PURE__ */ t.jsx(Re, { title: c, defaultExpanded: n, ...a, children: s }) : /* @__PURE__ */ t.jsx("pre", { className: "ds-code-block", ...a, children: /* @__PURE__ */ t.jsx("code", { children: s }) }) : /* @__PURE__ */ t.jsx("code", { className: "ds-code-inline", ...a, children: s });
 }
-function Qe({ href: t, children: e, onClick: s, target: c, rel: n, ...a }) {
-  const i = c === "_blank" ? n ? `${n} noopener noreferrer` : "noopener noreferrer" : n;
-  return /* @__PURE__ */ r.jsx(
+function Qe({ href: s, children: e, onClick: r, target: c, rel: n, ...a }) {
+  const l = c === "_blank" ? n ? `${n} noopener noreferrer` : "noopener noreferrer" : n;
+  return /* @__PURE__ */ t.jsx(
     "a",
     {
-      href: t,
+      href: s,
       className: "ds-link",
-      onClick: s,
+      onClick: r,
       target: c,
-      rel: i,
+      rel: l,
       ...a,
       children: e
     }
   );
 }
-function et({ children: t, size: e = "m", variant: s = "ghost", ...c }) {
-  return /* @__PURE__ */ r.jsx("div", { className: "ds-tabs", role: "tablist", ...c, children: A.Children.map(t, (n) => A.isValidElement(n) ? A.cloneElement(n, { size: e, variant: s }) : n) });
+function et({ children: s, size: e = "m", variant: r = "ghost", ...c }) {
+  return /* @__PURE__ */ t.jsx("div", { className: "ds-tabs", role: "tablist", ...c, children: A.Children.map(s, (n) => A.isValidElement(n) ? A.cloneElement(n, { size: e, variant: r }) : n) });
 }
-function tt({ children: t, selected: e = !1, onClick: s, size: c = "m", variant: n = "ghost", disabled: a = !1, icon: l, href: i, ...p }) {
-  const f = l && !t, d = [
+function tt({ children: s, selected: e = !1, onClick: r, size: c = "m", variant: n = "ghost", disabled: a = !1, icon: i, href: l, ...p }) {
+  const f = i && !s, d = [
     "ds-tab",
     `ds-tab--${c}`,
     `ds-tab--${n}`,
     e && "ds-tab--selected",
     f && "ds-tab--icon-only"
-  ].filter(Boolean).join(" "), u = /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-    l && /* @__PURE__ */ r.jsx("span", { className: "ds-tab-icon", children: l }),
-    t
+  ].filter(Boolean).join(" "), u = /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    i && /* @__PURE__ */ t.jsx("span", { className: "ds-tab-icon", children: i }),
+    s
   ] });
-  if (i) {
+  if (l) {
     const x = (b) => {
       if (a) {
         b.preventDefault();
         return;
       }
-      b.metaKey || b.ctrlKey || b.button === 1 || (b.preventDefault(), s == null || s(b));
+      b.metaKey || b.ctrlKey || b.button === 1 || (b.preventDefault(), r == null || r(b));
     };
-    return /* @__PURE__ */ r.jsx(
+    return /* @__PURE__ */ t.jsx(
       "a",
       {
         role: "tab",
         "aria-current": e ? "page" : void 0,
         "aria-disabled": a ? "true" : void 0,
         className: d,
-        href: a ? void 0 : i,
+        href: a ? void 0 : l,
         onClick: x,
         ...p,
         children: u
       }
     );
   }
-  return /* @__PURE__ */ r.jsx(
+  return /* @__PURE__ */ t.jsx(
     "button",
     {
       role: "tab",
       "aria-selected": e,
       className: d,
-      onClick: s,
+      onClick: r,
       disabled: a,
       ...p,
       children: u
@@ -874,22 +874,22 @@ function tt({ children: t, selected: e = !1, onClick: s, size: c = "m", variant:
   );
 }
 function st({
-  children: t,
+  children: s,
   title: e,
-  defaultExpanded: s = !1,
+  defaultExpanded: r = !1,
   expanded: c,
   onToggle: n,
   padding: a = "m",
-  ...l
+  ...i
 }) {
-  const [i, p] = I(s), f = c !== void 0, d = f ? c : i, u = () => {
+  const [l, p] = T(r), f = c !== void 0, d = f ? c : l, u = () => {
     f ? n == null || n(!c) : p((b) => !b);
   }, x = [
     "ds-accordion",
     `ds-accordion--${a}`
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r.jsxs("div", { className: x, ...l, children: [
-    /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ t.jsxs("div", { className: x, ...i, children: [
+    /* @__PURE__ */ t.jsxs(
       "button",
       {
         type: "button",
@@ -897,11 +897,11 @@ function st({
         onClick: u,
         "aria-expanded": d,
         children: [
-          /* @__PURE__ */ r.jsx("span", { className: "ds-accordion__title", children: e }),
-          /* @__PURE__ */ r.jsx(
+          /* @__PURE__ */ t.jsx("span", { className: "ds-accordion__title", children: e }),
+          /* @__PURE__ */ t.jsx(
             K,
             {
-              size: T[2],
+              size: S[2],
               strokeWidth: 1.5,
               className: `ds-accordion__icon ${d ? "ds-accordion__icon--expanded" : ""}`
             }
@@ -909,48 +909,48 @@ function st({
         ]
       }
     ),
-    d && /* @__PURE__ */ r.jsx("div", { className: "ds-accordion__content", children: t })
+    d && /* @__PURE__ */ t.jsx("div", { className: "ds-accordion__content", children: s })
   ] });
 }
 const O = 8, z = 8;
-function Te(t, e, s) {
+function Te(s, e, r) {
   const c = window.innerWidth;
   let n, a;
-  switch (t) {
+  switch (s) {
     case "top":
-      n = e.top - s.height - O, a = e.left + e.width / 2 - s.width / 2;
+      n = e.top - r.height - O, a = e.left + e.width / 2 - r.width / 2;
       break;
     case "bottom":
-      n = e.bottom + O, a = e.left + e.width / 2 - s.width / 2;
+      n = e.bottom + O, a = e.left + e.width / 2 - r.width / 2;
       break;
     case "left":
-      n = e.top + e.height / 2 - s.height / 2, a = e.left - s.width - O;
+      n = e.top + e.height / 2 - r.height / 2, a = e.left - r.width - O;
       break;
     case "right":
-      n = e.top + e.height / 2 - s.height / 2, a = e.right + O;
+      n = e.top + e.height / 2 - r.height / 2, a = e.right + O;
       break;
     default:
       n = e.bottom + O, a = e.left;
   }
-  const l = Math.max(z, Math.min(c - s.width - z, a)), i = a - l;
-  return { top: n, left: l, arrowOffset: i };
+  const i = Math.max(z, Math.min(c - r.width - z, a)), l = a - i;
+  return { top: n, left: i, arrowOffset: l };
 }
-function Se(t, e, s) {
+function Se(s, e, r) {
   const c = window.innerWidth, n = window.innerHeight;
-  if (t.top >= e + O + z) return "top";
-  if (n - t.bottom >= e + O + z) return "bottom";
-  if (c - t.right >= s + O + z) return "right";
-  if (t.left >= s + O + z) return "left";
-  const a = Math.max(t.top, n - t.bottom, t.left, c - t.right);
-  return a === t.top ? "top" : a === n - t.bottom ? "bottom" : a === c - t.right ? "right" : "left";
+  if (s.top >= e + O + z) return "top";
+  if (n - s.bottom >= e + O + z) return "bottom";
+  if (c - s.right >= r + O + z) return "right";
+  if (s.left >= r + O + z) return "left";
+  const a = Math.max(s.top, n - s.bottom, s.left, c - s.right);
+  return a === s.top ? "top" : a === n - s.bottom ? "bottom" : a === c - s.right ? "right" : "left";
 }
-function rt({ children: t, content: e, position: s, ...c }) {
-  const [n, a] = I(!1), [l, i] = I({ visibility: "hidden" }), [p, f] = I(s || "top"), d = L(null), u = L(null), x = L(!1), b = () => {
+function rt({ children: s, content: e, position: r, ...c }) {
+  const [n, a] = T(!1), [i, l] = T({ visibility: "hidden" }), [p, f] = T(r || "top"), d = L(null), u = L(null), x = L(!1), b = () => {
     if (!d.current || !u.current) return;
-    const v = d.current.getBoundingClientRect(), k = u.current.getBoundingClientRect(), $ = s || Se(v, k.height, k.width), { top: S, left: m, arrowOffset: _ } = Te($, v, k);
-    f($), i({
+    const v = d.current.getBoundingClientRect(), k = u.current.getBoundingClientRect(), $ = r || Se(v, k.height, k.width), { top: g, left: m, arrowOffset: _ } = Te($, v, k);
+    f($), l({
       position: "fixed",
-      top: S,
+      top: g,
       left: m,
       visibility: "visible",
       "--arrow-offset": `${_}px`
@@ -958,29 +958,29 @@ function rt({ children: t, content: e, position: s, ...c }) {
   };
   if (B(() => {
     if (!n) return;
-    i({ position: "fixed", visibility: "hidden" });
+    l({ position: "fixed", visibility: "hidden" });
     const v = requestAnimationFrame(b);
     return window.addEventListener("scroll", b, !0), window.addEventListener("resize", b), () => {
       cancelAnimationFrame(v), window.removeEventListener("scroll", b, !0), window.removeEventListener("resize", b);
     };
-  }, [n, s]), B(() => {
+  }, [n, r]), B(() => {
     if (!n) return;
     const v = (k) => {
       d.current && !d.current.contains(k.target) && a(!1);
     };
     return document.addEventListener("touchstart", v), () => document.removeEventListener("touchstart", v);
-  }, [n]), !e) return t;
-  const j = n && /* @__PURE__ */ r.jsx(
+  }, [n]), !e) return s;
+  const j = n && /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: u,
       className: `ds-tooltip ds-tooltip--${p}`,
       role: "tooltip",
-      style: l,
+      style: i,
       children: e
     }
   );
-  return /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ t.jsxs(
     "div",
     {
       ref: d,
@@ -996,71 +996,71 @@ function rt({ children: t, content: e, position: s, ...c }) {
       },
       ...c,
       children: [
-        t,
+        s,
         typeof document < "u" && C.createPortal(j, document.body)
       ]
     }
   );
 }
 function nt({
-  checked: t = !1,
+  checked: s = !1,
   onChange: e,
-  size: s = "m",
+  size: r = "m",
   disabled: c = !1,
   label: n,
   id: a,
-  ...l
+  ...i
 }) {
-  const i = a || `toggle-${A.useId()}`, p = [
+  const l = a || `toggle-${A.useId()}`, p = [
     "ds-toggle",
-    `ds-toggle--${s}`,
+    `ds-toggle--${r}`,
     c && "ds-toggle--disabled"
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r.jsxs("label", { className: p, htmlFor: i, children: [
-    /* @__PURE__ */ r.jsx(
+  return /* @__PURE__ */ t.jsxs("label", { className: p, htmlFor: l, children: [
+    /* @__PURE__ */ t.jsx(
       "input",
       {
         type: "checkbox",
-        id: i,
+        id: l,
         className: "ds-toggle__input",
-        checked: t,
+        checked: s,
         onChange: (f) => e == null ? void 0 : e(f.target.checked),
         disabled: c,
-        ...l
+        ...i
       }
     ),
-    /* @__PURE__ */ r.jsx("span", { className: "ds-toggle__track", children: /* @__PURE__ */ r.jsx("span", { className: "ds-toggle__thumb" }) }),
-    n && /* @__PURE__ */ r.jsx("span", { className: "ds-toggle__label", children: n })
+    /* @__PURE__ */ t.jsx("span", { className: "ds-toggle__track", children: /* @__PURE__ */ t.jsx("span", { className: "ds-toggle__thumb" }) }),
+    n && /* @__PURE__ */ t.jsx("span", { className: "ds-toggle__label", children: n })
   ] });
 }
 function at({
-  checked: t = !1,
+  checked: s = !1,
   onChange: e,
-  size: s = "m",
+  size: r = "m",
   disabled: c = !1,
   label: n,
   id: a,
-  ...l
+  ...i
 }) {
-  const i = a || `checkbox-${A.useId()}`, p = [
+  const l = a || `checkbox-${A.useId()}`, p = [
     "ds-checkbox",
-    `ds-checkbox--${s}`,
+    `ds-checkbox--${r}`,
     c && "ds-checkbox--disabled"
-  ].filter(Boolean).join(" "), f = s === "xs" ? 10 : s === "small" ? 14 : s === "large" ? 20 : 16;
-  return /* @__PURE__ */ r.jsxs("label", { className: p, htmlFor: i, children: [
-    /* @__PURE__ */ r.jsx(
+  ].filter(Boolean).join(" "), f = r === "xs" ? 10 : r === "small" ? 14 : r === "large" ? 20 : 16;
+  return /* @__PURE__ */ t.jsxs("label", { className: p, htmlFor: l, children: [
+    /* @__PURE__ */ t.jsx(
       "input",
       {
         type: "checkbox",
-        id: i,
+        id: l,
         className: "ds-checkbox__input",
-        checked: t,
+        checked: s,
         onChange: (d) => e == null ? void 0 : e(d.target.checked),
         disabled: c,
-        ...l
+        ...i
       }
     ),
-    /* @__PURE__ */ r.jsx("span", { className: "ds-checkbox__box", children: t && /* @__PURE__ */ r.jsx(
+    /* @__PURE__ */ t.jsx("span", { className: "ds-checkbox__box", children: s && /* @__PURE__ */ t.jsx(
       _e,
       {
         size: f,
@@ -1068,211 +1068,211 @@ function at({
         className: "ds-checkbox__icon"
       }
     ) }),
-    n && /* @__PURE__ */ r.jsx("span", { className: "ds-checkbox__label", children: n })
+    n && /* @__PURE__ */ t.jsx("span", { className: "ds-checkbox__label", children: n })
   ] });
 }
 function ot({
-  checked: t = !1,
+  checked: s = !1,
   onChange: e,
-  size: s = "m",
+  size: r = "m",
   disabled: c = !1,
   label: n,
   name: a,
-  value: l,
-  id: i,
+  value: i,
+  id: l,
   ...p
 }) {
-  const f = i || `radio-${A.useId()}`, d = [
+  const f = l || `radio-${A.useId()}`, d = [
     "ds-radio",
-    `ds-radio--${s}`,
+    `ds-radio--${r}`,
     c && "ds-radio--disabled"
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ r.jsxs("label", { className: d, htmlFor: f, children: [
-    /* @__PURE__ */ r.jsx(
+  return /* @__PURE__ */ t.jsxs("label", { className: d, htmlFor: f, children: [
+    /* @__PURE__ */ t.jsx(
       "input",
       {
         type: "radio",
         id: f,
         className: "ds-radio__input",
-        checked: t,
+        checked: s,
         onChange: (u) => e == null ? void 0 : e(u.target.checked),
         disabled: c,
         name: a,
-        value: l,
+        value: i,
         ...p
       }
     ),
-    /* @__PURE__ */ r.jsx("span", { className: "ds-radio__circle", children: /* @__PURE__ */ r.jsx("span", { className: "ds-radio__dot" }) }),
-    n && /* @__PURE__ */ r.jsx("span", { className: "ds-radio__label", children: n })
+    /* @__PURE__ */ t.jsx("span", { className: "ds-radio__circle", children: /* @__PURE__ */ t.jsx("span", { className: "ds-radio__dot" }) }),
+    n && /* @__PURE__ */ t.jsx("span", { className: "ds-radio__label", children: n })
   ] });
 }
-function ct({ size: t = "m", color: e = "default", className: s = "", ...c }) {
-  return /* @__PURE__ */ r.jsx(
+function ct({ size: s = "m", color: e = "default", className: r = "", ...c }) {
+  return /* @__PURE__ */ t.jsx(
     "span",
     {
-      className: ["ds-spinner", `ds-spinner--${t}`, `ds-spinner--${e}`, s].filter(Boolean).join(" "),
+      className: ["ds-spinner", `ds-spinner--${s}`, `ds-spinner--${e}`, r].filter(Boolean).join(" "),
       role: "status",
       "aria-label": "Loading",
       ...c
     }
   );
 }
-function lt({ width: t, height: e, shape: s = "rect", className: c = "", style: n = {}, ...a }) {
-  return /* @__PURE__ */ r.jsx(
+function lt({ width: s, height: e, shape: r = "rect", className: c = "", style: n = {}, ...a }) {
+  return /* @__PURE__ */ t.jsx(
     "span",
     {
-      className: ["ds-skeleton", `ds-skeleton--${s}`, c].filter(Boolean).join(" "),
-      style: { width: t, height: e, ...n },
+      className: ["ds-skeleton", `ds-skeleton--${r}`, c].filter(Boolean).join(" "),
+      style: { width: s, height: e, ...n },
       "aria-hidden": "true",
       ...a
     }
   );
 }
-function ge(t) {
+function ge(s) {
   let e = 2166136261;
-  for (let s = 0; s < t.length; s++)
-    e ^= t.charCodeAt(s), e = Math.imul(e, 16777619) >>> 0;
+  for (let r = 0; r < s.length; r++)
+    e ^= s.charCodeAt(r), e = Math.imul(e, 16777619) >>> 0;
   return e % 360;
 }
-function it({ seed: t, icon: e, size: s = 32, className: c = "", style: n = {}, ...a }) {
-  const l = ge(t ?? "");
-  return /* @__PURE__ */ r.jsx(
+function it({ seed: s, icon: e, src: r, size: c = 32, className: n = "", style: a = {}, ...i }) {
+  const l = ge(s ?? ""), [p, f] = T(!1);
+  return /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: ["ds-avatar", c].filter(Boolean).join(" "),
-      style: { width: s, height: s, "--ds-avatar-h": l, ...n },
+      className: ["ds-avatar", n].filter(Boolean).join(" "),
+      style: { width: c, height: c, "--ds-avatar-h": l, ...a },
       "aria-hidden": "true",
-      ...a,
-      children: e
+      ...i,
+      children: r && !p ? /* @__PURE__ */ t.jsx("img", { src: r, alt: "", onError: () => f(!0) }) : e
     }
   );
 }
 function dt({
-  children: t,
+  children: s,
   size: e = "compact",
-  stickyTop: s,
+  stickyTop: r,
   maxHeight: c,
   className: n = "",
   style: a = {},
-  ...l
+  ...i
 }) {
-  const i = {
+  const l = {
     ...c ? { maxHeight: c } : {},
-    ...s !== void 0 ? { "--ds-table-sticky-top": typeof s == "number" ? `${s}px` : s } : {},
+    ...r !== void 0 ? { "--ds-table-sticky-top": typeof r == "number" ? `${r}px` : r } : {},
     ...a
   };
-  return /* @__PURE__ */ r.jsx(
+  return /* @__PURE__ */ t.jsx(
     "div",
     {
       className: ["ds-table-wrap", c ? "ds-table-wrap--scroll" : ""].filter(Boolean).join(" "),
-      style: i,
-      children: /* @__PURE__ */ r.jsx(
+      style: l,
+      children: /* @__PURE__ */ t.jsx(
         "table",
         {
           className: ["ds-table", `ds-table--${e}`, n].filter(Boolean).join(" "),
-          ...l,
-          children: t
+          ...i,
+          children: s
         }
       )
     }
   );
 }
-function ut({ children: t, ...e }) {
-  return /* @__PURE__ */ r.jsx("thead", { ...e, children: t });
+function ut({ children: s, ...e }) {
+  return /* @__PURE__ */ t.jsx("thead", { ...e, children: s });
 }
-function ft({ children: t, ...e }) {
-  return /* @__PURE__ */ r.jsx("tbody", { ...e, children: t });
+function ft({ children: s, ...e }) {
+  return /* @__PURE__ */ t.jsx("tbody", { ...e, children: s });
 }
-function mt({ children: t, interactive: e, selected: s, className: c = "", onClick: n, ...a }) {
-  return /* @__PURE__ */ r.jsx(
+function mt({ children: s, interactive: e, selected: r, className: c = "", onClick: n, ...a }) {
+  return /* @__PURE__ */ t.jsx(
     "tr",
     {
       className: [
         "ds-table-row",
         e || n ? "ds-table-row--interactive" : "",
-        s ? "ds-table-row--selected" : "",
+        r ? "ds-table-row--selected" : "",
         c
       ].filter(Boolean).join(" "),
       onClick: n,
       ...a,
-      children: t
+      children: s
     }
   );
 }
-function pt({ children: t, align: e = "left", sortDir: s, onSort: c, width: n, className: a = "", style: l = {}, ...i }) {
-  const p = !!c || s !== void 0, f = s === "asc" ? we : s === "desc" ? K : Ne;
-  return /* @__PURE__ */ r.jsx(
+function pt({ children: s, align: e = "left", sortDir: r, onSort: c, width: n, className: a = "", style: i = {}, ...l }) {
+  const p = !!c || r !== void 0, f = r === "asc" ? we : r === "desc" ? K : Ne;
+  return /* @__PURE__ */ t.jsx(
     "th",
     {
       className: [
         "ds-th",
         p ? "ds-th--sortable" : "",
-        s ? "ds-th--sorted" : "",
+        r ? "ds-th--sorted" : "",
         e !== "left" ? `ds-table-cell--${e}` : "",
         a
       ].filter(Boolean).join(" "),
       onClick: c,
-      style: { width: n, ...l },
-      ...i,
-      children: p ? /* @__PURE__ */ r.jsxs("span", { className: "ds-th__inner", children: [
-        t,
-        /* @__PURE__ */ r.jsx("span", { className: "ds-th__sort-icon", children: /* @__PURE__ */ r.jsx(f, { size: 11, strokeWidth: 2.5 }) })
-      ] }) : t
+      style: { width: n, ...i },
+      ...l,
+      children: p ? /* @__PURE__ */ t.jsxs("span", { className: "ds-th__inner", children: [
+        s,
+        /* @__PURE__ */ t.jsx("span", { className: "ds-th__sort-icon", children: /* @__PURE__ */ t.jsx(f, { size: 11, strokeWidth: 2.5 }) })
+      ] }) : s
     }
   );
 }
-function bt({ children: t, align: e = "left", secondary: s, muted: c, truncate: n, nowrap: a, className: l = "", ...i }) {
-  return /* @__PURE__ */ r.jsx(
+function bt({ children: s, align: e = "left", secondary: r, muted: c, truncate: n, nowrap: a, className: i = "", ...l }) {
+  return /* @__PURE__ */ t.jsx(
     "td",
     {
       className: [
         "ds-td",
         e !== "left" ? `ds-table-cell--${e}` : "",
-        s ? "ds-table-cell--secondary" : "",
+        r ? "ds-table-cell--secondary" : "",
         c ? "ds-table-cell--muted" : "",
         n ? "ds-table-cell--truncate" : "",
         a ? "ds-table-cell--nowrap" : "",
-        l
+        i
       ].filter(Boolean).join(" "),
-      ...i,
-      children: t
+      ...l,
+      children: s
     }
   );
 }
 function ht({
-  icon: t,
+  icon: s,
   title: e,
-  description: s,
+  description: r,
   action: c,
   size: n = "m",
   className: a = "",
-  ...l
+  ...i
 }) {
-  return /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: ["ds-empty-state", `ds-empty-state--${n}`, a].filter(Boolean).join(" "),
-      ...l,
+      ...i,
       children: [
-        t && /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__icon", children: t }),
-        /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__title", children: e }),
-        s && /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__description", children: s }),
-        c && /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__action", children: c })
+        s && /* @__PURE__ */ t.jsx("div", { className: "ds-empty-state__icon", children: s }),
+        /* @__PURE__ */ t.jsx("div", { className: "ds-empty-state__title", children: e }),
+        r && /* @__PURE__ */ t.jsx("div", { className: "ds-empty-state__description", children: r }),
+        c && /* @__PURE__ */ t.jsx("div", { className: "ds-empty-state__action", children: c })
       ]
     }
   );
 }
 function xt({
-  trigger: t,
+  trigger: s,
   items: e = [],
-  open: s,
+  open: r,
   onOpenChange: c,
   align: n = "left",
   className: a = "",
-  style: l,
-  ...i
+  style: i,
+  ...l
 }) {
-  const [p, f] = I(!1), d = s !== void 0, u = d ? s : p, x = L(null), b = L(null), [j, v] = I({}), k = () => {
+  const [p, f] = T(!1), d = r !== void 0, u = d ? r : p, x = L(null), b = L(null), [j, v] = T({}), k = () => {
     d ? c == null || c(!1) : f(!1);
   }, $ = () => {
     const m = !u;
@@ -1293,8 +1293,8 @@ function xt({
   }, [u, n]), B(() => {
     if (!u) return;
     const m = (R) => {
-      var g, P;
-      !((g = x.current) != null && g.contains(R.target)) && !((P = b.current) != null && P.contains(R.target)) && k();
+      var I, P;
+      !((I = x.current) != null && I.contains(R.target)) && !((P = b.current) != null && P.contains(R.target)) && k();
     }, _ = (R) => {
       R.key === "Escape" && k();
     };
@@ -1302,7 +1302,7 @@ function xt({
       document.removeEventListener("mousedown", m), document.removeEventListener("keydown", _);
     };
   }, [u]);
-  const S = u && /* @__PURE__ */ r.jsx(
+  const g = u && /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: b,
@@ -1310,15 +1310,15 @@ function xt({
       style: j,
       children: e.map((m, _) => {
         if (m.separator)
-          return /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__separator" }, _);
+          return /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__separator" }, _);
         if (m.type === "section")
-          return /* @__PURE__ */ r.jsxs("div", { className: "ds-dropdown__section", children: [
-            m.label && /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__section-label", children: m.label }),
-            /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__section-content", children: m.content })
+          return /* @__PURE__ */ t.jsxs("div", { className: "ds-dropdown__section", children: [
+            m.label && /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__section-label", children: m.label }),
+            /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__section-content", children: m.content })
           ] }, _);
-        const R = !!m.href, g = R ? "a" : "button", P = R ? { href: m.disabled ? void 0 : m.href, "aria-disabled": m.disabled ? "true" : void 0 } : { type: "button", disabled: m.disabled };
-        return /* @__PURE__ */ r.jsxs(
-          g,
+        const R = !!m.href, I = R ? "a" : "button", P = R ? { href: m.disabled ? void 0 : m.href, "aria-disabled": m.disabled ? "true" : void 0 } : { type: "button", disabled: m.disabled };
+        return /* @__PURE__ */ t.jsxs(
+          I,
           {
             className: [
               "ds-dropdown__item",
@@ -1330,9 +1330,9 @@ function xt({
               (M = m.onClick) == null || M.call(m), k();
             },
             children: [
-              m.icon && /* @__PURE__ */ r.jsx("span", { className: "ds-dropdown__item-icon", children: m.icon }),
-              /* @__PURE__ */ r.jsx("span", { className: "ds-dropdown__item-label", children: m.label }),
-              m.shortcut && /* @__PURE__ */ r.jsx("span", { className: "ds-dropdown__item-shortcut", children: m.shortcut })
+              m.icon && /* @__PURE__ */ t.jsx("span", { className: "ds-dropdown__item-icon", children: m.icon }),
+              /* @__PURE__ */ t.jsx("span", { className: "ds-dropdown__item-label", children: m.label }),
+              m.shortcut && /* @__PURE__ */ t.jsx("span", { className: "ds-dropdown__item-shortcut", children: m.shortcut })
             ]
           },
           _
@@ -1340,16 +1340,16 @@ function xt({
       })
     }
   );
-  return /* @__PURE__ */ r.jsxs(
+  return /* @__PURE__ */ t.jsxs(
     "div",
     {
       ref: x,
       className: ["ds-dropdown", a].filter(Boolean).join(" "),
-      style: l,
-      ...i,
+      style: i,
+      ...l,
       children: [
-        /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__trigger", onClick: $, children: t }),
-        typeof document < "u" && C.createPortal(S, document.body)
+        /* @__PURE__ */ t.jsx("div", { className: "ds-dropdown__trigger", onClick: $, children: s }),
+        typeof document < "u" && C.createPortal(g, document.body)
       ]
     }
   );
@@ -1363,63 +1363,63 @@ const ue = {
 let V = [];
 const te = /* @__PURE__ */ new Set();
 function he() {
-  te.forEach((t) => t([...V]));
+  te.forEach((s) => s([...V]));
 }
-function Ae(t) {
-  V = [...V, t], he();
+function Ie(s) {
+  V = [...V, s], he();
 }
-function Ie(t) {
-  V = V.filter((e) => e.id !== t), he();
+function Ae(s) {
+  V = V.filter((e) => e.id !== s), he();
 }
 function vt() {
-  const t = (e, s = {}) => {
-    Ae({
+  const s = (e, r = {}) => {
+    Ie({
       id: `${Date.now()}-${Math.random()}`,
       message: e,
       type: "default",
       duration: 4e3,
-      ...s
+      ...r
     });
   };
-  return t.success = (e, s) => t(e, { ...s, type: "success" }), t.error = (e, s) => t(e, { ...s, type: "error" }), t.warning = (e, s) => t(e, { ...s, type: "warning" }), { toast: t };
+  return s.success = (e, r) => s(e, { ...r, type: "success" }), s.error = (e, r) => s(e, { ...r, type: "error" }), s.warning = (e, r) => s(e, { ...r, type: "warning" }), { toast: s };
 }
-function Pe({ data: t, onDismiss: e }) {
-  const [s, c] = I(!1), n = L(null);
-  B(() => (requestAnimationFrame(() => c(!0)), t.duration > 0 && (n.current = setTimeout(() => a(), t.duration)), () => clearTimeout(n.current)), []);
+function Pe({ data: s, onDismiss: e }) {
+  const [r, c] = T(!1), n = L(null);
+  B(() => (requestAnimationFrame(() => c(!0)), s.duration > 0 && (n.current = setTimeout(() => a(), s.duration)), () => clearTimeout(n.current)), []);
   function a() {
-    c(!1), setTimeout(() => e(t.id), 250);
+    c(!1), setTimeout(() => e(s.id), 250);
   }
-  const l = ue[t.type] ?? ue.default;
-  return /* @__PURE__ */ r.jsxs(
+  const i = ue[s.type] ?? ue.default;
+  return /* @__PURE__ */ t.jsxs(
     "div",
     {
       className: [
         "ds-toast",
-        `ds-toast--${t.type}`,
-        s && "ds-toast--visible"
+        `ds-toast--${s.type}`,
+        r && "ds-toast--visible"
       ].filter(Boolean).join(" "),
-      role: t.type === "error" ? "alert" : "status",
+      role: s.type === "error" ? "alert" : "status",
       "aria-live": "polite",
       children: [
-        /* @__PURE__ */ r.jsx("div", { className: "ds-toast__icon", children: /* @__PURE__ */ r.jsx(l, { size: T[3], strokeWidth: 1.5 }) }),
-        /* @__PURE__ */ r.jsx("span", { className: "ds-toast__message", children: t.message }),
-        /* @__PURE__ */ r.jsx(
+        /* @__PURE__ */ t.jsx("div", { className: "ds-toast__icon", children: /* @__PURE__ */ t.jsx(i, { size: S[3], strokeWidth: 1.5 }) }),
+        /* @__PURE__ */ t.jsx("span", { className: "ds-toast__message", children: s.message }),
+        /* @__PURE__ */ t.jsx(
           "button",
           {
             className: "ds-toast__close",
             onClick: a,
             "aria-label": "Закрыть",
-            children: /* @__PURE__ */ r.jsx(se, { size: T[3], strokeWidth: 1.5 })
+            children: /* @__PURE__ */ t.jsx(se, { size: S[3], strokeWidth: 1.5 })
           }
         )
       ]
     }
   );
 }
-function jt({ position: t = "bottom-right" }) {
-  const [e, s] = I(() => [...V]);
-  return B(() => (te.add(s), () => te.delete(s)), []), !e.length || typeof document > "u" ? null : C.createPortal(
-    /* @__PURE__ */ r.jsx("div", { className: ["ds-toast-container", `ds-toast-container--${t}`].join(" "), children: e.map((c) => /* @__PURE__ */ r.jsx(Pe, { data: c, onDismiss: Ie }, c.id)) }),
+function jt({ position: s = "bottom-right" }) {
+  const [e, r] = T(() => [...V]);
+  return B(() => (te.add(r), () => te.delete(r)), []), !e.length || typeof document > "u" ? null : C.createPortal(
+    /* @__PURE__ */ t.jsx("div", { className: ["ds-toast-container", `ds-toast-container--${s}`].join(" "), children: e.map((c) => /* @__PURE__ */ t.jsx(Pe, { data: c, onDismiss: Ae }, c.id)) }),
     document.body
   );
 }
@@ -1463,6 +1463,6 @@ export {
   jt as ToastContainer,
   nt as Toggle,
   rt as Tooltip,
-  T as iconSizes,
+  S as iconSizes,
   vt as useToast
 };