welcome-ui 10.0.0-alpha.1 → 10.0.0-alpha.10

package/dist/Breadcrumb.js

@@ -1,59 +1,61 @@
 "use client";
-import { jsxs as te, jsx as y } from "react/jsx-runtime";
-import { forwardRef as re, Children as pe, cloneElement as be, useRef as M, useState as V, useCallback as X, useMemo as ge, useEffect as q } from "react";
-import { Icon as me } from "./Icon.js";
-import { c as ne } from "./index-CdiHdiVB.js";
-import { t as xe } from "./throttle-BDBzFeFj.js";
-var b = [], ze = function() {
-  return b.some(function(e) {
+import './Breadcrumb.css';
+import { jsxs as I, jsx as w } from "react/jsx-runtime";
+import { forwardRef as ge, Children as me, cloneElement as xe, useRef as M, useState as V, useCallback as X, useMemo as ze, useEffect as $ } from "react";
+import { Icon as re } from "./Icon.js";
+import { c as ne } from "./index-PAaZGbyz.js";
+import { t as we } from "./throttle-BDBzFeFj.js";
+import { f as Oe } from "./forwardRefWithAs-8eP3ZN15.js";
+var g = [], Re = function() {
+  return g.some(function(e) {
     return e.activeTargets.length > 0;
   });
 }, ye = function() {
-  return b.some(function(e) {
+  return g.some(function(e) {
     return e.skippedTargets.length > 0;
   });
-}, $ = "ResizeObserver loop completed with undelivered notifications.", we = function() {
+}, J = "ResizeObserver loop completed with undelivered notifications.", Ee = function() {
   var e;
   typeof ErrorEvent == "function" ? e = new ErrorEvent("error", {
-    message: $
-  }) : (e = document.createEvent("Event"), e.initEvent("error", !1, !1), e.message = $), window.dispatchEvent(e);
-}, E;
+    message: J
+  }) : (e = document.createEvent("Event"), e.initEvent("error", !1, !1), e.message = J), window.dispatchEvent(e);
+}, y;
 (function(e) {
   e.BORDER_BOX = "border-box", e.CONTENT_BOX = "content-box", e.DEVICE_PIXEL_CONTENT_BOX = "device-pixel-content-box";
-})(E || (E = {}));
-var g = function(e) {
+})(y || (y = {}));
+var m = function(e) {
   return Object.freeze(e);
-}, Oe = /* @__PURE__ */ function() {
+}, Be = /* @__PURE__ */ function() {
   function e(t, r) {
-    this.inlineSize = t, this.blockSize = r, g(this);
+    this.inlineSize = t, this.blockSize = r, m(this);
   }
   return e;
 }(), ie = function() {
   function e(t, r, n, i) {
-    return this.x = t, this.y = r, this.width = n, this.height = i, this.top = this.y, this.left = this.x, this.bottom = this.top + this.height, this.right = this.left + this.width, g(this);
+    return this.x = t, this.y = r, this.width = n, this.height = i, this.top = this.y, this.left = this.x, this.bottom = this.top + this.height, this.right = this.left + this.width, m(this);
   }
   return e.prototype.toJSON = function() {
-    var t = this, r = t.x, n = t.y, i = t.top, o = t.right, s = t.bottom, l = t.left, c = t.width, v = t.height;
-    return { x: r, y: n, top: i, right: o, bottom: s, left: l, width: c, height: v };
+    var t = this, r = t.x, n = t.y, i = t.top, o = t.right, s = t.bottom, a = t.left, l = t.width, u = t.height;
+    return { x: r, y: n, top: i, right: o, bottom: s, left: a, width: l, height: u };
   }, e.fromRect = function(t) {
     return new e(t.x, t.y, t.width, t.height);
   }, e;
-}(), P = function(e) {
+}(), q = function(e) {
   return e instanceof SVGElement && "getBBox" in e;
 }, oe = function(e) {
-  if (P(e)) {
+  if (q(e)) {
     var t = e.getBBox(), r = t.width, n = t.height;
     return !r && !n;
   }
   var i = e, o = i.offsetWidth, s = i.offsetHeight;
   return !(o || s || e.getClientRects().length);
-}, J = function(e) {
+}, U = function(e) {
   var t;
   if (e instanceof Element)
     return !0;
   var r = (t = e == null ? void 0 : e.ownerDocument) === null || t === void 0 ? void 0 : t.defaultView;
   return !!(r && e instanceof r.Element);
-}, Re = function(e) {
+}, Te = function(e) {
   switch (e.tagName) {
     case "INPUT":
       if (e.type !== "image")
@@ -68,11 +70,11 @@ var g = function(e) {
       return !0;
   }
   return !1;
-}, R = typeof window < "u" ? window : {}, S = /* @__PURE__ */ new WeakMap(), U = /auto|scroll/, Ee = /^tb|vertical/, Te = /msie|trident/i.test(R.navigator && R.navigator.userAgent), d = function(e) {
+}, R = typeof window < "u" ? window : {}, S = /* @__PURE__ */ new WeakMap(), Y = /auto|scroll/, Se = /^tb|vertical/, _e = /msie|trident/i.test(R.navigator && R.navigator.userAgent), h = function(e) {
   return parseFloat(e || "0");
 }, z = function(e, t, r) {
-  return e === void 0 && (e = 0), t === void 0 && (t = 0), r === void 0 && (r = !1), new Oe((r ? t : e) || 0, (r ? e : t) || 0);
-}, Y = g({
+  return e === void 0 && (e = 0), t === void 0 && (t = 0), r === void 0 && (r = !1), new Be((r ? t : e) || 0, (r ? e : t) || 0);
+}, j = m({
   devicePixelContentBoxSize: z(),
   borderBoxSize: z(),
   contentBoxSize: z(),
@@ -81,28 +83,28 @@ var g = function(e) {
   if (t === void 0 && (t = !1), S.has(e) && !t)
     return S.get(e);
   if (oe(e))
-    return S.set(e, Y), Y;
-  var r = getComputedStyle(e), n = P(e) && e.ownerSVGElement && e.getBBox(), i = !Te && r.boxSizing === "border-box", o = Ee.test(r.writingMode || ""), s = !n && U.test(r.overflowY || ""), l = !n && U.test(r.overflowX || ""), c = n ? 0 : d(r.paddingTop), v = n ? 0 : d(r.paddingRight), h = n ? 0 : d(r.paddingBottom), f = n ? 0 : d(r.paddingLeft), w = n ? 0 : d(r.borderTopWidth), a = n ? 0 : d(r.borderRightWidth), u = n ? 0 : d(r.borderBottomWidth), m = n ? 0 : d(r.borderLeftWidth), p = f + v, x = c + h, O = m + a, D = w + u, G = l ? e.offsetHeight - D - e.clientHeight : 0, F = s ? e.offsetWidth - O - e.clientWidth : 0, le = i ? p + O : 0, de = i ? x + D : 0, T = n ? n.width : d(r.width) - le - F, B = n ? n.height : d(r.height) - de - G, fe = T + p + F + O, he = B + x + G + D, H = g({
-    devicePixelContentBoxSize: z(Math.round(T * devicePixelRatio), Math.round(B * devicePixelRatio), o),
-    borderBoxSize: z(fe, he, o),
-    contentBoxSize: z(T, B, o),
-    contentRect: new ie(f, c, T, B)
+    return S.set(e, j), j;
+  var r = getComputedStyle(e), n = q(e) && e.ownerSVGElement && e.getBBox(), i = !_e && r.boxSizing === "border-box", o = Se.test(r.writingMode || ""), s = !n && Y.test(r.overflowY || ""), a = !n && Y.test(r.overflowX || ""), l = n ? 0 : h(r.paddingTop), u = n ? 0 : h(r.paddingRight), f = n ? 0 : h(r.paddingBottom), v = n ? 0 : h(r.paddingLeft), E = n ? 0 : h(r.borderTopWidth), c = n ? 0 : h(r.borderRightWidth), d = n ? 0 : h(r.borderBottomWidth), p = n ? 0 : h(r.borderLeftWidth), b = v + u, x = l + f, O = p + c, D = E + d, G = a ? e.offsetHeight - D - e.clientHeight : 0, F = s ? e.offsetWidth - O - e.clientWidth : 0, fe = i ? b + O : 0, he = i ? x + D : 0, B = n ? n.width : h(r.width) - fe - F, T = n ? n.height : h(r.height) - he - G, pe = B + b + F + O, be = T + x + G + D, H = m({
+    devicePixelContentBoxSize: z(Math.round(B * devicePixelRatio), Math.round(T * devicePixelRatio), o),
+    borderBoxSize: z(pe, be, o),
+    contentBoxSize: z(B, T, o),
+    contentRect: new ie(v, l, B, T)
   });
   return S.set(e, H), H;
 }, ae = function(e, t, r) {
   var n = se(e, r), i = n.borderBoxSize, o = n.contentBoxSize, s = n.devicePixelContentBoxSize;
   switch (t) {
-    case E.DEVICE_PIXEL_CONTENT_BOX:
+    case y.DEVICE_PIXEL_CONTENT_BOX:
       return s;
-    case E.BORDER_BOX:
+    case y.BORDER_BOX:
       return i;
     default:
       return o;
   }
-}, Be = /* @__PURE__ */ function() {
+}, Ce = /* @__PURE__ */ function() {
   function e(t) {
     var r = se(t);
-    this.target = t, this.contentRect = r.contentRect, this.borderBoxSize = g([r.borderBoxSize]), this.contentBoxSize = g([r.contentBoxSize]), this.devicePixelContentBoxSize = g([r.devicePixelContentBoxSize]);
+    this.target = t, this.contentRect = r.contentRect, this.borderBoxSize = m([r.borderBoxSize]), this.contentBoxSize = m([r.contentBoxSize]), this.devicePixelContentBoxSize = m([r.devicePixelContentBoxSize]);
   }
   return e;
 }(), ce = function(e) {
@@ -111,16 +113,16 @@ var g = function(e) {
   for (var t = 0, r = e.parentNode; r; )
     t += 1, r = r.parentNode;
   return t;
-}, Se = function() {
+}, Ne = function() {
   var e = 1 / 0, t = [];
-  b.forEach(function(s) {
+  g.forEach(function(s) {
     if (s.activeTargets.length !== 0) {
-      var l = [];
-      s.activeTargets.forEach(function(v) {
-        var h = new Be(v.target), f = ce(v.target);
-        l.push(h), v.lastReportedSize = ae(v.target, v.observedBox), f < e && (e = f);
+      var a = [];
+      s.activeTargets.forEach(function(u) {
+        var f = new Ce(u.target), v = ce(u.target);
+        a.push(f), u.lastReportedSize = ae(u.target, u.observedBox), v < e && (e = v);
       }), t.push(function() {
-        s.callback.call(s.observer, l, s.observer);
+        s.callback.call(s.observer, a, s.observer);
       }), s.activeTargets.splice(0, s.activeTargets.length);
     }
   });
@@ -129,38 +131,38 @@ var g = function(e) {
     i();
   }
   return e;
-}, j = function(e) {
-  b.forEach(function(r) {
+}, K = function(e) {
+  g.forEach(function(r) {
     r.activeTargets.splice(0, r.activeTargets.length), r.skippedTargets.splice(0, r.skippedTargets.length), r.observationTargets.forEach(function(i) {
       i.isActive() && (ce(i.target) > e ? r.activeTargets.push(i) : r.skippedTargets.push(i));
     });
   });
-}, _e = function() {
+}, ke = function() {
   var e = 0;
-  for (j(e); ze(); )
-    e = Se(), j(e);
-  return ye() && we(), e > 0;
-}, A, ve = [], Ce = function() {
-  return ve.splice(0).forEach(function(e) {
+  for (K(e); Re(); )
+    e = Ne(), K(e);
+  return ye() && Ee(), e > 0;
+}, L, le = [], De = function() {
+  return le.splice(0).forEach(function(e) {
     return e();
   });
-}, Ne = function(e) {
-  if (!A) {
+}, Me = function(e) {
+  if (!L) {
     var t = 0, r = document.createTextNode(""), n = { characterData: !0 };
     new MutationObserver(function() {
-      return Ce();
-    }).observe(r, n), A = function() {
+      return De();
+    }).observe(r, n), L = function() {
       r.textContent = "".concat(t ? t-- : t++);
     };
   }
-  ve.push(e), A();
-}, ke = function(e) {
-  Ne(function() {
+  le.push(e), L();
+}, Le = function(e) {
+  Me(function() {
     requestAnimationFrame(e);
   });
-}, N = 0, De = function() {
+}, N = 0, We = function() {
   return !!N;
-}, Me = 250, Ae = { attributes: !0, characterData: !0, childList: !0, subtree: !0 }, K = [
+}, Ae = 250, Ie = { attributes: !0, characterData: !0, childList: !0, subtree: !0 }, Q = [
   "resize",
   "load",
   "transitionend",
@@ -175,9 +177,9 @@ var g = function(e) {
   "mouseout",
   "blur",
   "focus"
-], Q = function(e) {
+], Z = function(e) {
   return e === void 0 && (e = 0), Date.now() + e;
-}, I = !1, Ie = function() {
+}, W = !1, Pe = function() {
   function e() {
     var t = this;
     this.stopped = !0, this.listener = function() {
@@ -186,15 +188,15 @@ var g = function(e) {
   }
   return e.prototype.run = function(t) {
     var r = this;
-    if (t === void 0 && (t = Me), !I) {
-      I = !0;
-      var n = Q(t);
-      ke(function() {
+    if (t === void 0 && (t = Ae), !W) {
+      W = !0;
+      var n = Z(t);
+      Le(function() {
         var i = !1;
         try {
-          i = _e();
+          i = ke();
         } finally {
-          if (I = !1, t = n - Q(), !De())
+          if (W = !1, t = n - Z(), !We())
             return;
           i ? r.run(1e3) : t > 0 ? r.run(t) : r.start();
         }
@@ -204,41 +206,41 @@ var g = function(e) {
     this.stop(), this.run();
   }, e.prototype.observe = function() {
     var t = this, r = function() {
-      return t.observer && t.observer.observe(document.body, Ae);
+      return t.observer && t.observer.observe(document.body, Ie);
     };
     document.body ? r() : R.addEventListener("DOMContentLoaded", r);
   }, e.prototype.start = function() {
     var t = this;
-    this.stopped && (this.stopped = !1, this.observer = new MutationObserver(this.listener), this.observe(), K.forEach(function(r) {
+    this.stopped && (this.stopped = !1, this.observer = new MutationObserver(this.listener), this.observe(), Q.forEach(function(r) {
       return R.addEventListener(r, t.listener, !0);
     }));
   }, e.prototype.stop = function() {
     var t = this;
-    this.stopped || (this.observer && this.observer.disconnect(), K.forEach(function(r) {
+    this.stopped || (this.observer && this.observer.disconnect(), Q.forEach(function(r) {
       return R.removeEventListener(r, t.listener, !0);
     }), this.stopped = !0);
   }, e;
-}(), W = new Ie(), Z = function(e) {
-  !N && e > 0 && W.start(), N += e, !N && W.stop();
-}, Le = function(e) {
-  return !P(e) && !Re(e) && getComputedStyle(e).display === "inline";
-}, We = function() {
+}(), P = new Pe(), ee = function(e) {
+  !N && e > 0 && P.start(), N += e, !N && P.stop();
+}, qe = function(e) {
+  return !q(e) && !Te(e) && getComputedStyle(e).display === "inline";
+}, Ge = function() {
   function e(t, r) {
-    this.target = t, this.observedBox = r || E.CONTENT_BOX, this.lastReportedSize = {
+    this.target = t, this.observedBox = r || y.CONTENT_BOX, this.lastReportedSize = {
       inlineSize: 0,
       blockSize: 0
     };
   }
   return e.prototype.isActive = function() {
     var t = ae(this.target, this.observedBox, !0);
-    return Le(this.target) && (this.lastReportedSize = t), this.lastReportedSize.inlineSize !== t.inlineSize || this.lastReportedSize.blockSize !== t.blockSize;
+    return qe(this.target) && (this.lastReportedSize = t), this.lastReportedSize.inlineSize !== t.inlineSize || this.lastReportedSize.blockSize !== t.blockSize;
   }, e;
-}(), Pe = /* @__PURE__ */ function() {
+}(), Fe = /* @__PURE__ */ function() {
   function e(t, r) {
     this.activeTargets = [], this.skippedTargets = [], this.observationTargets = [], this.observer = t, this.callback = r;
   }
   return e;
-}(), _ = /* @__PURE__ */ new WeakMap(), ee = function(e, t) {
+}(), _ = /* @__PURE__ */ new WeakMap(), te = function(e, t) {
   for (var r = 0; r < e.length; r += 1)
     if (e[r].target === t)
       return r;
@@ -247,21 +249,21 @@ var g = function(e) {
   function e() {
   }
   return e.connect = function(t, r) {
-    var n = new Pe(t, r);
+    var n = new Fe(t, r);
     _.set(t, n);
   }, e.observe = function(t, r, n) {
     var i = _.get(t), o = i.observationTargets.length === 0;
-    ee(i.observationTargets, r) < 0 && (o && b.push(i), i.observationTargets.push(new We(r, n && n.box)), Z(1), W.schedule());
+    te(i.observationTargets, r) < 0 && (o && g.push(i), i.observationTargets.push(new Ge(r, n && n.box)), ee(1), P.schedule());
   }, e.unobserve = function(t, r) {
-    var n = _.get(t), i = ee(n.observationTargets, r), o = n.observationTargets.length === 1;
-    i >= 0 && (o && b.splice(b.indexOf(n), 1), n.observationTargets.splice(i, 1), Z(-1));
+    var n = _.get(t), i = te(n.observationTargets, r), o = n.observationTargets.length === 1;
+    i >= 0 && (o && g.splice(g.indexOf(n), 1), n.observationTargets.splice(i, 1), ee(-1));
   }, e.disconnect = function(t) {
     var r = this, n = _.get(t);
     n.observationTargets.slice().forEach(function(i) {
       return r.unobserve(t, i.target);
     }), n.activeTargets.splice(0, n.activeTargets.length);
   }, e;
-}(), Ge = function() {
+}(), He = function() {
   function e(t) {
     if (arguments.length === 0)
       throw new TypeError("Failed to construct 'ResizeObserver': 1 argument required, but only 0 present.");
@@ -272,13 +274,13 @@ var g = function(e) {
   return e.prototype.observe = function(t, r) {
     if (arguments.length === 0)
       throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': 1 argument required, but only 0 present.");
-    if (!J(t))
+    if (!U(t))
       throw new TypeError("Failed to execute 'observe' on 'ResizeObserver': parameter 1 is not of type 'Element");
     C.observe(this, t, r);
   }, e.prototype.unobserve = function(t) {
     if (arguments.length === 0)
       throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': 1 argument required, but only 0 present.");
-    if (!J(t))
+    if (!U(t))
       throw new TypeError("Failed to execute 'unobserve' on 'ResizeObserver': parameter 1 is not of type 'Element");
     C.unobserve(this, t);
   }, e.prototype.disconnect = function() {
@@ -287,107 +289,126 @@ var g = function(e) {
     return "function ResizeObserver () { [polyfill code] }";
   }, e;
 }();
-const Fe = (e, t, r) => Math.min(Math.max(e, t), r), He = "_root_cvyxb_2", Ve = "_list_cvyxb_14", ue = {
-  root: He,
-  list: Ve,
-  "start-gradient": "_start-gradient_cvyxb_24",
-  "end-gradient": "_end-gradient_cvyxb_28",
-  "item-wrapper": "_item-wrapper_cvyxb_39",
-  "item-content": "_item-content_cvyxb_44",
-  "item-separator": "_item-separator_cvyxb_58"
-}, L = ne(ue), Xe = re(
-  ({ children: e, "data-testid": t, isActive: r, separator: n, ...i }, o) => {
-    const s = i.href || i.to;
-    return /* @__PURE__ */ te("li", { "aria-label": "breadcrumb", className: L("item-wrapper"), "data-testid": t, children: [
-      n ? /* @__PURE__ */ y("span", { className: L("item-separator"), role: "presentation", children: n }) : null,
-      /* @__PURE__ */ y(
-        "a",
+const Ve = (e, t, r) => Math.min(Math.max(e, t), r), Xe = "_root_13qa2_2", $e = "_list_13qa2_12", ue = {
+  root: Xe,
+  list: $e,
+  "start-gradient": "_start-gradient_13qa2_23",
+  "end-gradient": "_end-gradient_13qa2_27",
+  "item-wrapper": "_item-wrapper_13qa2_38",
+  "item-content": "_item-content_13qa2_43",
+  "item-separator": "_item-separator_13qa2_63"
+}, A = ne(ue), ve = Oe(
+  ({
+    as: e = "a",
+    children: t,
+    collapsed: r,
+    "data-testid": n,
+    icon: i,
+    isActive: o,
+    separator: s,
+    ...a
+  }, l) => {
+    const u = a.href || a.to, f = !!(r && !o);
+    let v;
+    return f ? v = "ellipsis-h" : i === !0 ? v = o ? "folder-open" : "folder" : i && (v = i), /* @__PURE__ */ I("li", { "aria-label": "breadcrumb", className: A("item-wrapper"), "data-testid": n, children: [
+      s ? /* @__PURE__ */ w("span", { className: A("item-separator"), role: "presentation", children: s }) : null,
+      /* @__PURE__ */ I(
+        e,
         {
-          "aria-current": r ? "page" : void 0,
-          "aria-disabled": !s,
-          ...i,
-          className: L("item-content", i.className),
-          ref: o,
-          children: e
+          "aria-current": o ? "page" : void 0,
+          "aria-disabled": !u,
+          ...a,
+          className: A("item-content", a.className),
+          ref: l,
+          children: [
+            v ? /* @__PURE__ */ w(re, { name: v, size: "md" }) : null,
+            f ? null : t
+          ]
         }
       )
     ] });
   }
-), k = ne(ue), qe = re(
+);
+ve.displayName = "Breadcrumb.Item";
+const k = ne(ue), de = ge(
   ({
     children: e,
-    lastChildNotClickable: t = !0,
-    separator: r = /* @__PURE__ */ y(me, { name: "angle-right-b", size: "xs" }),
-    ...n
-  }, i) => {
-    const o = pe.toArray(e).filter(Boolean), s = o.length, l = o.map((w, a) => {
-      const u = s === 1 || s === a + 1;
-      return be(w, {
-        isActive: u && t,
-        key: `breadcrumb-${a}`,
-        separator: u ? void 0 : r,
-        ...w.props
+    icon: t,
+    lastChildNotClickable: r = !0,
+    separator: n = /* @__PURE__ */ w(re, { name: "angle-right-b", size: "md" }),
+    ...i
+  }, o) => {
+    const s = me.toArray(e).filter(Boolean), a = s.length, l = s.map((c, d) => {
+      const p = a === 1 || a === d + 1;
+      return xe(c, {
+        icon: t,
+        isActive: p && r,
+        key: `breadcrumb-${d}`,
+        separator: p ? void 0 : n,
+        ...c.props
       });
-    }), { endGradient: c, listRef: v, onListScroll: h, startGradient: f } = $e();
-    return /* @__PURE__ */ te("nav", { ref: i, ...n, className: k("root", n.className), children: [
-      f,
-      /* @__PURE__ */ y("ol", { className: k("list"), dir: "rtl", onScroll: h, ref: v, children: l.reverse() }),
-      c
+    }), { endGradient: u, listRef: f, onListScroll: v, startGradient: E } = Je();
+    return /* @__PURE__ */ I("nav", { ref: o, ...i, className: k("root", i.className), children: [
+      E,
+      /* @__PURE__ */ w("ol", { className: k("list"), dir: "rtl", onScroll: v, ref: f, children: l.reverse() }),
+      u
     ] });
   }
-), Qe = Object.assign(qe, {
-  Item: Xe
-}), $e = () => {
-  const e = M(null), t = M(), r = M(), [n, i] = V(!1), [o, s] = V(0), l = (a, u) => {
-    a && (a.style.transform = `scale3d(${u}, 1, 1)`);
-  }, c = X((a) => {
-    const u = 1 - a;
-    l(t.current, u), l(r.current, a);
-  }, []), v = X(() => {
+);
+de.displayName = "Breadcrumb";
+const et = Object.assign(de, {
+  Item: ve
+}), Je = () => {
+  const e = M(null), t = M(), r = M(), [n, i] = V(!1), [o, s] = V(0), a = (c, d) => {
+    c && (c.style.transform = `scale3d(${d}, 1, 1)`);
+  }, l = X((c) => {
+    const d = 1 - c;
+    a(t.current, d), a(r.current, c);
+  }, []), u = X(() => {
     const {
-      current: { offsetWidth: a, scrollLeft: u, scrollWidth: m }
-    } = e, p = m - a, O = Fe(Math.abs(u - o), 0, p) / p;
-    c(O);
-  }, [o, c]), h = ge(
-    () => xe(
-      (a) => {
+      current: { offsetWidth: c, scrollLeft: d, scrollWidth: p }
+    } = e, b = p - c, O = Ve(Math.abs(d - o), 0, b) / b;
+    l(O);
+  }, [o, l]), f = ze(
+    () => we(
+      (c) => {
         const [
           {
             // Is offsetWidth really needed ?
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
-            target: { offsetWidth: u, scrollLeft: m, scrollWidth: p }
+            target: { offsetWidth: d, scrollLeft: p, scrollWidth: b }
           }
-        ] = a, x = p - u;
-        o || s(m === 0 ? 0 : x), i(x > 0);
+        ] = c, x = b - d;
+        o || s(p === 0 ? 0 : x), i(x > 0);
       },
       300,
       !1
     ),
     [o]
   );
-  q(() => {
-    const a = new Ge(h);
-    return a.observe(e.current), () => a.disconnect();
-  }, []), q(() => {
-    t.current && r.current && c(0);
-  }, [n, c]);
-  const f = n ? /* @__PURE__ */ y(
+  $(() => {
+    const c = new He(f);
+    return c.observe(e.current), () => c.disconnect();
+  }, []), $(() => {
+    t.current && r.current && l(0);
+  }, [n, l]);
+  const v = n ? /* @__PURE__ */ w(
     "span",
     {
       className: k("start-gradient", "bg-linear-to-r  from-neutral-10 to-transparent"),
       ref: t
     }
   ) : null;
-  return { endGradient: n ? /* @__PURE__ */ y(
+  return { endGradient: n ? /* @__PURE__ */ w(
     "span",
     {
       className: k("end-gradient", "bg-linear-to-l from-neutral-10 to-transparent"),
       ref: r
     }
-  ) : null, listRef: e, onListScroll: v, startGradient: f };
+  ) : null, listRef: e, onListScroll: u, startGradient: v };
 };
 export {
-  Qe as Breadcrumb,
-  qe as BreadcrumbComponent
+  et as Breadcrumb,
+  de as BreadcrumbComponent
 };

package/dist/Button.css

@@ -1 +1 @@
-@property --gradient-angle{syntax: "<angle>"; initial-value: -60deg; inherits: true;}@keyframes _rotate-gradient_9gw1k_1{to{--gradient-angle: 300deg}}@layer components{._root_9gw1k_12{position:relative;display:inline-flex;align-items:center;justify-content:center;border-style:solid;cursor:pointer;border-radius:var(--border-radius-md);transition-property:all;transition-duration:var(--duration-medium);transition-timing-function:ease-in-out;outline:transparent solid var(--border-width-md);font-weight:var(--font-weight-semi-bold);font-family:var(--font-family-body);line-height:var(--font-line-height-xs);height:var(--buttonHeight);padding-inline:var(--buttonPaddingInline);font-size:var(--buttonFontSize);color:var(--buttonColor, var(--color-neutral-90));background:var(--buttonBackground);border-width:var(--buttonBorderWidth, 0);border-color:var(--buttonBorderColor, transparent);box-shadow:var(--buttonBoxShadow, none);gap:var(--buttonGap)}._root_9gw1k_12[data-focus-visible],._root_9gw1k_12:focus-visible{outline-width:var(--components-dimensions-button-border-width-focused);outline-color:var(--buttonOutlineColorFocus)}@media (hover: hover) and (pointer: fine){._root_9gw1k_12:hover:not(:disabled):not([aria-disabled]){box-shadow:var(--elevation-20);--buttonBackground: var(--buttonBackgroundHover);--buttonBorderColor: var(--buttonBorderColorHover, transparent);--buttonColor: var(--buttonColorHover)}}._root_9gw1k_12:active:not(:disabled):not([aria-disabled]){--buttonBackground: var(--buttonBackgroundActive);--buttonBorderColor: var(--buttonBorderColorActive, transparent);--buttonColor: var(--buttonColorPressed)}._root_9gw1k_12:disabled,._root_9gw1k_12[aria-disabled]{--buttonBorderColor: var(--buttonBorderColorDisabled, transparent);--buttonColor: var(--buttonColorDisabled);--buttonBackground: var(--buttonBackgroundDisabled);cursor:not-allowed}._root_9gw1k_12 i.wui-icon-font,._root_9gw1k_12 svg{font-weight:initial;width:var(--buttonIconSize);height:var(--buttonIconSize);font-size:var(--buttonIconSize)}._root_9gw1k_12:has(svg:only-child),._root_9gw1k_12:has(i._wui-icon-font_9gw1k_64:only-child){padding-inline:var(--buttonPaddingInlineIconOnly, var(--buttonPaddingInline))}._size-sm_9gw1k_74{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--components-dimensions-button-size-max-height-sm);--buttonPaddingInline: var(--spacing-sm);--buttonPaddingInlineIconOnly: var(--spacing-xs);--buttonIconSize: var(--components-dimensions-button-size-icon-sm);--buttonGap: var(--components-dimensions-button-gap-content-sm)}._size-md_9gw1k_82{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--components-dimensions-button-size-max-height-md);--buttonPaddingInline: var(--spacing-md);--buttonPaddingInlineIconOnly: var(--spacing-sm);--buttonIconSize: var(--components-dimensions-button-size-icon-md);--buttonGap: var(--components-dimensions-button-gap-content-md)}._size-lg_9gw1k_90{--buttonFontSize: var(--font-size-16);--buttonHeight: var(--components-dimensions-button-size-max-height-lg);--buttonPaddingInline: var(--spacing-lg);--buttonPaddingInlineIconOnly: var(--spacing-md);--buttonIconSize: var(--components-dimensions-button-size-icon-lg);--buttonGap: var(--components-dimensions-button-gap-content-lg)}._variant-primary_9gw1k_98{--buttonBackground: var(--components-colors-button-color-background-primary-main-default);--buttonBackgroundActive: var( --components-colors-button-color-background-primary-main-pressed );--buttonBackgroundHover: var(--components-colors-button-color-background-primary-main-hover);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused);--buttonColorDisabled: var(--components-colors-button-color-text-primary-main-disabled);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-main-disabled) 2.5px, var(--components-colors-button-color-background-primary-main-disabled) 5.25px) padding-box}._variant-primary-neutral_9gw1k_108{--buttonBackground: var(--components-colors-button-color-background-primary-neutral-default);--buttonBackgroundActive: var( --components-colors-button-color-background-primary-neutral-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-primary-neutral-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-neutral-disabled) 2.5px, var(--components-colors-button-color-background-primary-neutral-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-primary-neutral-default);--buttonColorDisabled: var(--components-colors-button-color-text-primary-neutral-disabled);--buttonColorHover: var(--components-colors-button-color-text-primary-neutral-hover);--buttonColorPressed: var(--components-colors-button-color-text-primary-neutral-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-primary-ai_9gw1k_123{--buttonBackground: linear-gradient(var(--components-colors-button-color-background-primary-ai-default) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundActive: linear-gradient(var(--components-colors-button-color-background-primary-ai-pressed) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundHover: linear-gradient(var(--components-colors-button-color-background-primary-ai-hover) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-ai-disabled) 2.5px, var(--components-colors-button-color-background-primary-ai-disabled) 5.25px) padding-box, linear-gradient( 107.75deg, var(--color-neutral-30) 0%, var(--color-neutral-50) 20%, var(--color-neutral-40) 40%, var(--color-neutral-50) 60%, var(--color-neutral-60) 80%, var(--color-neutral-50) 100% ) border-box;--buttonBorderWidth: var(--components-dimensions-button-border-width-ai);--buttonColor: var(--components-colors-button-color-text-primary-ai-default);--buttonColorDisabled: var(--components-colors-button-color-text-primary-ai-disabled);--buttonColorHover: var(--components-colors-button-color-text-primary-ai-hover);--buttonColorPressed: var(--components-colors-button-color-text-primary-ai-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused);animation:_rotate-gradient_9gw1k_1 3s linear infinite paused}@media (hover: hover) and (pointer: fine){._variant-primary-ai_9gw1k_123:hover:not(:disabled):not([aria-disabled]){animation-play-state:running}}._variant-primary-ai_9gw1k_123:focus-visible{animation-play-state:running}._variant-primary-danger_9gw1k_155{--buttonBackground: var(--components-colors-button-color-background-primary-danger-default);--buttonBackgroundActive: var( --components-colors-button-color-background-primary-danger-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-primary-danger-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-danger-disabled) 2.5px, var(--components-colors-button-color-background-primary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-primary-danger-default);--buttonColorDisabled: var(--components-colors-button-color-text-primary-danger-disabled);--buttonColorHover: var(--components-colors-button-color-text-primary-danger-hover);--buttonColorPressed: var(--components-colors-button-color-text-primary-danger-pressed);--buttonBorderWidth: var(--components-dimensions-button-border-width-secondary);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-secondary_9gw1k_171{--buttonBackground: var(--components-colors-button-color-background-secondary-main-default);--buttonBackgroundActive: var( --components-colors-button-color-background-secondary-main-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-secondary-main-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-secondary-main-disabled) 2.5px, var(--components-colors-button-color-background-secondary-main-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-secondary-main-default);--buttonColorDisabled: var(--components-colors-button-color-text-secondary-main-disabled);--buttonColorHover: var(--components-colors-button-color-text-secondary-main-hover);--buttonColorPressed: var(--components-colors-button-color-text-secondary-main-pressed);--buttonBorderWidth: var(--components-dimensions-button-border-width-secondary);--buttonBorderColor: var(--components-colors-button-color-border-secondary-main-default);--buttonBorderColorHover: var(--components-colors-button-color-border-secondary-main-hover);--buttonBorderColorActive: var( --components-colors-button-color-border-secondary-main-pressed );--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-secondary-danger_9gw1k_192{--buttonBackground: var(--components-colors-button-color-background-secondary-danger-default);--buttonBackgroundActive: var( --components-colors-button-color-background-secondary-danger-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-secondary-danger-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-secondary-danger-disabled) 2.5px, var(--components-colors-button-color-background-secondary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-secondary-danger-default);--buttonColorDisabled: var(--components-colors-button-color-text-secondary-danger-disabled);--buttonColorHover: var(--components-colors-button-color-text-secondary-danger-hover);--buttonColorPressed: var(--components-colors-button-color-text-secondary-danger-pressed);--buttonBorderWidth: var(--components-dimensions-button-border-width-secondary);--buttonBorderColor: var(--components-colors-button-color-border-secondary-danger-default);--buttonBorderColorHover: var(--components-colors-button-color-border-secondary-danger-hover);--buttonBorderColorActive: var( --components-colors-button-color-border-secondary-danger-pressed );--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-tertiary_9gw1k_213{--buttonBackground: var(--components-colors-button-color-background-tertiary-main-default);--buttonBackgroundActive: var( --components-colors-button-color-background-tertiary-main-pressed );--buttonBackgroundHover: var(--components-colors-button-color-background-tertiary-main-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-tertiary-main-disabled) 2.5px, var(--components-colors-button-color-background-tertiary-main-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-tertiary-main-default);--buttonColorDisabled: var(--components-colors-button-color-text-tertiary-main-disabled);--buttonColorHover: var(--components-colors-button-color-text-tertiary-main-hover);--buttonColorPressed: var(--components-colors-button-color-text-tertiary-main-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-tertiary-danger_9gw1k_226{--buttonBackground: var(--components-colors-button-color-background-tertiary-danger-default);--buttonBackgroundActive: var( --components-colors-button-color-background-tertiary-danger-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-tertiary-danger-hover );--buttonBackgroundDisabled: var( --components-colors-button-color-background-tertiary-danger-disabled );--buttonColor: var(--components-colors-button-color-text-tertiary-danger-default);--buttonColorDisabled: var(--components-colors-button-color-text-tertiary-danger-disabled);--buttonColorHover: var(--components-colors-button-color-text-tertiary-danger-hover);--buttonColorPressed: var(--components-colors-button-color-text-tertiary-danger-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._loader_9gw1k_243{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;right:0;top:0}._loader-children_9gw1k_253{opacity:0}}
+@property --gradient-angle{syntax: "<angle>"; initial-value: -60deg; inherits: true;}@keyframes _rotate-gradient_vtvta_1{to{--gradient-angle: 300deg}}@layer components{._root_vtvta_12{position:relative;display:inline-flex;white-space:nowrap;flex-shrink:0;align-items:center;justify-content:center;border-style:solid;cursor:pointer;border-radius:var(--border-radius-md);transition-property:all;transition-duration:var(--duration-medium);transition-timing-function:ease-in-out;outline:transparent solid var(--border-width-md);font-weight:var(--font-weight-semi-bold);font-family:var(--font-family-body);line-height:var(--font-line-height-xs);height:var(--buttonHeight);padding-inline:var(--buttonPaddingInline);font-size:var(--buttonFontSize);color:var(--buttonColor, var(--color-neutral-90));background:var(--buttonBackground);border-width:var(--buttonBorderWidth, 0);border-color:var(--buttonBorderColor, transparent);box-shadow:var(--buttonBoxShadow, none);gap:var(--buttonGap)}._root_vtvta_12[data-focus-visible],._root_vtvta_12:focus-visible{outline-width:var(--components-dimensions-button-border-width-focused);outline-color:var(--buttonOutlineColorFocus)}@media (hover: hover) and (pointer: fine){._root_vtvta_12:hover:not(:disabled):not([aria-disabled]){box-shadow:var(--elevation-20);--buttonBackground: var(--buttonBackgroundHover);--buttonBorderColor: var(--buttonBorderColorHover, transparent);--buttonColor: var(--buttonColorHover)}}._root_vtvta_12:active:not(:disabled):not([aria-disabled]){--buttonBackground: var(--buttonBackgroundActive);--buttonBorderColor: var(--buttonBorderColorActive, transparent);--buttonColor: var(--buttonColorPressed)}._root_vtvta_12:disabled,._root_vtvta_12[aria-disabled]{--buttonBorderColor: var(--buttonBorderColorDisabled, transparent);--buttonColor: var(--buttonColorDisabled);--buttonBackground: var(--buttonBackgroundDisabled);cursor:not-allowed}._root_vtvta_12 i.wui-icon-font,._root_vtvta_12 svg{font-weight:initial;width:var(--buttonIconSize);height:var(--buttonIconSize);font-size:var(--buttonIconSize)}._root_vtvta_12:has(svg:only-child),._root_vtvta_12:has(i._wui-icon-font_vtvta_66:only-child){width:var(--buttonHeight);--buttonPaddingInline: 0}._size-sm_vtvta_77{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--components-dimensions-button-size-max-height-sm);--buttonPaddingInline: var(--components-dimensions-button-padding-inline-sm);--buttonIconSize: var(--components-dimensions-button-size-icon-sm);--buttonGap: var(--components-dimensions-button-gap-content-sm)}._size-md_vtvta_84{--buttonFontSize: var(--font-size-14);--buttonHeight: var(--components-dimensions-button-size-max-height-md);--buttonPaddingInline: var(--components-dimensions-button-padding-inline-md);--buttonIconSize: var(--components-dimensions-button-size-icon-md);--buttonGap: var(--components-dimensions-button-gap-content-md)}._size-lg_vtvta_91{--buttonFontSize: var(--font-size-16);--buttonHeight: var(--components-dimensions-button-size-max-height-lg);--buttonPaddingInline: var(--components-dimensions-button-padding-inline-lg);--buttonIconSize: var(--components-dimensions-button-size-icon-lg);--buttonGap: var(--components-dimensions-button-gap-content-lg)}._variant-primary_vtvta_98{--buttonBackground: var(--components-colors-button-color-background-primary-main-default);--buttonBackgroundActive: var( --components-colors-button-color-background-primary-main-pressed );--buttonBackgroundHover: var(--components-colors-button-color-background-primary-main-hover);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused);--buttonColorDisabled: var(--components-colors-button-color-text-primary-main-disabled);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-main-disabled) 2.5px, var(--components-colors-button-color-background-primary-main-disabled) 5.25px) padding-box}._variant-primary-neutral_vtvta_108{--buttonBackground: var(--components-colors-button-color-background-primary-neutral-default);--buttonBackgroundActive: var( --components-colors-button-color-background-primary-neutral-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-primary-neutral-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-neutral-disabled) 2.5px, var(--components-colors-button-color-background-primary-neutral-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-primary-neutral-default);--buttonColorDisabled: var(--components-colors-button-color-text-primary-neutral-disabled);--buttonColorHover: var(--components-colors-button-color-text-primary-neutral-hover);--buttonColorPressed: var(--components-colors-button-color-text-primary-neutral-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-primary-ai_vtvta_123{--buttonBackground: linear-gradient(var(--components-colors-button-color-background-primary-ai-default) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundActive: linear-gradient(var(--components-colors-button-color-background-primary-ai-pressed) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundHover: linear-gradient(var(--components-colors-button-color-background-primary-ai-hover) 0 0) padding-box, conic-gradient(from var(--gradient-angle) at 50% 50%, var(--color-green-30), var(--color-teal-40), var(--color-blue-40), var(--color-violet-40), var(--color-pink-40), var(--color-red-orange-40), var(--color-pink-40), var(--color-violet-40), var(--color-blue-40), var(--color-teal-40), var(--color-green-30)) border-box;--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-ai-disabled) 2.5px, var(--components-colors-button-color-background-primary-ai-disabled) 5.25px) padding-box, linear-gradient( 107.75deg, var(--color-neutral-30) 0%, var(--color-neutral-50) 20%, var(--color-neutral-40) 40%, var(--color-neutral-50) 60%, var(--color-neutral-60) 80%, var(--color-neutral-50) 100% ) border-box;--buttonBorderWidth: var(--components-dimensions-button-border-width-ai);--buttonColor: var(--components-colors-button-color-text-primary-ai-default);--buttonColorDisabled: var(--components-colors-button-color-text-primary-ai-disabled);--buttonColorHover: var(--components-colors-button-color-text-primary-ai-hover);--buttonColorPressed: var(--components-colors-button-color-text-primary-ai-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused);animation:_rotate-gradient_vtvta_1 3s linear infinite paused}@media (hover: hover) and (pointer: fine){._variant-primary-ai_vtvta_123:hover:not(:disabled):not([aria-disabled]){animation-play-state:running}}._variant-primary-ai_vtvta_123:focus-visible{animation-play-state:running}._variant-primary-danger_vtvta_155{--buttonBackground: var(--components-colors-button-color-background-primary-danger-default);--buttonBackgroundActive: var( --components-colors-button-color-background-primary-danger-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-primary-danger-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-primary-danger-disabled) 2.5px, var(--components-colors-button-color-background-primary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-primary-danger-default);--buttonColorDisabled: var(--components-colors-button-color-text-primary-danger-disabled);--buttonColorHover: var(--components-colors-button-color-text-primary-danger-hover);--buttonColorPressed: var(--components-colors-button-color-text-primary-danger-pressed);--buttonBorderWidth: var(--components-dimensions-button-border-width-secondary);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-secondary_vtvta_171{--buttonBackground: var(--components-colors-button-color-background-secondary-main-default);--buttonBackgroundActive: var( --components-colors-button-color-background-secondary-main-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-secondary-main-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-secondary-main-disabled) 2.5px, var(--components-colors-button-color-background-secondary-main-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-secondary-main-default);--buttonColorDisabled: var(--components-colors-button-color-text-secondary-main-disabled);--buttonColorHover: var(--components-colors-button-color-text-secondary-main-hover);--buttonColorPressed: var(--components-colors-button-color-text-secondary-main-pressed);--buttonBorderWidth: var(--components-dimensions-button-border-width-secondary);--buttonBorderColor: var(--components-colors-button-color-border-secondary-main-default);--buttonBorderColorHover: var(--components-colors-button-color-border-secondary-main-hover);--buttonBorderColorActive: var( --components-colors-button-color-border-secondary-main-pressed );--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-secondary-danger_vtvta_192{--buttonBackground: var(--components-colors-button-color-background-secondary-danger-default);--buttonBackgroundActive: var( --components-colors-button-color-background-secondary-danger-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-secondary-danger-hover );--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-secondary-danger-disabled) 2.5px, var(--components-colors-button-color-background-secondary-danger-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-secondary-danger-default);--buttonColorDisabled: var(--components-colors-button-color-text-secondary-danger-disabled);--buttonColorHover: var(--components-colors-button-color-text-secondary-danger-hover);--buttonColorPressed: var(--components-colors-button-color-text-secondary-danger-pressed);--buttonBorderWidth: var(--components-dimensions-button-border-width-secondary);--buttonBorderColor: var(--components-colors-button-color-border-secondary-danger-default);--buttonBorderColorHover: var(--components-colors-button-color-border-secondary-danger-hover);--buttonBorderColorActive: var( --components-colors-button-color-border-secondary-danger-pressed );--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-tertiary_vtvta_213{--buttonBackground: var(--components-colors-button-color-background-tertiary-main-default);--buttonBackgroundActive: var( --components-colors-button-color-background-tertiary-main-pressed );--buttonBackgroundHover: var(--components-colors-button-color-background-tertiary-main-hover);--buttonBackgroundDisabled: repeating-linear-gradient(-45deg, var(--color-neutral-10), var(--color-neutral-10) 2.5px, var(--components-colors-button-color-background-tertiary-main-disabled) 2.5px, var(--components-colors-button-color-background-tertiary-main-disabled) 5.25px) padding-box;--buttonColor: var(--components-colors-button-color-text-tertiary-main-default);--buttonColorDisabled: var(--components-colors-button-color-text-tertiary-main-disabled);--buttonColorHover: var(--components-colors-button-color-text-tertiary-main-hover);--buttonColorPressed: var(--components-colors-button-color-text-tertiary-main-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._variant-tertiary-danger_vtvta_226{--buttonBackground: var(--components-colors-button-color-background-tertiary-danger-default);--buttonBackgroundActive: var( --components-colors-button-color-background-tertiary-danger-pressed );--buttonBackgroundHover: var( --components-colors-button-color-background-tertiary-danger-hover );--buttonBackgroundDisabled: var( --components-colors-button-color-background-tertiary-danger-disabled );--buttonColor: var(--components-colors-button-color-text-tertiary-danger-default);--buttonColorDisabled: var(--components-colors-button-color-text-tertiary-danger-disabled);--buttonColorHover: var(--components-colors-button-color-text-tertiary-danger-hover);--buttonColorPressed: var(--components-colors-button-color-text-tertiary-danger-pressed);--buttonOutlineColorFocus: var(--components-colors-button-color-border-focused)}._loader_vtvta_243{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;right:0;top:0}._loader-children_vtvta_253{opacity:0}}