@snmt-react-ui/async-select 1.13.12 → 1.13.14

package/dist/async-select.js

@@ -1,6 +1,6 @@
 import "./index.css";
 import { jsx as e, Fragment as F, jsxs as n } from "react/jsx-runtime";
-import { forwardRef as J, useState as N, useRef as T, useEffect as O, useCallback as M, useContext as X, useImperativeHandle as o1, createContext as I1, useLayoutEffect as L1, useMemo as H1 } from "react";
+import { forwardRef as J, useState as Z, useRef as T, useEffect as O, useCallback as N, useContext as X, useImperativeHandle as o1, createContext as I1, useLayoutEffect as L1, useMemo as H1 } from "react";
 import { Select as O1, Tag as V1, Flex as T1, Checkbox as S1, Avatar as W1, Typography as g1, Popover as $1 } from "antd";
 import { COLORS as a, SNMTUiContext as s1 } from "@snmt-react-ui/core";
 var j1 = Object.defineProperty, F1 = (i, l, C) => l in i ? j1(i, l, { enumerable: !0, configurable: !0, writable: !0, value: C }) : i[l] = C, P1 = (i, l, C) => F1(i, l + "", C), U1 = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
@@ -36,13 +36,13 @@ const G1 = (i, l) => () => {
   }), i.loadLanguages(l, G1(i, t));
 }, q1 = function(i, l) {
   let C = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-  const t = l.languages[0], h = l.options ? l.options.fallbackLng : !1, r = l.languages[l.languages.length - 1];
+  const t = l.languages[0], h = l.options ? l.options.fallbackLng : !1, d = l.languages[l.languages.length - 1];
   if (t.toLowerCase() === "cimode") return !0;
-  const d = (w, s) => {
+  const r = (w, s) => {
     const o = l.services.backendConnector.state[`${w}|${s}`];
     return o === -1 || o === 2;
   };
-  return C.bindI18n && C.bindI18n.indexOf("languageChanging") > -1 && l.services.backendConnector.backend && l.isLanguageChangingTo && !d(l.isLanguageChangingTo, i) ? !1 : !!(l.hasResourceBundle(t, i) || !l.services.backendConnector.backend || l.options.resources && !l.options.partialBundledLanguages || d(t, i) && (!h || d(r, i)));
+  return C.bindI18n && C.bindI18n.indexOf("languageChanging") > -1 && l.services.backendConnector.backend && l.isLanguageChangingTo && !r(l.isLanguageChangingTo, i) ? !1 : !!(l.hasResourceBundle(t, i) || !l.services.backendConnector.backend || l.options.resources && !l.options.partialBundledLanguages || r(t, i) && (!h || r(d, i)));
 }, J1 = function(i, l) {
   let C = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
   return !l.languages || !l.languages.length ? (u1("i18n.languages were undefined or empty", l.languages), !0) : l.options.ignoreJSONStructure !== void 0 ? l.hasLoadedNamespace(i, {
@@ -101,57 +101,57 @@ const c2 = (i, l) => {
   return O(() => {
     C.current = i;
   }, [i, l]), C.current;
-}, K1 = (i, l, C, t) => i.getFixedT(l, C, t), n2 = (i, l, C, t) => M(K1(i, l, C, t), [i, l, C, t]), r2 = function(i) {
+}, K1 = (i, l, C, t) => i.getFixedT(l, C, t), n2 = (i, l, C, t) => N(K1(i, l, C, t), [i, l, C, t]), r2 = function(i) {
   let l = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
   const {
     i18n: C
   } = l, {
     i18n: t,
     defaultNS: h
-  } = X(s2) || {}, r = C || t || o2();
-  if (r && !r.reportNamespaces && (r.reportNamespaces = new a2()), !r) {
+  } = X(s2) || {}, d = C || t || o2();
+  if (d && !d.reportNamespaces && (d.reportNamespaces = new a2()), !d) {
     u1("You will need to pass in an i18next instance by using initReactI18next");
-    const H = (_, k) => q(k) ? k : X1(k) && q(k.defaultValue) ? k.defaultValue : Array.isArray(_) ? _[_.length - 1] : _, p = [H, {}, !1];
-    return p.t = H, p.i18n = {}, p.ready = !1, p;
+    const H = (_, k) => q(k) ? k : X1(k) && q(k.defaultValue) ? k.defaultValue : Array.isArray(_) ? _[_.length - 1] : _, g = [H, {}, !1];
+    return g.t = H, g.i18n = {}, g.ready = !1, g;
   }
-  r.options.react && r.options.react.wait !== void 0 && u1("It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
-  const d = {
+  d.options.react && d.options.react.wait !== void 0 && u1("It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
+  const r = {
     ...t2(),
-    ...r.options.react,
+    ...d.options.react,
     ...l
   }, {
     useSuspense: w,
     keyPrefix: s
-  } = d;
+  } = r;
   let o = i;
-  o = q(o) ? [o] : o || ["translation"], r.reportNamespaces.addUsedNamespaces && r.reportNamespaces.addUsedNamespaces(o);
-  const c = (r.isInitialized || r.initializedStoreOnce) && o.every((H) => J1(H, r, d)), Z = n2(r, l.lng || null, d.nsMode === "fallback" ? o : o[0], s), m = () => Z, g = () => K1(r, l.lng || null, d.nsMode === "fallback" ? o : o[0], s), [E, x] = N(m);
+  o = q(o) ? [o] : o || ["translation"], d.reportNamespaces.addUsedNamespaces && d.reportNamespaces.addUsedNamespaces(o);
+  const c = (d.isInitialized || d.initializedStoreOnce) && o.every((H) => J1(H, d, r)), v = n2(d, l.lng || null, r.nsMode === "fallback" ? o : o[0], s), p = () => v, M = () => K1(d, l.lng || null, r.nsMode === "fallback" ? o : o[0], s), [E, x] = Z(p);
   let B = o.join();
   l.lng && (B = `${l.lng}${B}`);
   const I = c2(B), A = T(!0);
   O(() => {
     const {
       bindI18n: H,
-      bindI18nStore: p
-    } = d;
-    A.current = !0, !c && !w && (l.lng ? x1(r, l.lng, o, () => {
-      A.current && x(g);
-    }) : R1(r, o, () => {
-      A.current && x(g);
-    })), c && I && I !== B && A.current && x(g);
+      bindI18nStore: g
+    } = r;
+    A.current = !0, !c && !w && (l.lng ? x1(d, l.lng, o, () => {
+      A.current && x(M);
+    }) : R1(d, o, () => {
+      A.current && x(M);
+    })), c && I && I !== B && A.current && x(M);
     const _ = () => {
-      A.current && x(g);
+      A.current && x(M);
     };
-    return H && r && r.on(H, _), p && r && r.store.on(p, _), () => {
-      A.current = !1, H && r && H.split(" ").forEach((k) => r.off(k, _)), p && r && p.split(" ").forEach((k) => r.store.off(k, _));
+    return H && d && d.on(H, _), g && d && d.store.on(g, _), () => {
+      A.current = !1, H && d && H.split(" ").forEach((k) => d.off(k, _)), g && d && g.split(" ").forEach((k) => d.store.off(k, _));
     };
-  }, [r, B]), O(() => {
-    A.current && c && x(m);
-  }, [r, s, c]);
-  const S = [E, r, c];
-  if (S.t = E, S.i18n = r, S.ready = c, c || !c && !w) return S;
+  }, [d, B]), O(() => {
+    A.current && c && x(p);
+  }, [d, s, c]);
+  const S = [E, d, c];
+  if (S.t = E, S.i18n = d, S.ready = c, c || !c && !w) return S;
   throw new Promise((H) => {
-    l.lng ? x1(r, l.lng, o, () => H()) : R1(r, o, () => H());
+    l.lng ? x1(d, l.lng, o, () => H()) : R1(d, o, () => H());
   });
 }, w1 = ({
   children: i,
@@ -159,8 +159,8 @@ const c2 = (i, l) => {
   flexWrap: C = "nowrap",
   alignItems: t = "normal",
   justifyContent: h = "normal",
-  flex: r,
-  gap: d,
+  flex: d,
+  gap: r,
   padding: w
 }) => /* @__PURE__ */ e(
   T1,
@@ -170,41 +170,41 @@ const c2 = (i, l) => {
     wrap: C,
     align: t,
     justify: h,
-    flex: r,
-    gap: d,
+    flex: d,
+    gap: r,
     style: { padding: w },
     children: i
   }
 ), d2 = (i, { enabled: l = !0 } = {}) => {
-  const [C, t] = N(!1), h = M(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), r = M(() => {
-    const d = h();
-    if (!d) {
+  const [C, t] = Z(!1), h = N(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), d = N(() => {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
     const w = {
-      whiteSpace: d.style.whiteSpace,
-      overflow: d.style.overflow,
-      textOverflow: d.style.textOverflow
+      whiteSpace: r.style.whiteSpace,
+      overflow: r.style.overflow,
+      textOverflow: r.style.textOverflow
     };
-    Object.assign(d.style, {
+    Object.assign(r.style, {
       whiteSpace: "nowrap",
       overflow: "hidden",
       textOverflow: "clip"
     });
-    const s = d.scrollWidth > d.offsetWidth + 1;
-    Object.assign(d.style, w), t(s);
+    const s = r.scrollWidth > r.offsetWidth + 1;
+    Object.assign(r.style, w), t(s);
   }, [h]);
   return L1(() => {
-    const d = h();
-    if (!d) {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
-    r();
-    const w = new ResizeObserver(r);
-    return w.observe(d), () => w.disconnect();
-  }, [h, r]), C;
+    d();
+    const w = new ResizeObserver(d);
+    return w.observe(r), () => w.disconnect();
+  }, [h, d]), C;
 }, { Title: w2, Text: L2 } = g1, g2 = {
   h1: 1,
   h2: 2,
@@ -217,37 +217,39 @@ const c2 = (i, l) => {
     color: C,
     children: t,
     onClick: h,
-    collapsed: r,
-    whiteSpace: d = "normal",
+    whiteSpace: d,
     /** This prop allows you to enable tooltip if text size is too big */
-    trim: w = !1
-  }, s) => {
-    const o = T(null);
-    o1(s, () => o.current);
-    const c = d2(o, { enabled: w }), Z = l === "h1" || l === "h2" || l === "h3" || l === "h4";
-    let m = `snmt-typography snmt-typography-${l}`;
-    i && i !== "inherit" && (m += ` snmt-typography-align-${i}`), r && (m += " collapsed");
-    const g = {
-      className: m,
-      style: { color: C, whiteSpace: w ? "nowrap" : d, display: w ? "block" : "" },
+    trim: r = !1
+  }, w) => {
+    const s = T(null);
+    o1(w, () => s.current);
+    const o = d2(s, { enabled: r }), c = l === "h1" || l === "h2" || l === "h3" || l === "h4";
+    let v = `snmt-typography snmt-typography-${l}`;
+    i && i !== "inherit" && (v += ` snmt-typography-align-${i}`);
+    const p = {
+      className: v,
+      style: {
+        color: C,
+        whiteSpace: d
+      },
       onClick: h,
-      ref: o,
-      ellipsis: w && c ? {
+      ref: s,
+      ellipsis: r && o ? {
         tooltip: {
           title: t,
           overlayClassName: "snmt-tooltip"
         }
       } : void 0
     };
-    return Z ? /* @__PURE__ */ e(w2, { level: g2[l], ...g, children: t }) : /* @__PURE__ */ e(L2, { ...g, children: t });
+    return c ? /* @__PURE__ */ e(w2, { level: g2[l], ...p, children: t }) : /* @__PURE__ */ e(L2, { ...p, children: t });
   }
 ), m2 = ({ label: i, variant: l = "small", src: C, fallbackText: t }) => {
-  const h = C != null && C.trim() ? C : void 0, r = {
+  const h = C != null && C.trim() ? C : void 0, d = {
     large: 80,
     medium: 48,
     small: 32,
     xsmall: 20
-  }, d = {
+  }, r = {
     large: "h2",
     medium: "h4",
     small: "body2",
@@ -269,8 +271,8 @@ const c2 = (i, l) => {
           {
             className: `snmt-avatar ${h ? "image" : ""}`,
             src: h,
-            size: r[l],
-            children: /* @__PURE__ */ e(A1, { color: a.GREY_LIGHT_0, variant: d[l], children: !h && t })
+            size: d[l],
+            children: /* @__PURE__ */ e(A1, { color: a.GREY_LIGHT_0, variant: r[l], children: !h && t })
           }
         ),
         i && /* @__PURE__ */ e(
@@ -285,35 +287,35 @@ const c2 = (i, l) => {
     }
   );
 }, p2 = (i, { enabled: l = !0 } = {}) => {
-  const [C, t] = N(!1), h = M(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), r = M(() => {
-    const d = h();
-    if (!d) {
+  const [C, t] = Z(!1), h = N(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), d = N(() => {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
     const w = {
-      whiteSpace: d.style.whiteSpace,
-      overflow: d.style.overflow,
-      textOverflow: d.style.textOverflow
+      whiteSpace: r.style.whiteSpace,
+      overflow: r.style.overflow,
+      textOverflow: r.style.textOverflow
     };
-    Object.assign(d.style, {
+    Object.assign(r.style, {
       whiteSpace: "nowrap",
       overflow: "hidden",
       textOverflow: "clip"
     });
-    const s = d.scrollWidth > d.offsetWidth + 1;
-    Object.assign(d.style, w), t(s);
+    const s = r.scrollWidth > r.offsetWidth + 1;
+    Object.assign(r.style, w), t(s);
   }, [h]);
   return L1(() => {
-    const d = h();
-    if (!d) {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
-    r();
-    const w = new ResizeObserver(r);
-    return w.observe(d), () => w.disconnect();
-  }, [h, r]), C;
+    d();
+    const w = new ResizeObserver(d);
+    return w.observe(r), () => w.disconnect();
+  }, [h, d]), C;
 }, { Title: f2, Text: v2 } = g1, k2 = {
   h1: 1,
   h2: 2,
@@ -326,29 +328,31 @@ const c2 = (i, l) => {
     color: C,
     children: t,
     onClick: h,
-    collapsed: r,
-    whiteSpace: d = "normal",
+    whiteSpace: d,
     /** This prop allows you to enable tooltip if text size is too big */
-    trim: w = !1
-  }, s) => {
-    const o = T(null);
-    o1(s, () => o.current);
-    const c = p2(o, { enabled: w }), Z = l === "h1" || l === "h2" || l === "h3" || l === "h4";
-    let m = `snmt-typography snmt-typography-${l}`;
-    i && i !== "inherit" && (m += ` snmt-typography-align-${i}`), r && (m += " collapsed");
-    const g = {
-      className: m,
-      style: { color: C, whiteSpace: w ? "nowrap" : d, display: w ? "block" : "" },
+    trim: r = !1
+  }, w) => {
+    const s = T(null);
+    o1(w, () => s.current);
+    const o = p2(s, { enabled: r }), c = l === "h1" || l === "h2" || l === "h3" || l === "h4";
+    let v = `snmt-typography snmt-typography-${l}`;
+    i && i !== "inherit" && (v += ` snmt-typography-align-${i}`);
+    const p = {
+      className: v,
+      style: {
+        color: C,
+        whiteSpace: d
+      },
       onClick: h,
-      ref: o,
-      ellipsis: w && c ? {
+      ref: s,
+      ellipsis: r && o ? {
         tooltip: {
           title: t,
           overlayClassName: "snmt-tooltip"
         }
       } : void 0
     };
-    return Z ? /* @__PURE__ */ e(f2, { level: k2[l], ...g, children: t }) : /* @__PURE__ */ e(v2, { ...g, children: t });
+    return c ? /* @__PURE__ */ e(f2, { level: k2[l], ...p, children: t }) : /* @__PURE__ */ e(v2, { ...p, children: t });
   }
 ), N2 = ({
   checked: i = !0,
@@ -356,9 +360,9 @@ const c2 = (i, l) => {
   label: C,
   onChange: t,
   disabled: h = !1,
-  disableUncheck: r = !1
+  disableUncheck: d = !1
 }) => {
-  const [d, w] = N(i), [s, o] = N(l);
+  const [r, w] = Z(i), [s, o] = Z(l);
   O(() => {
     w(i), o(l);
   }, [i, l]);
@@ -367,10 +371,10 @@ const c2 = (i, l) => {
     S1,
     {
       className: `snmt-checkbox snmt-checkbox-${c}`,
-      checked: d,
+      checked: r,
       indeterminate: s,
-      onChange: (Z) => {
-        r && d || (o(!1), w(Z.target.checked), t && t(Z));
+      onChange: (v) => {
+        d && r || (o(!1), w(v.target.checked), t && t(v));
       },
       disabled: h,
       children: C && /* @__PURE__ */ e(
@@ -2644,10 +2648,10 @@ const c2 = (i, l) => {
   height: C,
   color: t,
   className: h,
-  disabled: r = !1,
-  onClick: d
+  disabled: d = !1,
+  onClick: r
 }) => {
-  const { theme: w } = X(s1), s = r ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = r ? void 0 : d, c = d && !r ? `${h || ""} clickable` : h;
+  const { theme: w } = X(s1), s = d ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = d ? void 0 : r, c = r && !d ? `${h || ""} clickable` : h;
   return /* @__PURE__ */ e(F, { children: (() => {
     switch (i) {
       case "arrow1Down":
@@ -2805,35 +2809,35 @@ const c2 = (i, l) => {
     }
   })() });
 }, E5 = (i, { enabled: l = !0 } = {}) => {
-  const [C, t] = N(!1), h = M(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), r = M(() => {
-    const d = h();
-    if (!d) {
+  const [C, t] = Z(!1), h = N(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), d = N(() => {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
     const w = {
-      whiteSpace: d.style.whiteSpace,
-      overflow: d.style.overflow,
-      textOverflow: d.style.textOverflow
+      whiteSpace: r.style.whiteSpace,
+      overflow: r.style.overflow,
+      textOverflow: r.style.textOverflow
     };
-    Object.assign(d.style, {
+    Object.assign(r.style, {
       whiteSpace: "nowrap",
       overflow: "hidden",
       textOverflow: "clip"
     });
-    const s = d.scrollWidth > d.offsetWidth + 1;
-    Object.assign(d.style, w), t(s);
+    const s = r.scrollWidth > r.offsetWidth + 1;
+    Object.assign(r.style, w), t(s);
   }, [h]);
   return L1(() => {
-    const d = h();
-    if (!d) {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
-    r();
-    const w = new ResizeObserver(r);
-    return w.observe(d), () => w.disconnect();
-  }, [h, r]), C;
+    d();
+    const w = new ResizeObserver(d);
+    return w.observe(r), () => w.disconnect();
+  }, [h, d]), C;
 }, { Title: G5, Text: K5 } = g1, Y5 = {
   h1: 1,
   h2: 2,
@@ -2846,29 +2850,31 @@ const c2 = (i, l) => {
     color: C,
     children: t,
     onClick: h,
-    collapsed: r,
-    whiteSpace: d = "normal",
+    whiteSpace: d,
     /** This prop allows you to enable tooltip if text size is too big */
-    trim: w = !1
-  }, s) => {
-    const o = T(null);
-    o1(s, () => o.current);
-    const c = E5(o, { enabled: w }), Z = l === "h1" || l === "h2" || l === "h3" || l === "h4";
-    let m = `snmt-typography snmt-typography-${l}`;
-    i && i !== "inherit" && (m += ` snmt-typography-align-${i}`), r && (m += " collapsed");
-    const g = {
-      className: m,
-      style: { color: C, whiteSpace: w ? "nowrap" : d, display: w ? "block" : "" },
+    trim: r = !1
+  }, w) => {
+    const s = T(null);
+    o1(w, () => s.current);
+    const o = E5(s, { enabled: r }), c = l === "h1" || l === "h2" || l === "h3" || l === "h4";
+    let v = `snmt-typography snmt-typography-${l}`;
+    i && i !== "inherit" && (v += ` snmt-typography-align-${i}`);
+    const p = {
+      className: v,
+      style: {
+        color: C,
+        whiteSpace: d
+      },
       onClick: h,
-      ref: o,
-      ellipsis: w && c ? {
+      ref: s,
+      ellipsis: r && o ? {
         tooltip: {
           title: t,
           overlayClassName: "snmt-tooltip"
         }
       } : void 0
     };
-    return Z ? /* @__PURE__ */ e(G5, { level: Y5[l], ...g, children: t }) : /* @__PURE__ */ e(K5, { ...g, children: t });
+    return c ? /* @__PURE__ */ e(G5, { level: Y5[l], ...p, children: t }) : /* @__PURE__ */ e(K5, { ...p, children: t });
   }
 ), b5 = ({
   width: i = 20,
@@ -5131,10 +5137,10 @@ const c2 = (i, l) => {
   height: C,
   color: t,
   className: h,
-  disabled: r = !1,
-  onClick: d
+  disabled: d = !1,
+  onClick: r
 }) => {
-  const { theme: w } = X(s1), s = r ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = r ? void 0 : d, c = d && !r ? `${h || ""} clickable` : h;
+  const { theme: w } = X(s1), s = d ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = d ? void 0 : r, c = r && !d ? `${h || ""} clickable` : h;
   return /* @__PURE__ */ e(F, { children: (() => {
     switch (i) {
       case "arrow1Down":
@@ -5297,22 +5303,22 @@ const c2 = (i, l) => {
   size: C = "small",
   onClose: t,
   closable: h = !0,
-  disabled: r = !1
+  disabled: d = !1
 }) => {
-  const d = C === "small" ? 10 : 12.5, w = () => {
-    r || t == null || t();
+  const r = C === "small" ? 10 : 12.5, w = () => {
+    d || t == null || t();
   };
   return /* @__PURE__ */ e(
     V1,
     {
-      className: `snmt-tag ${C} ${r ? "disabled" : ""}`,
+      className: `snmt-tag ${C} ${d ? "disabled" : ""}`,
       closeIcon: /* @__PURE__ */ e(
         F7,
         {
           name: "cancelCircle",
-          color: r ? a.GREY_DARK_1 : a.GREY_DARK_2,
-          width: d,
-          height: d,
+          color: d ? a.GREY_DARK_1 : a.GREY_DARK_2,
+          width: r,
+          height: r,
           onClick: w
         }
       ),
@@ -5323,42 +5329,42 @@ const c2 = (i, l) => {
         B5,
         {
           variant: C === "small" ? "body4" : "body2",
-          color: r ? a.GREY_DARK_2 : a.GREY_DARK_5,
+          color: d ? a.GREY_DARK_2 : a.GREY_DARK_5,
           children: i
         }
       ) : i
     }
   );
 }, P7 = (i, { enabled: l = !0 } = {}) => {
-  const [C, t] = N(!1), h = M(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), r = M(() => {
-    const d = h();
-    if (!d) {
+  const [C, t] = Z(!1), h = N(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), d = N(() => {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
     const w = {
-      whiteSpace: d.style.whiteSpace,
-      overflow: d.style.overflow,
-      textOverflow: d.style.textOverflow
+      whiteSpace: r.style.whiteSpace,
+      overflow: r.style.overflow,
+      textOverflow: r.style.textOverflow
     };
-    Object.assign(d.style, {
+    Object.assign(r.style, {
       whiteSpace: "nowrap",
       overflow: "hidden",
       textOverflow: "clip"
     });
-    const s = d.scrollWidth > d.offsetWidth + 1;
-    Object.assign(d.style, w), t(s);
+    const s = r.scrollWidth > r.offsetWidth + 1;
+    Object.assign(r.style, w), t(s);
   }, [h]);
   return L1(() => {
-    const d = h();
-    if (!d) {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
-    r();
-    const w = new ResizeObserver(r);
-    return w.observe(d), () => w.disconnect();
-  }, [h, r]), C;
+    d();
+    const w = new ResizeObserver(d);
+    return w.observe(r), () => w.disconnect();
+  }, [h, d]), C;
 }, { Title: U7, Text: z7 } = g1, q7 = {
   h1: 1,
   h2: 2,
@@ -5371,29 +5377,31 @@ const c2 = (i, l) => {
     color: C,
     children: t,
     onClick: h,
-    collapsed: r,
-    whiteSpace: d = "normal",
+    whiteSpace: d,
     /** This prop allows you to enable tooltip if text size is too big */
-    trim: w = !1
-  }, s) => {
-    const o = T(null);
-    o1(s, () => o.current);
-    const c = P7(o, { enabled: w }), Z = l === "h1" || l === "h2" || l === "h3" || l === "h4";
-    let m = `snmt-typography snmt-typography-${l}`;
-    i && i !== "inherit" && (m += ` snmt-typography-align-${i}`), r && (m += " collapsed");
-    const g = {
-      className: m,
-      style: { color: C, whiteSpace: w ? "nowrap" : d, display: w ? "block" : "" },
+    trim: r = !1
+  }, w) => {
+    const s = T(null);
+    o1(w, () => s.current);
+    const o = P7(s, { enabled: r }), c = l === "h1" || l === "h2" || l === "h3" || l === "h4";
+    let v = `snmt-typography snmt-typography-${l}`;
+    i && i !== "inherit" && (v += ` snmt-typography-align-${i}`);
+    const p = {
+      className: v,
+      style: {
+        color: C,
+        whiteSpace: d
+      },
       onClick: h,
-      ref: o,
-      ellipsis: w && c ? {
+      ref: s,
+      ellipsis: r && o ? {
         tooltip: {
           title: t,
           overlayClassName: "snmt-tooltip"
         }
       } : void 0
     };
-    return Z ? /* @__PURE__ */ e(U7, { level: q7[l], ...g, children: t }) : /* @__PURE__ */ e(z7, { ...g, children: t });
+    return c ? /* @__PURE__ */ e(U7, { level: q7[l], ...p, children: t }) : /* @__PURE__ */ e(z7, { ...p, children: t });
   }
 ), X7 = ({
   children: i,
@@ -5401,18 +5409,18 @@ const c2 = (i, l) => {
   isOpen: C,
   setIsOpen: t,
   placement: h = "topRight",
-  noPadding: r = !1,
-  trigger: d = "click"
+  noPadding: d = !1,
+  trigger: r = "click"
 }) => {
-  const [w, s] = N(!1);
+  const [w, s] = Z(!1);
   return /* @__PURE__ */ e(
     $1,
     {
       content: l,
       arrow: !1,
       placement: h,
-      trigger: d,
-      overlayClassName: `snmt-popover ${r ? "" : "padding"}`,
+      trigger: r,
+      overlayClassName: `snmt-popover ${d ? "" : "padding"}`,
       open: C ?? w,
       onOpenChange: (o) => {
         s(o), t == null || t(o);
@@ -5421,35 +5429,35 @@ const c2 = (i, l) => {
     }
   );
 }, Q7 = (i, { enabled: l = !0 } = {}) => {
-  const [C, t] = N(!1), h = M(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), r = M(() => {
-    const d = h();
-    if (!d) {
+  const [C, t] = Z(!1), h = N(() => !l || !i || typeof i == "function" ? null : i.current, [l, i]), d = N(() => {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
     const w = {
-      whiteSpace: d.style.whiteSpace,
-      overflow: d.style.overflow,
-      textOverflow: d.style.textOverflow
+      whiteSpace: r.style.whiteSpace,
+      overflow: r.style.overflow,
+      textOverflow: r.style.textOverflow
     };
-    Object.assign(d.style, {
+    Object.assign(r.style, {
       whiteSpace: "nowrap",
       overflow: "hidden",
       textOverflow: "clip"
     });
-    const s = d.scrollWidth > d.offsetWidth + 1;
-    Object.assign(d.style, w), t(s);
+    const s = r.scrollWidth > r.offsetWidth + 1;
+    Object.assign(r.style, w), t(s);
   }, [h]);
   return L1(() => {
-    const d = h();
-    if (!d) {
+    const r = h();
+    if (!r) {
       t(!1);
       return;
     }
-    r();
-    const w = new ResizeObserver(r);
-    return w.observe(d), () => w.disconnect();
-  }, [h, r]), C;
+    d();
+    const w = new ResizeObserver(d);
+    return w.observe(r), () => w.disconnect();
+  }, [h, d]), C;
 }, { Title: C9, Text: l9 } = g1, e9 = {
   h1: 1,
   h2: 2,
@@ -5462,29 +5470,31 @@ const c2 = (i, l) => {
     color: C,
     children: t,
     onClick: h,
-    collapsed: r,
-    whiteSpace: d = "normal",
+    whiteSpace: d,
     /** This prop allows you to enable tooltip if text size is too big */
-    trim: w = !1
-  }, s) => {
-    const o = T(null);
-    o1(s, () => o.current);
-    const c = Q7(o, { enabled: w }), Z = l === "h1" || l === "h2" || l === "h3" || l === "h4";
-    let m = `snmt-typography snmt-typography-${l}`;
-    i && i !== "inherit" && (m += ` snmt-typography-align-${i}`), r && (m += " collapsed");
-    const g = {
-      className: m,
-      style: { color: C, whiteSpace: w ? "nowrap" : d, display: w ? "block" : "" },
+    trim: r = !1
+  }, w) => {
+    const s = T(null);
+    o1(w, () => s.current);
+    const o = Q7(s, { enabled: r }), c = l === "h1" || l === "h2" || l === "h3" || l === "h4";
+    let v = `snmt-typography snmt-typography-${l}`;
+    i && i !== "inherit" && (v += ` snmt-typography-align-${i}`);
+    const p = {
+      className: v,
+      style: {
+        color: C,
+        whiteSpace: d
+      },
       onClick: h,
-      ref: o,
-      ellipsis: w && c ? {
+      ref: s,
+      ellipsis: r && o ? {
         tooltip: {
           title: t,
           overlayClassName: "snmt-tooltip"
         }
       } : void 0
     };
-    return Z ? /* @__PURE__ */ e(C9, { level: e9[l], ...g, children: t }) : /* @__PURE__ */ e(l9, { ...g, children: t });
+    return c ? /* @__PURE__ */ e(C9, { level: e9[l], ...p, children: t }) : /* @__PURE__ */ e(l9, { ...p, children: t });
   }
 ), i9 = ({
   width: i = 20,
@@ -7747,10 +7757,10 @@ const c2 = (i, l) => {
   height: C,
   color: t,
   className: h,
-  disabled: r = !1,
-  onClick: d
+  disabled: d = !1,
+  onClick: r
 }) => {
-  const { theme: w } = X(s1), s = r ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = r ? void 0 : d, c = d && !r ? `${h || ""} clickable` : h;
+  const { theme: w } = X(s1), s = d ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = d ? void 0 : r, c = r && !d ? `${h || ""} clickable` : h;
   return /* @__PURE__ */ e(F, { children: (() => {
     switch (i) {
       case "arrow1Down":
@@ -7913,7 +7923,7 @@ const c2 = (i, l) => {
   size: C = "medium",
   width: t
 }) => {
-  const h = C === "medium" ? "body2" : C === "small" ? "body4" : "caption", r = C === "xsmall" ? "purple" : l, d = {
+  const h = C === "medium" ? "body2" : C === "small" ? "body4" : "caption", d = C === "xsmall" ? "purple" : l, r = {
     cyan: a.CYAN_LIGHT,
     red: a.NOTIFICATION_ERROR_LIGHT,
     orange: a.NOTIFICATION_WARNING_LIGHT,
@@ -7927,7 +7937,7 @@ const c2 = (i, l) => {
     {
       className: `snmt-regular-badge snmt-regular-badge--${C}`,
       style: {
-        background: d[r],
+        background: r[d],
         width: t ?? "fit-content"
       },
       children: /* @__PURE__ */ e(B1, { variant: h, color: a.GREY_DARK_4, children: i })
@@ -7960,12 +7970,12 @@ const c2 = (i, l) => {
       }
     ),
     canceled: /* @__PURE__ */ e(N1, { name: "cancelCircle", width: 14, height: 14, color: a.GREY_DARK_2 })
-  }, r = {
+  }, d = {
     approved: a.NOTIFICATION_SUCCESS_LIGHT,
     pending: a.NOTIFICATION_WARNING_LIGHT,
     rejected: a.NOTIFICATION_ERROR_LIGHT,
     canceled: a.GREY_LIGHT_2
-  }, d = {
+  }, r = {
     approved: a.NOTIFICATION_SUCCESS_DARK,
     pending: a.NOTIFICATION_WARNING_DARK,
     rejected: a.NOTIFICATION_ERROR_DARK,
@@ -7975,10 +7985,10 @@ const c2 = (i, l) => {
     V1,
     {
       className: `snmt-status-badge snmt-status-badge--${C ? "with-icon" : "without-icon"}`,
-      style: { background: r[l], width: t ?? "fit-content" },
+      style: { background: d[l], width: t ?? "fit-content" },
       children: [
         C && h[l],
-        /* @__PURE__ */ e(B1, { variant: "body4", color: d[l], children: i })
+        /* @__PURE__ */ e(B1, { variant: "body4", color: r[l], children: i })
       ]
     }
   );
@@ -8000,27 +8010,27 @@ const g4 = ({
   maxWidth: C,
   closable: t = !0,
   disabled: h,
-  options: r,
-  extraOptions: d,
+  options: d,
+  extraOptions: r,
   selectedItemVariant: w = "default"
 }) => {
-  const { locale: s } = X(s1), { t: o } = r2("common", { lng: s }), [c, Z] = N(!1);
+  const { locale: s } = X(s1), { t: o } = r2("common", { lng: s }), [c, v] = Z(!1);
   if (O(() => {
-    i.length || Z(!1);
+    i.length || v(!1);
   }, [i]), !i.length)
     return null;
-  const m = (g) => {
+  const p = (M) => {
     var E, x;
-    return ((E = r == null ? void 0 : r.find((I) => I.value === g)) == null ? void 0 : E.label) || ((x = d == null ? void 0 : d.find((I) => I.value === g)) == null ? void 0 : x.label) || g;
+    return ((E = d == null ? void 0 : d.find((I) => I.value === M)) == null ? void 0 : E.label) || ((x = r == null ? void 0 : r.find((I) => I.value === M)) == null ? void 0 : x.label) || M;
   };
   return /* @__PURE__ */ n(
     X7,
     {
       content: (
         // 90: paddings + margins + gaps and so on
-        /* @__PURE__ */ e("div", { style: { maxWidth: C - 90 }, className: "snmt-popover-from-select", children: /* @__PURE__ */ e(w1, { gap: 6, flexWrap: "wrap", children: i.map(({ value: g }) => {
-          const E = w === "badge" && r.find(
-            (x) => x.label === m(g)
+        /* @__PURE__ */ e("div", { style: { maxWidth: C - 90 }, className: "snmt-popover-from-select", children: /* @__PURE__ */ e(w1, { gap: 6, flexWrap: "wrap", children: i.map(({ value: M }) => {
+          const E = w === "badge" && d.find(
+            (x) => x.label === p(M)
           );
           return w === "badge" ? /* @__PURE__ */ e(
             b1,
@@ -8028,24 +8038,24 @@ const g4 = ({
               variant: "regular",
               size: "small",
               color: E ? E.color : void 0,
-              text: m(g)
+              text: p(M)
             },
-            g
+            M
           ) : /* @__PURE__ */ e(
             Y1,
             {
-              onClose: () => l(g),
+              onClose: () => l(M),
               closable: t,
               disabled: h,
-              children: m(g)
+              children: p(M)
             },
-            g
+            M
           );
         }) }) })
       ),
       placement: "bottomRight",
       isOpen: c,
-      setIsOpen: Z,
+      setIsOpen: v,
       children: [
         i.length,
         " ",
@@ -10326,10 +10336,10 @@ const g4 = ({
   height: C,
   color: t,
   className: h,
-  disabled: r = !1,
-  onClick: d
+  disabled: d = !1,
+  onClick: r
 }) => {
-  const { theme: w } = X(s1), s = r ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = r ? void 0 : d, c = d && !r ? `${h || ""} clickable` : h;
+  const { theme: w } = X(s1), s = d ? w && w === "dark" ? a.GREY_LIGHT_4 : a.GREY_DARK_1 : t, o = d ? void 0 : r, c = r && !d ? `${h || ""} clickable` : h;
   return /* @__PURE__ */ e(F, { children: (() => {
     switch (i) {
       case "arrow1Down":
@@ -10493,11 +10503,11 @@ const g4 = ({
   disabled: t = !1,
   onClick: h
 }) => {
-  const r = x0(l, t), d = R0(l, t);
+  const d = x0(l, t), r = R0(l, t);
   return /* @__PURE__ */ e(
     "button",
     {
-      className: `snmt-arrow-button${d ? ` snmt-arrow-button${d}` : ""}`,
+      className: `snmt-arrow-button${r ? ` snmt-arrow-button${r}` : ""}`,
       onClick: h,
       disabled: t,
       children: /* @__PURE__ */ e(
@@ -10505,7 +10515,7 @@ const g4 = ({
         {
           name: i,
           className: "snmt-arrow-button-icon-rotation" + (l && !t ? `-${C}` : "-initial"),
-          color: r
+          color: d
         }
       )
     }
@@ -10522,15 +10532,15 @@ const A0 = J((i, l) => {
     value: C,
     onChange: t,
     placeholder: h,
-    mode: r,
-    search: d = !1,
+    mode: d,
+    search: r = !1,
     options: w,
     width: s,
     disabled: o = !1,
     required: c = !1,
-    clearable: Z = !0,
-    scrollThresholdValue: m = 50,
-    onSearchChange: g,
+    clearable: v = !0,
+    scrollThresholdValue: p = 50,
+    onSearchChange: M,
     onDropdownVisibleChange: E,
     onScrollToEnd: x,
     onPopupScroll: B,
@@ -10538,60 +10548,60 @@ const A0 = J((i, l) => {
     extraOptions: A,
     dropdownRender: S,
     optionRender: H,
-    isLoading: p,
+    isLoading: g,
     readOnly: _,
     error: k,
     selectedItemVariant: b = "default",
     variant: G = "outlined"
   } = i;
   let Q;
-  r && r !== "single" && (Q = i.overflowBehaviour ?? "responsive");
-  const [Y, U] = N(!1), [z, m1] = N(!1), [W, a1] = N(!1), [c1, C1] = N(!0), [u, $] = N(C), n1 = T(null), l1 = r === "single" && b === "badge";
+  d && d !== "single" && (Q = i.overflowBehaviour ?? "responsive");
+  const [Y, U] = Z(!1), [z, m1] = Z(!1), [W, a1] = Z(!1), [c1, C1] = Z(!0), [u, $] = Z(C), n1 = T(null), l1 = d === "single" && b === "badge";
   O(() => {
     $(C);
   }, [C]);
   const p1 = (L) => {
     U(L), E && E(L);
-  }, f1 = (L, f) => {
+  }, f1 = (L, m) => {
     var V;
-    return !!((V = f == null ? void 0 : f.label) != null && V.toString().toLowerCase().includes(L.toLowerCase()));
+    return !!((V = m == null ? void 0 : m.label) != null && V.toString().toLowerCase().includes(L.toLowerCase()));
   }, v1 = () => {
     m1(!0);
   }, k1 = () => {
     m1(!1);
-  }, P = M(
+  }, P = N(
     (L) => {
-      let f = null;
+      let m = null;
       if (l1) {
         const V = Array.isArray(L) ? L : [];
-        f = V.length > 1 ? [V[V.length - 1]] : V;
-        const r1 = f.length > 0 ? f[0] : null;
-        t == null || t(r1), $(f);
+        m = V.length > 1 ? [V[V.length - 1]] : V;
+        const r1 = m.length > 0 ? m[0] : null;
+        t == null || t(r1), $(m);
         return;
       }
-      if (r && r !== "single") {
+      if (d && d !== "single") {
         const V = L;
         t == null || t(V), $(V);
         return;
       }
-      f = Array.isArray(L) ? null : L || null, t == null || t(f), $(f);
+      m = Array.isArray(L) ? null : L || null, t == null || t(m), $(m);
     },
-    [r, t, l1]
-  ), M1 = M(() => {
+    [d, t, l1]
+  ), M1 = N(() => {
     if (!(_ || o)) {
-      if (r) {
+      if (d) {
         P([]);
         return;
       }
       P("");
     }
-  }, [o, P, r, _]), e1 = M(
+  }, [o, P, d, _]), e1 = N(
     (L) => {
-      const f = u.filter((V) => V !== L);
-      P(f), $(f);
+      const m = u.filter((V) => V !== L);
+      P(m), $(m);
     },
     [P, u]
-  ), v = M(
+  ), f = N(
     (L) => (u == null ? void 0 : u.indexOf(L)) === 0 ? (
       // if the search input is empty
       // then display the placeholder, else do not display it
@@ -10601,16 +10611,16 @@ const A0 = J((i, l) => {
   ), D = (L) => {
     L.preventDefault(), L.stopPropagation();
   }, j = async (L) => {
-    const { target: f } = L;
-    f.scrollTop + f.offsetHeight >= f.scrollHeight - m && (x == null || x(!0)), B && await B(L);
-  }, R = M(
+    const { target: m } = L;
+    m.scrollTop + m.offsetHeight >= m.scrollHeight - p && (x == null || x(!0)), B && await B(L);
+  }, R = N(
     (L) => {
-      var f, V;
-      return ((f = w.find((t1) => t1.value === L)) == null ? void 0 : f.label) || ((V = A == null ? void 0 : A.find((t1) => t1.value === L)) == null ? void 0 : V.label) || L;
+      var m, V;
+      return ((m = w.find((t1) => t1.value === L)) == null ? void 0 : m.label) || ((V = A == null ? void 0 : A.find((t1) => t1.value === L)) == null ? void 0 : V.label) || L;
     },
     [A, w]
-  ), K = M(
-    (L, f = "default") => {
+  ), K = N(
+    (L, m = "default") => {
       var V;
       return /* @__PURE__ */ e(
         g4,
@@ -10622,17 +10632,17 @@ const A0 = J((i, l) => {
           closable: !_,
           options: w,
           extraOptions: A,
-          selectedItemVariant: f
+          selectedItemVariant: m
         }
       );
     },
     [o, A, e1, w, _]
-  ), y = M(
-    ({ label: L, value: f, mode: V }) => {
+  ), y = N(
+    ({ label: L, value: m, mode: V }) => {
       if (V === "filter")
-        return v(f);
+        return f(m);
       {
-        const r1 = b === "badge" && w.find((y1) => y1.label === L), t1 = typeof L == "object" ? L : R(f);
+        const r1 = b === "badge" && w.find((y1) => y1.label === L), t1 = typeof L == "object" ? L : R(m);
         return /* @__PURE__ */ e("div", { onMouseDown: D, className: "tag-wrapper", children: b === "badge" ? /* @__PURE__ */ e(
           b1,
           {
@@ -10641,10 +10651,10 @@ const A0 = J((i, l) => {
             color: r1 ? r1.color : "cyan",
             text: t1
           }
-        ) : /* @__PURE__ */ e(Y1, { onClose: () => e1(f), disabled: o, children: t1 }) });
+        ) : /* @__PURE__ */ e(Y1, { onClose: () => e1(m), disabled: o, children: t1 }) });
       }
     },
-    [o, R, e1, v, b, w]
+    [o, R, e1, f, b, w]
   ), i1 = Array.isArray(u) && u.length > 0 || !!u && typeof u == "string" && u.trim() !== "";
   return /* @__PURE__ */ n(
     "div",
@@ -10655,7 +10665,7 @@ const A0 = J((i, l) => {
           "div",
           {
             className: `snmt-select ${z ? "snmt-select-focused" : ""} 
-                    ${r ? "" : "snmt-select-single"} 
+                    ${d ? "" : "snmt-select-single"} 
                     ${_ ? "snmt-select-read-only" : ""} 
                     ${Q === "static" ? "snmt-select-static" : ""} 
                     ${G === "borderless" ? "snmt-select-borderless" : ""}`,
@@ -10669,16 +10679,16 @@ const A0 = J((i, l) => {
                   popupClassName: _ ? "dropdown-read-only" : "",
                   id: I,
                   ref: l,
-                  showSearch: !!d,
-                  filterOption: d && f1,
+                  showSearch: !!r,
+                  filterOption: r && f1,
                   onDropdownVisibleChange: p1,
                   disabled: o,
                   value: u || void 0,
                   labelRender: (L) => {
-                    const f = R(L.value);
-                    return o ? /* @__PURE__ */ e("span", { style: { color: a.GREY_DARK_1 }, children: f }) : f;
+                    const m = R(L.value);
+                    return o ? /* @__PURE__ */ e("span", { style: { color: a.GREY_DARK_1 }, children: m }) : m;
                   },
-                  mode: D0(r, l1),
+                  mode: D0(d, l1),
                   variant: G,
                   onChange: P,
                   onFocus: v1,
@@ -10686,17 +10696,17 @@ const A0 = J((i, l) => {
                   onMouseEnter: () => a1(!0),
                   onMouseLeave: () => a1(!1),
                   onSearch: (L) => {
-                    C1(!L), g && g(L);
+                    C1(!L), M && M(L);
                   },
                   onSelect: () => C1(!0),
                   onDeselect: () => C1(!0),
-                  tagRender: (L) => y({ ...L, mode: r }),
+                  tagRender: (L) => y({ ...L, mode: d }),
                   maxTagCount: Q === "responsive" ? "responsive" : void 0,
                   maxTagPlaceholder: (L) => K(L, b),
                   onPopupScroll: j,
-                  prefix: p && /* @__PURE__ */ e(D1, { size: "small" }),
-                  suffixIcon: /* @__PURE__ */ e("div", { className: "wrapper-suffix-icon", children: r !== "filter" && /* @__PURE__ */ n(F, { children: [
-                    u && !!u.length && Z && /* @__PURE__ */ e(
+                  prefix: g && /* @__PURE__ */ e(D1, { size: "small" }),
+                  suffixIcon: /* @__PURE__ */ e("div", { className: "wrapper-suffix-icon", children: d !== "filter" && /* @__PURE__ */ n(F, { children: [
+                    u && !!u.length && v && /* @__PURE__ */ e(
                       "div",
                       {
                         onClick: M1,
@@ -10733,7 +10743,7 @@ const A0 = J((i, l) => {
                   options: w,
                   optionRender: (L) => H ? H(L.data) : /* @__PURE__ */ n(w1, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
                     /* @__PURE__ */ n(w1, { alignItems: "center", gap: 12, children: [
-                      r && /* @__PURE__ */ e(
+                      d && /* @__PURE__ */ e(
                         N2,
                         {
                           checked: !!(u != null && u.includes(L.value))
@@ -10751,18 +10761,18 @@ const A0 = J((i, l) => {
                         /* @__PURE__ */ e("span", { children: L.label })
                       ] })
                     ] }),
-                    !r && u === L.value && /* @__PURE__ */ e(d1, { name: "check", color: a.BLUE_DARK_1 })
+                    !d && u === L.value && /* @__PURE__ */ e(d1, { name: "check", color: a.BLUE_DARK_1 })
                   ] }),
                   dropdownRender: (L) => /* @__PURE__ */ n("div", { className: "dropdown-container", children: [
                     /* @__PURE__ */ e("div", { className: "dropdown-menu", children: S ? S(L) : L }),
-                    p && /* @__PURE__ */ e("div", { className: "loading-overlay", children: /* @__PURE__ */ e(D1, {}) })
+                    g && /* @__PURE__ */ e("div", { className: "loading-overlay", children: /* @__PURE__ */ e(D1, {}) })
                   ] })
                 }
               ),
               h && G !== "borderless" && /* @__PURE__ */ e(
                 "label",
                 {
-                  className: `${z || i1 ? "label-floating" : ""} ${o ? "label-disabled" : ""} ${z ? "label-focused" : ""} ${p ? "label-loading" : ""} ${k ? "label-error" : ""}`,
+                  className: `${z || i1 ? "label-floating" : ""} ${o ? "label-disabled" : ""} ${z ? "label-focused" : ""} ${g ? "label-loading" : ""} ${k ? "label-error" : ""}`,
                   children: c ? `${h}*` : h
                 }
               ),
@@ -10801,10 +10811,10 @@ function E0(i, l = 500) {
   return O(() => () => {
     C.current && clearTimeout(C.current);
   }, []), (...h) => {
-    const r = setTimeout(() => {
+    const d = setTimeout(() => {
       i(...h);
     }, l);
-    clearTimeout(C.current), C.current = r;
+    clearTimeout(C.current), C.current = d;
   };
 }
 function E1(i) {
@@ -10820,15 +10830,15 @@ const Z1 = 100, h1 = {
     loadOptions: C,
     width: t,
     onChange: h,
-    id: r,
-    disabled: d,
+    id: d,
+    disabled: r,
     scrollThresholdValue: w,
     placeholder: s,
     mode: o,
     loadOnClosedState: c,
-    preloadOptions: Z,
-    extraOptions: m,
-    onDropdownVisibleChange: g,
+    preloadOptions: v,
+    extraOptions: p,
+    onDropdownVisibleChange: M,
     optionRender: E,
     dropdownRender: x,
     readOnly: B,
@@ -10836,18 +10846,18 @@ const Z1 = 100, h1 = {
     required: A = !1,
     error: S,
     variant: H = "outlined"
-  } = i, [p, _] = N(), [k, b] = N(h1), [G, Q] = N(!1), [Y, U] = N(), [z, m1] = N(!1), [W, a1] = N(
-    m ?? []
-  ), c1 = E1(k.offset), C1 = E1(Y), [u, $] = N(!1), n1 = T(!1), l1 = M(
+  } = i, [g, _] = Z(), [k, b] = Z(h1), [G, Q] = Z(!1), [Y, U] = Z(), [z, m1] = Z(!1), [W, a1] = Z(
+    p ?? []
+  ), c1 = E1(k.offset), C1 = E1(Y), [u, $] = Z(!1), n1 = T(!1), l1 = N(
     async ({
-      limit: v = Z1,
+      limit: f = Z1,
       offset: D,
       search: j
     }) => {
       Q(!0);
       try {
         const R = await C({
-          limit: v,
+          limit: f,
           offset: D,
           search: j
         });
@@ -10864,50 +10874,50 @@ const Z1 = 100, h1 = {
       }
     },
     [C]
-  ), p1 = E0((v) => {
-    U(v), v || b(h1);
-  }), f1 = M(
-    (v) => p1(v),
+  ), p1 = E0((f) => {
+    U(f), f || b(h1);
+  }), f1 = N(
+    (f) => p1(f),
     [p1]
-  ), v1 = M(
-    async (v) => {
-      G || v && k.count && k.count > ((p == null ? void 0 : p.length) ?? 0) && b((D) => ({
+  ), v1 = N(
+    async (f) => {
+      G || f && k.count && k.count > ((g == null ? void 0 : g.length) ?? 0) && b((D) => ({
         ...D,
         offset: D.offset + Z1
       }));
     },
-    [G, p == null ? void 0 : p.length, k.count]
-  ), k1 = M(
-    (v) => {
-      m1(v), !v && Y && (U(void 0), b(h1), $(!0)), g == null || g(v);
+    [G, g == null ? void 0 : g.length, k.count]
+  ), k1 = N(
+    (f) => {
+      m1(f), !f && Y && (U(void 0), b(h1), $(!0)), M == null || M(f);
     },
-    [g, Y]
+    [M, Y]
   );
   O(() => {
     if (!n1.current || G) return;
-    (u || z && (c1 !== k.offset || C1 !== Y || !p)) && (l1({ offset: k.offset, limit: Z1, search: Y }), u && $(!1));
-  }, [u, z, k.offset, Y, c1, C1, p, G]), O(() => {
-    (c || Z) && l1(h1), n1.current = !0;
+    (u || z && (c1 !== k.offset || C1 !== Y || !g)) && (l1({ offset: k.offset, limit: Z1, search: Y }), u && $(!1));
+  }, [u, z, k.offset, Y, c1, C1, g, G]), O(() => {
+    (c || v) && l1(h1), n1.current = !0;
   }, []), O(() => {
-    m && a1((v) => {
-      const D = m.filter(
-        (j) => !v.some((R) => R.value === j.value)
+    p && a1((f) => {
+      const D = p.filter(
+        (j) => !f.some((R) => R.value === j.value)
       );
-      return [...v, ...D];
+      return [...f, ...D];
     });
-  }, [m]);
-  const P = M(
-    (v) => {
-      h && h(v);
+  }, [p]);
+  const P = N(
+    (f) => {
+      h && h(f);
       let D = [];
-      if (o ? D = Array.isArray(v) ? v : [] : D = v ? [v] : [], Y) {
+      if (o ? D = Array.isArray(f) ? f : [] : D = f ? [f] : [], Y) {
         const j = D.filter(
           (R) => !(W != null && W.some((K) => K.value === R))
         );
         j.length > 0 && a1((R = []) => [
           ...R,
           ...j.map((K) => {
-            const y = p == null ? void 0 : p.find((i1) => i1.value === K);
+            const y = g == null ? void 0 : g.find((i1) => i1.value === K);
             return {
               value: K,
               label: (y == null ? void 0 : y.label) ?? K,
@@ -10918,10 +10928,10 @@ const Z1 = 100, h1 = {
         ]), U(void 0), b(h1), $(!0);
       }
     },
-    [h, Y, o, p, W]
+    [h, Y, o, g, W]
   ), M1 = H1(
     () => ({
-      id: r,
+      id: d,
       width: t,
       onChange: P,
       ref: l,
@@ -10931,7 +10941,7 @@ const Z1 = 100, h1 = {
       onDropdownVisibleChange: k1,
       scrollThresholdValue: w,
       onScrollToEnd: v1,
-      disabled: d,
+      disabled: r,
       isLoading: G,
       optionRender: E,
       dropdownRender: x,
@@ -10942,7 +10952,7 @@ const Z1 = 100, h1 = {
       variant: H
     }),
     [
-      r,
+      d,
       t,
       P,
       l,
@@ -10951,7 +10961,7 @@ const Z1 = 100, h1 = {
       k1,
       w,
       v1,
-      d,
+      r,
       G,
       E,
       x,
@@ -10968,7 +10978,7 @@ const Z1 = 100, h1 = {
     }
   }));
   const e1 = H1(() => {
-    const v = o && o !== "single", D = i.selectedItemVariant === "badge", j = D ? p || [] : p || [], R = W, K = i, i1 = v ? {
+    const f = o && o !== "single", D = i.selectedItemVariant === "badge", j = D ? g || [] : g || [], R = W, K = i, i1 = f ? {
       mode: o,
       overflowBehaviour: K.overflowBehaviour,
       value: K.value
@@ -10983,7 +10993,7 @@ const Z1 = 100, h1 = {
       options: j,
       extraOptions: R
     };
-  }, [o, i, M1, W, p]);
+  }, [o, i, M1, W, g]);
   return /* @__PURE__ */ e("div", { className: "snmt-async-select", children: /* @__PURE__ */ e(A0, { ...e1 }) });
 });
 export {