npm - @snmt-react-ui/async-select - Versions diffs - 1.2.7 → 1.3.1 - Mend

@snmt-react-ui/async-select 1.2.7 → 1.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/dist/async-select.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import "./index.css";
-import { jsx as t, jsxs as c, Fragment as E } from "react/jsx-runtime";
-import { createContext as O, forwardRef as b, useState as v, useRef as X, useEffect as R, useContext as z, useCallback as P } from "react";
-import { Select as C1, Flex as w1, Avatar as k1, Checkbox as g1, Typography as e1, Tag as o1, Popover as p1 } from "antd";
+import { jsx as t, jsxs as c, Fragment as W } from "react/jsx-runtime";
+import { createContext as O, forwardRef as b, useState as v, useRef as e1, useEffect as R, useContext as q, useCallback as $ } from "react";
+import { Select as w1, Flex as k1, Avatar as g1, Checkbox as p1, Typography as o1, Tag as i1, Popover as L1 } from "antd";
 const K = ({
   children: i,
   direction: o = "row",
@@ -12,7 +12,7 @@ const K = ({
   gap: g,
   padding: s
 }) => /* @__PURE__ */ t(
-  w1,
+  k1,
   {
     className: `snmt-flex${e === "inherit" ? " inherit" : ""}`,
     vertical: o === "column",
@@ -24,26 +24,27 @@ const K = ({
     style: { padding: s },
     children: i
   }
-), L1 = ({ shape: i = "circle", size: o = 32, children: e, ...l }) => {
+), m1 = ({ shape: i = "circle", size: o = 32, children: e, ...l }) => {
   const r = typeof l.src == "string";
   return /* @__PURE__ */ t(
-    k1,
+    g1,
     {
       className: `snmt-avatar ${r ? "image" : ""}`,
       shape: i,
       size: o,
+      style: { minWidth: o, minHeight: o },
       ...l,
       children: e
     }
   );
 };
-var V = /* @__PURE__ */ ((i) => (i.GREY_LIGHT_0 = "var(--grey-light-0)", i.GREY_LIGHT_1 = "var(--grey-light-1)", i.GREY_LIGHT_2 = "var(--grey-light-2)", i.GREY_LIGHT_3 = "var(--grey-light-3)", i.GREY_LIGHT_4 = "var(--grey-light-4)", i.GREY_DARK_1 = "var(--grey-dark-1)", i.GREY_DARK_2 = "var(--grey-dark-2)", i.GREY_DARK_3 = "var(--grey-dark-3)", i.GREY_DARK_4 = "var(--grey-dark-4)", i.GREY_DARK_5 = "var(--grey-dark-5)", i.BLUE_PRIMARY = "var(--blue-primary)", i.BLUE_HOVER = "var(--blue-hover)", i.BLUE_LIGHT_1 = "var(--blue-light-1)", i.BLUE_LIGHT_2 = "var(--blue-light-2)", i.BLUE_LIGHT_3 = "var(--blue-light-3)", i.BLUE_LIGHT_4 = "var(--blue-light-4)", i.BLUE_DARK_1 = "var(--blue-dark-1)", i.PURPLE_LIGHT = "var(--purple-light)", i.PURPLE_DARK = "var(--purple-dark)", i.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", i.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", i.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", i.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", i.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", i.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", i.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", i))(V || {});
-const i1 = O({
+var Z = /* @__PURE__ */ ((i) => (i.GREY_LIGHT_0 = "var(--grey-light-0)", i.GREY_LIGHT_1 = "var(--grey-light-1)", i.GREY_LIGHT_2 = "var(--grey-light-2)", i.GREY_LIGHT_3 = "var(--grey-light-3)", i.GREY_LIGHT_4 = "var(--grey-light-4)", i.GREY_DARK_1 = "var(--grey-dark-1)", i.GREY_DARK_2 = "var(--grey-dark-2)", i.GREY_DARK_3 = "var(--grey-dark-3)", i.GREY_DARK_4 = "var(--grey-dark-4)", i.GREY_DARK_5 = "var(--grey-dark-5)", i.BLUE_PRIMARY = "var(--blue-primary)", i.BLUE_HOVER = "var(--blue-hover)", i.BLUE_LIGHT_1 = "var(--blue-light-1)", i.BLUE_LIGHT_2 = "var(--blue-light-2)", i.BLUE_LIGHT_3 = "var(--blue-light-3)", i.BLUE_LIGHT_4 = "var(--blue-light-4)", i.BLUE_DARK_1 = "var(--blue-dark-1)", i.PURPLE_LIGHT = "var(--purple-light)", i.PURPLE_DARK = "var(--purple-dark)", i.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", i.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", i.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", i.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", i.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", i.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", i.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", i))(Z || {});
+const t1 = O({
   locale: "en",
   theme: "light"
 });
-i1.Provider;
-const m1 = ({
+t1.Provider;
+const v1 = ({
   checked: i = !0,
   indeterminate: o = !1,
   children: e,
@@ -55,9 +56,9 @@ const m1 = ({
   R(() => {
     s(i), k(o);
   }, [i, o]);
-  const { theme: n } = z(i1);
+  const { theme: n } = q(t1);
   return /* @__PURE__ */ t(
-    g1,
+    p1,
     {
       className: `snmt-checkbox snmt-checkbox-${n}`,
       checked: g,
@@ -71,12 +72,12 @@ const m1 = ({
   );
 };
 var d = /* @__PURE__ */ ((i) => (i.GREY_LIGHT_0 = "var(--grey-light-0)", i.GREY_LIGHT_1 = "var(--grey-light-1)", i.GREY_LIGHT_2 = "var(--grey-light-2)", i.GREY_LIGHT_3 = "var(--grey-light-3)", i.GREY_LIGHT_4 = "var(--grey-light-4)", i.GREY_DARK_1 = "var(--grey-dark-1)", i.GREY_DARK_2 = "var(--grey-dark-2)", i.GREY_DARK_3 = "var(--grey-dark-3)", i.GREY_DARK_4 = "var(--grey-dark-4)", i.GREY_DARK_5 = "var(--grey-dark-5)", i.BLUE_PRIMARY = "var(--blue-primary)", i.BLUE_HOVER = "var(--blue-hover)", i.BLUE_LIGHT_1 = "var(--blue-light-1)", i.BLUE_LIGHT_2 = "var(--blue-light-2)", i.BLUE_LIGHT_3 = "var(--blue-light-3)", i.BLUE_LIGHT_4 = "var(--blue-light-4)", i.BLUE_DARK_1 = "var(--blue-dark-1)", i.PURPLE_LIGHT = "var(--purple-light)", i.PURPLE_DARK = "var(--purple-dark)", i.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", i.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", i.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", i.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", i.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", i.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", i.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", i))(d || {});
-const t1 = O({
+const l1 = O({
   locale: "en",
   theme: "light"
 });
-t1.Provider;
-const v1 = ({
+l1.Provider;
+const u1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -103,7 +104,7 @@ const v1 = ({
       }
     )
   }
-), u1 = ({
+), N1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -130,7 +131,7 @@ const v1 = ({
       }
     )
   }
-), N1 = ({
+), f1 = ({
   width: i = 16,
   height: o = 16,
   color: e = "#001E52",
@@ -158,7 +159,7 @@ const v1 = ({
       )
     ]
   }
-), f1 = ({
+), M1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -193,7 +194,7 @@ const v1 = ({
       )
     ]
   }
-), M1 = ({
+), x1 = ({
   width: i = 18,
   height: o = 18,
   color: e = "#001E52",
@@ -232,7 +233,7 @@ const v1 = ({
       )
     ]
   }
-), x1 = ({
+), _1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -258,7 +259,7 @@ const v1 = ({
       }
     )
   }
-), _1 = ({
+), R1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -279,7 +280,7 @@ const v1 = ({
       /* @__PURE__ */ t("path", { d: "M16 4L4 16", stroke: e, strokeWidth: "1.5", strokeLinecap: "round" })
     ]
   }
-), R1 = ({
+), H1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -311,7 +312,7 @@ const v1 = ({
       )
     ]
   }
-), H1 = ({
+), V1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -365,7 +366,7 @@ const v1 = ({
       )
     ]
   }
-), V1 = ({
+), E1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -404,7 +405,7 @@ const v1 = ({
       /* @__PURE__ */ t("path", { d: "M3 12L17 12", stroke: e, strokeWidth: "2", strokeLinecap: "round" })
     ]
   }
-), E1 = ({
+), Z1 = ({
   width: i = 16,
   height: o = 12,
   color: e = "#001E52",
@@ -453,7 +454,7 @@ const v1 = ({
       )
     ] })
   }
-), Z1 = ({
+), W1 = ({
   width: i = 16,
   height: o = 16,
   color: e = "#001E52",
@@ -487,7 +488,7 @@ const v1 = ({
       )
     ]
   }
-), W1 = ({
+), I1 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#001E52",
@@ -526,7 +527,7 @@ const v1 = ({
       )
     ] })
   }
-), I1 = ({
+), B1 = ({
   width: i = 16,
   height: o = 16,
   color: e = "#001E52",
@@ -562,7 +563,7 @@ const v1 = ({
       )
     ]
   }
-), B1 = ({
+), A1 = ({
   width: i = 11,
   height: o = 32,
   color: e = "#001E52",
@@ -600,7 +601,7 @@ const v1 = ({
       /* @__PURE__ */ t("circle", { cx: "3", cy: "3", r: "3", fill: e })
     ]
   }
-), A1 = ({
+), G1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -647,7 +648,7 @@ const v1 = ({
       )
     ]
   }
-), G1 = ({
+), D1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -680,7 +681,7 @@ const v1 = ({
       )
     ]
   }
-), D1 = ({
+), j1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -727,7 +728,7 @@ const v1 = ({
       )
     ]
   }
-), j1 = ({
+), T1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -760,7 +761,7 @@ const v1 = ({
       )
     ]
   }
-), T1 = ({
+), y1 = ({
   width: i = 18,
   height: o = 16,
   color: e = "#001E52",
@@ -832,7 +833,7 @@ const v1 = ({
       )
     ]
   }
-), y1 = ({
+), K1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -856,7 +857,7 @@ const v1 = ({
       }
     )
   }
-), K1 = ({
+), O1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -903,7 +904,7 @@ const v1 = ({
       )
     ]
   }
-), O1 = ({
+), b1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -936,7 +937,7 @@ const v1 = ({
       )
     ]
   }
-), b1 = ({
+), F1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -969,7 +970,7 @@ const v1 = ({
       )
     ]
   }
-), F1 = ({
+), S1 = ({
   width: i = 20,
   height: o = 23,
   color: e = "#001E52",
@@ -1030,7 +1031,7 @@ const v1 = ({
       )
     ]
   }
-), S1 = ({
+), U1 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -1070,7 +1071,7 @@ const v1 = ({
       )
     ]
   }
-), U1 = ({
+), P1 = ({
   width: i = 32,
   height: o = 25,
   color: e = "#001E52",
@@ -1098,7 +1099,7 @@ const v1 = ({
       )
     ]
   }
-), P1 = ({
+), $1 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#10B981",
@@ -1127,7 +1128,7 @@ const v1 = ({
       )
     ]
   }
-), $1 = ({
+), z1 = ({
   width: i = 11,
   height: o = 11,
   color: e = "#FFB020",
@@ -1161,7 +1162,7 @@ const v1 = ({
       )
     ]
   }
-), z1 = ({
+), q1 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#88A4FF",
@@ -1209,7 +1210,7 @@ const v1 = ({
       )
     ]
   }
-), q1 = ({
+), J1 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#8E8E93",
@@ -1237,7 +1238,7 @@ const v1 = ({
       )
     ]
   }
-), J1 = ({
+), Q1 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#FFB020",
@@ -1271,7 +1272,7 @@ const v1 = ({
       )
     ]
   }
-), Q1 = ({
+), X1 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#D0421B",
@@ -1319,7 +1320,7 @@ const v1 = ({
       )
     ]
   }
-), X1 = ({
+), e2 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#070739",
@@ -1349,7 +1350,7 @@ const v1 = ({
       /* @__PURE__ */ t("circle", { cx: "10", cy: "10", r: "2.375", stroke: e, strokeWidth: "1.25" })
     ]
   }
-), e2 = ({
+), o2 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#070739",
@@ -1387,7 +1388,7 @@ const v1 = ({
       )
     ]
   }
-), o2 = ({
+), i2 = ({
   width: i = 9,
   height: o = 5,
   color: e = "#001E52",
@@ -1413,7 +1414,7 @@ const v1 = ({
       }
     )
   }
-), i2 = ({
+), t2 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#F2F2F7",
@@ -1442,7 +1443,7 @@ const v1 = ({
       )
     ]
   }
-), t2 = ({
+), l2 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#004ED7",
@@ -1471,7 +1472,7 @@ const v1 = ({
       )
     ]
   }
-), l2 = ({
+), r2 = ({
   width: i = 248,
   height: o = 248,
   color: e = "#070739",
@@ -1508,7 +1509,7 @@ const v1 = ({
       )
     ]
   }
-), r2 = ({
+), s2 = ({
   width: i = 24,
   height: o = 24,
   color: e = "#001E52",
@@ -1547,7 +1548,7 @@ const v1 = ({
       )
     ]
   }
-), s2 = ({
+), n2 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#001E52",
@@ -1576,7 +1577,7 @@ const v1 = ({
       )
     ]
   }
-), n2 = ({
+), h2 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#001E52",
@@ -1613,7 +1614,7 @@ const v1 = ({
       )
     ]
   }
-), h2 = ({
+), c2 = ({
   width: i = 24,
   height: o = 24,
   color: e = d.GREY_DARK_5,
@@ -1652,7 +1653,7 @@ const v1 = ({
       )
     ]
   }
-), c2 = ({
+), a2 = ({
   width: i = 20,
   height: o = 20,
   color: e = d.GREY_DARK_1,
@@ -1685,7 +1686,7 @@ const v1 = ({
       )
     ]
   }
-), a2 = ({
+), d2 = ({
   width: i = 81,
   height: o = 80,
   color: e = d.GREY_DARK_5,
@@ -1734,7 +1735,7 @@ const v1 = ({
       )
     ]
   }
-), d2 = ({
+), C2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 20,
@@ -1761,7 +1762,7 @@ const v1 = ({
       }
     )
   }
-), C2 = ({
+), w2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 20,
@@ -1788,7 +1789,7 @@ const v1 = ({
       }
     )
   }
-), w2 = ({
+), k2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 5,
@@ -1812,7 +1813,7 @@ const v1 = ({
       }
     )
   }
-), k2 = ({
+), g2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 5,
@@ -1837,7 +1838,7 @@ const v1 = ({
       }
     )
   }
-), g2 = ({
+), p2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -1876,7 +1877,7 @@ const v1 = ({
       )
     ]
   }
-), p2 = ({
+), L2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -1915,7 +1916,7 @@ const v1 = ({
       )
     ]
   }
-), L2 = ({
+), m2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -1942,7 +1943,7 @@ const v1 = ({
       }
     )
   }
-), m2 = ({
+), v2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2001,7 +2002,7 @@ const v1 = ({
       )
     ]
   }
-), v2 = ({
+), u2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2038,7 +2039,7 @@ const v1 = ({
       )
     ]
   }
-), u2 = ({
+), N2 = ({
   className: i,
   color: o = d.GREY_DARK_3,
   height: e = 14,
@@ -2075,7 +2076,7 @@ const v1 = ({
       )
     ]
   }
-), N2 = ({
+), f2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 18,
@@ -2102,7 +2103,7 @@ const v1 = ({
       }
     )
   }
-), f2 = ({
+), M2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2154,7 +2155,7 @@ const v1 = ({
       )
     ]
   }
-), M2 = ({
+), x2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2191,7 +2192,7 @@ const v1 = ({
       )
     ]
   }
-), x2 = ({
+), _2 = ({
   className: i,
   color: o = d.NOTIFICATION_WARNING_DARK,
   height: e = 37,
@@ -2230,7 +2231,7 @@ const v1 = ({
       )
     ]
   }
-), _2 = ({
+), R2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2256,7 +2257,7 @@ const v1 = ({
       }
     )
   }
-), R2 = ({
+), H2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2295,7 +2296,7 @@ const v1 = ({
       )
     ]
   }
-), H2 = ({
+), V2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2334,7 +2335,7 @@ const v1 = ({
       )
     ]
   }
-), V2 = ({
+), E2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2403,7 +2404,7 @@ const v1 = ({
       )
     ]
   }
-), E2 = ({
+), Z2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2442,7 +2443,7 @@ const v1 = ({
       )
     ]
   }
-), Z2 = ({
+), W2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2499,7 +2500,7 @@ const v1 = ({
       )
     ]
   }
-), W2 = ({
+), I2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2538,7 +2539,7 @@ const v1 = ({
       )
     ]
   }
-), I2 = ({
+), B2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2587,7 +2588,7 @@ const v1 = ({
       )
     ]
   }
-), B2 = ({
+), A2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2626,7 +2627,7 @@ const v1 = ({
       )
     ]
   }
-), A2 = ({
+), G2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2653,7 +2654,7 @@ const v1 = ({
       }
     )
   }
-), G2 = ({
+), D2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2691,7 +2692,7 @@ const v1 = ({
       )
     ]
   }
-), D2 = ({
+), j2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2712,7 +2713,7 @@ const v1 = ({
       /* @__PURE__ */ t("path", { d: "M12 8L4 8", stroke: o, strokeWidth: "1.7", strokeLinecap: "round" })
     ]
   }
-), j2 = ({
+), T2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2751,7 +2752,7 @@ const v1 = ({
       )
     ]
   }
-), T2 = ({
+), y2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 24,
@@ -2829,7 +2830,7 @@ const v1 = ({
       )
     ]
   }
-), y2 = ({
+), K2 = ({
   className: i,
   color: o = d.GREY_DARK_2,
   height: e = 16,
@@ -2855,7 +2856,7 @@ const v1 = ({
       }
     )
   }
-), K2 = ({
+), O2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 20,
@@ -2884,7 +2885,7 @@ const v1 = ({
       /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_3992_5989", children: /* @__PURE__ */ t("rect", { width: "20", height: "20", fill: "white" }) }) })
     ]
   }
-), O2 = ({
+), b2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 20,
@@ -2913,7 +2914,7 @@ const v1 = ({
       /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_3992_5988", children: /* @__PURE__ */ t("rect", { width: "20", height: "20", fill: "white" }) }) })
     ]
   }
-), b2 = ({
+), F2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 20,
@@ -2942,7 +2943,7 @@ const v1 = ({
       )
     ]
   }
-), F2 = ({
+), S2 = ({
   className: i,
   color: o = d.GREY_DARK_5,
   height: e = 20,
@@ -2971,7 +2972,7 @@ const v1 = ({
       )
     ]
   }
-), S2 = ({
+), U2 = ({
   className: i,
   color: o = "#001E52",
   height: e = 24,
@@ -2997,7 +2998,7 @@ const v1 = ({
       }
     )
   }
-), U2 = ({
+), P2 = ({
   className: i,
   color: o = "#131314",
   height: e = 20,
@@ -3025,7 +3026,7 @@ const v1 = ({
       }
     )
   }
-), P2 = ({
+), $2 = ({
   className: i,
   color: o = "#001E52",
   height: e = 24,
@@ -3063,7 +3064,7 @@ const v1 = ({
       )
     ] }) })
   }
-), y = ({
+), Y = ({
   name: i,
   width: o,
   height: e,
@@ -3072,49 +3073,49 @@ const v1 = ({
   disabled: w = !1,
   onClick: g
 }) => {
-  const [s, p] = v(r), { theme: k } = z(t1), n = w ? k && k === "dark" ? d.GREY_LIGHT_4 : d.GREY_DARK_1 : l, h = w ? void 0 : g;
+  const [s, p] = v(r), { theme: k } = q(l1), n = w ? k && k === "dark" ? d.GREY_LIGHT_4 : d.GREY_DARK_1 : l, h = w ? void 0 : g;
   return R(() => {
     if (r) {
       h && !w && p(`${r} clickable`);
       return;
     }
     h && !w && p("clickable");
-  }, [h, r, w]), /* @__PURE__ */ t(E, { children: (() => {
+  }, [h, r, w]), /* @__PURE__ */ t(W, { children: (() => {
     switch (i) {
       case "nextIcon":
-        return d2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "prevIcon":
         return C2({ width: o, height: e, color: n, className: s, onClick: h });
+      case "prevIcon":
+        return w2({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowUp":
-        return v1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "arrowDown":
         return u1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "info":
+      case "arrowDown":
         return N1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "arrowRight":
+      case "info":
         return f1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "calendar":
+      case "arrowRight":
         return M1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "ok":
+      case "calendar":
         return x1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "cancel":
+      case "ok":
         return _1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "add":
+      case "cancel":
         return R1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "list":
+      case "add":
         return H1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "dragAndDrop":
+      case "list":
         return V1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "filter":
+      case "dragAndDrop":
         return E1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "attention":
+      case "filter":
         return Z1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "plus":
+      case "attention":
         return W1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "time":
+      case "plus":
         return I1({ width: o, height: e, color: n, className: s, onClick: h });
+      case "time":
+        return B1({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowDownLong":
-        return B1({
+        return A1({
           width: o,
           height: e,
           color: n,
@@ -3122,9 +3123,9 @@ const v1 = ({
           onClick: h
         });
       case "users":
-        return A1({ width: o, height: e, color: n, className: s, onClick: h });
+        return G1({ width: o, height: e, color: n, className: s, onClick: h });
       case "mySkillsMatrix":
-        return G1({
+        return D1({
           width: o,
           height: e,
           color: n,
@@ -3132,9 +3133,9 @@ const v1 = ({
           onClick: h
         });
       case "skills":
-        return D1({ width: o, height: e, color: n, className: s, onClick: h });
+        return j1({ width: o, height: e, color: n, className: s, onClick: h });
       case "skillsMatrices":
-        return j1({
+        return T1({
           width: o,
           height: e,
           color: n,
@@ -3142,23 +3143,23 @@ const v1 = ({
           onClick: h
         });
       case "history":
-        return T1({ width: o, height: e, color: n, className: s, onClick: h });
+        return y1({ width: o, height: e, color: n, className: s, onClick: h });
       case "logOut":
         return Y1({ width: o, height: e, color: n, className: s, onClick: h });
       case "settings":
-        return y1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "addSkill":
         return K1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "conversation":
+      case "addSkill":
         return O1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "trash":
+      case "conversation":
         return b1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "settings4":
+      case "trash":
         return F1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "edit2":
+      case "settings4":
         return S1({ width: o, height: e, color: n, className: s, onClick: h });
+      case "edit2":
+        return U1({ width: o, height: e, color: n, className: s, onClick: h });
       case "notifications":
-        return U1({
+        return P1({
           width: o,
           height: e,
           color: n,
@@ -3166,9 +3167,9 @@ const v1 = ({
           onClick: h
         });
       case "success":
-        return P1({ width: o, height: e, color: n, className: s, onClick: h });
+        return $1({ width: o, height: e, color: n, className: s, onClick: h });
       case "attentionSmall":
-        return $1({
+        return z1({
           width: o,
           height: e,
           color: n,
@@ -3176,11 +3177,11 @@ const v1 = ({
           onClick: h
         });
       case "errorSmall":
-        return z1({ width: o, height: e, color: n, className: s, onClick: h });
-      case "infoMedium":
         return q1({ width: o, height: e, color: n, className: s, onClick: h });
+      case "infoMedium":
+        return J1({ width: o, height: e, color: n, className: s, onClick: h });
       case "attentionMedium":
-        return J1({
+        return Q1({
           width: o,
           height: e,
           color: n,
@@ -3188,9 +3189,9 @@ const v1 = ({
           onClick: h
         });
       case "errorMedium":
-        return Q1({ width: o, height: e, color: n, className: s, onClick: h });
+        return X1({ width: o, height: e, color: n, className: s, onClick: h });
       case "faviconSkills":
-        return l2({
+        return r2({
           width: o,
           height: e,
           color: n,
@@ -3198,7 +3199,7 @@ const v1 = ({
           onClick: h
         });
       case "visibilityIcon":
-        return X1({
+        return e2({
           width: o,
           height: e,
           color: n,
@@ -3206,7 +3207,7 @@ const v1 = ({
           onClick: h
         });
       case "visibilityOffIcon":
-        return e2({
+        return o2({
           width: o,
           height: e,
           color: n,
@@ -3214,7 +3215,7 @@ const v1 = ({
           onClick: h
         });
       case "selectArrowIcon":
-        return o2({
+        return i2({
           width: o,
           height: e,
           color: n,
@@ -3222,7 +3223,7 @@ const v1 = ({
           onClick: h
         });
       case "expandArrowIcon":
-        return i2({
+        return t2({
           width: o,
           height: e,
           color: n,
@@ -3230,7 +3231,7 @@ const v1 = ({
           onClick: h
         });
       case "expandActiveArrowIcon":
-        return t2({
+        return l2({
           width: o,
           height: e,
           color: n,
@@ -3238,97 +3239,97 @@ const v1 = ({
           onClick: h
         });
       case "camera":
-        return r2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "sortUp":
         return s2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "sortDown":
+      case "sortUp":
         return n2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "logOut2":
+      case "sortDown":
         return h2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "search":
+      case "logOut2":
         return c2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "handRock":
+      case "search":
         return a2({ width: o, height: e, color: n, className: s, onClick: h });
+      case "handRock":
+        return d2({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowUpFilled":
-        return k2({ width: o, height: e, color: n, className: s, onClick: h });
+        return g2({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowDownFilled":
-        return w2({ width: o, height: e, color: n, className: s, onClick: h });
+        return k2({ width: o, height: e, color: n, className: s, onClick: h });
       case "link":
-        return g2({ width: o, height: e, color: n, className: s, onClick: h });
+        return p2({ width: o, height: e, color: n, className: s, onClick: h });
       case "telegram":
-        return L2({ width: o, height: e, color: n, className: s, onClick: h });
+        return m2({ width: o, height: e, color: n, className: s, onClick: h });
       case "mail":
-        return v2({ width: o, height: e, color: n, className: s, onClick: h });
+        return u2({ width: o, height: e, color: n, className: s, onClick: h });
       case "github":
-        return p2({ width: o, height: e, color: n, className: s, onClick: h });
+        return L2({ width: o, height: e, color: n, className: s, onClick: h });
       case "linkedIn":
-        return m2({ width: o, height: e, color: n, className: s, onClick: h });
+        return v2({ width: o, height: e, color: n, className: s, onClick: h });
       case "emptyStateIcon":
-        return u2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "filtersIcon":
         return N2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "dotMenuIcon":
+      case "filtersIcon":
         return f2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "plusCircle":
+      case "dotMenuIcon":
         return M2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "warning":
+      case "plusCircle":
         return x2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "back":
+      case "warning":
         return _2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "bell":
+      case "back":
         return R2({ width: o, height: e, color: n, className: s, onClick: h });
+      case "bell":
+        return H2({ width: o, height: e, color: n, className: s, onClick: h });
       case "contract":
-        return V2({ width: o, height: e, color: n, className: s, onClick: h });
+        return E2({ width: o, height: e, color: n, className: s, onClick: h });
       case "trash2":
-        return H2({ width: o, height: e, color: n, className: s, onClick: h });
+        return V2({ width: o, height: e, color: n, className: s, onClick: h });
       case "manager":
-        return E2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "resourceManager":
         return Z2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "settings2":
+      case "resourceManager":
         return W2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "image":
+      case "settings2":
         return I2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "upload":
+      case "image":
         return B2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "edit":
+      case "upload":
         return A2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "location":
+      case "edit":
         return G2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "plus2":
+      case "location":
         return D2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "search2":
+      case "plus2":
         return j2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "fastArrowLeft":
+      case "search2":
         return T2({ width: o, height: e, color: n, className: s, onClick: h });
+      case "fastArrowLeft":
+        return y2({ width: o, height: e, color: n, className: s, onClick: h });
       case "fastArrowRight":
         return Y2({ width: o, height: e, color: n, className: s, onClick: h });
       case "crossInCircle":
-        return y2({ width: o, height: e, color: n, className: s, onClick: h });
+        return K2({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowUp2":
-        return O2({ width: o, height: e, color: n, className: s, onClick: h });
+        return b2({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowDown2":
-        return K2({ width: o, height: e, color: n, className: s, onClick: h });
+        return O2({ width: o, height: e, color: n, className: s, onClick: h });
       case "filledArrowLeft":
-        return b2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "filledArrowRight":
         return F2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "burgerMenu":
+      case "filledArrowRight":
         return S2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "signOut":
+      case "burgerMenu":
         return U2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "refresh":
+      case "signOut":
         return P2({ width: o, height: e, color: n, className: s, onClick: h });
+      case "refresh":
+        return $2({ width: o, height: e, color: n, className: s, onClick: h });
       default:
-        return /* @__PURE__ */ t(E, { children: "No Icon provided" });
+        return /* @__PURE__ */ t(W, { children: "No Icon provided" });
     }
   })() });
-}, { Title: $2, Text: z2 } = e1, q2 = {
+}, { Title: z2, Text: q2 } = o1, J2 = {
   h1: 1,
   h2: 2,
   h3: 3,
   h4: 4
-}, J2 = b(
+}, Q2 = b(
   ({
     align: i = "inherit",
     variant: o = "body1",
@@ -3341,17 +3342,17 @@ const v1 = ({
     const p = o === "h1" || o === "h2" || o === "h3" || o === "h4";
     let k = `snmt-typography snmt-typography-${o}`;
     return i && i !== "inherit" && (k += ` snmt-typography-align-${i}`), w && (k += " collapsed"), p ? /* @__PURE__ */ t(
-      $2,
+      z2,
       {
         className: k,
         style: { color: e, whiteSpace: g },
         onClick: r,
-        level: q2[o],
+        level: J2[o],
         ref: s,
         children: l
       }
     ) : /* @__PURE__ */ t(
-      z2,
+      q2,
       {
         className: k,
         style: { color: e, whiteSpace: g },
@@ -3363,12 +3364,12 @@ const v1 = ({
   }
 );
 var C = /* @__PURE__ */ ((i) => (i.GREY_LIGHT_0 = "var(--grey-light-0)", i.GREY_LIGHT_1 = "var(--grey-light-1)", i.GREY_LIGHT_2 = "var(--grey-light-2)", i.GREY_LIGHT_3 = "var(--grey-light-3)", i.GREY_LIGHT_4 = "var(--grey-light-4)", i.GREY_DARK_1 = "var(--grey-dark-1)", i.GREY_DARK_2 = "var(--grey-dark-2)", i.GREY_DARK_3 = "var(--grey-dark-3)", i.GREY_DARK_4 = "var(--grey-dark-4)", i.GREY_DARK_5 = "var(--grey-dark-5)", i.BLUE_PRIMARY = "var(--blue-primary)", i.BLUE_HOVER = "var(--blue-hover)", i.BLUE_LIGHT_1 = "var(--blue-light-1)", i.BLUE_LIGHT_2 = "var(--blue-light-2)", i.BLUE_LIGHT_3 = "var(--blue-light-3)", i.BLUE_LIGHT_4 = "var(--blue-light-4)", i.BLUE_DARK_1 = "var(--blue-dark-1)", i.PURPLE_LIGHT = "var(--purple-light)", i.PURPLE_DARK = "var(--purple-dark)", i.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", i.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", i.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", i.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", i.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", i.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", i.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", i))(C || {});
-const l1 = O({
+const r1 = O({
   locale: "en",
   theme: "light"
 });
-l1.Provider;
-const Q2 = ({
+r1.Provider;
+const X2 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3395,7 +3396,7 @@ const Q2 = ({
       }
     )
   }
-), X2 = ({
+), e5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3422,7 +3423,7 @@ const Q2 = ({
       }
     )
   }
-), e5 = ({
+), o5 = ({
   width: i = 16,
   height: o = 16,
   color: e = "#001E52",
@@ -3450,7 +3451,7 @@ const Q2 = ({
       )
     ]
   }
-), o5 = ({
+), i5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3485,7 +3486,7 @@ const Q2 = ({
       )
     ]
   }
-), i5 = ({
+), t5 = ({
   width: i = 18,
   height: o = 18,
   color: e = "#001E52",
@@ -3524,7 +3525,7 @@ const Q2 = ({
       )
     ]
   }
-), t5 = ({
+), l5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3550,7 +3551,7 @@ const Q2 = ({
       }
     )
   }
-), l5 = ({
+), r5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3571,7 +3572,7 @@ const Q2 = ({
       /* @__PURE__ */ t("path", { d: "M16 4L4 16", stroke: e, strokeWidth: "1.5", strokeLinecap: "round" })
     ]
   }
-), r5 = ({
+), s5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3603,7 +3604,7 @@ const Q2 = ({
       )
     ]
   }
-), s5 = ({
+), n5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3657,7 +3658,7 @@ const Q2 = ({
       )
     ]
   }
-), n5 = ({
+), h5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3696,7 +3697,7 @@ const Q2 = ({
       /* @__PURE__ */ t("path", { d: "M3 12L17 12", stroke: e, strokeWidth: "2", strokeLinecap: "round" })
     ]
   }
-), h5 = ({
+), c5 = ({
   width: i = 16,
   height: o = 12,
   color: e = "#001E52",
@@ -3745,7 +3746,7 @@ const Q2 = ({
       )
     ] })
   }
-), c5 = ({
+), a5 = ({
   width: i = 16,
   height: o = 16,
   color: e = "#001E52",
@@ -3779,7 +3780,7 @@ const Q2 = ({
       )
     ]
   }
-), a5 = ({
+), d5 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#001E52",
@@ -3818,7 +3819,7 @@ const Q2 = ({
       )
     ] })
   }
-), d5 = ({
+), C5 = ({
   width: i = 16,
   height: o = 16,
   color: e = "#001E52",
@@ -3854,7 +3855,7 @@ const Q2 = ({
       )
     ]
   }
-), C5 = ({
+), w5 = ({
   width: i = 11,
   height: o = 32,
   color: e = "#001E52",
@@ -3892,7 +3893,7 @@ const Q2 = ({
       /* @__PURE__ */ t("circle", { cx: "3", cy: "3", r: "3", fill: e })
     ]
   }
-), w5 = ({
+), k5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3939,7 +3940,7 @@ const Q2 = ({
       )
     ]
   }
-), k5 = ({
+), g5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -3972,7 +3973,7 @@ const Q2 = ({
       )
     ]
   }
-), g5 = ({
+), p5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4019,7 +4020,7 @@ const Q2 = ({
       )
     ]
   }
-), p5 = ({
+), L5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4052,7 +4053,7 @@ const Q2 = ({
       )
     ]
   }
-), L5 = ({
+), m5 = ({
   width: i = 18,
   height: o = 16,
   color: e = "#001E52",
@@ -4091,7 +4092,7 @@ const Q2 = ({
       )
     ]
   }
-), m5 = ({
+), v5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4124,7 +4125,7 @@ const Q2 = ({
       )
     ]
   }
-), v5 = ({
+), u5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4148,7 +4149,7 @@ const Q2 = ({
       }
     )
   }
-), u5 = ({
+), N5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4195,7 +4196,7 @@ const Q2 = ({
       )
     ]
   }
-), N5 = ({
+), f5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4228,7 +4229,7 @@ const Q2 = ({
       )
     ]
   }
-), f5 = ({
+), M5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4261,7 +4262,7 @@ const Q2 = ({
       )
     ]
   }
-), M5 = ({
+), x5 = ({
   width: i = 20,
   height: o = 23,
   color: e = "#001E52",
@@ -4322,7 +4323,7 @@ const Q2 = ({
       )
     ]
   }
-), x5 = ({
+), _5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#001E52",
@@ -4362,7 +4363,7 @@ const Q2 = ({
       )
     ]
   }
-), _5 = ({
+), R5 = ({
   width: i = 32,
   height: o = 25,
   color: e = "#001E52",
@@ -4390,7 +4391,7 @@ const Q2 = ({
       )
     ]
   }
-), R5 = ({
+), H5 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#10B981",
@@ -4419,7 +4420,7 @@ const Q2 = ({
       )
     ]
   }
-), H5 = ({
+), V5 = ({
   width: i = 11,
   height: o = 11,
   color: e = "#FFB020",
@@ -4453,7 +4454,7 @@ const Q2 = ({
       )
     ]
   }
-), V5 = ({
+), E5 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#88A4FF",
@@ -4501,7 +4502,7 @@ const Q2 = ({
       )
     ]
   }
-), E5 = ({
+), Z5 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#8E8E93",
@@ -4529,7 +4530,7 @@ const Q2 = ({
       )
     ]
   }
-), Z5 = ({
+), W5 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#FFB020",
@@ -4563,7 +4564,7 @@ const Q2 = ({
       )
     ]
   }
-), W5 = ({
+), I5 = ({
   width: i = 14,
   height: o = 14,
   color: e = "#D0421B",
@@ -4611,7 +4612,7 @@ const Q2 = ({
       )
     ]
   }
-), I5 = ({
+), B5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#070739",
@@ -4641,7 +4642,7 @@ const Q2 = ({
       /* @__PURE__ */ t("circle", { cx: "10", cy: "10", r: "2.375", stroke: e, strokeWidth: "1.25" })
     ]
   }
-), B5 = ({
+), A5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#070739",
@@ -4679,7 +4680,7 @@ const Q2 = ({
       )
     ]
   }
-), A5 = ({
+), G5 = ({
   width: i = 9,
   height: o = 5,
   color: e = "#001E52",
@@ -4705,7 +4706,7 @@ const Q2 = ({
       }
     )
   }
-), G5 = ({
+), D5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#F2F2F7",
@@ -4734,7 +4735,7 @@ const Q2 = ({
       )
     ]
   }
-), D5 = ({
+), j5 = ({
   width: i = 20,
   height: o = 20,
   color: e = "#004ED7",
@@ -4763,7 +4764,7 @@ const Q2 = ({
       )
     ]
   }
-), j5 = ({
+), T5 = ({
   width: i = 248,
   height: o = 248,
   color: e = "#070739",
@@ -4800,7 +4801,7 @@ const Q2 = ({
       )
     ]
   }
-), T5 = ({
+), y5 = ({
   width: i = 24,
   height: o = 24,
   color: e = "#001E52",
@@ -4868,7 +4869,7 @@ const Q2 = ({
       )
     ]
   }
-), y5 = ({
+), K5 = ({
   width: i = 10,
   height: o = 10,
   color: e = "#001E52",
@@ -4905,7 +4906,7 @@ const Q2 = ({
       )
     ]
   }
-), K5 = ({
+), O5 = ({
   width: i = 24,
   height: o = 24,
   color: e = C.GREY_DARK_5,
@@ -4944,7 +4945,7 @@ const Q2 = ({
       )
     ]
   }
-), O5 = ({
+), b5 = ({
   width: i = 20,
   height: o = 20,
   color: e = C.GREY_DARK_1,
@@ -4977,7 +4978,7 @@ const Q2 = ({
       )
     ]
   }
-), b5 = ({
+), F5 = ({
   width: i = 81,
   height: o = 80,
   color: e = C.GREY_DARK_5,
@@ -5026,7 +5027,7 @@ const Q2 = ({
       )
     ]
   }
-), F5 = ({
+), S5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 20,
@@ -5053,7 +5054,7 @@ const Q2 = ({
       }
     )
   }
-), S5 = ({
+), U5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 20,
@@ -5080,7 +5081,7 @@ const Q2 = ({
       }
     )
   }
-), U5 = ({
+), P5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 5,
@@ -5104,7 +5105,7 @@ const Q2 = ({
       }
     )
   }
-), P5 = ({
+), $5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 5,
@@ -5129,7 +5130,7 @@ const Q2 = ({
       }
     )
   }
-), $5 = ({
+), z5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5168,7 +5169,7 @@ const Q2 = ({
       )
     ]
   }
-), z5 = ({
+), q5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5207,7 +5208,7 @@ const Q2 = ({
       )
     ]
   }
-), q5 = ({
+), J5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5234,7 +5235,7 @@ const Q2 = ({
       }
     )
   }
-), J5 = ({
+), Q5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5293,7 +5294,7 @@ const Q2 = ({
       )
     ]
   }
-), Q5 = ({
+), X5 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5330,7 +5331,7 @@ const Q2 = ({
       )
     ]
   }
-), X5 = ({
+), e3 = ({
   className: i,
   color: o = C.GREY_DARK_3,
   height: e = 14,
@@ -5367,7 +5368,7 @@ const Q2 = ({
       )
     ]
   }
-), e3 = ({
+), o3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 18,
@@ -5394,7 +5395,7 @@ const Q2 = ({
       }
     )
   }
-), o3 = ({
+), i3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5446,7 +5447,7 @@ const Q2 = ({
       )
     ]
   }
-), i3 = ({
+), t3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5483,7 +5484,7 @@ const Q2 = ({
       )
     ]
   }
-), t3 = ({
+), l3 = ({
   className: i,
   color: o = C.NOTIFICATION_WARNING_DARK,
   height: e = 37,
@@ -5522,7 +5523,7 @@ const Q2 = ({
       )
     ]
   }
-), l3 = ({
+), r3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5548,7 +5549,7 @@ const Q2 = ({
       }
     )
   }
-), r3 = ({
+), s3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5587,7 +5588,7 @@ const Q2 = ({
       )
     ]
   }
-), s3 = ({
+), n3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5626,7 +5627,7 @@ const Q2 = ({
       )
     ]
   }
-), n3 = ({
+), h3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5695,7 +5696,7 @@ const Q2 = ({
       )
     ]
   }
-), h3 = ({
+), c3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5734,7 +5735,7 @@ const Q2 = ({
       )
     ]
   }
-), c3 = ({
+), a3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5791,7 +5792,7 @@ const Q2 = ({
       )
     ]
   }
-), a3 = ({
+), d3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5830,7 +5831,7 @@ const Q2 = ({
       )
     ]
   }
-), d3 = ({
+), C3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5879,7 +5880,7 @@ const Q2 = ({
       )
     ]
   }
-), C3 = ({
+), w3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5918,7 +5919,7 @@ const Q2 = ({
       )
     ]
   }
-), w3 = ({
+), k3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5945,7 +5946,7 @@ const Q2 = ({
       }
     )
   }
-), k3 = ({
+), g3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -5983,7 +5984,7 @@ const Q2 = ({
       )
     ]
   }
-), g3 = ({
+), p3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -6004,7 +6005,7 @@ const Q2 = ({
       /* @__PURE__ */ t("path", { d: "M12 8L4 8", stroke: o, strokeWidth: "1.7", strokeLinecap: "round" })
     ]
   }
-), p3 = ({
+), L3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -6043,7 +6044,7 @@ const Q2 = ({
       )
     ]
   }
-), L3 = ({
+), m3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -6082,7 +6083,7 @@ const Q2 = ({
       )
     ]
   }
-), m3 = ({
+), v3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 24,
@@ -6121,7 +6122,7 @@ const Q2 = ({
       )
     ]
   }
-), v3 = ({
+), u3 = ({
   className: i,
   color: o = C.GREY_DARK_2,
   height: e = 16,
@@ -6147,7 +6148,7 @@ const Q2 = ({
       }
     )
   }
-), u3 = ({
+), N3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 20,
@@ -6176,7 +6177,7 @@ const Q2 = ({
       /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_3992_5989", children: /* @__PURE__ */ t("rect", { width: "20", height: "20", fill: "white" }) }) })
     ]
   }
-), N3 = ({
+), f3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 20,
@@ -6205,7 +6206,7 @@ const Q2 = ({
       /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_3992_5988", children: /* @__PURE__ */ t("rect", { width: "20", height: "20", fill: "white" }) }) })
     ]
   }
-), f3 = ({
+), M3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 20,
@@ -6234,7 +6235,7 @@ const Q2 = ({
       )
     ]
   }
-), M3 = ({
+), x3 = ({
   className: i,
   color: o = C.GREY_DARK_5,
   height: e = 20,
@@ -6263,7 +6264,7 @@ const Q2 = ({
       )
     ]
   }
-), x3 = ({
+), _3 = ({
   className: i,
   color: o = "#001E52",
   height: e = 24,
@@ -6289,7 +6290,7 @@ const Q2 = ({
       }
     )
   }
-), _3 = ({
+), R3 = ({
   className: i,
   color: o = "#131314",
   height: e = 20,
@@ -6317,7 +6318,7 @@ const Q2 = ({
       }
     )
   }
-), R3 = ({
+), H3 = ({
   className: i,
   color: o = "#001E52",
   height: e = 24,
@@ -6355,7 +6356,7 @@ const Q2 = ({
       )
     ] }) })
   }
-), H3 = ({
+), V3 = ({
   name: i,
   width: o,
   height: e,
@@ -6364,49 +6365,49 @@ const Q2 = ({
   disabled: w = !1,
   onClick: g
 }) => {
-  const [s, p] = v(r), { theme: k } = z(l1), n = w ? k && k === "dark" ? C.GREY_LIGHT_4 : C.GREY_DARK_1 : l, h = w ? void 0 : g;
+  const [s, p] = v(r), { theme: k } = q(r1), n = w ? k && k === "dark" ? C.GREY_LIGHT_4 : C.GREY_DARK_1 : l, h = w ? void 0 : g;
   return R(() => {
     if (r) {
       h && !w && p(`${r} clickable`);
       return;
     }
     h && !w && p("clickable");
-  }, [h, r, w]), /* @__PURE__ */ t(E, { children: (() => {
+  }, [h, r, w]), /* @__PURE__ */ t(W, { children: (() => {
     switch (i) {
       case "nextIcon":
-        return F5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "prevIcon":
         return S5({ width: o, height: e, color: n, className: s, onClick: h });
+      case "prevIcon":
+        return U5({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowUp":
-        return Q2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "arrowDown":
         return X2({ width: o, height: e, color: n, className: s, onClick: h });
-      case "info":
+      case "arrowDown":
         return e5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "arrowRight":
+      case "info":
         return o5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "calendar":
+      case "arrowRight":
         return i5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "ok":
+      case "calendar":
         return t5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "cancel":
+      case "ok":
         return l5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "add":
+      case "cancel":
         return r5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "list":
+      case "add":
         return s5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "dragAndDrop":
+      case "list":
         return n5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "filter":
+      case "dragAndDrop":
         return h5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "attention":
+      case "filter":
         return c5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "plus":
+      case "attention":
         return a5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "time":
+      case "plus":
         return d5({ width: o, height: e, color: n, className: s, onClick: h });
+      case "time":
+        return C5({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowDownLong":
-        return C5({
+        return w5({
           width: o,
           height: e,
           color: n,
@@ -6414,9 +6415,9 @@ const Q2 = ({
           onClick: h
         });
       case "users":
-        return w5({ width: o, height: e, color: n, className: s, onClick: h });
+        return k5({ width: o, height: e, color: n, className: s, onClick: h });
       case "mySkillsMatrix":
-        return k5({
+        return g5({
           width: o,
           height: e,
           color: n,
@@ -6424,9 +6425,9 @@ const Q2 = ({
           onClick: h
         });
       case "skills":
-        return g5({ width: o, height: e, color: n, className: s, onClick: h });
+        return p5({ width: o, height: e, color: n, className: s, onClick: h });
       case "skillsMatrices":
-        return p5({
+        return L5({
           width: o,
           height: e,
           color: n,
@@ -6434,23 +6435,23 @@ const Q2 = ({
           onClick: h
         });
       case "history":
-        return L5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "logOut":
         return m5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "settings":
+      case "logOut":
         return v5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "addSkill":
+      case "settings":
         return u5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "conversation":
+      case "addSkill":
         return N5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "trash":
+      case "conversation":
         return f5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "settings4":
+      case "trash":
         return M5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "edit2":
+      case "settings4":
         return x5({ width: o, height: e, color: n, className: s, onClick: h });
+      case "edit2":
+        return _5({ width: o, height: e, color: n, className: s, onClick: h });
       case "notifications":
-        return _5({
+        return R5({
           width: o,
           height: e,
           color: n,
@@ -6458,9 +6459,9 @@ const Q2 = ({
           onClick: h
         });
       case "success":
-        return R5({ width: o, height: e, color: n, className: s, onClick: h });
+        return H5({ width: o, height: e, color: n, className: s, onClick: h });
       case "attentionSmall":
-        return H5({
+        return V5({
           width: o,
           height: e,
           color: n,
@@ -6468,11 +6469,11 @@ const Q2 = ({
           onClick: h
         });
       case "errorSmall":
-        return V5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "infoMedium":
         return E5({ width: o, height: e, color: n, className: s, onClick: h });
+      case "infoMedium":
+        return Z5({ width: o, height: e, color: n, className: s, onClick: h });
       case "attentionMedium":
-        return Z5({
+        return W5({
           width: o,
           height: e,
           color: n,
@@ -6480,9 +6481,9 @@ const Q2 = ({
           onClick: h
         });
       case "errorMedium":
-        return W5({ width: o, height: e, color: n, className: s, onClick: h });
+        return I5({ width: o, height: e, color: n, className: s, onClick: h });
       case "faviconSkills":
-        return j5({
+        return T5({
           width: o,
           height: e,
           color: n,
@@ -6490,7 +6491,7 @@ const Q2 = ({
           onClick: h
         });
       case "visibilityIcon":
-        return I5({
+        return B5({
           width: o,
           height: e,
           color: n,
@@ -6498,7 +6499,7 @@ const Q2 = ({
           onClick: h
         });
       case "visibilityOffIcon":
-        return B5({
+        return A5({
           width: o,
           height: e,
           color: n,
@@ -6506,7 +6507,7 @@ const Q2 = ({
           onClick: h
         });
       case "selectArrowIcon":
-        return A5({
+        return G5({
           width: o,
           height: e,
           color: n,
@@ -6514,7 +6515,7 @@ const Q2 = ({
           onClick: h
         });
       case "expandArrowIcon":
-        return G5({
+        return D5({
           width: o,
           height: e,
           color: n,
@@ -6522,7 +6523,7 @@ const Q2 = ({
           onClick: h
         });
       case "expandActiveArrowIcon":
-        return D5({
+        return j5({
           width: o,
           height: e,
           color: n,
@@ -6530,109 +6531,109 @@ const Q2 = ({
           onClick: h
         });
       case "camera":
-        return T5({ width: o, height: e, color: n, className: s, onClick: h });
+        return y5({ width: o, height: e, color: n, className: s, onClick: h });
       case "sortUp":
         return Y5({ width: o, height: e, color: n, className: s, onClick: h });
       case "sortDown":
-        return y5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "logOut2":
         return K5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "search":
+      case "logOut2":
         return O5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "handRock":
+      case "search":
         return b5({ width: o, height: e, color: n, className: s, onClick: h });
+      case "handRock":
+        return F5({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowUpFilled":
-        return P5({ width: o, height: e, color: n, className: s, onClick: h });
+        return $5({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowDownFilled":
-        return U5({ width: o, height: e, color: n, className: s, onClick: h });
+        return P5({ width: o, height: e, color: n, className: s, onClick: h });
       case "link":
-        return $5({ width: o, height: e, color: n, className: s, onClick: h });
+        return z5({ width: o, height: e, color: n, className: s, onClick: h });
       case "telegram":
-        return q5({ width: o, height: e, color: n, className: s, onClick: h });
+        return J5({ width: o, height: e, color: n, className: s, onClick: h });
       case "mail":
-        return Q5({ width: o, height: e, color: n, className: s, onClick: h });
+        return X5({ width: o, height: e, color: n, className: s, onClick: h });
       case "github":
-        return z5({ width: o, height: e, color: n, className: s, onClick: h });
+        return q5({ width: o, height: e, color: n, className: s, onClick: h });
       case "linkedIn":
-        return J5({ width: o, height: e, color: n, className: s, onClick: h });
+        return Q5({ width: o, height: e, color: n, className: s, onClick: h });
       case "emptyStateIcon":
-        return X5({ width: o, height: e, color: n, className: s, onClick: h });
-      case "filtersIcon":
         return e3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "dotMenuIcon":
+      case "filtersIcon":
         return o3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "plusCircle":
+      case "dotMenuIcon":
         return i3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "warning":
+      case "plusCircle":
         return t3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "back":
+      case "warning":
         return l3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "bell":
+      case "back":
         return r3({ width: o, height: e, color: n, className: s, onClick: h });
+      case "bell":
+        return s3({ width: o, height: e, color: n, className: s, onClick: h });
       case "contract":
-        return n3({ width: o, height: e, color: n, className: s, onClick: h });
+        return h3({ width: o, height: e, color: n, className: s, onClick: h });
       case "trash2":
-        return s3({ width: o, height: e, color: n, className: s, onClick: h });
+        return n3({ width: o, height: e, color: n, className: s, onClick: h });
       case "manager":
-        return h3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "resourceManager":
         return c3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "settings2":
+      case "resourceManager":
         return a3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "image":
+      case "settings2":
         return d3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "upload":
+      case "image":
         return C3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "edit":
+      case "upload":
         return w3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "location":
+      case "edit":
         return k3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "plus2":
+      case "location":
         return g3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "search2":
+      case "plus2":
         return p3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "fastArrowLeft":
+      case "search2":
         return L3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "fastArrowRight":
+      case "fastArrowLeft":
         return m3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "crossInCircle":
+      case "fastArrowRight":
         return v3({ width: o, height: e, color: n, className: s, onClick: h });
+      case "crossInCircle":
+        return u3({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowUp2":
-        return N3({ width: o, height: e, color: n, className: s, onClick: h });
+        return f3({ width: o, height: e, color: n, className: s, onClick: h });
       case "arrowDown2":
-        return u3({ width: o, height: e, color: n, className: s, onClick: h });
+        return N3({ width: o, height: e, color: n, className: s, onClick: h });
       case "filledArrowLeft":
-        return f3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "filledArrowRight":
         return M3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "burgerMenu":
+      case "filledArrowRight":
         return x3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "signOut":
+      case "burgerMenu":
         return _3({ width: o, height: e, color: n, className: s, onClick: h });
-      case "refresh":
+      case "signOut":
         return R3({ width: o, height: e, color: n, className: s, onClick: h });
+      case "refresh":
+        return H3({ width: o, height: e, color: n, className: s, onClick: h });
       default:
-        return /* @__PURE__ */ t(E, { children: "No Icon provided" });
+        return /* @__PURE__ */ t(W, { children: "No Icon provided" });
     }
   })() });
 };
-var r1 = /* @__PURE__ */ ((i) => (i.GREY_LIGHT_0 = "var(--grey-light-0)", i.GREY_LIGHT_1 = "var(--grey-light-1)", i.GREY_LIGHT_2 = "var(--grey-light-2)", i.GREY_LIGHT_3 = "var(--grey-light-3)", i.GREY_LIGHT_4 = "var(--grey-light-4)", i.GREY_DARK_1 = "var(--grey-dark-1)", i.GREY_DARK_2 = "var(--grey-dark-2)", i.GREY_DARK_3 = "var(--grey-dark-3)", i.GREY_DARK_4 = "var(--grey-dark-4)", i.GREY_DARK_5 = "var(--grey-dark-5)", i.BLUE_PRIMARY = "var(--blue-primary)", i.BLUE_HOVER = "var(--blue-hover)", i.BLUE_LIGHT_1 = "var(--blue-light-1)", i.BLUE_LIGHT_2 = "var(--blue-light-2)", i.BLUE_LIGHT_3 = "var(--blue-light-3)", i.BLUE_LIGHT_4 = "var(--blue-light-4)", i.BLUE_DARK_1 = "var(--blue-dark-1)", i.PURPLE_LIGHT = "var(--purple-light)", i.PURPLE_DARK = "var(--purple-dark)", i.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", i.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", i.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", i.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", i.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", i.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", i.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", i))(r1 || {});
-const V3 = O({
+var s1 = /* @__PURE__ */ ((i) => (i.GREY_LIGHT_0 = "var(--grey-light-0)", i.GREY_LIGHT_1 = "var(--grey-light-1)", i.GREY_LIGHT_2 = "var(--grey-light-2)", i.GREY_LIGHT_3 = "var(--grey-light-3)", i.GREY_LIGHT_4 = "var(--grey-light-4)", i.GREY_DARK_1 = "var(--grey-dark-1)", i.GREY_DARK_2 = "var(--grey-dark-2)", i.GREY_DARK_3 = "var(--grey-dark-3)", i.GREY_DARK_4 = "var(--grey-dark-4)", i.GREY_DARK_5 = "var(--grey-dark-5)", i.BLUE_PRIMARY = "var(--blue-primary)", i.BLUE_HOVER = "var(--blue-hover)", i.BLUE_LIGHT_1 = "var(--blue-light-1)", i.BLUE_LIGHT_2 = "var(--blue-light-2)", i.BLUE_LIGHT_3 = "var(--blue-light-3)", i.BLUE_LIGHT_4 = "var(--blue-light-4)", i.BLUE_DARK_1 = "var(--blue-dark-1)", i.PURPLE_LIGHT = "var(--purple-light)", i.PURPLE_DARK = "var(--purple-dark)", i.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", i.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", i.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", i.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", i.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", i.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", i.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", i))(s1 || {});
+const E3 = O({
   locale: "en",
   theme: "light"
 });
-V3.Provider;
-const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r = !0 }) => {
+E3.Provider;
+const n1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r = !0 }) => {
   const w = e === "small" ? 10 : 12.5;
   return /* @__PURE__ */ t(
-    o1,
+    i1,
     {
       className: `snmt-tag ${e}`,
       closeIcon: /* @__PURE__ */ t(
-        H3,
+        V3,
         {
           name: "errorSmall",
-          color: r1.GREY_DARK_2,
+          color: s1.GREY_DARK_2,
           width: w,
           height: w,
           onClick: l
@@ -6641,15 +6642,15 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
       bordered: !1,
       style: { width: o ?? "fit-content" },
       closable: r,
-      children: typeof i == "string" ? /* @__PURE__ */ t(J2, { variant: e === "small" ? "body4" : "body2", children: i }) : i
+      children: typeof i == "string" ? /* @__PURE__ */ t(Q2, { variant: e === "small" ? "body4" : "body2", children: i }) : i
     }
   );
-}, { Title: E3, Text: Z3 } = e1, W3 = {
+}, { Title: Z3, Text: W3 } = o1, I3 = {
   h1: 1,
   h2: 2,
   h3: 3,
   h4: 4
-}, n1 = b(
+}, h1 = b(
   ({
     align: i = "inherit",
     variant: o = "body1",
@@ -6662,17 +6663,17 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
     const p = o === "h1" || o === "h2" || o === "h3" || o === "h4";
     let k = `snmt-typography snmt-typography-${o}`;
     return i && i !== "inherit" && (k += ` snmt-typography-align-${i}`), w && (k += " collapsed"), p ? /* @__PURE__ */ t(
-      E3,
+      Z3,
       {
         className: k,
         style: { color: e, whiteSpace: g },
         onClick: r,
-        level: W3[o],
+        level: I3[o],
         ref: s,
         children: l
       }
     ) : /* @__PURE__ */ t(
-      Z3,
+      W3,
       {
         className: k,
         style: { color: e, whiteSpace: g },
@@ -6682,7 +6683,7 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
       }
     );
   }
-), I3 = ({
+), B3 = ({
   children: i,
   content: o,
   isOpen: e,
@@ -6692,7 +6693,7 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
 }) => {
   const [g, s] = v(!1);
   return /* @__PURE__ */ t(
-    p1,
+    L1,
     {
       content: o,
       arrow: !1,
@@ -6706,7 +6707,7 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
       children: /* @__PURE__ */ t("div", { className: "wrapper", children: i })
     }
   );
-}, B3 = ({
+}, A3 = ({
   values: i,
   onTagClose: o,
   maxWidth: e,
@@ -6724,16 +6725,16 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
   if (!i.length)
     return null;
   const k = (n) => {
-    var h, M;
-    return ((h = r == null ? void 0 : r.find((x) => x.value === n)) == null ? void 0 : h.label) || ((M = w == null ? void 0 : w.find((x) => x.value === n)) == null ? void 0 : M.label) || n;
+    var h, f;
+    return ((h = r == null ? void 0 : r.find((M) => M.value === n)) == null ? void 0 : h.label) || ((f = w == null ? void 0 : w.find((M) => M.value === n)) == null ? void 0 : f.label) || n;
   };
   return /* @__PURE__ */ t("div", { onMouseDown: p, className: "wrapper", children: /* @__PURE__ */ t(
-    I3,
+    B3,
     {
       content: (
         // 90: paddings + margins + gaps and so on
         /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, children: /* @__PURE__ */ t(K, { gap: 6, flexWrap: "wrap", children: i.map(({ value: n }) => /* @__PURE__ */ t(
-          s1,
+          n1,
           {
             onClose: () => o(n),
             closable: !l,
@@ -6745,13 +6746,21 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
       placement: "bottomRight",
       isOpen: g,
       setIsOpen: s,
-      children: /* @__PURE__ */ t(o1, { className: `overflow-button ${g ? "open" : ""}`, bordered: !1, children: /* @__PURE__ */ c(n1, { variant: "body4", color: g ? V.BLUE_PRIMARY : void 0, children: [
+      children: /* @__PURE__ */ t(i1, { className: `overflow-button ${g ? "open" : ""}`, bordered: !1, children: /* @__PURE__ */ c(h1, { variant: "body4", color: g ? Z.BLUE_PRIMARY : void 0, children: [
         i.length,
         " more"
       ] }) })
     }
   ) });
-}, Q = b(
+}, G3 = ({ size: i = 30, color: o = "#004ed7" }) => {
+  const e = `no-repeat linear-gradient(${o}
+    calc(50% - 10px), #0000 0 calc(50% + 10px), ${o} 0)`, l = {
+    width: i,
+    background: `${e} 0% 100%, ${e} 50% 100%, ${e} 100% 100%`,
+    backgroundSize: "20% calc(200% + 20px)"
+  };
+  return /* @__PURE__ */ t("span", { className: "snmt-loader", style: l });
+}, X = b(
   ({
     value: i,
     onChange: o,
@@ -6765,95 +6774,96 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
     scrollThresholdValue: k = 50,
     onSearchChange: n,
     onDropdownVisibleChange: h,
-    onScrollToEnd: M,
-    onPopupScroll: Z,
-    id: x,
-    extraOptions: H
-  }, T) => {
-    const [W, I] = v(!1), [Y, _] = v(!1), [B, A] = v(!0), [u, G] = v(i), D = X(null);
+    onScrollToEnd: f,
+    onPopupScroll: I,
+    id: M,
+    extraOptions: H,
+    isLoading: B
+  }, j) => {
+    const [A, T] = v(!1), [x, V] = v(!1), [F, G] = v(!0), [u, E] = v(i), m = e1(null);
     R(() => {
-      G(i);
+      E(i);
     }, [i]);
-    const m = (a) => {
-      I(a), h && h(a);
-    }, F = (a, L) => {
-      var f;
-      return !!((f = L == null ? void 0 : L.label) != null && f.toString().toLowerCase().includes(a.toLowerCase()));
-    }, S = () => {
-      _(!0);
-    }, j = () => {
-      _(!1);
-    }, N = (a) => {
-      if (G(a), l) {
-        const f = a;
-        o == null || o(f);
+    const S = (a) => {
+      T(a), h && h(a);
+    }, U = (a, L) => {
+      var N;
+      return !!((N = L == null ? void 0 : L.label) != null && N.toString().toLowerCase().includes(a.toLowerCase()));
+    }, D = () => {
+      V(!0);
+    }, _ = () => {
+      V(!1);
+    }, y = (a) => {
+      if (E(a), l) {
+        const N = a;
+        o == null || o(N);
         return;
       }
       const L = a;
       o == null || o(L);
-    }, h1 = () => {
+    }, c1 = () => {
       if (l) {
-        N([]);
+        y([]);
         return;
       }
-      N("");
-    }, q = (a) => {
-      const L = u.filter((f) => f !== a);
-      N(L), G(L);
-    }, c1 = (a) => (u == null ? void 0 : u.indexOf(a)) === 0 ? (
+      y("");
+    }, J = (a) => {
+      const L = u.filter((N) => N !== a);
+      y(L), E(L);
+    }, a1 = (a) => (u == null ? void 0 : u.indexOf(a)) === 0 ? (
       // if the search input is empty
       // then display the placeholder, else do not display it
-      /* @__PURE__ */ t("span", { className: "custom-placeholder", children: B ? e : "" })
-    ) : /* @__PURE__ */ t(E, {}), a1 = (a) => {
+      /* @__PURE__ */ t("span", { className: "custom-placeholder", children: F ? e : "" })
+    ) : /* @__PURE__ */ t(W, {}), d1 = (a) => {
       a.preventDefault(), a.stopPropagation();
-    }, d1 = async (a) => {
+    }, C1 = async (a) => {
       const { target: L } = a;
-      L.scrollTop + L.offsetHeight >= L.scrollHeight - k && (M == null || M(!0)), Z && await Z(a);
-    }, J = (a) => {
-      var L, f;
-      return ((L = w.find((U) => U.value === a)) == null ? void 0 : L.label) || ((f = H == null ? void 0 : H.find((U) => U.value === a)) == null ? void 0 : f.label) || a;
+      L.scrollTop + L.offsetHeight >= L.scrollHeight - k && (f == null || f(!0)), I && await I(a);
+    }, Q = (a) => {
+      var L, N;
+      return ((L = w.find((P) => P.value === a)) == null ? void 0 : L.label) || ((N = H == null ? void 0 : H.find((P) => P.value === a)) == null ? void 0 : N.label) || a;
     };
     return /* @__PURE__ */ c(
       "div",
       {
-        className: `snmt-select ${Y ? "snmt-select-focused" : ""}
+        className: `snmt-select ${x ? "snmt-select-focused" : ""}
                 ${l ? "" : "snmt-select-single"}`,
-        ref: D,
+        ref: m,
         style: { width: g },
         children: [
           /* @__PURE__ */ t(
-            C1,
+            w1,
             {
               className: "snmt-select-blank",
-              id: x,
-              ref: T,
+              id: M,
+              ref: j,
               showSearch: !!r,
-              filterOption: r && F,
-              onDropdownVisibleChange: m,
+              filterOption: r && U,
+              onDropdownVisibleChange: S,
               placeholder: e ? p ? `${e}*` : e : void 0,
               disabled: s,
               value: u || void 0,
-              labelRender: (a) => J(a.value),
+              labelRender: (a) => Q(a.value),
               mode: l === "filter" ? "multiple" : l,
-              onChange: N,
-              onFocus: S,
-              onBlur: j,
+              onChange: y,
+              onFocus: D,
+              onBlur: _,
               onSearch: (a) => {
-                A(!a), n && n(a);
+                G(!a), n && n(a);
               },
-              onSelect: () => A(!0),
-              onDeselect: () => A(!0),
+              onSelect: () => G(!0),
+              onDeselect: () => G(!0),
               tagRender: l === "filter" ? (
                 // HACK to prevent showing selected options in input
-                (a) => c1(a.value)
+                (a) => a1(a.value)
               ) : (a) => {
                 const L = typeof a.label == "object";
-                return /* @__PURE__ */ t("div", { onMouseDown: a1, className: "tag-wrapper", children: /* @__PURE__ */ t(
-                  s1,
+                return /* @__PURE__ */ t("div", { onMouseDown: d1, className: "tag-wrapper", children: /* @__PURE__ */ t(
+                  n1,
                   {
-                    onClose: () => q(a.value),
+                    onClose: () => J(a.value),
                     closable: !s,
-                    children: /* @__PURE__ */ t(n1, { variant: "body4", children: L ? a.label : J(a.value) })
+                    children: /* @__PURE__ */ t(h1, { variant: "body4", children: L ? a.label : Q(a.value) })
                   }
                 ) });
               },
@@ -6861,61 +6871,72 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
               maxTagPlaceholder: (a) => {
                 var L;
                 return /* @__PURE__ */ t(
-                  B3,
+                  A3,
                   {
                     values: a,
-                    onTagClose: q,
-                    maxWidth: ((L = D.current) == null ? void 0 : L.clientWidth) || 0,
+                    onTagClose: J,
+                    maxWidth: ((L = m.current) == null ? void 0 : L.clientWidth) || 0,
                     disabled: s,
                     options: w,
                     extraOptions: H
                   }
                 );
               },
-              onPopupScroll: d1,
-              suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(E, { children: [
-                l && u && !!u.length && /* @__PURE__ */ t("div", { onClick: h1, children: /* @__PURE__ */ t(y, { name: "cancel" }) }),
+              onPopupScroll: C1,
+              suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(W, { children: [
+                l && u && !!u.length && /* @__PURE__ */ t("div", { onClick: c1, children: /* @__PURE__ */ t(Y, { name: "cancel" }) }),
                 /* @__PURE__ */ t(
-                  y,
+                  Y,
                   {
                     name: "selectArrowIcon",
-                    color: s ? V.GREY_DARK_1 : V.GREY_DARK_5,
-                    className: W ? "select-arrow-rotated" : "select-arrow",
-                    onClick: () => I(!W)
+                    color: s ? Z.GREY_DARK_1 : Z.GREY_DARK_5,
+                    className: A ? "select-arrow-rotated" : "select-arrow",
+                    onClick: () => T(!A)
                   }
                 )
               ] }) }),
-              removeIcon: /* @__PURE__ */ t(y, { name: "errorSmall", color: V.GREY_DARK_2 }),
+              removeIcon: /* @__PURE__ */ t(Y, { name: "errorSmall", color: Z.GREY_DARK_2 }),
               options: w,
               optionRender: (a) => /* @__PURE__ */ c(K, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
                 /* @__PURE__ */ c(K, { alignItems: "center", gap: 12, children: [
                   l && /* @__PURE__ */ t(
-                    m1,
+                    v1,
                     {
                       checked: !!(u != null && u.includes(a.value))
                     }
                   ),
                   /* @__PURE__ */ c(K, { alignItems: "center", gap: 8, children: [
-                    a.data.image && /* @__PURE__ */ t(L1, { src: a.data.image, size: 20 }),
+                    a.data.image && /* @__PURE__ */ t(m1, { src: a.data.image, size: 20 }),
                     /* @__PURE__ */ t("span", { children: a.label })
                   ] })
                 ] }),
                 !l && u === a.value && /* @__PURE__ */ t(
-                  y,
+                  Y,
                   {
                     name: "ok",
-                    color: V.BLUE_PRIMARY,
+                    color: Z.BLUE_PRIMARY,
                     width: 16,
                     height: 16
                   }
                 )
-              ] })
+              ] }),
+              dropdownRender: B ? () => /* @__PURE__ */ t(
+                "div",
+                {
+                  style: {
+                    padding: "16px",
+                    display: "grid",
+                    justifyContent: "center"
+                  },
+                  children: /* @__PURE__ */ t(G3, { size: 28 })
+                }
+              ) : void 0
             }
           ),
           /* @__PURE__ */ t(
             "fieldset",
             {
-              className: `${Y ? "fieldset-focused" : ""}
+              className: `${x ? "fieldset-focused" : ""}
                      ${s ? "fieldset-disabled" : ""}
                      ${typeof i == "string" && i ? "fieldset-filled" : ""}
                      ${typeof i == "object" && i != null && i.length ? "fieldset-filled" : ""}`,
@@ -6927,8 +6948,8 @@ const s1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
     );
   }
 );
-function A3(i, o = 500) {
-  const e = X();
+function D3(i, o = 500) {
+  const e = e1();
   return R(() => () => {
     e.current && clearTimeout(e.current);
   }, []), (...r) => {
@@ -6938,10 +6959,10 @@ function A3(i, o = 500) {
     clearTimeout(e.current), e.current = w;
   };
 }
-const $ = {
+const z = {
   limit: 100,
   offset: 0
-}, y3 = b(
+}, O3 = b(
   ({
     loadOptions: i,
     width: o,
@@ -6955,61 +6976,62 @@ const $ = {
     loadOnClosedState: k,
     extraOptions: n
   }, h) => {
-    const [M, Z] = v([]), [x, H] = v($), [T, W] = v(!1), [I, Y] = v(null), _ = P(
-      async (m = !1, F) => {
-        if (!T) {
-          W(!0);
+    const [f, I] = v([]), [M, H] = v(z), [B, j] = v(!1), [A, T] = v(null), x = $(
+      async (m = !1, S) => {
+        if (!B) {
+          j(!0);
           try {
-            const S = m ? { ...$, search: F } : x, j = await i(S);
-            Z(
-              (N) => m ? j.options : [...N, ...j.options]
-            ), Y(j.count), H((N) => ({
-              ...N,
-              offset: N.offset + N.limit
+            const U = m ? { ...z, search: S } : M, D = await i(U);
+            I(
+              (_) => m ? D.options : [..._, ...D.options]
+            ), T(D.count), H((_) => ({
+              ..._,
+              offset: _.offset + _.limit
             }));
           } finally {
-            W(!1);
+            j(!1);
           }
         }
       },
-      [x, i, T]
-    ), B = A3(_), A = P(
+      [M, i, B]
+    ), V = D3(x), F = $(
       (m) => {
-        (m === "" || m === void 0 || m === null) && H($), B(!0, m);
+        (m === "" || m === void 0 || m === null) && H(z), V(!0, m);
       },
-      [B]
-    ), u = async (m) => {
-      m && I !== null && I > M.length && await _(!1);
-    }, G = P(
+      [V]
+    ), G = async (m) => {
+      m && A !== null && A > f.length && await x(!1);
+    }, u = $(
       (m) => {
-        m && !k && _(!1);
+        m && !k && x(!1);
       },
       // eslint-disable-next-line
       [k]
     );
     R(() => {
-      k && _(!1);
+      k && x(!1);
     }, []);
-    const D = {
+    const E = {
       id: r,
       width: o,
-      options: M,
+      options: f,
       onChange: e,
       ref: h,
       placeholder: s,
       search: !0,
       value: l,
-      onSearchChange: A,
-      onDropdownVisibleChange: G,
+      onSearchChange: F,
+      onDropdownVisibleChange: u,
       scrollThresholdValue: g,
-      onScrollToEnd: u,
+      onScrollToEnd: G,
       loadOnClosedState: k,
       disabled: w,
-      extraOptions: n
+      extraOptions: n,
+      isLoading: B
     };
-    return p ? /* @__PURE__ */ t(Q, { ...D, onChange: e, value: l, mode: p }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(Q, { ...D, onChange: e, value: l }) });
+    return p ? /* @__PURE__ */ t(X, { ...E, onChange: e, value: l, mode: p }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(X, { ...E, onChange: e, value: l }) });
   }
 );
 export {
-  y3 as AsyncSelect
+  O3 as AsyncSelect
 };