@julseb-lib/react 0.0.86 → 0.0.88

package/dist/index.es.js

@@ -1,7 +1,7 @@
 import k, { StyleSheetManager as n6, css as x, keyframes as _2 } from "styled-components";
 import { ThemeProvider as Vd } from "styled-components";
-import M6, { Fragment as O2, useState as O, useRef as d2, useCallback as q, useEffect as m2, useLayoutEffect as B0, useMemo as k0, createContext as W3, useContext as K3, useReducer as g6, lazy as X3, Suspense as q3, memo as k6, createRef as b6, createElement as Q3, isValidElement as w6 } from "react";
-import { uuid as K, slugify as o3, stringifyPx as D, scrollToTop as g0, detectLanguage as x6, convertYoutube as u6, getRandomString as s0, capitalize as A2, filterObject as H6, getPercentage as Y0, generateNumbers as J3, enableScroll as b0, disableScroll as P0, convertDateShort as l0, convertDate as C6, getYesterday as y6, getToday as z3, toSentenceCase as l1, formatDate as $6 } from "@julseb-lib/utils";
+import M6, { Fragment as O2, useState as O, useRef as i2, useCallback as X, useEffect as m2, useLayoutEffect as B0, useMemo as k0, createContext as W3, useContext as K3, useReducer as g6, lazy as X3, Suspense as q3, memo as k6, createRef as b6, createElement as Q3, isValidElement as w6 } from "react";
+import { uuid as K, slugify as o3, stringifyPx as G, scrollToTop as g0, detectLanguage as x6, convertYoutube as u6, getRandomString as s0, capitalize as A2, filterObject as H6, getPercentage as Y0, generateNumbers as J3, enableScroll as b0, disableScroll as P0, convertDateShort as l0, convertDate as C6, getYesterday as y6, getToday as z3, toSentenceCase as l1, formatDate as $6 } from "@julseb-lib/utils";
 import { addDay as Dd, addMonth as Gd, addYear as Td, calculateAverage as Od, calculateTotalSum as Bd, capitalize as Yd, convertDate as Pd, convertDateShort as Ud, convertPrice as Fd, convertToEmail as Zd, convertYoutube as Wd, deleteDuplicates as Kd, detectLanguage as Xd, disableScroll as qd, emailRegex as Qd, enableScroll as Jd, filterObject as li, formatDate as ci, formatHour as ei, generateNumbers as ai, getFirstName as ti, getInitials as hi, getLastName as di, getNextDay as ii, getPercentage as fi, getRandom as ri, getRandomAvatar as mi, getRandomDate as si, getRandomNumber as oi, getRandomString as zi, getRandomTime as pi, getTimeNow as vi, getToday as ni, getTomorrow as Mi, getYesterday as gi, hexToRgb as ki, passwordRegex as bi, rgbToHex as wi, scrollToTop as xi, slugify as ui, sortByFrequency as Hi, stringifyPx as Ci, toCamelCase as yi, toConstantCase as $i, toDotCase as Ai, toKebabCase as Li, toPascalCase as Ri, toPathCase as _i, toSentenceCase as ji, toSnakeCase as Ii, toTitleCase as Si, unslugify as Ni, uuid as Vi } from "@julseb-lib/utils";
 import { useSearchParams as o0, NavLink as A6, Link as x2, useNavigate as L6, createSearchParams as R6, useLocation as _6 } from "react-router-dom";
 import j6 from "react-inlinesvg";
@@ -76,7 +76,7 @@ function U6() {
     function l(L) {
       if (L == null) return null;
       if (typeof L == "function")
-        return L.$$typeof === T ? null : L.displayName || L.name || null;
+        return L.$$typeof === V ? null : L.displayName || L.name || null;
       if (typeof L == "string") return L;
       switch (L) {
         case v:
@@ -89,7 +89,7 @@ function U6() {
           return "Suspense";
         case R:
           return "SuspenseList";
-        case G:
+        case T:
           return "Activity";
       }
       if (typeof L == "object")
@@ -128,11 +128,11 @@ function U6() {
       }
       if (Y) {
         Y = console;
-        var e2 = Y.error, i2 = typeof Symbol == "function" && Symbol.toStringTag && L[Symbol.toStringTag] || L.constructor.name || "Object";
+        var e2 = Y.error, d2 = typeof Symbol == "function" && Symbol.toStringTag && L[Symbol.toStringTag] || L.constructor.name || "Object";
         return e2.call(
           Y,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          i2
+          d2
         ), c(L);
       }
     }
@@ -148,7 +148,7 @@ function U6() {
       }
     }
     function h() {
-      var L = c2.A;
+      var L = l2.A;
       return L === null ? null : L.getOwner();
     }
     function d() {
@@ -163,7 +163,7 @@ function U6() {
     }
     function r(L, Y) {
       function e2() {
-        V || (V = !0, console.error(
+        E || (E = !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)",
           Y
         ));
@@ -179,13 +179,13 @@ function U6() {
         "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."
       )), L = this.props.ref, L !== void 0 ? L : null;
     }
-    function m(L, Y, e2, i2, l2, f2, D2, Q2) {
+    function m(L, Y, e2, d2, J, f2, D2, Q2) {
       return e2 = f2.ref, L = {
         $$typeof: p,
         type: L,
         key: Y,
         props: f2,
-        _owner: l2
+        _owner: J
       }, (e2 !== void 0 ? e2 : null) !== null ? Object.defineProperty(L, "ref", {
         enumerable: !1,
         get: f
@@ -211,13 +211,13 @@ function U6() {
         value: Q2
       }), Object.freeze && (Object.freeze(L.props), Object.freeze(L)), L;
     }
-    function o(L, Y, e2, i2, l2, f2, D2, Q2) {
+    function o(L, Y, e2, d2, J, f2, D2, Q2) {
       var p2 = Y.children;
       if (p2 !== void 0)
-        if (i2)
-          if (W(p2)) {
-            for (i2 = 0; i2 < p2.length; i2++)
-              z(p2[i2]);
+        if (d2)
+          if (Q(p2)) {
+            for (d2 = 0; d2 < p2.length; d2++)
+              z(p2[d2]);
             Object.freeze && Object.freeze(p2);
           } else
             console.error(
@@ -229,18 +229,18 @@ function U6() {
         var J2 = Object.keys(Y).filter(function(v6) {
           return v6 !== "key";
         });
-        i2 = 0 < J2.length ? "{key: someKey, " + J2.join(": ..., ") + ": ...}" : "{key: someKey}", z2[p2 + i2] || (J2 = 0 < J2.length ? "{" + J2.join(": ..., ") + ": ...}" : "{}", console.error(
+        d2 = 0 < J2.length ? "{key: someKey, " + J2.join(": ..., ") + ": ...}" : "{key: someKey}", o2[p2 + d2] || (J2 = 0 < J2.length ? "{" + J2.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          i2,
+          d2,
           p2,
           J2,
           p2
-        ), z2[p2 + i2] = !0);
+        ), o2[p2 + d2] = !0);
       }
       if (p2 = null, e2 !== void 0 && (e(e2), p2 = "" + e2), i(Y) && (e(Y.key), p2 = "" + Y.key), "key" in Y) {
         e2 = {};
@@ -254,7 +254,7 @@ React keys must be passed directly to JSX without using spread:
         L,
         p2,
         f2,
-        l2,
+        J,
         h(),
         e2,
         D2,
@@ -264,7 +264,7 @@ React keys must be passed directly to JSX without using spread:
     function z(L) {
       typeof L == "object" && L !== null && L.$$typeof === p && L._store && (L._store.validated = 1);
     }
-    var n = M6, p = Symbol.for("react.transitional.element"), g = Symbol.for("react.portal"), v = Symbol.for("react.fragment"), u = Symbol.for("react.strict_mode"), w = Symbol.for("react.profiler"), C = Symbol.for("react.consumer"), H = Symbol.for("react.context"), $ = Symbol.for("react.forward_ref"), y = Symbol.for("react.suspense"), R = Symbol.for("react.suspense_list"), _ = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), G = Symbol.for("react.activity"), T = Symbol.for("react.client.reference"), c2 = n.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, P = Object.prototype.hasOwnProperty, W = Array.isArray, J = console.createTask ? console.createTask : function() {
+    var n = M6, p = Symbol.for("react.transitional.element"), g = Symbol.for("react.portal"), v = Symbol.for("react.fragment"), u = Symbol.for("react.strict_mode"), w = Symbol.for("react.profiler"), C = Symbol.for("react.consumer"), H = Symbol.for("react.context"), $ = Symbol.for("react.forward_ref"), y = Symbol.for("react.suspense"), R = Symbol.for("react.suspense_list"), _ = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), T = Symbol.for("react.activity"), V = Symbol.for("react.client.reference"), l2 = n.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, P = Object.prototype.hasOwnProperty, Q = Array.isArray, W = console.createTask ? console.createTask : function() {
       return null;
     };
     n = {
@@ -272,33 +272,33 @@ React keys must be passed directly to JSX without using spread:
         return L();
       }
     };
-    var V, Z = {}, X = n["react-stack-bottom-frame"].bind(
+    var E, Z = {}, c2 = n["react-stack-bottom-frame"].bind(
       n,
       d
-    )(), h2 = J(a(d)), z2 = {};
-    d0.Fragment = v, d0.jsx = function(L, Y, e2, i2, l2) {
-      var f2 = 1e4 > c2.recentlyCreatedOwnerStacks++;
+    )(), h2 = W(a(d)), o2 = {};
+    d0.Fragment = v, d0.jsx = function(L, Y, e2, d2, J) {
+      var f2 = 1e4 > l2.recentlyCreatedOwnerStacks++;
       return o(
         L,
         Y,
         e2,
         !1,
-        i2,
-        l2,
-        f2 ? Error("react-stack-top-frame") : X,
-        f2 ? J(a(L)) : h2
+        d2,
+        J,
+        f2 ? Error("react-stack-top-frame") : c2,
+        f2 ? W(a(L)) : h2
       );
-    }, d0.jsxs = function(L, Y, e2, i2, l2) {
-      var f2 = 1e4 > c2.recentlyCreatedOwnerStacks++;
+    }, d0.jsxs = function(L, Y, e2, d2, J) {
+      var f2 = 1e4 > l2.recentlyCreatedOwnerStacks++;
       return o(
         L,
         Y,
         e2,
         !0,
-        i2,
-        l2,
-        f2 ? Error("react-stack-top-frame") : X,
-        f2 ? J(a(L)) : h2
+        d2,
+        J,
+        f2 ? Error("react-stack-top-frame") : c2,
+        f2 ? W(a(L)) : h2
       );
     };
   }()), d0;
@@ -2500,7 +2500,7 @@ class t8 {
         ["xs", N.XS],
         ["round", N.ROUND],
         ["circle", N.CIRCLE]
-      ]), a = (f) => typeof f == "number" ? D(f) : e.get(f);
+      ]), a = (f) => typeof f == "number" ? G(f) : e.get(f);
       if (typeof c == "number" || typeof c == "string")
         return x`
                 border-radius: ${a(c)};
@@ -2535,7 +2535,7 @@ class t8 {
             &:active {
                 box-shadow: ${s.Shadow(c.active)};
             }
-        ` : null, this.FontSize = (c = "body") => c ? typeof c == "number" ? D(c) : (/* @__PURE__ */ new Map([
+        ` : null, this.FontSize = (c = "body") => c ? typeof c == "number" ? G(c) : (/* @__PURE__ */ new Map([
       ["display-h1", U.DISPLAY_H1],
       ["display-h2", U.DISPLAY_H2],
       ["display-h3", U.DISPLAY_H3],
@@ -2554,7 +2554,7 @@ class t8 {
       ["regular", t2.REGULAR],
       ["bold", t2.BOLD],
       ["black", t2.BLACK]
-    ])).get(c) : null, this.Spacer = (c) => c ? typeof c == "number" ? D(c) : c === "0px" ? "0px" : (/* @__PURE__ */ new Map([
+    ])).get(c) : null, this.Spacer = (c) => c ? typeof c == "number" ? G(c) : c === "0px" ? "0px" : (/* @__PURE__ */ new Map([
       ["xxl", A.XXL],
       ["xl", A.XL],
       ["l", A.L],
@@ -3113,7 +3113,7 @@ function F0({
   value: c,
   setValue: e
 }) {
-  const [a, h] = O(!1), [d, i] = O(0), r = d2(null), f = q(
+  const [a, h] = O(!1), [d, i] = O(0), r = i2(null), f = X(
     (m) => {
       var n, p, g, v, u;
       const { key: o } = m, z = l;
@@ -4069,7 +4069,7 @@ const g3 = ({
   queries: e,
   totalPages: a
 }) => {
-  const [h, d] = o0(), i = q(() => {
+  const [h, d] = o0(), i = X(() => {
     const m = l - 1;
     c(m), d(
       e ? {
@@ -4078,7 +4078,7 @@ const g3 = ({
       } : { page: m.toString() },
       { replace: !0 }
     ), g0();
-  }, [l, e, c, d]), r = q(() => {
+  }, [l, e, c, d]), r = X(() => {
     const m = l + 1;
     c(m), d(
       e ? {
@@ -4363,7 +4363,7 @@ function u8() {
   }(L0)), L0.exports;
 }
 var H8 = u8();
-const E = /* @__PURE__ */ Y6(H8), a2 = ({
+const D = /* @__PURE__ */ Y6(H8), a2 = ({
   "data-testid": l,
   icon: c,
   size: e,
@@ -4380,7 +4380,7 @@ const E = /* @__PURE__ */ Y6(H8), a2 = ({
     color: a,
     baseURL: d
   }
-), Q = k.svg`
+), q = k.svg`
     width: ${({ $size: l }) => l}px;
     height: ${({ $size: l }) => l}px;
     fill: ${({ theme: l, $color: c }) => s.AllColors(c, l)};
@@ -4389,7 +4389,7 @@ const E = /* @__PURE__ */ Y6(H8), a2 = ({
         fill: ${({ theme: l, $color: c }) => s.AllColors(c, l)};
     }
 `;
-j([Q]);
+j([q]);
 const C8 = ({
   "data-testid": l,
   className: c,
@@ -4397,7 +4397,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4424,7 +4424,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4461,7 +4461,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4488,7 +4488,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4526,7 +4526,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4553,7 +4553,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4580,7 +4580,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4607,7 +4607,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4634,7 +4634,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4661,7 +4661,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4693,7 +4693,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4731,7 +4731,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4758,7 +4758,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4796,7 +4796,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4841,7 +4841,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4862,7 +4862,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4889,7 +4889,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4927,7 +4927,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4954,7 +4954,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -4981,7 +4981,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5008,7 +5008,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5035,7 +5035,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5080,7 +5080,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5107,7 +5107,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5152,7 +5152,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5179,7 +5179,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5215,7 +5215,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5242,7 +5242,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5269,7 +5269,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5296,7 +5296,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5323,7 +5323,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5350,7 +5350,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5386,7 +5386,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5422,7 +5422,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5458,7 +5458,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsxs(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5496,7 +5496,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5523,7 +5523,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5550,7 +5550,7 @@ const C8 = ({
   color: a = "currentColor",
   ...h
 }) => /* @__PURE__ */ t.jsx(
-  Q,
+  q,
   {
     "data-testid": l,
     className: c,
@@ -5589,7 +5589,7 @@ const C8 = ({
 `, L1 = k.div`
     position: relative;
     width: 100%;
-    max-width: ${({ $maxWidth: l }) => D(l)};
+    max-width: ${({ $maxWidth: l }) => G(l)};
     padding: ${A.S};
     border-radius: ${N.M};
     transition: ${B.SHORT};
@@ -5770,9 +5770,9 @@ const u3 = 24, el = ({
   ...p
 }) => {
   var $, y, R, _;
-  const g = il(), [v, u] = O(!0), w = q(() => {
+  const g = il(), [v, u] = O(!0), w = X(() => {
     u(!1), setTimeout(() => g.remove(i), 200);
-  }, [i, g]), C = d2(null);
+  }, [i, g]), C = i2(null);
   m2(() => {
     const I = r == null ? void 0 : r.duration;
     I && setTimeout(() => {
@@ -5788,7 +5788,7 @@ const u3 = 24, el = ({
       as: c,
       role: o,
       id: i,
-      className: E(h, { Open: v }),
+      className: D(h, { Open: v }),
       $status: n,
       $maxWidth: f,
       $toasterPosition: m,
@@ -5929,7 +5929,7 @@ const u3 = 24, el = ({
     $position: r,
     ...f,
     children: h.map((m) => {
-      var z, n, p, g, v, u, w, C, H, $, y, R, _, I, G, T, c2, P, W, J, V;
+      var z, n, p, g, v, u, w, C, H, $, y, R, _, I, T, V, l2, P, Q, W, E;
       const o = al[m.status || "success"];
       return /* @__PURE__ */ t.jsx(
         el,
@@ -5948,14 +5948,14 @@ const u3 = 24, el = ({
             },
             iconSizes: {
               left: ((R = (y = m.options) == null ? void 0 : y.iconSizes) == null ? void 0 : R.left) || (o == null ? void 0 : o.iconLeftSize),
-              close: ((I = (_ = m.options) == null ? void 0 : _.iconSizes) == null ? void 0 : I.close) || ((G = d == null ? void 0 : d.iconSizes) == null ? void 0 : G.close)
+              close: ((I = (_ = m.options) == null ? void 0 : _.iconSizes) == null ? void 0 : I.close) || ((T = d == null ? void 0 : d.iconSizes) == null ? void 0 : T.close)
             },
-            iconLeftColor: ((T = m.options) == null ? void 0 : T.iconLeftColor) || (d == null ? void 0 : d.iconLeftColor) || o.iconLeftColor,
-            ref: ((c2 = m.options) == null ? void 0 : c2.ref) || m.ref,
+            iconLeftColor: ((V = m.options) == null ? void 0 : V.iconLeftColor) || (d == null ? void 0 : d.iconLeftColor) || o.iconLeftColor,
+            ref: ((l2 = m.options) == null ? void 0 : l2.ref) || m.ref,
             labelClose: ((P = m.options) == null ? void 0 : P.labelClose) || (d == null ? void 0 : d.labelClose),
-            body: (W = m.options) == null ? void 0 : W.body,
-            id: ((J = m.options) == null ? void 0 : J.id) || m.id,
-            timerBackgroundColor: ((V = m.options) == null ? void 0 : V.timerBackgroundColor) || o.timerColor,
+            body: (Q = m.options) == null ? void 0 : Q.body,
+            id: ((W = m.options) == null ? void 0 : W.id) || m.id,
+            timerBackgroundColor: ((E = m.options) == null ? void 0 : E.timerBackgroundColor) || o.timerColor,
             ...d,
             ...m.options
           },
@@ -6036,8 +6036,8 @@ const u3 = 24, el = ({
     z-index: 0;
     background-color: ${({ theme: l }) => l.GRAY_500};
     display: block;
-    width: ${({ $width: l }) => D(l)};
-    height: ${({ $height: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
+    height: ${({ $height: l }) => G(l)};
     aspect-ratio: ${({ $aspectRatio: l }) => l};
     ${({ $borderRadius: l }) => s.BorderRadius(l)}
 `;
@@ -6045,8 +6045,7 @@ j([Q0]);
 const V1 = k.section`
     position: relative;
     background-color: ${({ $backgroundColor: l, theme: c }) => s.AllColors(l, c)};
-    height: ${({ $minHeight: l }) => D(l)};
-    min-height: ${({ $minHeight: l }) => D(l)};
+    min-height: ${({ $minHeight: l }) => G(l)};
     ${({ $gap: l }) => s.Flexbox({
   $gap: l,
   $justifyContent: "center"
@@ -6056,7 +6055,7 @@ const V1 = k.section`
         flex-direction: column;
         align-items: center;
         justify-content: flex-start;
-        min-height: ${({ $minHeight: l }) => D(l)};
+        min-height: ${({ $minHeight: l }) => G(l)};
     }
 `;
 j([V1]);
@@ -6081,7 +6080,7 @@ const fl = ({
     ...r,
     children: a
   }
-), H3 = (l) => typeof l == "number" ? D(l) : (/* @__PURE__ */ new Map([
+), H3 = (l) => typeof l == "number" ? G(l) : (/* @__PURE__ */ new Map([
   ["default", F2.MAIN_DEFAULT],
   ["large", F2.MAIN_LARGE],
   ["form", F2.MAIN_FORM],
@@ -6125,8 +6124,8 @@ const rl = ({
   as: c,
   ref: e,
   children: a,
-  size: h,
-  contentSize: d,
+  size: h = "default",
+  contentSize: d = "default",
   ...i
 }) => /* @__PURE__ */ t.jsx(
   E1,
@@ -6139,7 +6138,7 @@ const rl = ({
     ...i,
     children: a
   }
-), C3 = (l) => typeof l == "number" ? D(l) : (/* @__PURE__ */ new Map([
+), C3 = (l) => typeof l == "number" ? G(l) : (/* @__PURE__ */ new Map([
   ["default", F2.ASIDE_DEFAULT],
   ["small", F2.ASIDE_SMALL]
 ])).get(l), D1 = k.aside`
@@ -6174,7 +6173,7 @@ const Vh = ({
   as: c,
   ref: e,
   children: a,
-  size: h,
+  size: h = "default",
   ...d
 }) => /* @__PURE__ */ t.jsx(
   D1,
@@ -6227,15 +6226,15 @@ const Dh = ({
   ref: e,
   children: a,
   inline: h,
-  col: d,
-  gap: i,
-  columnGap: r,
-  rowGap: f,
-  justifyItems: m,
-  alignItems: o,
-  justifyContent: z,
-  alignContent: n,
-  padding: p,
+  col: d = 1,
+  gap: i = "0px",
+  columnGap: r = "0px",
+  rowGap: f = "0px",
+  justifyItems: m = "stretch",
+  alignItems: o = "stretch",
+  justifyContent: z = "auto",
+  alignContent: n = "normal",
+  padding: p = "0px",
   ...g
 }) => /* @__PURE__ */ t.jsx(
   T1,
@@ -6260,7 +6259,7 @@ const Dh = ({
     ${s.Flexbox}
 `;
 j([O1]);
-const o2 = ({
+const z2 = ({
   "data-testid": l,
   as: c,
   ref: e,
@@ -6298,8 +6297,8 @@ const o2 = ({
     children: a
   }
 ), B1 = k(j6)`
-    width: ${({ $size: l }) => D(l)};
-    height: ${({ $size: l }) => D(l)};
+    width: ${({ $size: l }) => G(l)};
+    height: ${({ $size: l }) => G(l)};
     fill: ${({ theme: l, $color: c }) => s.AllColors(c, l)};
 
     path {
@@ -6452,7 +6451,7 @@ const P1 = ({
         flex-grow: 1;
     }
 `, Z1 = k.span`
-    height: ${({ $tag: l, $display: c, $iconSize: e }) => e ? D(e * 1.5) : D((U1(l, c) || 16) * 1.5)};
+    height: ${({ $tag: l, $display: c, $iconSize: e }) => e ? G(e * 1.5) : G((U1(l, c) || 16) * 1.5)};
     ${s.Flexbox({
   $inline: !0,
   $alignItems: "center",
@@ -6473,7 +6472,7 @@ const Gh = ({
   iconBaseUrl: m,
   tag: o = "p",
   display: z,
-  gap: n,
+  gap: n = "xs",
   containerStyle: p,
   ...g
 }) => {
@@ -6692,15 +6691,15 @@ const pl = ({
   tooltipStyles: v,
   ...u
 }) => {
-  const w = W0(), C = f === "click" || w ? "click" : "hover", [H, $] = O(!1), y = d2(null);
+  const w = W0(), C = f === "click" || w ? "click" : "hover", [H, $] = O(!1), y = i2(null);
   V2(y, () => {
     H && C === "click" && $(!1);
   });
-  const R = q(() => {
+  const R = X(() => {
     $(!H);
-  }, [H]), _ = q(() => {
+  }, [H]), _ = X(() => {
     $(!0);
-  }, []), I = q(() => {
+  }, []), I = X(() => {
     $(!1);
   }, []);
   return /* @__PURE__ */ t.jsxs(
@@ -6709,7 +6708,7 @@ const pl = ({
       "data-testid": l,
       ref: e,
       as: c,
-      className: E(a, { Visible: H }),
+      className: D(a, { Visible: H }),
       onClick: z || (C === "click" ? R : void 0),
       onMouseEnter: n || (C === "hover" ? _ : void 0),
       onMouseLeave: p || (C === "hover" ? I : void 0),
@@ -6719,7 +6718,7 @@ const pl = ({
           K1,
           {
             "data-testid": l && `${l}.Tooltip`,
-            className: E(
+            className: D(
               { Tooltip: a },
               { Visible: H }
             ),
@@ -6740,10 +6739,10 @@ const pl = ({
 }, X1 = k.hr`
     display: block;
     width: 100%;
-    max-width: ${({ $maxWidth: l }) => D(l)};
+    max-width: ${({ $maxWidth: l }) => G(l)};
     border: none;
     background-color: ${({ theme: l, $color: c }) => s.AllColors(c, l)};
-    height: ${({ $height: l }) => D(l)};
+    height: ${({ $height: l }) => G(l)};
     ${({ $margin: l }) => s.Margin(l)}
 
     &.Rounded {
@@ -6768,7 +6767,7 @@ const q1 = ({
     "data-testid": l,
     ref: e,
     as: c,
-    className: E(a, { Rounded: f }),
+    className: D(a, { Rounded: f }),
     $height: h,
     $maxWidth: d,
     $color: i,
@@ -6803,9 +6802,9 @@ const q1 = ({
 }) => x`
     position: relative;
     overflow: hidden;
-    width: ${D(l)};
-    max-width: ${c && D(c)};
-    height: ${e && D(e)};
+    width: ${G(l)};
+    max-width: ${c && G(c)};
+    height: ${e && G(e)};
     background-color: ${({ theme: f }) => s.AllColors(a, f)};
     aspect-ratio: ${h};
     flex: ${i};
@@ -6821,7 +6820,7 @@ const q1 = ({
     background-color: ${({ theme: l }) => l.WHITE};
     animation: ${vl} 2000ms infinite;
     opacity: 0.7;
-`, l4 = k(o2)`
+`, l4 = k(z2)`
     ${Q1}
     ${({ $border: l }) => s.Border(l)}
     ${({ $padding: l }) => s.Padding(l)}
@@ -6960,8 +6959,8 @@ const Th = ({
   }
 ) }), a4 = k.img`
     display: block;
-    width: ${({ $width: l }) => D(l)};
-    height: ${({ $height: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
+    height: ${({ $height: l }) => G(l)};
     object-fit: ${({ $fit: l }) => l};
     aspect-ratio: ${({ $aspectRatio: l }) => l};
     position: relative;
@@ -6987,8 +6986,8 @@ const Th = ({
 `, J0 = k.figure`
     position: relative;
     overflow: hidden;
-    width: ${({ $width: l }) => D(l)};
-    height: ${({ $height: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
+    height: ${({ $height: l }) => G(l)};
     ${({ $borderRadius: l }) => s.BorderRadius(l)};
 `, l3 = k(F).attrs({ as: "figcaption" })`
     background: ${({ theme: l, $backgroundColor: c }) => s.ColorsAndOverlays(c, l)};
@@ -7074,7 +7073,7 @@ const kl = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   ) : /* @__PURE__ */ t.jsx($3, { ...v });
 };
 function bl(l, c, e = globalThis) {
-  const a = d2();
+  const a = i2();
   m2(() => a.current = c, [c]), m2(() => {
     if (!e.addEventListener) return;
     const h = (d) => a.current(d);
@@ -7108,9 +7107,9 @@ const Bh = ({
   gap: d = "l",
   ...i
 }) => {
-  const r = d2(null), [f, m] = O(h), o = [...Array(h)].map(() => []);
+  const r = i2(null), [f, m] = O(h), o = [...Array(h)].map(() => []);
   wl(a, o);
-  const z = q(
+  const z = X(
     () => m(
       Math.ceil(window.innerWidth / (window.innerWidth / f))
     ),
@@ -7134,7 +7133,7 @@ const Bh = ({
     ${({ $padding: l }) => s.Padding(l)}
 
     ${({ $height: l }) => l && x`
-            height: ${D(l)};
+            height: ${G(l)};
 
             & > img,
             & > figure {
@@ -7212,8 +7211,8 @@ const Yh = ({
 ), f4 = k.iframe`
     display: block;
     aspect-ratio: ${({ $aspectRatio: l }) => l};
-    width: ${({ $width: l }) => D(l)};
-    height: ${({ $height: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
+    height: ${({ $height: l }) => G(l)};
 `;
 j([f4]);
 const Uh = ({
@@ -7288,7 +7287,7 @@ const f0 = ({
       "data-testid": l,
       ref: e,
       as: h,
-      className: E(c, v),
+      className: D(c, v),
       id: a,
       $backgroundColor: o,
       $contentColor: z,
@@ -7359,8 +7358,8 @@ const f0 = ({
         bottom: ${A.XXS};
     }
 `, p4 = k.span`
-    width: ${({ $size: l }) => D(l)};
-    height: ${({ $size: l }) => D(l)};
+    width: ${({ $size: l }) => G(l)};
+    height: ${({ $size: l }) => G(l)};
     font-weight: ${t2.BLACK};
     background-color: ${({ $backgroundColor: l, theme: c }) => s.AllColors(l, c)};
     color: ${({ $fontColor: l, theme: c }) => s.AllColors(l, c)};
@@ -7404,7 +7403,7 @@ const A3 = ({
       ref: d ? void 0 : e,
       as: d ? "span" : c,
       id: h,
-      className: E(
+      className: D(
         d && a ? "Avatar" : a,
         C
       ),
@@ -7512,7 +7511,7 @@ const A3 = ({
           z4,
           {
             "data-testid": l && `${l}.Badge`,
-            className: E(
+            className: D(
               { Badge: p },
               `Position${A2(
                 u && i.position ? i.position : "top"
@@ -7532,8 +7531,8 @@ const A3 = ({
     }
   ) : /* @__PURE__ */ t.jsx(A3, { ...C });
 }, C0 = ({ $size: l }) => x`
-    width: ${l && D(l)};
-    height: ${l && D(l)};
+    width: ${l && G(l)};
+    height: ${l && G(l)};
     position: relative;
 `, ul = _2`
     0% {
@@ -7731,8 +7730,8 @@ const Hl = ({ "data-testid": l, ref: c, as: e, size: a, color: h, borderWidth: d
     border: none;
     background-color: transparent;
     position: relative;
-    width: ${({ $width: l }) => D(l)};
-    height: ${({ $height: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
+    height: ${({ $height: l }) => G(l)};
     color: ${({ theme: l, $color: c }) => s.ColorsHoverDefault(c, l)};
 
     ${({ $noHover: l, $color: c, theme: e }) => {
@@ -7763,7 +7762,7 @@ const Hl = ({ "data-testid": l, ref: c, as: e, size: a, color: h, borderWidth: d
         display: block;
         background-color: currentColor;
         width: 100%;
-        height: ${({ $borderWidth: l }) => D(l)};
+        height: ${({ $borderWidth: l }) => G(l)};
         border-radius: ${N.ROUND};
         position: absolute;
         left: 0;
@@ -7775,7 +7774,7 @@ const Hl = ({ "data-testid": l, ref: c, as: e, size: a, color: h, borderWidth: d
 
         &:nth-child(2) {
             top: calc(
-                50% - ${({ $borderWidth: l }) => D(l)} / 2
+                50% - ${({ $borderWidth: l }) => G(l)} / 2
             );
         }
 
@@ -7792,7 +7791,7 @@ const Hl = ({ "data-testid": l, ref: c, as: e, size: a, color: h, borderWidth: d
 
         &:nth-child(2) {
             top: calc(
-                50% - ${({ $borderWidth: l }) => D(l)} / 2
+                50% - ${({ $borderWidth: l }) => G(l)} / 2
             );
             width: 0;
         }
@@ -7823,7 +7822,7 @@ const b4 = ({
     "data-testid": l,
     ref: e,
     as: c || (f ? "span" : "button"),
-    className: E(a, { Open: h }),
+    className: D(a, { Open: h }),
     "aria-label": o,
     $noHover: f,
     $borderWidth: m,
@@ -7855,80 +7854,82 @@ const a0 = ({
   as: h,
   ref: d,
   className: i,
-  children: r,
-  color: f = "primary",
-  shadow: m,
-  size: o = "default",
-  borderRadius: z = o === "small" ? "s" : "m",
-  icons: n,
-  iconSizes: p,
-  iconBaseUrl: g,
-  gap: v = "xs",
-  variant: u = "plain",
-  noPadding: w,
-  isLoading: C,
-  loaderVariant: H,
-  to: $,
-  href: y,
-  blank: R,
-  ..._
+  role: r = "button",
+  children: f,
+  color: m = "primary",
+  shadow: o,
+  size: z = "default",
+  borderRadius: n = z === "small" ? "s" : "m",
+  icons: p,
+  iconSizes: g,
+  iconBaseUrl: v,
+  gap: u = "xs",
+  variant: w = "plain",
+  noPadding: C,
+  isLoading: H,
+  loaderVariant: $,
+  to: y,
+  href: R,
+  blank: _,
+  ...I
 }) => {
-  const I = {
-    size: o === "small" ? 14 : 16,
+  const T = {
+    size: z === "small" ? 14 : 16,
     color: "gray",
     "data-testid": l && `${l}.Loader`,
     className: "Loader"
-  }, G = o === "small" ? 14 : 16;
+  }, V = z === "small" ? 14 : 16;
   return /* @__PURE__ */ t.jsxs(
     w4,
     {
       "data-testid": l,
       ref: d,
-      as: h || ($ ? x2 : y ? "a" : "button"),
-      to: $ === "prev" ? -1 : $,
-      href: y,
+      as: h || (y ? x2 : R ? "a" : "button"),
+      to: y === "prev" ? -1 : y,
+      role: r,
+      href: R,
       className: i,
       "aria-label": c,
       "aria-disabled": a,
-      disabled: C || e,
-      target: R && "_blank",
-      rel: R && "noreferrer noopener",
-      $color: f,
-      $shadow: m,
-      $borderRadius: z,
-      $size: o,
-      $gap: v,
-      $variant: u,
-      $noPadding: w,
-      ..._,
+      disabled: H || e,
+      target: _ && "_blank",
+      rel: _ && "noreferrer noopener",
+      $color: m,
+      $shadow: o,
+      $borderRadius: n,
+      $size: z,
+      $gap: u,
+      $variant: w,
+      $noPadding: C,
+      ...I,
       children: [
-        (n == null ? void 0 : n.left) && !C && /* @__PURE__ */ t.jsx(
+        (p == null ? void 0 : p.left) && !H && /* @__PURE__ */ t.jsx(
           a2,
           {
-            icon: n.left,
+            icon: p.left,
             "data-testid": l && `${l}.IconLeft`,
             className: i && "IconLeft",
-            size: (p == null ? void 0 : p.left) || G,
-            baseUrl: g
+            size: (g == null ? void 0 : g.left) || V,
+            baseUrl: v
           }
         ),
-        C && (H === 4 ? /* @__PURE__ */ t.jsx(r0, { variant: 4, ...I }) : /* @__PURE__ */ t.jsx(
+        H && ($ === 4 ? /* @__PURE__ */ t.jsx(r0, { variant: 4, ...T }) : /* @__PURE__ */ t.jsx(
           r0,
           {
-            variant: H,
+            variant: $,
             borderWidth: 2,
-            ...I
+            ...T
           }
         )),
-        r,
-        (n == null ? void 0 : n.right) && /* @__PURE__ */ t.jsx(
+        f,
+        (p == null ? void 0 : p.right) && /* @__PURE__ */ t.jsx(
           a2,
           {
-            icon: n.right,
+            icon: p.right,
             "data-testid": l && `${l}.IconRight`,
             className: i && "IconRight",
-            size: (p == null ? void 0 : p.right) || G,
-            baseUrl: g
+            size: (g == null ? void 0 : g.right) || V,
+            baseUrl: v
           }
         )
       ]
@@ -7939,8 +7940,8 @@ const a0 = ({
     position: relative;
     padding: 0;
     z-index: 0;
-    width: ${({ $size: l }) => D(l)};
-    height: ${({ $size: l }) => D(l)};
+    width: ${({ $size: l }) => G(l)};
+    height: ${({ $size: l }) => G(l)};
 
     ${({ $variant: l, $showBackgroundHover: c, theme: e }) => l === "transparent" && c && x`
             @media ${S.HOVER} {
@@ -8027,71 +8028,73 @@ const L3 = ({
   "data-testid": l,
   as: c,
   ref: e,
-  size: a = 32,
-  icon: h,
-  iconSize: d = r2(a),
-  shadow: i,
-  borderRadius: r = "circle",
-  tooltip: f,
-  showTooltip: m,
-  "aria-label": o = A2(
-    typeof h == "string" ? h : "button icon"
+  role: a = "button",
+  size: h = 32,
+  icon: d,
+  iconSize: i = r2(h),
+  shadow: r,
+  borderRadius: f = "circle",
+  tooltip: m,
+  showTooltip: o,
+  "aria-label": z = A2(
+    typeof d == "string" ? d : "button icon"
   ),
-  to: z,
-  href: n,
-  blank: p,
-  variant: g = "plain",
-  showBackgroundHover: v,
-  isLoading: u,
-  loaderVariant: w,
-  loaderBorderWidth: C = 2,
-  disabled: H,
-  "aria-disabled": $ = u || H,
-  color: y = "primary",
-  className: R,
-  containerStyle: _,
-  ...I
+  to: n,
+  href: p,
+  blank: g,
+  variant: v = "plain",
+  showBackgroundHover: u,
+  isLoading: w,
+  loaderVariant: C,
+  loaderBorderWidth: H = 2,
+  disabled: $,
+  "aria-disabled": y = w || $,
+  color: R = "primary",
+  className: _,
+  containerStyle: I,
+  ...T
 }) => {
-  const G = {
+  const V = {
     "data-testid": l,
     as: c,
-    className: R,
-    showTooltip: m,
-    to: z,
-    href: n,
-    isLoading: u,
-    disabled: H,
-    "aria-disabled": $,
-    "aria-label": o,
-    blank: p,
-    variant: g,
-    showBackgroundHover: v,
-    borderRadius: r,
-    color: y,
-    shadow: i,
-    size: a,
-    loaderVariant: w,
-    icon: h,
-    iconSize: d,
-    loaderBorderWidth: C,
+    role: a,
+    className: _,
+    showTooltip: o,
+    to: n,
+    href: p,
+    isLoading: w,
+    disabled: $,
+    "aria-disabled": y,
+    "aria-label": z,
+    blank: g,
+    variant: v,
+    showBackgroundHover: u,
+    borderRadius: f,
+    color: R,
+    shadow: r,
+    size: h,
+    loaderVariant: C,
+    icon: d,
+    iconSize: i,
+    loaderBorderWidth: H,
     ref: e,
-    ...I
+    ...T
   };
-  return f && m ? /* @__PURE__ */ t.jsx(
+  return m && o ? /* @__PURE__ */ t.jsx(
     pl,
     {
       "data-testid": l,
-      className: R,
-      tooltip: f,
-      position: typeof m == "object" && (m != null && m.position) ? m.position : "top",
-      offset: typeof m == "object" && (m != null && m.offset) ? m.offset : void 0,
-      hideArrow: typeof m == "object" && m.hideArrow ? m.hideArrow : !1,
-      backgroundColor: typeof m == "object" && m.backgroundColor ? m.backgroundColor : "black-80",
-      textColor: typeof m == "object" && m.textColor ? m.textColor : "white",
-      style: _,
-      children: /* @__PURE__ */ t.jsx(L3, { ...G })
+      className: _,
+      tooltip: m,
+      position: typeof o == "object" && (o != null && o.position) ? o.position : "top",
+      offset: typeof o == "object" && (o != null && o.offset) ? o.offset : void 0,
+      hideArrow: typeof o == "object" && o.hideArrow ? o.hideArrow : !1,
+      backgroundColor: typeof o == "object" && o.backgroundColor ? o.backgroundColor : "black-80",
+      textColor: typeof o == "object" && o.textColor ? o.textColor : "white",
+      style: I,
+      children: /* @__PURE__ */ t.jsx(L3, { ...V })
     }
-  ) : /* @__PURE__ */ t.jsx(L3, { ...G });
+  ) : /* @__PURE__ */ t.jsx(L3, { ...V });
 }, Al = ({
   "data-testid": l,
   ref: c,
@@ -8455,7 +8458,7 @@ const Wh = ({
   gap: d = "xs",
   ...i
 }) => {
-  const r = d2(null), [f, m] = O(0);
+  const r = i2(null), [f, m] = O(0);
   return B0(() => {
     const o = () => {
       if (!r.current) return;
@@ -8513,8 +8516,8 @@ const Wh = ({
     overflow: hidden;
     position: relative;
     cursor: ${({ $cursor: l }) => l};
-    width: ${({ $width: l }) => l && D(l)};
-    height: ${({ $height: l }) => l && D(l)};
+    width: ${({ $width: l }) => l && G(l)};
+    height: ${({ $height: l }) => l && G(l)};
     background-color: ${({ theme: l, $backgroundColor: c }) => s.AllColors(c, l)};
     color: ${({ theme: l, $textColor: c }) => s.AllColors(c, l)};
     text-align: ${({ $textAlign: l }) => l};
@@ -8551,11 +8554,11 @@ const Kh = ({
   justifyContent: R,
   alignItems: _,
   justifyItems: I,
-  alignContent: G,
-  gap: T,
-  columnGap: c2,
+  alignContent: T,
+  gap: V,
+  columnGap: l2,
   rowGap: P,
-  ...W
+  ...Q
 }) => /* @__PURE__ */ t.jsx(
   R4,
   {
@@ -8591,11 +8594,11 @@ const Kh = ({
     $justifyContent: R,
     $alignItems: _,
     $justifyItems: I,
-    $alignContent: G,
-    $gap: T,
-    $columnGap: c2,
+    $alignContent: T,
+    $gap: V,
+    $columnGap: l2,
     $rowGap: P,
-    ...W,
+    ...Q,
     children: a
   }
 ), b2 = ({
@@ -9283,7 +9286,7 @@ const j2 = ({
 })}
 `, a3 = k.span`
     height: calc(${U.SMALL} * ${s2.BODY});
-    width: ${({ $iconSize: l }) => D(l)};
+    width: ${({ $iconSize: l }) => G(l)};
     ${s.Flexbox({
   $inline: !0,
   $alignItems: "center",
@@ -9291,7 +9294,7 @@ const j2 = ({
 })}
 `, Z2 = k(F).attrs({ tag: "small" })`
     font-style: ${({ $fontStyle: l }) => l};
-    width: ${({ $hasIcon: l, $iconSize: c }) => l && c && `calc(100% - ${D(c)} - ${A.XXS})`};
+    width: ${({ $hasIcon: l, $iconSize: c }) => l && c && `calc(100% - ${G(c)} - ${A.XXS})`};
 `;
 j([
   P4,
@@ -9420,7 +9423,7 @@ const _l = ({
   E4,
   {
     "data-testid": e && l ? `${l}.Wrapper` : l,
-    className: E(
+    className: D(
       e && c ? "Wrapper" : c,
       { Open: h }
     ),
@@ -9444,7 +9447,7 @@ const _l = ({
   D4,
   {
     "data-testid": l && `${l}.ListInput`,
-    className: E({ ListInput: e }, { Open: r }),
+    className: D({ ListInput: e }, { Open: r }),
     ref: c,
     $direction: h,
     $inputBackground: d,
@@ -9467,7 +9470,7 @@ const _l = ({
   G4,
   {
     "data-testid": l && `${l}.ListItem`,
-    className: E(
+    className: D(
       { ListItem: c },
       { Active: d },
       { Hovered: f }
@@ -9530,7 +9533,7 @@ const _l = ({
   Y4,
   {
     "data-testid": l && (d ? l : `${l}.InputAndListContainer`),
-    className: E(
+    className: D(
       { InputAndListContainer: e && !d },
       { Open: h },
       d && e
@@ -9636,7 +9639,7 @@ const _l = ({
     "data-testid": l,
     ref: e,
     as: c,
-    className: E(p, { Open: g }),
+    className: D(p, { Open: g }),
     style: v,
     ...w,
     children: [
@@ -9783,7 +9786,7 @@ const Vl = ({
   prefix: w,
   ...C
 }) => {
-  const H = d2(null), $ = q(() => {
+  const H = i2(null), $ = X(() => {
     var y;
     return (y = H == null ? void 0 : H.current) == null ? void 0 : y.showPicker();
   }, []);
@@ -10090,9 +10093,9 @@ const Vl = ({
   prefix: H,
   ...$
 }) => {
-  const y = W0(), R = d2(null), _ = q(() => {
-    var G;
-    return (G = R == null ? void 0 : R.current) == null ? void 0 : G.focus();
+  const y = W0(), R = i2(null), _ = X(() => {
+    var T;
+    return (T = R == null ? void 0 : R.current) == null ? void 0 : T.focus();
   }, []), I = u || [""];
   return t0(I, () => _()), /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     (H || p) && /* @__PURE__ */ t.jsxs(
@@ -10210,7 +10213,7 @@ const Vl = ({
   prefix: w,
   ...C
 }) => {
-  const H = d2(null);
+  const H = i2(null);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     (w || g) && /* @__PURE__ */ t.jsxs(
       C2,
@@ -10452,7 +10455,7 @@ const Vl = ({
   prefix: u,
   ...w
 }) => {
-  const C = d2(null), H = q(() => {
+  const C = i2(null), H = X(() => {
     var $;
     return ($ = C == null ? void 0 : C.current) == null ? void 0 : $.showPicker();
   }, []);
@@ -10643,8 +10646,8 @@ const Fl = ({ type: l, ref: c, ...e }) => Ul(e, l, c), Z4 = ({
     }
   );
 }, W4 = k.label`
-    width: ${({ $width: l }) => D(l)};
-    height: ${({ $height: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
+    height: ${({ $height: l }) => G(l)};
     position: relative;
     overflow: hidden;
     background-color: ${({ theme: l, $validationStatus: c }) => c === !1 ? l.DANGER_50 : l.GRAY_100};
@@ -10750,7 +10753,7 @@ const Zl = ({
   X4,
   {
     "data-testid": l && `${l}.HoverContainer`,
-    className: E(
+    className: D(
       { HoverContainer: c },
       { Visible: i }
     ),
@@ -10796,9 +10799,9 @@ const Zl = ({
   containerStyle: C,
   ...H
 }) => {
-  const $ = !!(h || d || i || r || f), [y, R] = O(!1), _ = q(() => {
+  const $ = !!(h || d || i || r || f), [y, R] = O(!1), _ = X(() => {
     R(!0);
-  }, []), I = q(() => {
+  }, []), I = X(() => {
     R(!1);
   }, []);
   return /* @__PURE__ */ t.jsx(
@@ -11090,7 +11093,7 @@ const qh = ({
   a7,
   {
     "data-testid": l,
-    className: a && E(a, i && A2(i)),
+    className: a && D(a, i && A2(i)),
     htmlFor: d,
     style: n,
     $variant: i,
@@ -11745,25 +11748,25 @@ const n0 = {
   countryButtonAriaLabel: R = "Select country",
   textNoResult: _ = "Your search did not return any result.",
   containerStyle: I,
-  inputAndListContainerStyle: G,
-  ...T
+  inputAndListContainerStyle: T,
+  ...V
 }) => {
-  const c2 = !!(h || d || i || r || f), P = k0(() => z || R3.find((l2) => l2.code === p), [p, z]), [W, J] = O(!1), V = q(() => {
-    J(!W);
-  }, [W]), Z = d2(null);
+  const l2 = !!(h || d || i || r || f), P = k0(() => z || R3.find((J) => J.code === p), [p, z]), [Q, W] = O(!1), E = X(() => {
+    W(!Q);
+  }, [Q]), Z = i2(null);
   V2(
     Z,
-    q(() => {
-      W && J(!1);
-    }, [W])
+    X(() => {
+      Q && W(!1);
+    }, [Q])
   );
-  const [X, h2] = O(""), z2 = k0(() => R3.filter(
-    (l2) => l2.name.toLowerCase().includes(X.toLowerCase()) || l2.dial_code.toLowerCase().includes(X.toLowerCase()) || l2.code.toLowerCase().includes(X.toLowerCase())
-  ), [X]), L = q((l2) => {
-    h2(l2.target.value);
-  }, []), Y = q(
-    (l2) => {
-      n(l2), J(!1);
+  const [c2, h2] = O(""), o2 = k0(() => R3.filter(
+    (J) => J.name.toLowerCase().includes(c2.toLowerCase()) || J.dial_code.toLowerCase().includes(c2.toLowerCase()) || J.code.toLowerCase().includes(c2.toLowerCase())
+  ), [c2]), L = X((J) => {
+    h2(J.target.value);
+  }, []), Y = X(
+    (J) => {
+      n(J), W(!1);
     },
     [n]
   ), e2 = {
@@ -11783,7 +11786,7 @@ const n0 = {
         className: e && "CaretIcon"
       }
     )
-  }, i2 = {
+  }, d2 = {
     "data-testid": l,
     className: e,
     validationStatus: f == null ? void 0 : f.status,
@@ -11803,7 +11806,7 @@ const n0 = {
       value: H,
       counter: void 0,
       maxLength: $,
-      hasListOpen: W,
+      hasListOpen: Q,
       iconBaseUrl: u,
       style: I,
       children: /* @__PURE__ */ t.jsxs(
@@ -11811,17 +11814,17 @@ const n0 = {
         {
           "data-testid": l,
           className: e,
-          hasListOpen: W,
-          inputAndListContainerStyle: G,
-          isParent: !c2,
+          hasListOpen: Q,
+          inputAndListContainerStyle: T,
+          isParent: !l2,
           children: [
             /* @__PURE__ */ t.jsxs(
               q2,
               {
                 "data-testid": l,
                 className: e,
-                hasContainer: c2,
-                hasListOpen: W,
+                hasContainer: l2,
+                hasListOpen: Q,
                 isTextArea: !1,
                 inputVariant: o,
                 inputBackground: m,
@@ -11843,7 +11846,7 @@ const n0 = {
                             disabled: y,
                             "aria-disabled": y,
                             "aria-label": R,
-                            onClick: V,
+                            onClick: E,
                             $inputBackground: m,
                             children: [
                               /* @__PURE__ */ t.jsx(
@@ -11886,9 +11889,9 @@ const n0 = {
                     {
                       "data-testid": l && `${l}.Input`,
                       ref: c,
-                      className: E(
+                      className: D(
                         { Input: e },
-                        { WithListOpen: W }
+                        { WithListOpen: Q }
                       ),
                       id: a,
                       type: "tel",
@@ -11897,7 +11900,7 @@ const n0 = {
                       $inputBackground: m,
                       $validationStatus: f == null ? void 0 : f.status,
                       $inputVariant: o,
-                      ...T
+                      ...V
                     }
                   ),
                   f && /* @__PURE__ */ t.jsx(
@@ -11928,13 +11931,13 @@ const n0 = {
                 "data-testid": l,
                 className: e,
                 ref: Z,
-                isOpen: W,
+                isOpen: Q,
                 direction: C,
                 inputBackground: m,
                 validationStatus: f == null ? void 0 : f.status,
                 inputVariant: o,
                 children: [
-                  /* @__PURE__ */ t.jsx(W2, { readOnly: !0, ...i2, children: /* @__PURE__ */ t.jsxs(
+                  /* @__PURE__ */ t.jsx(W2, { readOnly: !0, ...d2, children: /* @__PURE__ */ t.jsxs(
                     i7,
                     {
                       "data-testid": l && `${l}.ListInput.SearchContainer`,
@@ -11958,7 +11961,7 @@ const n0 = {
                             "data-testid": l && `${l}.ListInput.SearchContainer.Input`,
                             className: e && "InputSearch",
                             placeholder: w,
-                            value: X,
+                            value: c2,
                             onChange: L,
                             $inputBackground: m
                           }
@@ -11966,24 +11969,24 @@ const n0 = {
                       ]
                     }
                   ) }),
-                  z2.length ? z2.map((l2) => /* @__PURE__ */ t.jsxs(
+                  o2.length ? o2.map((J) => /* @__PURE__ */ t.jsxs(
                     W2,
                     {
-                      onClick: () => Y(l2),
-                      isActive: P === l2,
-                      ...i2,
+                      onClick: () => Y(J),
+                      isActive: P === J,
+                      ...d2,
                       children: [
-                        /* @__PURE__ */ t.jsx(D0, { src: l2.flag, width: 16 }),
+                        /* @__PURE__ */ t.jsx(D0, { src: J.flag, width: 16 }),
                         /* @__PURE__ */ t.jsxs("span", { children: [
                           "(",
-                          l2.dial_code,
+                          J.dial_code,
                           ") ",
-                          l2.name
+                          J.name
                         ] })
                       ]
                     },
-                    l2.code
-                  )) : /* @__PURE__ */ t.jsx(W2, { readOnly: !0, ...i2, children: _ })
+                    J.code
+                  )) : /* @__PURE__ */ t.jsx(W2, { readOnly: !0, ...d2, children: _ })
                 ]
               }
             )
@@ -12049,9 +12052,9 @@ const _3 = 32, Jh = ({
   inputNoEdit: R,
   disabled: _,
   containerStyle: I,
-  ...G
+  ...T
 }) => {
-  const T = !!(a || h || d || i || f), c2 = {
+  const V = !!(a || h || d || i || f), l2 = {
     size: 32,
     showTooltip: y && {
       position: "top",
@@ -12060,23 +12063,23 @@ const _3 = 32, Jh = ({
     variant: u,
     color: (f == null ? void 0 : f.status) === !1 ? "danger" : "primary",
     iconBaseUrl: H
-  }, P = _ || !!(p && z <= p), W = _ || !!(g && z >= g), J = q(() => {
-    const X = z - v;
-    if (p && X < p) {
+  }, P = _ || !!(p && z <= p), Q = _ || !!(g && z >= g), W = X(() => {
+    const c2 = z - v;
+    if (p && c2 < p) {
       n(p);
       return;
     }
-    n(X);
-  }, [p, n, v, z]), V = q(() => {
-    const X = z + v;
-    if (g && X > g) {
+    n(c2);
+  }, [p, n, v, z]), E = X(() => {
+    const c2 = z + v;
+    if (g && c2 > g) {
       n(g);
       return;
     }
-    n(X);
-  }, [g, n, v, z]), Z = q(
-    (X) => {
-      const h2 = Number(X.target.value);
+    n(c2);
+  }, [g, n, v, z]), Z = X(
+    (c2) => {
+      const h2 = Number(c2.target.value);
       if (p && h2 < p) {
         n(p);
         return;
@@ -12109,8 +12112,8 @@ const _3 = 32, Jh = ({
       children: /* @__PURE__ */ t.jsxs(
         r7,
         {
-          "data-testid": T && l ? `${l}.InputCounterWrapper` : l,
-          className: T && e ? "InputCounterWrapper" : e,
+          "data-testid": V && l ? `${l}.InputCounterWrapper` : l,
+          className: V && e ? "InputCounterWrapper" : e,
           $isInputEditable: !R,
           children: [
             /* @__PURE__ */ t.jsx(
@@ -12129,10 +12132,10 @@ const _3 = 32, Jh = ({
                 iconSize: w.minus,
                 "aria-label": $.minus,
                 tooltip: $.minus,
-                onClick: J,
+                onClick: W,
                 disabled: P,
                 "aria-disabled": P,
-                ...c2
+                ...l2
               }
             ),
             R ? /* @__PURE__ */ t.jsx(
@@ -12142,7 +12145,7 @@ const _3 = 32, Jh = ({
                 className: e && "NumberValue",
                 ref: c,
                 $disabled: _,
-                ...G,
+                ...T,
                 children: z
               }
             ) : /* @__PURE__ */ t.jsx(
@@ -12150,7 +12153,7 @@ const _3 = 32, Jh = ({
               {
                 "data-testid": l,
                 className: e,
-                hasContainer: T,
+                hasContainer: V,
                 isTextArea: !1,
                 inputBackground: m,
                 inputVariant: o,
@@ -12160,7 +12163,7 @@ const _3 = 32, Jh = ({
                   m7,
                   {
                     "data-testid": l && `${l}.Input`,
-                    className: E(
+                    className: D(
                       { Input: e },
                       { WithListOpen: !1 }
                     ),
@@ -12179,7 +12182,7 @@ const _3 = 32, Jh = ({
                     $disabled: _,
                     $validationStatus: f == null ? void 0 : f.status,
                     $length: z.toString().length,
-                    ...G
+                    ...T
                   }
                 )
               }
@@ -12200,10 +12203,10 @@ const _3 = 32, Jh = ({
                 iconSize: w.plus,
                 "aria-label": $.plus,
                 tooltip: $.plus,
-                onClick: V,
-                disabled: W,
-                "aria-disabled": W,
-                ...c2
+                onClick: E,
+                disabled: Q,
+                "aria-disabled": Q,
+                ...l2
               }
             )
           ]
@@ -12516,9 +12519,9 @@ const I0 = ({
     color: "gray"
   }, [y, R] = O(
     p === "always"
-  ), _ = q(() => {
+  ), _ = X(() => {
     p === "hover" && R(!0);
-  }, [p]), I = q(() => {
+  }, [p]), I = X(() => {
     p === "hover" && R(!1);
   }, [p]);
   return /* @__PURE__ */ t.jsx(
@@ -12539,7 +12542,7 @@ const I0 = ({
       style: v,
       hasListOpen: void 0,
       children: n || p !== "never" ? /* @__PURE__ */ t.jsxs(
-        o2,
+        z2,
         {
           "data-testid": w ? `${l}.SliderWrapper` : l,
           className: w ? "SliderWrapper" : e,
@@ -12568,7 +12571,7 @@ const I0 = ({
                     p7,
                     {
                       "data-testid": l && `${l}.SliderWrapper.SliderContainer.Tooltip`,
-                      className: E(
+                      className: D(
                         { SliderTooltip: e },
                         { Visible: y }
                       ),
@@ -12626,7 +12629,7 @@ const I3 = ({
   {
     "data-testid": (g || p || f != null && f.left) && l ? `${l}.SelectContainer.SelectButton` : l,
     ref: c,
-    className: E(
+    className: D(
       (g || p || f != null && f.left) && e ? "SelectButton" : e,
       { WithListOpen: h }
     ),
@@ -12668,22 +12671,22 @@ const I3 = ({
   containerStyle: R,
   ..._
 }) => {
-  const I = !!(d || i || r || f || m), G = !!(v && v.length > 1), T = !!(G || m || w != null && w.left), c2 = {
+  const I = !!(d || i || r || f || m), T = !!(v && v.length > 1), V = !!(T || m || w != null && w.left), l2 = {
     left: 16,
     caret: 16
-  }, { isOpen: P, setIsOpen: W, cursor: J, listRef: V } = F0({
+  }, { isOpen: P, setIsOpen: Q, cursor: W, listRef: E } = F0({
     data: v || [],
     value: p,
     setValue: g
   });
-  V2(V, () => W(!1));
+  V2(E, () => Q(!1));
   const Z = (h2) => {
-    h2.stopPropagation(), !P && v && v.length > 1 && W(!0);
+    h2.stopPropagation(), !P && v && v.length > 1 && Q(!0);
   };
   m2(() => {
-    W(!1);
+    Q(!1);
   }, [p]);
-  const X = {
+  const c2 = {
     "data-testid": l,
     className: a,
     value: p,
@@ -12697,9 +12700,9 @@ const I3 = ({
     options: v,
     isOpen: P,
     hasContainer: I,
-    hasWrapper: T
+    hasWrapper: V
   };
-  return !I && !T && !G ? /* @__PURE__ */ t.jsx(I3, { ...X }) : /* @__PURE__ */ t.jsx(
+  return !I && !V && !T ? /* @__PURE__ */ t.jsx(I3, { ...c2 }) : /* @__PURE__ */ t.jsx(
     b2,
     {
       "data-testid": l,
@@ -12724,8 +12727,8 @@ const I3 = ({
           ref: e,
           as: c,
           onClick: Z,
-          onFocus: () => W(!0),
-          onBlur: () => W(!1),
+          onFocus: () => Q(!0),
+          onBlur: () => Q(!1),
           ..._,
           children: [
             /* @__PURE__ */ t.jsxs(
@@ -12762,7 +12765,7 @@ const I3 = ({
                             "data-testid": l,
                             className: a,
                             icon: w == null ? void 0 : w.left,
-                            iconSize: (C == null ? void 0 : C.left) || c2.left,
+                            iconSize: (C == null ? void 0 : C.left) || l2.left,
                             validationStatus: m == null ? void 0 : m.status,
                             disabled: n,
                             inputBackground: z,
@@ -12773,8 +12776,8 @@ const I3 = ({
                       ]
                     }
                   ),
-                  /* @__PURE__ */ t.jsx(I3, { ...X }),
-                  (G || m) && /* @__PURE__ */ t.jsxs(
+                  /* @__PURE__ */ t.jsx(I3, { ...c2 }),
+                  (T || m) && /* @__PURE__ */ t.jsxs(
                     u2,
                     {
                       "data-testid": l,
@@ -12792,7 +12795,7 @@ const I3 = ({
                             inputBackground: z
                           }
                         ),
-                        G && /* @__PURE__ */ t.jsx(
+                        T && /* @__PURE__ */ t.jsx(
                           R2,
                           {
                             "data-testid": l,
@@ -12803,10 +12806,10 @@ const I3 = ({
                               {
                                 "data-testid": l && `${l}.Button.Caret`,
                                 className: a && "Caret",
-                                size: (C == null ? void 0 : C.caret) || c2.caret
+                                size: (C == null ? void 0 : C.caret) || l2.caret
                               }
                             ),
-                            iconSize: (C == null ? void 0 : C.caret) || c2.caret,
+                            iconSize: (C == null ? void 0 : C.caret) || l2.caret,
                             disabled: n,
                             "aria-label": "Caret down",
                             validationStatus: m == null ? void 0 : m.status,
@@ -12824,13 +12827,13 @@ const I3 = ({
               {
                 "data-testid": l,
                 className: a,
-                ref: V,
+                ref: E,
                 direction: u,
                 inputBackground: z,
                 inputVariant: o,
                 validationStatus: m == null ? void 0 : m.status,
                 isOpen: P,
-                children: v.map((h2, z2) => /* @__PURE__ */ t.jsx(
+                children: v.map((h2, o2) => /* @__PURE__ */ t.jsx(
                   W2,
                   {
                     "data-testid": l,
@@ -12839,10 +12842,10 @@ const I3 = ({
                     validationStatus: m == null ? void 0 : m.status,
                     onClick: () => g(h2),
                     isActive: p === h2,
-                    isHovered: J === z2 && p !== h2,
+                    isHovered: W === o2 && p !== h2,
                     children: h2
                   },
-                  `${h2}-${z2}`
+                  `${h2}-${o2}`
                 ))
               }
             )
@@ -12881,42 +12884,42 @@ const wt = ({
   disabled: R,
   containerStyle: _,
   inputAndListContainerStyle: I,
-  ...G
+  ...T
 }) => {
-  const T = !!(h || d || i || r || f), c2 = { left: 16, clear: 16 }, P = W0(), W = d2(null), J = $ || [""];
+  const V = !!(h || d || i || r || f), l2 = { left: 16, clear: 16 }, P = W0(), Q = i2(null), W = $ || [""];
   t0(
-    J,
-    q(() => {
+    W,
+    X(() => {
       var f2;
-      return (f2 = W == null ? void 0 : W.current) == null ? void 0 : f2.focus();
+      return (f2 = Q == null ? void 0 : Q.current) == null ? void 0 : f2.focus();
     }, [])
   );
-  const V = k0(() => {
+  const E = k0(() => {
     var D2, Q2;
     return (Q2 = (D2 = new I6(p, u).search(z)) == null ? void 0 : D2.slice(0, 20)) == null ? void 0 : Q2.map((p2) => p2.item);
-  }, [u, p, z]), { isOpen: Z, setIsOpen: X, cursor: h2, listRef: z2 } = F0({
-    data: V,
+  }, [u, p, z]), { isOpen: Z, setIsOpen: c2, cursor: h2, listRef: o2 } = F0({
+    data: E,
     value: z,
     setValue: n
-  }), L = q(
+  }), L = X(
     (f2) => {
       n(f2.target.value);
     },
     [n]
-  ), Y = q(() => {
+  ), Y = X(() => {
     n("");
-  }, [n]), e2 = q(
+  }, [n]), e2 = X(
     (f2) => {
       n(f2);
     },
     [n]
-  ), i2 = q(() => {
-    X(!0);
-  }, [X]), l2 = q(
+  ), d2 = X(() => {
+    c2(!0);
+  }, [c2]), J = X(
     () => setTimeout(() => {
-      X(!1);
+      c2(!1);
     }, 100),
-    [X]
+    [c2]
   );
   return /* @__PURE__ */ t.jsx(
     b2,
@@ -12942,14 +12945,14 @@ const wt = ({
           className: a,
           hasListOpen: Z,
           inputAndListContainerStyle: I,
-          isParent: !T,
+          isParent: !V,
           children: [
             /* @__PURE__ */ t.jsxs(
               q2,
               {
                 "data-testid": l,
                 className: a,
-                hasContainer: T,
+                hasContainer: V,
                 hasListOpen: Z,
                 isTextArea: !1,
                 inputVariant: o,
@@ -12968,7 +12971,7 @@ const wt = ({
                           "data-testid": l,
                           className: a,
                           icon: w.left,
-                          iconSize: (C == null ? void 0 : C.left) || c2.left,
+                          iconSize: (C == null ? void 0 : C.left) || l2.left,
                           validationStatus: f == null ? void 0 : f.status,
                           disabled: R,
                           inputBackground: m,
@@ -12982,23 +12985,23 @@ const wt = ({
                     M7,
                     {
                       "data-testid": l && `${l}.Input`,
-                      className: E(
+                      className: D(
                         { Input: a },
                         { WithListOpen: Z }
                       ),
-                      ref: g2([c, W]),
+                      ref: g2([c, Q]),
                       id: e,
                       value: z,
                       disabled: R,
                       onChange: L,
                       type: "search",
-                      onFocus: i2,
-                      onBlur: l2,
+                      onFocus: d2,
+                      onBlur: J,
                       $disabled: R,
                       $validationStatus: f == null ? void 0 : f.status,
                       $inputBackground: m,
                       $inputVariant: o,
-                      ...G
+                      ...T
                     }
                   ),
                   (z.length || f || y) && /* @__PURE__ */ t.jsxs(
@@ -13021,10 +13024,10 @@ const wt = ({
                               {
                                 "data-testid": l && `${l}.Button.Icon`,
                                 className: a && "ClearIcon",
-                                size: (C == null ? void 0 : C.clear) || c2.clear
+                                size: (C == null ? void 0 : C.clear) || l2.clear
                               }
                             ),
-                            iconSize: (C == null ? void 0 : C.clear) || c2.clear,
+                            iconSize: (C == null ? void 0 : C.clear) || l2.clear,
                             inputBackground: m,
                             disabled: R,
                             "aria-label": "Clear",
@@ -13036,7 +13039,7 @@ const wt = ({
                           {
                             "data-testid": l && `${l}.Keys`,
                             className: a && "Keys",
-                            keys: e1(J)
+                            keys: e1(W)
                           }
                         ),
                         f && /* @__PURE__ */ t.jsx(
@@ -13064,8 +13067,8 @@ const wt = ({
                 inputVariant: o,
                 validationStatus: f == null ? void 0 : f.status,
                 isOpen: !!(z && Z),
-                ref: z2,
-                children: V != null && V.length ? /* @__PURE__ */ t.jsx(t.Fragment, { children: V.map((f2, D2) => /* @__PURE__ */ t.jsx(
+                ref: o2,
+                children: E != null && E.length ? /* @__PURE__ */ t.jsx(t.Fragment, { children: E.map((f2, D2) => /* @__PURE__ */ t.jsx(
                   W2,
                   {
                     "data-testid": l,
@@ -13170,7 +13173,7 @@ const ad = ({
         size: (i == null ? void 0 : i.checked) || C.checked
       }
     )
-  }, $ = q(
+  }, $ = X(
     (y) => {
       h(y + 1);
     },
@@ -13194,7 +13197,7 @@ const ad = ({
       style: v,
       hasListOpen: void 0,
       children: /* @__PURE__ */ t.jsx(
-        o2,
+        z2,
         {
           "data-testid": w ? `${l}.RatingContainer` : l,
           className: w ? "RatingContainer" : e,
@@ -13318,7 +13321,7 @@ const td = ({
       hasListOpen: void 0,
       iconBaseUrl: void 0,
       children: /* @__PURE__ */ t.jsx(
-        o2,
+        z2,
         {
           "data-testid": $ ? `${l}.FlexContainer` : l,
           ref: c,
@@ -13333,7 +13336,7 @@ const td = ({
               className: e && "InputPin",
               ref: _,
               id: Object.keys(a)[I],
-              onChange: (G) => R(G, I),
+              onChange: (T) => R(T, I),
               value: Object.values(a)[I],
               placeholder: d && d[I],
               type: r ? "password" : "text",
@@ -13353,7 +13356,7 @@ const td = ({
     }
   );
 }, b7 = k.form`
-    max-width: ${({ $maxWidth: l }) => D(l)};
+    max-width: ${({ $maxWidth: l }) => G(l)};
     width: 100%;
     ${({ $gap: l }) => s.Flexbox({
   $flexDirection: "column",
@@ -13401,7 +13404,7 @@ const hd = ({
       children: [
         a,
         (h || d) && /* @__PURE__ */ t.jsxs(
-          o2,
+          z2,
           {
             gap: "xxs",
             "data-testid": l && `${l}.ButtonsContainer`,
@@ -13451,7 +13454,7 @@ const hd = ({
 }, w7 = k.div`
     border: 1px solid ${({ theme: l }) => l.GRAY_200};
     border-radius: ${N.M};
-    max-height: ${({ $maxHeight: l }) => l && D(l)};
+    max-height: ${({ $maxHeight: l }) => l && G(l)};
     overflow: hidden;
     overflow-y: scroll;
     position: relative;
@@ -13596,7 +13599,7 @@ const xt = ({
       "data-testid": l,
       ref: c,
       as: e,
-      className: E(h, { Scrolled: n }),
+      className: D(h, { Scrolled: n }),
       $backgroundColor: d,
       $contentColor: i,
       $noSeparator: r,
@@ -13731,7 +13734,7 @@ const xt = ({
   noSeparator: m,
   ...o
 }) => {
-  const z = d2(null);
+  const z = i2(null);
   return /* @__PURE__ */ t.jsxs(
     w7,
     {
@@ -13761,7 +13764,7 @@ const xt = ({
           ut,
           {
             "data-testid": n["data-testid"] || l,
-            className: E(n.className, {
+            className: D(n.className, {
               ListGroupItem: !!a
             }),
             id: n.id,
@@ -14047,14 +14050,14 @@ const yt = ({
     "data-testid": l && `${l}.AccordionButton.IconContainer.Icon.${a === "plus" ? "Plus" : "Chevron"}`,
     className: c && "AccordionButtonIcon",
     size: 20
-  }, f = q(() => {
+  }, f = X(() => {
     d(!h);
   }, [h, d]);
   return /* @__PURE__ */ t.jsxs(
     i3,
     {
       "data-testid": l && `${l}.AccordionButton`,
-      className: E(
+      className: D(
         { AccordionButton: c },
         A2(e)
       ),
@@ -14065,7 +14068,7 @@ const yt = ({
           I7,
           {
             "data-testid": l && `${l}.AccordionButton.IconContainer`,
-            className: E(
+            className: D(
               { AccordionButtonIconContainer: c },
               { Open: h },
               { [A2(a)]: typeof a == "string" }
@@ -14092,7 +14095,7 @@ const yt = ({
   S7,
   {
     "data-testid": l && `${l}.AccordionContent`,
-    className: E(
+    className: D(
       { AccordionContent: c },
       { Open: a },
       A2(h)
@@ -14118,7 +14121,7 @@ const yt = ({
       "data-testid": l,
       as: e,
       ref: a,
-      className: E(c, A2(f)),
+      className: D(c, A2(f)),
       $variant: f,
       ...m,
       children: [
@@ -14165,7 +14168,7 @@ const yt = ({
       "data-testid": l,
       ref: e,
       as: c,
-      className: E(a, m),
+      className: D(a, m),
       ...f,
       children: r ? r.map((o) => /* @__PURE__ */ t.jsx(
         At,
@@ -14204,11 +14207,11 @@ const yt = ({
   switch (l) {
     case "up":
       return x`
-                    bottom: ${D(c)};
+                    bottom: ${G(c)};
                 `;
     case "down":
       return x`
-                    top: ${D(c)};
+                    top: ${G(c)};
                 `;
     default:
       return x``;
@@ -14217,9 +14220,9 @@ const yt = ({
 
 &.Open {
         box-shadow: ${({ $shadow: l }) => s.Shadow(l)};
-        max-height: ${({ $maxHeight: l }) => D(l)};
+        max-height: ${({ $maxHeight: l }) => G(l)};
     }
-`, N7 = k(o2)`
+`, N7 = k(z2)`
     position: relative;
     z-index: 0;
 
@@ -14365,17 +14368,17 @@ const G7 = ({
   shadow: n = "m",
   ...p
 }) => {
-  const g = d2(null);
+  const g = i2(null);
   return V2(
     g,
-    q(() => i(!1), [i])
+    X(() => i(!1), [i])
   ), /* @__PURE__ */ t.jsx(
     f3,
     {
       "data-testid": l,
       ref: g2([e, g]),
       as: c,
-      className: E(a, { Open: d }),
+      className: D(a, { Open: d }),
       $direction: f,
       $maxHeight: o,
       $buttonOpenHeight: z,
@@ -14405,7 +14408,7 @@ const G7 = ({
   N7,
   {
     ref: l,
-    className: E(e, { Open: c }),
+    className: D(e, { Open: c }),
     ...a
   }
 ), T7 = k.div`
@@ -14454,44 +14457,46 @@ const _t = {
   ref: e,
   className: a,
   id: h,
-  children: d,
-  maxWidth: i,
-  textColor: r = "font",
-  padding: f = "s",
-  borderRadius: m = "m",
-  gap: o = "xs",
-  alertColor: z = "primary",
-  backgroundColor: n,
-  border: p,
-  ...g
+  role: d = "alert",
+  children: i,
+  maxWidth: r,
+  textColor: f = "font",
+  padding: m = "s",
+  borderRadius: o = "m",
+  gap: z = "xs",
+  alertColor: n = "primary",
+  backgroundColor: p,
+  border: g,
+  ...v
 }) => {
-  const v = _t[z], u = s0(10, !0), w = (a == null ? void 0 : a.split(" ")[0]) || u;
+  const u = _t[n], w = s0(10, !0), C = (a == null ? void 0 : a.split(" ")[0]) || w;
   return K2(`
-            ${h ? `#${h}` : `.${w}`} {
-                --alert-max-width: ${D(i || "100%")};
+            ${h ? `#${h}` : `.${C}`} {
+                --alert-max-width: ${G(r || "100%")};
             }
         `), /* @__PURE__ */ t.jsx(t.Fragment, { children: /* @__PURE__ */ t.jsx(
     T7,
     {
       "data-testid": l,
       ref: e,
-      as: c || typeof d == "string" ? F : "div",
-      className: E(a, u),
+      as: c || typeof i == "string" ? F : "div",
+      className: D(a, w),
       id: h,
-      $backgroundColor: n || v.backgroundColor || "primary-50",
+      role: d,
+      $backgroundColor: p || u.backgroundColor || "primary-50",
       $border: {
-        color: v.borderColor || "primary",
-        ...p
+        color: u.borderColor || "primary",
+        ...g
       },
-      $borderRadius: m,
-      $gap: o,
-      $padding: f,
-      $textColor: r,
-      ...g,
-      children: d
+      $borderRadius: o,
+      $gap: z,
+      $padding: m,
+      $textColor: f,
+      ...v,
+      children: i
     }
   ) });
-}, O7 = k(o2)`
+}, O7 = k(z2)`
     position: fixed;
     top: 0;
     left: 0;
@@ -14548,21 +14553,21 @@ const S3 = 48, jt = "Close modal", md = ({
   contentId: z,
   ...n
 }) => {
-  const p = q(() => {
+  const p = X(() => {
     i(!1), b0();
   }, [i]);
   t0(
     ["Escape"],
-    q(() => {
+    X(() => {
       d && !r && p();
     }, [r, p, d])
   );
-  const g = d2(null);
+  const g = i2(null);
   V2(g, () => p());
   const v = s0(10, !0), u = (h == null ? void 0 : h.split(" ")[0]) || v;
   return K2(`
             ${z ? `#${z}` : `.${u}`} {
-                --modal-content-width: ${D(o || "90%")};
+                --modal-content-width: ${G(o || "90%")};
             }
         `), /* @__PURE__ */ t.jsxs(
     O7,
@@ -14570,7 +14575,7 @@ const S3 = 48, jt = "Close modal", md = ({
       "data-testid": l,
       ref: e,
       as: c,
-      className: E(h, v, {
+      className: D(h, v, {
         Open: d
       }),
       ...n,
@@ -14680,7 +14685,7 @@ const P2 = ({
     "data-testid": l,
     as: c,
     ref: e,
-    className: E(a, { Active: h }),
+    className: D(a, { Active: h }),
     type: "button",
     $accentColor: i,
     $readOnly: r,
@@ -14708,18 +14713,18 @@ const P2 = ({
     currentPage: w,
     setCurrentPage: C,
     queries: i
-  }), _ = q(() => {
-    const T = Math.floor((u - 1) / f) * f;
-    return new Array(f).fill(r).map((c2, P) => T + P + 1).filter((c2) => c2 <= (r || 0));
-  }, [u, f, r])(), I = Z0(600), G = p || I ? "xxs" : "xs";
+  }), _ = X(() => {
+    const V = Math.floor((u - 1) / f) * f;
+    return new Array(f).fill(r).map((l2, P) => V + P + 1).filter((l2) => l2 <= (r || 0));
+  }, [u, f, r])(), I = Z0(600), T = p || I ? "xxs" : "xs";
   return r && r <= 1 ? null : /* @__PURE__ */ t.jsx(
-    o2,
+    z2,
     {
       "data-testid": l,
       ref: e,
       as: c,
       justifyContent: n,
-      gap: G,
+      gap: T,
       className: h,
       ...g,
       children: r ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
@@ -14758,7 +14763,7 @@ const P2 = ({
             P2,
             {
               "data-testid": l && `${l}.PaginationButton.Number${w === 1 ? ".Active" : ""}`,
-              className: h && E("Number", {
+              className: h && D("Number", {
                 Active: w === 1
               }),
               isActive: w === 1,
@@ -14778,17 +14783,17 @@ const P2 = ({
             }
           )
         ] }),
-        _.map((T) => /* @__PURE__ */ t.jsx(
+        _.map((V) => /* @__PURE__ */ t.jsx(
           P2,
           {
-            "data-testid": l && `${l}.PaginationButton.Number${w === T ? ".Active" : ""}`,
-            className: h && E("Number", { Active: w === T }),
-            isActive: T === w,
-            onClick: () => y(T),
+            "data-testid": l && `${l}.PaginationButton.Number${w === V ? ".Active" : ""}`,
+            className: h && D("Number", { Active: w === V }),
+            isActive: V === w,
+            onClick: () => y(V),
             accentColor: d,
-            children: T
+            children: V
           },
-          T
+          V
         )),
         _[_.length - 1] !== r && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
           /* @__PURE__ */ t.jsx(
@@ -14895,12 +14900,12 @@ const V3 = 32, od = ({
     setCurrentPage: H,
     queries: z,
     totalPages: h
-  }), _ = q(
+  }), _ = X(
     (I) => R(Number(I.target.value)),
     [R]
   );
   return h && h <= 1 ? null : /* @__PURE__ */ t.jsxs(
-    o2,
+    z2,
     {
       "data-testid": l,
       ref: e,
@@ -15111,7 +15116,7 @@ const It = ({
     r3,
     {
       "data-testid": l,
-      className: E(h, { StepLink: H }),
+      className: D(h, { StepLink: H }),
       ref: e,
       as: C,
       to: p,
@@ -15127,7 +15132,7 @@ const It = ({
           W7,
           {
             "data-testid": l && `${l}.NumberContainer`,
-            className: E(
+            className: D(
               { NumberContainer: h },
               { Active: r }
             ),
@@ -15288,7 +15293,7 @@ const pd = ({
       "data-testid": l,
       ref: e,
       as: c,
-      className: E(
+      className: D(
         a,
         { Animated: !i },
         z,
@@ -15346,7 +15351,7 @@ const D3 = ({
   return /* @__PURE__ */ t.jsx(
     Q7,
     {
-      className: E(l, { Animated: !a }),
+      className: D(l, { Animated: !a }),
       r: 70,
       cx: 100,
       cy: 100,
@@ -15684,7 +15689,7 @@ const Dt = ({
     "data-testid": l,
     ref: e,
     as: c,
-    className: E(a, { Active: r }),
+    className: D(a, { Active: r }),
     onClick: f,
     $justify: d,
     $variant: i,
@@ -15705,7 +15710,7 @@ const Dt = ({
     "data-testid": l,
     ref: e,
     as: c,
-    className: E(h, { Active: d }),
+    className: D(h, { Active: d }),
     ...i,
     children: a
   }
@@ -15790,16 +15795,16 @@ const Dt = ({
   $justifyItems: "center"
 })};
     position: relative;
-`, i5 = k(o2).attrs({ flexDirection: "column" })`
+`, i5 = k(z2).attrs({ flexDirection: "column" })`
     width: 100%;
-    height: ${({ $height: l }) => D(l)};
+    height: ${({ $height: l }) => G(l)};
     position: relative;
     overflow: hidden;
-`, f5 = k(o2)`
+`, f5 = k(z2)`
     overflow: hidden;
     width: 100%;
     height: 100%;
-`, r5 = k(o2)`
+`, r5 = k(z2)`
     transition: all ${({ $speed: l }) => l}ms ease;
     width: 100%;
     transform: ${({ $active: l }) => `translateX(-${l * 100}%)`};
@@ -15856,7 +15861,7 @@ const Dt = ({
                 display: none;
             }
         `}
-`, s5 = k(o2).attrs({
+`, s5 = k(z2).attrs({
   justifyContent: "center",
   alignItems: "center",
   gap: "xs"
@@ -16131,7 +16136,7 @@ const O3 = 24, B3 = 32, Y3 = ({
         z5,
         {
           "data-testid": l && `${l}.SlideshowPagination.Thumbnail`,
-          className: E(
+          className: D(
             {
               SlideshowThumbnail: c
             },
@@ -16156,7 +16161,7 @@ const O3 = 24, B3 = 32, Y3 = ({
         o5,
         {
           "data-testid": l && `${l}.SlideshowPagination.PaginationItem`,
-          className: E(
+          className: D(
             { SlideshowPaginationItem: c },
             { Active: i === n }
           ),
@@ -16183,17 +16188,17 @@ const O3 = 24, B3 = 32, Y3 = ({
   ...z
 }) => {
   var I;
-  const [n, p] = O(0), g = (h == null ? void 0 : h.length) || (d == null ? void 0 : d.length) || 0, v = () => p(n < g - 1 ? n + 1 : 0), u = () => p(n > 0 ? n - 1 : g - 1), w = q(() => {
+  const [n, p] = O(0), g = (h == null ? void 0 : h.length) || (d == null ? void 0 : d.length) || 0, v = () => p(n < g - 1 ? n + 1 : 0), u = () => p(n > 0 ? n - 1 : g - 1), w = X(() => {
     p(n < g - 1 ? n + 1 : 0);
   }, [n, g]);
   m2(() => {
     !f && !m && !(o != null && o.autoPlay) ? setInterval(() => w(), 1500) : o != null && o.autoPlay && setInterval(() => w(), o.autoPlay);
   }, [o == null ? void 0 : o.autoPlay, w, f, m]);
-  const [C, H] = O(null), $ = (G) => H(G.touches[0].clientX), y = (G) => {
+  const [C, H] = O(null), $ = (T) => H(T.touches[0].clientX), y = (T) => {
     if (C === null)
       return;
-    const T = C - G.touches[0].clientX;
-    T > 5 && v(), T < -5 && u(), H(null);
+    const V = C - T.touches[0].clientX;
+    V > 5 && v(), V < -5 && u(), H(null);
   }, R = !!(h && h.length > 1 || d && d.length > 1 && f), _ = !!(h && h.length > 1 || d && d.length > 1 && m);
   return /* @__PURE__ */ t.jsxs(
     d5,
@@ -16236,11 +16241,11 @@ const O3 = 24, B3 = 32, Y3 = ({
                       $active: n,
                       $speed: (o == null ? void 0 : o.speed) || 1e3,
                       $imgFit: r,
-                      children: d ? d.map((G, T) => /* @__PURE__ */ t.jsx(
+                      children: d ? d.map((T, V) => /* @__PURE__ */ t.jsx(
                         X2,
                         {
-                          src: G,
-                          alt: `Image slideshow ${T}`,
+                          src: T,
+                          alt: `Image slideshow ${V}`,
                           fit: r,
                           "data-testid": l && `${l}.SlideshowWrapper.SlideshowContentWrapper.SlideshowContent.Image`,
                           className: a && "SlideshowImage"
@@ -16282,7 +16287,7 @@ const O3 = 24, B3 = 32, Y3 = ({
 }, p5 = k.div`
     position: relative;
     width: 100%;
-    height: ${({ $height: l }) => D(l)};
+    height: ${({ $height: l }) => G(l)};
 
     ${({ $overlay: l }) => l && x`
             &:before {
@@ -16304,7 +16309,7 @@ const O3 = 24, B3 = 32, Y3 = ({
     position: fixed;
     top: 0;
     left: 0;
-`, n5 = k(o2)`
+`, n5 = k(z2)`
     position: relative;
     top: 0;
     left: 0;
@@ -16472,7 +16477,7 @@ const kd = ({
   $flexDirection: "column",
   $gap: "s"
 })}
-`, b5 = k(o2)`
+`, b5 = k(z2)`
     flex-grow: 1;
     overflow-y: scroll;
     ${s.HideScrollbar};
@@ -16614,7 +16619,7 @@ const Pt = ({
   hideScrollButton: r,
   ...f
 }) => {
-  const [m, o] = O(!1), z = d2(null), n = d2(null), p = () => {
+  const [m, o] = O(!1), z = i2(null), n = i2(null), p = () => {
     var v, u;
     if (z && z.current) {
       const w = (v = z == null ? void 0 : z.current) == null ? void 0 : v.scrollHeight, C = (u = z == null ? void 0 : z.current) == null ? void 0 : u.clientHeight, H = w - C;
@@ -16666,7 +16671,7 @@ const Pt = ({
           x5,
           {
             "data-testid": l && `${l}.ScrollButton`,
-            className: E(
+            className: D(
               {
                 MessagesListScrollButton: a
               },
@@ -16702,7 +16707,7 @@ const Pt = ({
   iconBaseUrl: f,
   ...m
 }) => {
-  const [o, z] = O(!1), n = q(
+  const [o, z] = O(!1), n = X(
     (v) => {
       h.setMessage(v.target.value), r(v.target.scrollHeight), v.target.value.length || r(32);
     },
@@ -16800,7 +16805,7 @@ const Pt = ({
 }) => {
   const g = n === "short" ? l0 : C6;
   return /* @__PURE__ */ t.jsxs(
-    o2,
+    z2,
     {
       "data-testid": l,
       ref: e,
@@ -16815,7 +16820,7 @@ const Pt = ({
           C5,
           {
             "data-testid": l && `${l}.Message`,
-            className: E(
+            className: D(
               { MessageText: a },
               A2(h)
             ),
@@ -16856,7 +16861,7 @@ const Pt = ({
             #message-container-scroll-button, 
             #messaging-form,
             #messaging-form-input {
-                --input-height: ${D(
+                --input-height: ${G(
     z >= 72 ? 72 : z
   )};
             }
@@ -17128,7 +17133,7 @@ const y5 = k.div`
     &.Visible {
         display: block;
     }
-`, A5 = k(o2).attrs({
+`, A5 = k(z2).attrs({
   gap: "xs",
   alignItems: "center",
   justifyContent: "space-between",
@@ -17207,7 +17212,7 @@ const Qt = ({
   editor: i,
   setEditor: r
 }) => /* @__PURE__ */ t.jsx(
-  o2,
+  z2,
   {
     "data-testid": l && `${l}.EditorContainer.ButtonsContainer.EditorButtonsContainer`,
     className: c && "EditorButtonsContainer",
@@ -17221,7 +17226,7 @@ const Qt = ({
         s3,
         {
           "data-testid": l && `${l}.EditorContainer.ButtonsContainer.EditorButtonsContainer.EditorButton`,
-          className: E(
+          className: D(
             { EditorButton: c },
             { Active: i === f.name }
           ),
@@ -17338,7 +17343,7 @@ const eh = ({
   maxLength: m,
   ...o
 }) => {
-  const z = q(
+  const z = X(
     (n) => {
       h(n.target.value), d(n.target.scrollHeight), n.target.value.length || d(250);
     },
@@ -17354,7 +17359,7 @@ const eh = ({
           $5,
           {
             "data-testid": l && `${l}.EditorContainer.ContainerGrid.Textarea`,
-            className: E(
+            className: D(
               { Textarea: e },
               {
                 Visible: a === "editorCode" || a === "editorLive"
@@ -17379,7 +17384,7 @@ const eh = ({
           I5,
           {
             "data-testid": l && `${l}.EditorContainer.ContainerGrid.MarkdownContent`,
-            className: E(
+            className: D(
               { MarkdownContent: e },
               {
                 Visible: a === "editorPreview" || a === "editorLive"
@@ -17416,13 +17421,13 @@ const eh = ({
   containerStyle: $,
   ...y
 }) => {
-  const [R, _] = O(o), [I, G] = O(250), T = d2(null), c2 = q(
-    (W) => {
-      var V;
-      const J = `${e}${W}`;
-      a(J), (V = T == null ? void 0 : T.current) == null || V.focus();
+  const [R, _] = O(o), [I, T] = O(250), V = i2(null), l2 = X(
+    (Q) => {
+      var E;
+      const W = `${e}${Q}`;
+      a(W), (E = V == null ? void 0 : V.current) == null || E.focus();
     },
-    [e, a, T]
+    [e, a, V]
   ), P = !!(n || p || g || v || u || w);
   return K2(`
             :root {
@@ -17461,7 +17466,7 @@ const eh = ({
                 className: z && "ButtonsContainer",
                 children: [
                   /* @__PURE__ */ t.jsxs(
-                    o2,
+                    z2,
                     {
                       "data-testid": l && `${l}.EditorContainer.ButtonsContainer.ActionButtonsContainer`,
                       className: z && "ActionButtonsContainer",
@@ -17475,8 +17480,8 @@ const eh = ({
                             showButtons: i,
                             className: z,
                             textButtonTitles: H,
-                            inputRef: T,
-                            addCode: c2
+                            inputRef: V,
+                            addCode: l2
                           }
                         ),
                         /* @__PURE__ */ t.jsx(
@@ -17488,7 +17493,7 @@ const eh = ({
                             icons: r,
                             iconsSizes: f,
                             iconsBaseUrl: m,
-                            addCode: c2
+                            addCode: l2
                           }
                         )
                       ]
@@ -17517,8 +17522,8 @@ const eh = ({
                 ref: c,
                 className: z,
                 editor: R,
-                setHeight: G,
-                inputRef: T,
+                setHeight: T,
+                inputRef: V,
                 setValue: a,
                 id: h,
                 value: e,
@@ -17804,7 +17809,7 @@ const Hd = ({
   className: h,
   ...d
 }) => {
-  const [i, r] = O(!0), f = d2(null);
+  const [i, r] = O(!0), f = i2(null);
   return m2(() => {
     new IntersectionObserver((o) => {
       o.forEach((z) => r(z.isIntersecting));
@@ -17815,7 +17820,7 @@ const Hd = ({
       "data-testid": l,
       ref: g2([e, f]),
       as: c,
-      className: E(h, { Visible: i }),
+      className: D(h, { Visible: i }),
       ...d,
       children: a
     }
@@ -17871,7 +17876,7 @@ const Cd = ({
     G5,
     {
       "data-testid": l,
-      className: E(e, { Visible: f }),
+      className: D(e, { Visible: f }),
       ref: c,
       icon: a,
       onClick: o,
@@ -18145,7 +18150,7 @@ const Cd = ({
     }
 `, Y5 = k.form`
     width: 100%;
-    max-width: ${({ $maxWidth: l }) => l && D(l)};
+    max-width: ${({ $maxWidth: l }) => l && G(l)};
 
     @media ${S.BREAKPOINT_MOBILE} {
         max-width: 100%;
@@ -18177,6 +18182,7 @@ const U3 = ({
     {
       "data-testid": l && `${l}.HeaderBurger`,
       ref: c,
+      role: "button",
       className: e && "HeaderBurger",
       isOpen: a,
       onClick: () => {
@@ -18270,57 +18276,59 @@ const U3 = ({
   }
 ), F3 = ({
   "data-testid": l,
-  className: c,
-  search: e,
-  isOpen: a,
-  children: h,
-  links: d,
-  headerHeight: i,
-  variant: r,
-  navMobileVariant: f,
-  burgerPosition: m,
-  burgerRef: o,
-  handleClose: z,
-  nav: n
+  role: c = "navigation",
+  className: e,
+  search: a,
+  isOpen: h,
+  children: d,
+  links: i,
+  headerHeight: r,
+  variant: f,
+  navMobileVariant: m,
+  burgerPosition: o,
+  burgerRef: z,
+  handleClose: n,
+  nav: p
 }) => {
-  const p = Z0(600), g = d2(null);
-  V2(g, (H) => {
-    var $;
-    ($ = o == null ? void 0 : o.current) != null && $.contains(H.target) || z();
+  const g = Z0(600), v = i2(null);
+  V2(v, ($) => {
+    var y;
+    typeof z == "object" && z !== null && "current" in z && ((y = z.current) != null && y.contains($.target)) || n();
   });
-  const v = d || h, u = p && e ? 32 : 0, w = d ? d.length * 24 + ([...v, u].length - 1) * 12 : 56, C = u + w;
+  const u = i || d, w = g && a ? 32 : 0, C = i ? i.length * 24 + ([...u, w].length - 1) * 12 : 56, H = w + C;
   return /* @__PURE__ */ t.jsxs(
     O5,
     {
       "data-testid": l && `${l}.HeaderNav`,
-      ref: g,
-      className: E({ HeaderNav: c }, { Open: a }),
-      $headerHeight: i,
-      $variant: r,
-      $burgerPosition: m,
-      $navMobileVariant: f,
-      $navHeight: C,
+      ref: v,
+      className: D({ HeaderNav: e }, { Open: h }),
+      role: c,
+      $headerHeight: r,
+      $variant: f,
+      $burgerPosition: o,
+      $navMobileVariant: m,
+      $navHeight: H,
       children: [
-        p && e && /* @__PURE__ */ t.jsx(
+        g && a && /* @__PURE__ */ t.jsx(
           T0,
           {
-            ...e,
+            ...a,
             "data-testid": l,
-            className: c,
-            handleClose: z
+            className: e,
+            handleClose: n
           }
         ),
-        d && d.map((H) => /* @__PURE__ */ t.jsx(
+        i && i.map(($) => /* @__PURE__ */ t.jsx(
           th,
           {
             "data-testid": l,
-            className: c,
-            link: H
+            className: e,
+            link: $
           },
           K()
         )),
-        h && h,
-        n && n
+        d && d,
+        p && p
       ]
     }
   );
@@ -18355,6 +18363,7 @@ const U3 = ({
         href: i,
         "data-testid": l && `${l}.HeaderLogo`,
         className: c && "HeaderLogo",
+        role: "link",
         children: /* @__PURE__ */ t.jsx(G0, { ...n })
       }
     ) : /* @__PURE__ */ t.jsx(
@@ -18363,6 +18372,7 @@ const U3 = ({
         "data-testid": l && `${l}.HeaderLogo`,
         className: c && "HeaderLogo",
         to: d,
+        role: "link",
         children: /* @__PURE__ */ t.jsx(G0, { ...n })
       }
     );
@@ -18376,6 +18386,8 @@ const U3 = ({
       to: d,
       href: i,
       translate: "no",
+      role: "link",
+      "aria-label": "Header Logo",
       children: a
     }
   );
@@ -18384,64 +18396,65 @@ const U3 = ({
   as: c,
   ref: e,
   children: a,
-  className: h,
-  logo: d,
-  variant: i = "primary",
-  burgerPosition: r = "right",
-  navDesktopVariant: f = "right",
-  navMobileVariant: m = "drawer",
-  search: o,
-  position: z = "relative",
-  hideOnScroll: n,
-  links: p,
-  nav: g,
-  enableScrollingOpen: v,
-  backgroundColor: u = "primary",
-  textColor: w = "background",
-  linkColor: C = "white",
-  ...H
+  role: h = "navigation",
+  className: d,
+  logo: i,
+  variant: r = "primary",
+  burgerPosition: f = "right",
+  navDesktopVariant: m = "right",
+  navMobileVariant: o = "drawer",
+  search: z,
+  position: n = "relative",
+  hideOnScroll: p,
+  links: g,
+  nav: v,
+  enableScrollingOpen: u,
+  backgroundColor: w = "primary",
+  textColor: C = "background",
+  linkColor: H = "white",
+  ...$
 }) => {
-  const [$, y] = O(!1), R = () => {
-    v || P0(), y(!0);
-  }, _ = () => {
-    v || b0(), setTimeout(() => y(!1), 10);
-  }, I = Z0(600), G = typeof d == "object" ? d : void 0, W = [(G == null ? void 0 : G.height) || 30, 32, 35].sort(), V = W[W.length - 1] + 16 * 2, [Z, X] = O(!1), h2 = typeof n == "boolean" ? 400 : n;
+  const [y, R] = O(!1), _ = () => {
+    u || P0(), R(!0);
+  }, I = () => {
+    u || b0(), setTimeout(() => R(!1), 10);
+  }, T = Z0(600), V = typeof i == "object" ? i : void 0, W = [(V == null ? void 0 : V.height) || 30, 32, 35].sort(), Z = W[W.length - 1] + 16 * 2, [c2, h2] = O(!1), o2 = typeof p == "boolean" ? 400 : p;
   m2(() => {
-    h2 && (window.pageYOffset >= h2 ? X(!0) : X(!1), window.addEventListener("scroll", () => {
-      window.pageYOffset >= h2 ? X(!0) : X(!1);
+    o2 && (window.pageYOffset >= o2 ? h2(!0) : h2(!1), window.addEventListener("scroll", () => {
+      window.pageYOffset >= o2 ? h2(!0) : h2(!1);
     }));
-  }, [h2]);
-  const z2 = d2(null);
+  }, [o2]);
+  const L = i2(null);
   t0("Escape", () => {
-    $ && _();
+    y && I();
   });
-  const L = {
+  const Y = {
     "data-testid": l,
-    className: h,
-    isOpen: $,
-    navMobileVariant: m,
-    variant: i,
-    ref: z2,
-    handleOpen: R,
-    handleClose: _
-  }, Y = {
+    className: d,
+    isOpen: y,
+    navMobileVariant: o,
+    variant: r,
+    ref: L,
+    handleOpen: _,
+    handleClose: I
+  }, e2 = {
     "data-testid": l,
-    className: h,
-    search: o,
-    isOpen: $,
-    handleClose: _,
-    links: p,
+    className: d,
+    search: z,
+    isOpen: y,
+    handleClose: I,
+    links: g,
     children: a,
-    headerHeight: V,
-    variant: i,
-    navMobileVariant: m,
-    burgerPosition: r,
-    burgerRef: z2
-  }, e2 = {
+    headerHeight: Z,
+    variant: r,
+    navMobileVariant: o,
+    burgerPosition: f,
+    burgerRef: L
+  }, d2 = {
     "data-testid": l,
-    className: h,
-    search: o,
-    handleClose: _
+    className: d,
+    search: z,
+    handleClose: I
   };
   return /* @__PURE__ */ t.jsxs(
     T5,
@@ -18449,46 +18462,47 @@ const U3 = ({
       "data-testid": l,
       ref: e,
       as: c,
-      className: E(
-        h,
-        { Hidden: Z },
-        { Open: $ }
+      className: D(
+        d,
+        { Hidden: c2 },
+        { Open: y }
       ),
-      $burgerPosition: r,
-      $headerHeight: V,
-      $position: z,
-      $variant: i,
-      $backgroundColor: u,
-      $linkColor: C,
-      $textColor: w,
-      ...H,
+      role: h,
+      $burgerPosition: f,
+      $headerHeight: Z,
+      $position: n,
+      $variant: r,
+      $backgroundColor: w,
+      $linkColor: H,
+      $textColor: C,
+      ...$,
       children: [
-        r === "left" && /* @__PURE__ */ t.jsx(U3, { ...L }),
+        f === "left" && /* @__PURE__ */ t.jsx(U3, { ...Y }),
         /* @__PURE__ */ t.jsx(
           hh,
           {
             "data-testid": l,
-            className: h,
-            logo: d,
-            isOpen: $,
-            children: typeof d == "object" ? d.text : d
+            className: d,
+            logo: i,
+            isOpen: y,
+            children: typeof i == "object" ? i.text : i
           }
         ),
-        f === "left" && /* @__PURE__ */ t.jsx(F3, { ...Y }),
-        !I && f === "right" && /* @__PURE__ */ t.jsx(T0, { ...e2 }),
-        r === "right" && /* @__PURE__ */ t.jsx(U3, { ...L }),
-        f === "right" && /* @__PURE__ */ t.jsx(F3, { ...Y }),
-        I && m === "drawer" && /* @__PURE__ */ t.jsx(
+        m === "left" && /* @__PURE__ */ t.jsx(F3, { ...e2 }),
+        !T && m === "right" && /* @__PURE__ */ t.jsx(T0, { ...d2 }),
+        f === "right" && /* @__PURE__ */ t.jsx(U3, { ...Y }),
+        m === "right" && /* @__PURE__ */ t.jsx(F3, { ...e2 }),
+        T && o === "drawer" && /* @__PURE__ */ t.jsx(
           B5,
           {
-            onClick: () => y(!1),
-            className: E(
-              { HeaderOverlay: h },
-              { Visible: $ }
+            onClick: () => R(!1),
+            className: D(
+              { HeaderOverlay: d },
+              { Visible: y }
             )
           }
         ),
-        !I && f === "left" && /* @__PURE__ */ t.jsx(T0, { ...e2 })
+        !T && m === "left" && /* @__PURE__ */ t.jsx(T0, { ...d2 })
       ]
     }
   );
@@ -18603,7 +18617,7 @@ const ih = ({
   iconBaseUrl: n,
   ...p
 }) => {
-  const [g, v] = O(!1), u = d2(null);
+  const [g, v] = O(!1), u = i2(null);
   return V2(u, () => {
     g && v(!1);
   }), /* @__PURE__ */ t.jsxs(
@@ -18642,7 +18656,7 @@ const ih = ({
               F5,
               {
                 "data-testid": l && `${l}.OpenButton.Icon`,
-                className: E(
+                className: D(
                   { OpenIcon: h },
                   { Open: g }
                 )
@@ -18656,7 +18670,7 @@ const ih = ({
           ih,
           {
             "data-testid": w["data-testid"] || l && `${l}.Item`,
-            className: E(
+            className: D(
               w.className,
               { IconMenuItem: h },
               { Open: g }
@@ -18733,7 +18747,7 @@ const ih = ({
     object-position: left center;
 `, X5 = k(F).attrs({ tag: "strong" })`
     color: ${({ theme: l }) => l.Primary500};
-`, q5 = k(o2).attrs({
+`, q5 = k(z2).attrs({
   alignItems: "center",
   justifyContent: "center",
   gap: "xs",
@@ -18887,7 +18901,7 @@ const fh = ({
         visibility: visible;
     }
 `, c6 = k.div`
-    width: ${({ $width: l }) => D(l)};
+    width: ${({ $width: l }) => G(l)};
     height: 100%;
     background-color: ${({ $backgroundColor: l, theme: c }) => s.AllColors(l, c)};
     color: ${({ $contentColor: l, theme: c }) => s.AllColors(l, c)};
@@ -18982,7 +18996,7 @@ const Ad = ({
       "data-testid": l,
       ref: e,
       as: c,
-      className: E(h, { Open: d }),
+      className: D(h, { Open: d }),
       $zIndex: g,
       ...C,
       children: [
@@ -18991,7 +19005,7 @@ const Ad = ({
           {
             "data-testid": l && `${l}.Overlay`,
             onClick: H,
-            className: E(
+            className: D(
               { DrawerOverlay: h },
               { Open: d }
             ),
@@ -19002,7 +19016,7 @@ const Ad = ({
           c6,
           {
             "data-testid": l && `${l}.Content`,
-            className: E(
+            className: D(
               { DrawerContent: h },
               { Open: d }
             ),
@@ -19073,8 +19087,8 @@ const Ad = ({
         cursor: grabbing;
     }
 `, t6 = k.span`
-    width: ${({ $size: l }) => D(l)};
-    height: ${({ $size: l }) => D(l)};
+    width: ${({ $size: l }) => G(l)};
+    height: ${({ $size: l }) => G(l)};
     color: ${({ theme: l }) => l.GRAY_500};
     ${s.Flexbox({
   $alignItems: "center",
@@ -19232,7 +19246,7 @@ const sh = ({
   hideSeparator: g,
   ...v
 }) => {
-  const [u, w] = O(-1), C = d2(null), H = (y, R) => {
+  const [u, w] = O(-1), C = i2(null), H = (y, R) => {
     const { target: _ } = y;
     w(R), C && C.current && (C.current = _, y.dataTransfer.effectAllowed = "move", _ instanceof HTMLElement && y.dataTransfer.setData("text/html", _.outerHTML));
   }, $ = (y, R) => {
@@ -19752,28 +19766,28 @@ const ph = ({
   setIsOpen: p,
   inputBackground: g
 }) => {
-  const [v, u] = O((/* @__PURE__ */ new Date()).getMonth()), [w, C] = O((/* @__PURE__ */ new Date()).getFullYear()), H = h != null && h.weekDays ? Object.values(h == null ? void 0 : h.weekDays) : Object.values(oh), $ = h != null && h.months ? Object.values(h.months) : Object.values(zh), y = (V, Z) => new Date(V, Z + 1, 0).getDate(), R = (V, Z) => {
-    const X = Math.abs((Z - V) / 1), { result: h2 } = Array.from({ length: X }).reduce(
-      ({ result: z2, current: L }) => ({
-        result: [...z2, L],
+  const [v, u] = O((/* @__PURE__ */ new Date()).getMonth()), [w, C] = O((/* @__PURE__ */ new Date()).getFullYear()), H = h != null && h.weekDays ? Object.values(h == null ? void 0 : h.weekDays) : Object.values(oh), $ = h != null && h.months ? Object.values(h.months) : Object.values(zh), y = (E, Z) => new Date(E, Z + 1, 0).getDate(), R = (E, Z) => {
+    const c2 = Math.abs((Z - E) / 1), { result: h2 } = Array.from({ length: c2 }).reduce(
+      ({ result: o2, current: L }) => ({
+        result: [...o2, L],
         current: L + 1
       }),
-      { result: [], current: V }
+      { result: [], current: E }
     );
     return h2;
   }, _ = () => {
-    v > 0 ? u((V) => V - 1) : (u(11), C((V) => V - 1));
+    v > 0 ? u((E) => E - 1) : (u(11), C((E) => E - 1));
   }, I = () => {
-    v < 11 ? u((V) => V + 1) : (u(0), C((V) => V + 1));
-  }, G = R(
+    v < 11 ? u((E) => E + 1) : (u(0), C((E) => E + 1));
+  }, T = R(
     1,
     y(w, v) + 1
-  ), T = () => G.map(
+  ), V = () => T.map(
     (Z) => (/* @__PURE__ */ new Date(
       `${w}/${v + 1}/${Z}`
     )).toLocaleDateString("en-EN", { weekday: "long" })
-  )[0], c2 = (V) => {
-    const Z = V.target;
+  )[0], l2 = (E) => {
+    const Z = E.target;
     Z.id.includes("day-") && i(
       $6(
         new Date(
@@ -19783,20 +19797,20 @@ const ph = ({
         )
       )
     ), p(!1);
-  }, P = (V, Z, X) => `${V}/${Z}/${X}`, W = P(
+  }, P = (E, Z, c2) => `${E}/${Z}/${c2}`, Q = P(
     (/* @__PURE__ */ new Date()).getFullYear(),
     (/* @__PURE__ */ new Date()).getMonth() + 1,
     (/* @__PURE__ */ new Date()).getDate()
-  ), J = (V, Z) => new Date(
+  ), W = (E, Z) => new Date(
     w,
     Z ? Z + v : v,
-    V
+    E
   ).getTime();
   return /* @__PURE__ */ t.jsxs(
     m6,
     {
       "data-testid": l && `${l}.Calendar`,
-      className: E({ Open: n }, { Calendar: c }),
+      className: D({ Open: n }, { Calendar: c }),
       $direction: o,
       $validationStatus: z == null ? void 0 : z.status,
       $inputBackground: g,
@@ -19815,7 +19829,7 @@ const ph = ({
                   "data-testid": l && `${l}.Calendar.Header.NavButton.Prev`,
                   className: c && "CalendarNavButton",
                   onClick: _,
-                  disabled: !!(e && new Date(e).getTime() > J(1, 0)),
+                  disabled: !!(e && new Date(e).getTime() > W(1, 0)),
                   type: "button",
                   $validationStatus: z == null ? void 0 : z.status,
                   $inputBackground: g,
@@ -19853,7 +19867,7 @@ const ph = ({
                   "data-testid": l && `${l}.Calendar.Header.NavButton.Next`,
                   className: c && "CalendarNavButton",
                   onClick: I,
-                  disabled: !!(a && new Date(a).getTime() < J(0, 1)),
+                  disabled: !!(a && new Date(a).getTime() < W(0, 1)),
                   type: "button",
                   $validationStatus: z == null ? void 0 : z.status,
                   $inputBackground: g,
@@ -19886,51 +19900,51 @@ const ph = ({
             className: c && "DaysContainer",
             $inputBackground: g,
             children: [
-              H.map((V) => /* @__PURE__ */ t.jsx(
+              H.map((E) => /* @__PURE__ */ t.jsx(
                 F,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.Day`,
                   className: c && "WeekDay",
                   tag: "strong",
-                  children: V.slice(0, 3)
+                  children: E.slice(0, 3)
                 },
                 K()
               )),
-              T() === "Tuesday" ? /* @__PURE__ */ t.jsx(
+              V() === "Tuesday" ? /* @__PURE__ */ t.jsx(
                 U2,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.EmptyDay`,
                   className: c && "EmptyDay"
                 }
-              ) : T() === "Wednesday" ? [...Array(2)].map(() => /* @__PURE__ */ t.jsx(
+              ) : V() === "Wednesday" ? [...Array(2)].map(() => /* @__PURE__ */ t.jsx(
                 U2,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.EmptyDay`,
                   className: c && "EmptyDay"
                 },
                 K()
-              )) : T() === "Thursday" ? [...Array(3)].map(() => /* @__PURE__ */ t.jsx(
+              )) : V() === "Thursday" ? [...Array(3)].map(() => /* @__PURE__ */ t.jsx(
                 U2,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.EmptyDay`,
                   className: c && "EmptyDay"
                 },
                 K()
-              )) : T() === "Friday" ? [...Array(4)].map(() => /* @__PURE__ */ t.jsx(
+              )) : V() === "Friday" ? [...Array(4)].map(() => /* @__PURE__ */ t.jsx(
                 U2,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.EmptyDay`,
                   className: c && "EmptyDay"
                 },
                 K()
-              )) : T() === "Saturday" ? [...Array(5)].map(() => /* @__PURE__ */ t.jsx(
+              )) : V() === "Saturday" ? [...Array(5)].map(() => /* @__PURE__ */ t.jsx(
                 U2,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.EmptyDay`,
                   className: c && "EmptyDay"
                 },
                 K()
-              )) : T() === "Sunday" ? [...Array(6)].map(() => /* @__PURE__ */ t.jsx(
+              )) : V() === "Sunday" ? [...Array(6)].map(() => /* @__PURE__ */ t.jsx(
                 U2,
                 {
                   "data-testid": l && `${l}.Calendar.DaysContainer.EmptyDay`,
@@ -19938,12 +19952,12 @@ const ph = ({
                 },
                 K()
               )) : null,
-              G.map((V) => {
+              T.map((E) => {
                 const Z = P(
                   w,
                   v + 1,
-                  V
-                ), X = d ? P(
+                  E
+                ), c2 = d ? P(
                   new Date(d).getFullYear(),
                   new Date(d).getMonth() + 1,
                   new Date(d).getDate()
@@ -19952,18 +19966,18 @@ const ph = ({
                   z6,
                   {
                     "data-testid": l && `${l}.Calendar.DaysContainer.CalendarDay`,
-                    className: E(
-                      { Today: Z === W },
-                      { Active: Z === X },
+                    className: D(
+                      { Today: Z === Q },
+                      { Active: Z === c2 },
                       { CalendarDay: c }
                     ),
-                    id: `day-${V}`,
-                    onClick: c2,
-                    disabled: e && new Date(e).getTime() > J(V + 1, 0) ? !0 : !!(a && new Date(a).getTime() < J(V, 0)),
+                    id: `day-${E}`,
+                    onClick: l2,
+                    disabled: e && new Date(e).getTime() > W(E + 1, 0) ? !0 : !!(a && new Date(a).getTime() < W(E, 0)),
                     type: "button",
                     $inputBackground: g,
                     $validationStatus: z == null ? void 0 : z.status,
-                    children: V
+                    children: E
                   },
                   K()
                 );
@@ -20000,14 +20014,14 @@ const ph = ({
   containerStyle: R,
   inputAndListContainerStyle: _,
   prefix: I,
-  ...G
+  ...T
 }) => {
-  const [T, c2] = O(!1), P = d2(null);
-  V2(P, () => c2(!1));
-  const J = !!(w || C || H || $ || y), V = () => {
-    if (!g) c2(!0);
+  const [V, l2] = O(!1), P = i2(null);
+  V2(P, () => l2(!1));
+  const W = !!(w || C || H || $ || y), E = () => {
+    if (!g) l2(!0);
     else return;
-  }, Z = (X) => r(X.target.value);
+  }, Z = (c2) => r(c2.target.value);
   return /* @__PURE__ */ t.jsx(
     b2,
     {
@@ -20022,7 +20036,7 @@ const ph = ({
       className: e,
       iconBaseUrl: o,
       style: R,
-      hasListOpen: T,
+      hasListOpen: V,
       counter: void 0,
       maxLength: void 0,
       children: /* @__PURE__ */ t.jsxs(
@@ -20030,8 +20044,8 @@ const ph = ({
         {
           "data-testid": l,
           className: e,
-          hasListOpen: T,
-          isParent: !J,
+          hasListOpen: V,
+          isParent: !W,
           ref: P,
           inputAndListContainerStyle: _,
           children: [
@@ -20044,7 +20058,7 @@ const ph = ({
                 inputBackground: p,
                 inputVariant: n,
                 validationStatus: y == null ? void 0 : y.status,
-                hasListOpen: T,
+                hasListOpen: V,
                 hasContainer: !0,
                 children: [
                   ((f == null ? void 0 : f.left) || I) && /* @__PURE__ */ t.jsxs(
@@ -20086,8 +20100,8 @@ const ph = ({
                       "data-testid": l && `${l}.InputWrapper.InputDate`,
                       className: e && "InputDate",
                       ref: c,
-                      onClick: V,
-                      onFocus: V,
+                      onClick: E,
+                      onFocus: E,
                       tabIndex: v,
                       value: l0(i),
                       onChange: Z,
@@ -20096,7 +20110,7 @@ const ph = ({
                       $validationStatus: y == null ? void 0 : y.status,
                       $inputBackground: p,
                       $disabled: g,
-                      ...G
+                      ...T
                     }
                   ),
                   /* @__PURE__ */ t.jsxs(
@@ -20122,7 +20136,7 @@ const ph = ({
                               }
                             ),
                             iconSize: m == null ? void 0 : m.calendar,
-                            onClick: V,
+                            onClick: E,
                             "aria-label": "Calendar",
                             disabled: g,
                             inputBackground: p,
@@ -20160,8 +20174,8 @@ const ph = ({
                 calendarDirection: z,
                 validation: y,
                 inputBackground: p,
-                isOpen: T,
-                setIsOpen: c2
+                isOpen: V,
+                setIsOpen: l2
               }
             )
           ]
@@ -20216,26 +20230,26 @@ const Id = ({
   value: R,
   setValue: _,
   prefix: I,
-  disabled: G,
-  tabIndex: T,
-  ...c2
+  disabled: T,
+  tabIndex: V,
+  ...l2
 }) => {
-  const P = !!(m || o || z || n || p), W = d2(null);
-  let J = Object.keys(H === "30min" ? i0.halfHours : H === "15min" ? i0.quarterHours : H === "1min" ? i0.minutes : i0.hours);
-  $ && (J = J.splice(
-    J.indexOf(J.find((l2) => l2 === $)),
-    J.length - 1
-  )), y && (J = J.splice(0, J.indexOf(y) + 1));
-  const { isOpen: V, setIsOpen: Z, cursor: X, listRef: h2 } = F0({
-    data: J,
+  const P = !!(m || o || z || n || p), Q = i2(null);
+  let W = Object.keys(H === "30min" ? i0.halfHours : H === "15min" ? i0.quarterHours : H === "1min" ? i0.minutes : i0.hours);
+  $ && (W = W.splice(
+    W.indexOf(W.find((J) => J === $)),
+    W.length - 1
+  )), y && (W = W.splice(0, W.indexOf(y) + 1));
+  const { isOpen: E, setIsOpen: Z, cursor: c2, listRef: h2 } = F0({
+    data: W,
     value: R,
     setValue: _
-  }), z2 = () => {
-    V && Z(!1), Z(!0);
-  }, L = () => Z(!0), Y = () => Z(!1), e2 = (l2) => _(
-    l2.target.value
-  ), i2 = (l2) => {
-    _(l2), Y();
+  }), o2 = () => {
+    E && Z(!1), Z(!0);
+  }, L = () => Z(!0), Y = () => Z(!1), e2 = (J) => _(
+    J.target.value
+  ), d2 = (J) => {
+    _(J), Y();
   };
   return V2(h2, Y), /* @__PURE__ */ t.jsx(
     b2,
@@ -20251,7 +20265,7 @@ const Id = ({
       className: e,
       iconBaseUrl: d,
       style: u,
-      hasListOpen: V,
+      hasListOpen: E,
       counter: void 0,
       maxLength: void 0,
       children: /* @__PURE__ */ t.jsxs(
@@ -20259,9 +20273,9 @@ const Id = ({
         {
           "data-testid": l,
           className: e,
-          hasListOpen: V,
+          hasListOpen: E,
           isParent: !P,
-          ref: W,
+          ref: Q,
           inputAndListContainerStyle: w,
           children: [
             /* @__PURE__ */ t.jsxs(
@@ -20273,7 +20287,7 @@ const Id = ({
                 inputBackground: g,
                 inputVariant: v,
                 validationStatus: p == null ? void 0 : p.status,
-                hasListOpen: V,
+                hasListOpen: E,
                 hasContainer: !0,
                 children: [
                   (a || I) && /* @__PURE__ */ t.jsxs(
@@ -20281,7 +20295,7 @@ const Id = ({
                     {
                       "data-testid": l,
                       className: e,
-                      disabled: G,
+                      disabled: T,
                       children: [
                         I && /* @__PURE__ */ t.jsx(
                           E2,
@@ -20300,7 +20314,7 @@ const Id = ({
                             icon: a,
                             iconSize: h,
                             validationStatus: p == null ? void 0 : p.status,
-                            disabled: G,
+                            disabled: T,
                             inputBackground: g,
                             inputVariant: v,
                             iconBaseUrl: d
@@ -20315,17 +20329,17 @@ const Id = ({
                       "data-testid": l && `${l}.InputWrapper.InputTime`,
                       className: e && "InputTime",
                       ref: c,
-                      onClick: z2,
+                      onClick: o2,
                       onFocus: L,
-                      tabIndex: T,
+                      tabIndex: V,
                       value: R,
                       onChange: e2,
-                      disabled: G,
-                      $disabled: G,
+                      disabled: T,
+                      $disabled: T,
                       $validationStatus: p == null ? void 0 : p.status,
                       $inputBackground: g,
                       $inputVariant: v,
-                      ...c2
+                      ...l2
                     }
                   ),
                   /* @__PURE__ */ t.jsxs(
@@ -20333,7 +20347,7 @@ const Id = ({
                     {
                       "data-testid": l,
                       className: e,
-                      disabled: G,
+                      disabled: T,
                       withBorder: !1,
                       withPadding: !0,
                       children: [
@@ -20344,9 +20358,9 @@ const Id = ({
                             className: e,
                             icon: r,
                             iconSize: i,
-                            onClick: z2,
+                            onClick: o2,
                             "aria-label": "Calendar",
-                            disabled: G,
+                            disabled: T,
                             inputBackground: g,
                             validationStatus: p == null ? void 0 : p.status
                           }
@@ -20375,21 +20389,21 @@ const Id = ({
                 inputBackground: g,
                 inputVariant: v,
                 validationStatus: p == null ? void 0 : p.status,
-                isOpen: !!(R && V),
+                isOpen: !!(R && E),
                 ref: h2,
-                children: J.map((l2, f2) => /* @__PURE__ */ t.jsx(
+                children: W.map((J, f2) => /* @__PURE__ */ t.jsx(
                   W2,
                   {
                     "data-testid": l,
                     className: e,
                     validationStatus: p == null ? void 0 : p.status,
                     inputBackground: g,
-                    onClick: () => i2(l2),
-                    isActive: f2 === X,
-                    isHovered: R === l2,
-                    children: l2
+                    onClick: () => d2(J),
+                    isActive: f2 === c2,
+                    isHovered: R === J,
+                    children: J
                   },
-                  l2
+                  J
                 ))
               }
             )
@@ -20462,7 +20476,7 @@ export {
   Hd as Fade,
   Q0 as Fallback,
   _d as Fieldset,
-  o2 as Flexbox,
+  z2 as Flexbox,
   mh as Footer,
   hd as Form,
   Yh as FullBleed,