@snmt-react-ui/async-select 1.7.7 → 1.8.0

package/dist/async-select.js

@@ -1,20 +1,20 @@
 import "./index.css";
-import { jsx as t, Fragment as O, jsxs as c } from "react/jsx-runtime";
-import { createContext as r1, forwardRef as d1, useState as H, useRef as z, useEffect as B, useCallback as A, useContext as n1, useMemo as Z1, useImperativeHandle as W1 } from "react";
+import { jsx as t, Fragment as F, jsxs as c } from "react/jsx-runtime";
+import { createContext as r1, forwardRef as k1, useState as H, useRef as q, useEffect as I, useCallback as W, useContext as n1, useMemo as Z1, useImperativeHandle as W1 } from "react";
 import { Select as I1, Flex as A1, Avatar as B1, Checkbox as G1, Typography as x1, Tag as y1, Popover as D1 } from "antd";
 var j1 = Object.defineProperty, T1 = (i, o, e) => o in i ? j1(i, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[o] = e, Y1 = (i, o, e) => T1(i, o + "", e), K1 = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
 function b1() {
   if (console && console.warn) {
     for (var i = arguments.length, o = new Array(i), e = 0; e < i; e++)
       o[e] = arguments[e];
-    S(o[0]) && (o[0] = `react-i18next:: ${o[0]}`), console.warn(...o);
+    U(o[0]) && (o[0] = `react-i18next:: ${o[0]}`), console.warn(...o);
   }
 }
 const m1 = {};
-function g1() {
+function p1() {
   for (var i = arguments.length, o = new Array(i), e = 0; e < i; e++)
     o[e] = arguments[e];
-  S(o[0]) && m1[o[0]] || (S(o[0]) && (m1[o[0]] = /* @__PURE__ */ new Date()), b1(...o));
+  U(o[0]) && m1[o[0]] || (U(o[0]) && (m1[o[0]] = /* @__PURE__ */ new Date()), b1(...o));
 }
 const _1 = (i, o) => () => {
   if (i.isInitialized)
@@ -30,27 +30,27 @@ const _1 = (i, o) => () => {
 }, u1 = (i, o, e) => {
   i.loadNamespaces(o, _1(i, e));
 }, v1 = (i, o, e, l) => {
-  S(e) && (e = [e]), e.forEach((r) => {
+  U(e) && (e = [e]), e.forEach((r) => {
     i.options.ns.indexOf(r) < 0 && i.options.ns.push(r);
   }), i.loadLanguages(o, _1(i, l));
 }, O1 = function(i, o) {
   let e = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
   const l = o.languages[0], r = o.options ? o.options.fallbackLng : !1, a = o.languages[o.languages.length - 1];
   if (l.toLowerCase() === "cimode") return !0;
-  const g = (n, L) => {
-    const k = o.services.backendConnector.state[`${n}|${L}`];
+  const g = (n, m) => {
+    const k = o.services.backendConnector.state[`${n}|${m}`];
     return k === -1 || k === 2;
   };
   return e.bindI18n && e.bindI18n.indexOf("languageChanging") > -1 && o.services.backendConnector.backend && o.isLanguageChangingTo && !g(o.isLanguageChangingTo, i) ? !1 : !!(o.hasResourceBundle(l, i) || !o.services.backendConnector.backend || o.options.resources && !o.options.partialBundledLanguages || g(l, i) && (!r || g(a, i)));
 }, S1 = function(i, o) {
   let e = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-  return !o.languages || !o.languages.length ? (g1("i18n.languages were undefined or empty", o.languages), !0) : o.options.ignoreJSONStructure !== void 0 ? o.hasLoadedNamespace(i, {
+  return !o.languages || !o.languages.length ? (p1("i18n.languages were undefined or empty", o.languages), !0) : o.options.ignoreJSONStructure !== void 0 ? o.hasLoadedNamespace(i, {
     lng: e.lng,
     precheck: (l, r) => {
       if (e.bindI18n && e.bindI18n.indexOf("languageChanging") > -1 && l.services.backendConnector.backend && l.isLanguageChangingTo && !r(l.isLanguageChangingTo, i)) return !1;
     }
   }) : O1(i, o, e);
-}, S = (i) => typeof i == "string", F1 = (i) => typeof i == "object" && i !== null, U1 = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g, P1 = {
+}, U = (i) => typeof i == "string", F1 = (i) => typeof i == "object" && i !== null, U1 = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g, P1 = {
   "&amp;": "&",
   "&#38;": "&",
   "&lt;": "<",
@@ -96,11 +96,11 @@ class o2 {
   }
 }
 const i2 = (i, o) => {
-  const e = z();
-  return B(() => {
+  const e = q();
+  return I(() => {
     e.current = i;
   }, [i, o]), e.current;
-}, R1 = (i, o, e, l) => i.getFixedT(o, e, l), t2 = (i, o, e, l) => A(R1(i, o, e, l), [i, o, e, l]), l2 = function(i) {
+}, R1 = (i, o, e, l) => i.getFixedT(o, e, l), t2 = (i, o, e, l) => W(R1(i, o, e, l), [i, o, e, l]), l2 = function(i) {
   let o = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
   const {
     i18n: e
@@ -109,48 +109,48 @@ const i2 = (i, o) => {
     defaultNS: r
   } = n1(e2) || {}, a = e || l || X1();
   if (a && !a.reportNamespaces && (a.reportNamespaces = new o2()), !a) {
-    g1("You will need to pass in an i18next instance by using initReactI18next");
-    const f = (R, M) => S(M) ? M : F1(M) && S(M.defaultValue) ? M.defaultValue : Array.isArray(R) ? R[R.length - 1] : R, m = [f, {}, !1];
-    return m.t = f, m.i18n = {}, m.ready = !1, m;
+    p1("You will need to pass in an i18next instance by using initReactI18next");
+    const p = (N, f) => U(f) ? f : F1(f) && U(f.defaultValue) ? f.defaultValue : Array.isArray(N) ? N[N.length - 1] : N, _ = [p, {}, !1];
+    return _.t = p, _.i18n = {}, _.ready = !1, _;
   }
-  a.options.react && a.options.react.wait !== void 0 && g1("It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
+  a.options.react && a.options.react.wait !== void 0 && p1("It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
   const g = {
     ...q1(),
     ...a.options.react,
     ...o
   }, {
     useSuspense: n,
-    keyPrefix: L
+    keyPrefix: m
   } = g;
   let k = i;
-  k = S(k) ? [k] : k || ["translation"], a.reportNamespaces.addUsedNamespaces && a.reportNamespaces.addUsedNamespaces(k);
-  const h = (a.isInitialized || a.initializedStoreOnce) && k.every((f) => S1(f, a, g)), s = t2(a, o.lng || null, g.nsMode === "fallback" ? k : k[0], L), x = () => s, Z = () => R1(a, o.lng || null, g.nsMode === "fallback" ? k : k[0], L), [G, y] = H(x);
-  let _ = k.join();
-  o.lng && (_ = `${o.lng}${_}`);
-  const Y = i2(_), E = z(!0);
-  B(() => {
+  k = U(k) ? [k] : k || ["translation"], a.reportNamespaces.addUsedNamespaces && a.reportNamespaces.addUsedNamespaces(k);
+  const h = (a.isInitialized || a.initializedStoreOnce) && k.every((p) => S1(p, a, g)), s = t2(a, o.lng || null, g.nsMode === "fallback" ? k : k[0], m), M = () => s, E = () => R1(a, o.lng || null, g.nsMode === "fallback" ? k : k[0], m), [B, G] = H(M);
+  let x = k.join();
+  o.lng && (x = `${o.lng}${x}`);
+  const K = i2(x), Z = q(!0);
+  I(() => {
     const {
-      bindI18n: f,
-      bindI18nStore: m
+      bindI18n: p,
+      bindI18nStore: _
     } = g;
-    E.current = !0, !h && !n && (o.lng ? v1(a, o.lng, k, () => {
-      E.current && y(Z);
+    Z.current = !0, !h && !n && (o.lng ? v1(a, o.lng, k, () => {
+      Z.current && G(E);
     }) : u1(a, k, () => {
-      E.current && y(Z);
-    })), h && Y && Y !== _ && E.current && y(Z);
-    const R = () => {
-      E.current && y(Z);
+      Z.current && G(E);
+    })), h && K && K !== x && Z.current && G(E);
+    const N = () => {
+      Z.current && G(E);
     };
-    return f && a && a.on(f, R), m && a && a.store.on(m, R), () => {
-      E.current = !1, f && a && f.split(" ").forEach((M) => a.off(M, R)), m && a && m.split(" ").forEach((M) => a.store.off(M, R));
+    return p && a && a.on(p, N), _ && a && a.store.on(_, N), () => {
+      Z.current = !1, p && a && p.split(" ").forEach((f) => a.off(f, N)), _ && a && _.split(" ").forEach((f) => a.store.off(f, N));
     };
-  }, [a, _]), B(() => {
-    E.current && h && y(x);
-  }, [a, L, h]);
-  const v = [G, a, h];
-  if (v.t = G, v.i18n = a, v.ready = h, h || !h && !n) return v;
-  throw new Promise((f) => {
-    o.lng ? v1(a, o.lng, k, () => f()) : u1(a, k, () => f());
+  }, [a, x]), I(() => {
+    Z.current && h && G(M);
+  }, [a, m, h]);
+  const A = [B, a, h];
+  if (A.t = B, A.i18n = a, A.ready = h, h || !h && !n) return A;
+  throw new Promise((p) => {
+    o.lng ? v1(a, o.lng, k, () => p()) : u1(a, k, () => p());
   });
 }, t1 = ({
   children: i,
@@ -188,12 +188,12 @@ const i2 = (i, o) => {
     }
   );
 };
-var T = /* @__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))(T || {});
-const p1 = r1({
+var Y = /* @__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))(Y || {});
+const L1 = r1({
   locale: "en",
   theme: "light"
 });
-p1.Provider;
+L1.Provider;
 const n2 = ({
   checked: i = !0,
   indeterminate: o = !1,
@@ -202,17 +202,17 @@ const n2 = ({
   disabled: r = !1,
   disableUncheck: a = !1
 }) => {
-  const [g, n] = H(i), [L, k] = H(o);
-  B(() => {
+  const [g, n] = H(i), [m, k] = H(o);
+  I(() => {
     n(i), k(o);
   }, [i, o]);
-  const { theme: h } = n1(p1);
+  const { theme: h } = n1(L1);
   return /* @__PURE__ */ t(
     G1,
     {
       className: `snmt-checkbox snmt-checkbox-${h}`,
       checked: g,
-      indeterminate: L,
+      indeterminate: m,
       onChange: (s) => {
         a && g || (k(!1), n(s.target.checked), l && l(s));
       },
@@ -3472,14 +3472,14 @@ const s2 = ({
   disabled: a = !1,
   onClick: g
 }) => {
-  const [n, L] = H(r), { theme: k } = n1(H1), h = a ? k && k === "dark" ? d.GREY_LIGHT_4 : d.GREY_DARK_1 : l, s = a ? void 0 : g;
-  return B(() => {
+  const [n, m] = H(r), { theme: k } = n1(H1), h = a ? k && k === "dark" ? d.GREY_LIGHT_4 : d.GREY_DARK_1 : l, s = a ? void 0 : g;
+  return I(() => {
     if (r) {
-      s && !a && L(`${r} clickable`);
+      s && !a && m(`${r} clickable`);
       return;
     }
-    s && !a && L("clickable");
-  }, [s, r, a]), /* @__PURE__ */ t(O, { children: (() => {
+    s && !a && m("clickable");
+  }, [s, r, a]), /* @__PURE__ */ t(F, { children: (() => {
     switch (i) {
       case "nextIcon":
         return X2({ width: o, height: e, color: h, className: n, onClick: s });
@@ -3734,7 +3734,7 @@ const s2 = ({
       case "docs":
         return b5({ width: o, height: e, color: h, className: n, onClick: s });
       default:
-        return /* @__PURE__ */ t(O, { children: "No Icon provided" });
+        return /* @__PURE__ */ t(F, { children: "No Icon provided" });
     }
   })() });
 }, { Title: O5, Text: S5 } = x1, F5 = {
@@ -3742,7 +3742,7 @@ const s2 = ({
   h2: 2,
   h3: 3,
   h4: 4
-}, U5 = d1(
+}, U5 = k1(
   ({
     align: i = "inherit",
     variant: o = "body1",
@@ -3752,9 +3752,9 @@ const s2 = ({
     collapsed: a,
     whiteSpace: g = "normal"
   }, n) => {
-    const L = o === "h1" || o === "h2" || o === "h3" || o === "h4";
+    const m = o === "h1" || o === "h2" || o === "h3" || o === "h4";
     let k = `snmt-typography snmt-typography-${o}`;
-    return i && i !== "inherit" && (k += ` snmt-typography-align-${i}`), a && (k += " collapsed"), L ? /* @__PURE__ */ t(
+    return i && i !== "inherit" && (k += ` snmt-typography-align-${i}`), a && (k += " collapsed"), m ? /* @__PURE__ */ t(
       O5,
       {
         className: k,
@@ -7027,14 +7027,14 @@ const P5 = ({
   disabled: a = !1,
   onClick: g
 }) => {
-  const [n, L] = H(r), { theme: k } = n1(V1), h = a ? k && k === "dark" ? w.GREY_LIGHT_4 : w.GREY_DARK_1 : l, s = a ? void 0 : g;
-  return B(() => {
+  const [n, m] = H(r), { theme: k } = n1(V1), h = a ? k && k === "dark" ? w.GREY_LIGHT_4 : w.GREY_DARK_1 : l, s = a ? void 0 : g;
+  return I(() => {
     if (r) {
-      s && !a && L(`${r} clickable`);
+      s && !a && m(`${r} clickable`);
       return;
     }
-    s && !a && L("clickable");
-  }, [s, r, a]), /* @__PURE__ */ t(O, { children: (() => {
+    s && !a && m("clickable");
+  }, [s, r, a]), /* @__PURE__ */ t(F, { children: (() => {
     switch (i) {
       case "nextIcon":
         return T3({ width: o, height: e, color: h, className: n, onClick: s });
@@ -7289,7 +7289,7 @@ const P5 = ({
       case "docs":
         return V0({ width: o, height: e, color: h, className: n, onClick: s });
       default:
-        return /* @__PURE__ */ t(O, { children: "No Icon provided" });
+        return /* @__PURE__ */ t(F, { children: "No Icon provided" });
     }
   })() });
 };
@@ -7342,7 +7342,7 @@ const E1 = ({
   h2: 2,
   h3: 3,
   h4: 4
-}, B0 = d1(
+}, B0 = k1(
   ({
     align: i = "inherit",
     variant: o = "body1",
@@ -7352,9 +7352,9 @@ const E1 = ({
     collapsed: a,
     whiteSpace: g = "normal"
   }, n) => {
-    const L = o === "h1" || o === "h2" || o === "h3" || o === "h4";
+    const m = o === "h1" || o === "h2" || o === "h3" || o === "h4";
     let k = `snmt-typography snmt-typography-${o}`;
-    return i && i !== "inherit" && (k += ` snmt-typography-align-${i}`), a && (k += " collapsed"), L ? /* @__PURE__ */ t(
+    return i && i !== "inherit" && (k += ` snmt-typography-align-${i}`), a && (k += " collapsed"), m ? /* @__PURE__ */ t(
       W0,
       {
         className: k,
@@ -7393,8 +7393,8 @@ const E1 = ({
       trigger: "click",
       overlayClassName: `snmt-popover ${a ? "" : "padding"}`,
       open: e ?? g,
-      onOpenChange: (L) => {
-        n(L), l == null || l(L);
+      onOpenChange: (m) => {
+        n(m), l == null || l(m);
       },
       children: /* @__PURE__ */ t("div", { className: "wrapper", children: i })
     }
@@ -7420,29 +7420,29 @@ const D0 = ({
   options: a,
   extraOptions: g
 }) => {
-  const { locale: n } = n1(p1), { t: L } = l2("common", { lng: n }), [k, h] = H(!1);
-  if (B(() => {
+  const { locale: n } = n1(L1), { t: m } = l2("common", { lng: n }), [k, h] = H(!1);
+  if (I(() => {
     i.length || h(!1);
   }, [i]), !i.length)
     return null;
-  const s = (x) => {
-    var Z, G;
-    return ((Z = a == null ? void 0 : a.find((_) => _.value === x)) == null ? void 0 : Z.label) || ((G = g == null ? void 0 : g.find((_) => _.value === x)) == null ? void 0 : G.label) || x;
+  const s = (M) => {
+    var E, B;
+    return ((E = a == null ? void 0 : a.find((x) => x.value === M)) == null ? void 0 : E.label) || ((B = g == null ? void 0 : g.find((x) => x.value === M)) == null ? void 0 : B.label) || M;
   };
   return /* @__PURE__ */ c(
     G0,
     {
       content: (
         // 90: paddings + margins + gaps and so on
-        /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, className: "snmt-popover-from-select", children: /* @__PURE__ */ t(t1, { gap: 6, flexWrap: "wrap", children: i.map(({ value: x }) => /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, className: "snmt-popover-from-select", children: /* @__PURE__ */ t(t1, { gap: 6, flexWrap: "wrap", children: i.map(({ value: M }) => /* @__PURE__ */ t(
           E1,
           {
-            onClose: () => o(x),
+            onClose: () => o(M),
             closable: l,
             disabled: r,
-            children: s(x)
+            children: s(M)
           },
-          x
+          M
         )) }) })
       ),
       placement: "bottomRight",
@@ -7451,7 +7451,7 @@ const D0 = ({
       children: [
         i.length,
         " ",
-        L("more")
+        m("more")
       ]
     }
   );
@@ -7463,7 +7463,7 @@ const D0 = ({
     backgroundSize: "20% calc(200% + 20px)"
   };
   return /* @__PURE__ */ t("span", { className: "snmt-loader", style: l });
-}, f1 = d1(
+}, f1 = k1(
   ({
     value: i,
     onChange: o,
@@ -7473,161 +7473,161 @@ const D0 = ({
     options: a,
     width: g,
     disabled: n = !1,
-    required: L = !1,
+    required: m = !1,
     clearable: k = !1,
     scrollThresholdValue: h = 50,
     onSearchChange: s,
-    onDropdownVisibleChange: x,
-    onScrollToEnd: Z,
-    onPopupScroll: G,
-    id: y,
-    extraOptions: _,
-    dropdownRender: Y,
-    optionRender: E,
-    isLoading: v,
-    readOnly: f,
-    error: m
-  }, R) => {
-    const [M, J] = H(!1), [W, K] = H(!1), [q, Q] = H(!0), [N, F] = H(i), X = z(null);
-    B(() => {
-      F(i);
+    onDropdownVisibleChange: M,
+    onScrollToEnd: E,
+    onPopupScroll: B,
+    id: G,
+    extraOptions: x,
+    dropdownRender: K,
+    optionRender: Z,
+    isLoading: A,
+    readOnly: p,
+    error: _
+  }, N) => {
+    const [f, j] = H(!1), [b, y] = H(!1), [O, P] = H(!0), [R, D] = H(i), Q = q(null);
+    I(() => {
+      D(i);
     }, [i]);
     const s1 = (C) => {
-      J(C), x && x(C);
-    }, e1 = (C, p) => {
-      var V;
-      return !!((V = p == null ? void 0 : p.label) != null && V.toString().toLowerCase().includes(C.toLowerCase()));
-    }, U = () => {
-      K(!0);
-    }, h1 = () => {
-      K(!1);
-    }, D = A(
+      j(C), M && M(C);
+    }, h1 = (C, L) => {
+      var v;
+      return !!((v = L == null ? void 0 : L.label) != null && v.toString().toLowerCase().includes(C.toLowerCase()));
+    }, X = () => {
+      y(!0);
+    }, $ = () => {
+      y(!1);
+    }, T = W(
       (C) => {
-        if (F(C), l) {
-          const V = C;
-          o == null || o(V);
+        if (D(C), l) {
+          const v = C;
+          o == null || o(v);
           return;
         }
-        const p = C;
-        o == null || o(p);
+        const L = C;
+        o == null || o(L);
       },
       [l, o]
-    ), c1 = A(() => {
-      if (!f) {
+    ), c1 = W(() => {
+      if (!p) {
         if (l) {
-          D([]);
+          T([]);
           return;
         }
-        D("");
+        T("");
       }
-    }, [D, l, f]), b = A(
+    }, [T, l, p]), S = W(
       (C) => {
-        const p = N.filter((V) => V !== C);
-        D(p), F(p);
+        const L = R.filter((v) => v !== C);
+        T(L), D(L);
       },
-      [D, N]
-    ), o1 = A(
-      (C) => (N == null ? void 0 : N.indexOf(C)) === 0 ? (
+      [T, R]
+    ), e1 = W(
+      (C) => (R == null ? void 0 : R.indexOf(C)) === 0 ? (
         // if the search input is empty
         // then display the placeholder, else do not display it
-        /* @__PURE__ */ t("span", { className: "custom-placeholder", children: q ? e : "" })
-      ) : /* @__PURE__ */ t(O, {}),
-      [q, N, e]
+        /* @__PURE__ */ t("span", { className: "custom-placeholder", children: O ? e : "" })
+      ) : /* @__PURE__ */ t(F, {}),
+      [O, R, e]
     ), a1 = (C) => {
       C.preventDefault(), C.stopPropagation();
     }, C1 = async (C) => {
-      const { target: p } = C;
-      p.scrollTop + p.offsetHeight >= p.scrollHeight - h && (Z == null || Z(!0)), G && await G(C);
-    }, P = A(
+      const { target: L } = C;
+      L.scrollTop + L.offsetHeight >= L.scrollHeight - h && (E == null || E(!0)), B && await B(C);
+    }, z = W(
       (C) => {
-        var p, V;
-        return ((p = a.find((w1) => w1.value === C)) == null ? void 0 : p.label) || ((V = _ == null ? void 0 : _.find(
-          (w1) => w1.value === C
-        )) == null ? void 0 : V.label) || C;
+        var L, v;
+        return ((L = a.find((o1) => o1.value === C)) == null ? void 0 : L.label) || ((v = x == null ? void 0 : x.find(
+          (o1) => o1.value === C
+        )) == null ? void 0 : v.label) || C;
       },
-      [_, a]
-    ), u = A(
+      [x, a]
+    ), d1 = W(
       (C) => {
-        var p;
+        var L;
         return /* @__PURE__ */ t(
           D0,
           {
             values: C,
-            onTagClose: b,
-            maxWidth: ((p = X.current) == null ? void 0 : p.clientWidth) || 0,
+            onTagClose: S,
+            maxWidth: ((L = Q.current) == null ? void 0 : L.clientWidth) || 0,
             disabled: n,
-            closable: !f,
+            closable: !p,
             options: a,
-            extraOptions: _
+            extraOptions: x
           }
         );
       },
-      [n, _, b, a, f]
-    ), I = A(
-      ({ label: C, value: p, mode: V }) => V === "filter" ? o1(p) : /* @__PURE__ */ t("div", { onMouseDown: a1, className: "tag-wrapper", children: /* @__PURE__ */ t(E1, { onClose: () => b(p), disabled: n, children: typeof C == "object" ? C : P(p) }) }),
-      [n, P, b, o1]
-    ), j = Array.isArray(N) && N.length > 0 || !!N && typeof N == "string" && N.trim() !== "";
+      [n, x, S, a, p]
+    ), u = W(
+      ({ label: C, value: L, mode: v }) => v === "filter" ? e1(L) : /* @__PURE__ */ t("div", { onMouseDown: a1, className: "tag-wrapper", children: /* @__PURE__ */ t(E1, { onClose: () => S(L), disabled: n, children: typeof C == "object" ? C : z(L) }) }),
+      [n, z, S, e1]
+    ), V = Array.isArray(R) && R.length > 0 || !!R && typeof R == "string" && R.trim() !== "";
     return /* @__PURE__ */ c(
       "div",
       {
-        className: `snmt-select-1-15-6 ${W ? "snmt-select-focused" : ""} 
-                    ${l ? "" : "snmt-select-single"} ${f ? "snmt-select-read-only" : ""}`,
-        ref: X,
+        className: `snmt-select-1-15-6 ${b ? "snmt-select-focused" : ""} 
+                    ${l ? "" : "snmt-select-single"} ${p ? "snmt-select-read-only" : ""}`,
+        ref: Q,
         style: { width: g },
         children: [
           /* @__PURE__ */ t(
             I1,
             {
               className: "snmt-select-blank",
-              popupClassName: f ? "dropdown-read-only" : "",
-              id: y,
-              ref: R,
+              popupClassName: p ? "dropdown-read-only" : "",
+              id: G,
+              ref: N,
               showSearch: !!r,
-              filterOption: r && e1,
+              filterOption: r && h1,
               onDropdownVisibleChange: s1,
               disabled: n,
-              value: N || void 0,
-              labelRender: (C) => P(C.value),
+              value: R || void 0,
+              labelRender: (C) => z(C.value),
               mode: l === "filter" ? "multiple" : l,
-              onChange: D,
-              onFocus: U,
-              onBlur: h1,
+              onChange: T,
+              onFocus: X,
+              onBlur: $,
               onSearch: (C) => {
-                Q(!C), s && s(C);
+                P(!C), s && s(C);
               },
-              onSelect: () => Q(!0),
-              onDeselect: () => Q(!0),
-              tagRender: (C) => I({ ...C, mode: l }),
+              onSelect: () => P(!0),
+              onDeselect: () => P(!0),
+              tagRender: (C) => u({ ...C, mode: l }),
               maxTagCount: "responsive",
-              maxTagPlaceholder: u,
+              maxTagPlaceholder: d1,
               onPopupScroll: C1,
-              prefix: v && /* @__PURE__ */ t(N1, { size: 15 }),
-              suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(O, { children: [
-                N && !!N.length && (l || k) && /* @__PURE__ */ t("div", { onClick: c1, children: /* @__PURE__ */ t(
+              prefix: A && /* @__PURE__ */ t(N1, { size: 15 }),
+              suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(F, { children: [
+                R && !!R.length && (l || k) && /* @__PURE__ */ t("div", { onClick: c1, children: /* @__PURE__ */ t(
                   i1,
                   {
                     name: "cancel",
-                    color: n ? T.GREY_DARK_1 : T.GREY_DARK_5
+                    color: n ? Y.GREY_DARK_1 : Y.GREY_DARK_5
                   }
                 ) }),
                 /* @__PURE__ */ t(
                   i1,
                   {
                     name: "selectArrowIcon",
-                    color: n ? T.GREY_DARK_1 : T.GREY_DARK_5,
-                    className: M ? "select-arrow-rotated" : "select-arrow",
-                    onClick: () => J(!M)
+                    color: n ? Y.GREY_DARK_1 : Y.GREY_DARK_5,
+                    className: f ? "select-arrow-rotated" : "select-arrow",
+                    onClick: () => j(!f)
                   }
                 )
               ] }) }),
-              removeIcon: /* @__PURE__ */ t(i1, { name: "errorSmall", color: T.GREY_DARK_2 }),
+              removeIcon: /* @__PURE__ */ t(i1, { name: "errorSmall", color: Y.GREY_DARK_2 }),
               options: a,
-              optionRender: (C) => E ? E(C.data) : /* @__PURE__ */ c(t1, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
+              optionRender: (C) => Z ? Z(C.data) : /* @__PURE__ */ c(t1, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
                 /* @__PURE__ */ c(t1, { alignItems: "center", gap: 12, children: [
                   l && /* @__PURE__ */ t(
                     n2,
                     {
-                      checked: !!(N != null && N.includes(C.value))
+                      checked: !!(R != null && R.includes(C.value))
                     }
                   ),
                   /* @__PURE__ */ c(t1, { alignItems: "center", gap: 8, children: [
@@ -7635,41 +7635,41 @@ const D0 = ({
                     /* @__PURE__ */ t("span", { children: C.label })
                   ] })
                 ] }),
-                !l && N === C.value && /* @__PURE__ */ t(
+                !l && R === C.value && /* @__PURE__ */ t(
                   i1,
                   {
                     name: "ok",
-                    color: T.BLUE_PRIMARY,
+                    color: Y.BLUE_PRIMARY,
                     width: 16,
                     height: 16
                   }
                 )
               ] }),
               dropdownRender: (C) => /* @__PURE__ */ c("div", { className: "dropdown-container", children: [
-                /* @__PURE__ */ t("div", { className: "dropdown-menu", children: Y ? Y(C) : C }),
-                v && /* @__PURE__ */ t("div", { className: "loading-overlay", children: /* @__PURE__ */ t(N1, { size: 28 }) })
+                /* @__PURE__ */ t("div", { className: "dropdown-menu", children: K ? K(C) : C }),
+                A && /* @__PURE__ */ t("div", { className: "loading-overlay", children: /* @__PURE__ */ t(N1, { size: 28 }) })
               ] })
             }
           ),
-          e && /* @__PURE__ */ c(O, { children: [
+          e && /* @__PURE__ */ c(F, { children: [
             /* @__PURE__ */ t(
               "label",
               {
-                className: `${W || j ? "label-floating" : ""} ${n ? "label-disabled" : ""} ${W ? "label-focused" : ""} ${v ? "label-loading" : ""} ${m ? "label-error" : ""}`,
-                children: L ? `${e}*` : e
+                className: `${b || V ? "label-floating" : ""} ${n ? "label-disabled" : ""} ${b ? "label-focused" : ""} ${A ? "label-loading" : ""} ${_ ? "label-error" : ""}`,
+                children: m ? `${e}*` : e
               }
             ),
             /* @__PURE__ */ t(
               "fieldset",
               {
-                className: `${W ? "fieldset-focused" : ""} ${n ? "fieldset-disabled" : ""} ${j ? "fieldset-filled" : ""} ${m ? "fieldset-error" : ""}`,
-                children: /* @__PURE__ */ t("legend", { children: /* @__PURE__ */ t("span", { children: L ? `${e}*` : e }) })
+                className: `${b ? "fieldset-focused" : ""} ${n ? "fieldset-disabled" : ""} ${V ? "fieldset-filled" : ""} ${_ ? "fieldset-error" : ""}`,
+                children: /* @__PURE__ */ t("legend", { children: /* @__PURE__ */ t("span", { children: m ? `${e}*` : e }) })
               }
             )
           ] }),
-          m && /* @__PURE__ */ c(t1, { justifyContent: "flex-start", gap: 6, children: [
-            /* @__PURE__ */ t(i1, { name: "attention", color: T.NOTIFICATION_ERROR_DARK }),
-            typeof m == "string" ? /* @__PURE__ */ t(B0, { color: T.NOTIFICATION_ERROR_DARK, variant: "body4", children: m }) : m
+          _ && /* @__PURE__ */ c(t1, { justifyContent: "flex-start", gap: 6, children: [
+            /* @__PURE__ */ t(i1, { name: "attention", color: Y.NOTIFICATION_ERROR_DARK }),
+            typeof _ == "string" ? /* @__PURE__ */ t(B0, { color: Y.NOTIFICATION_ERROR_DARK, variant: "body4", children: _ }) : _
           ] })
         ]
       }
@@ -7677,8 +7677,8 @@ const D0 = ({
   }
 );
 function j0(i, o = 500) {
-  const e = z();
-  return B(() => () => {
+  const e = q();
+  return I(() => () => {
     e.current && clearTimeout(e.current);
   }, []), (...r) => {
     const a = setTimeout(() => {
@@ -7688,14 +7688,14 @@ function j0(i, o = 500) {
   };
 }
 function M1(i) {
-  const o = z(i);
-  return B(() => {
+  const o = q(i);
+  return I(() => {
     o.current = i;
   }, [i]), o.current;
 }
-const k1 = 100, $ = {
+const g1 = 100, J = {
   offset: 0
-}, O0 = d1(
+}, O0 = k1(
   ({
     loadOptions: i,
     width: o,
@@ -7705,148 +7705,151 @@ const k1 = 100, $ = {
     disabled: a,
     scrollThresholdValue: g,
     placeholder: n,
-    mode: L,
+    mode: m,
     loadOnClosedState: k,
     preloadOptions: h,
     extraOptions: s,
-    onDropdownVisibleChange: x,
-    optionRender: Z,
-    dropdownRender: G,
-    readOnly: y,
-    clearable: _,
-    required: Y = !1
-  }, E) => {
-    const [v, f] = H(), [m, R] = H($), [M, J] = H(!1), [W, K] = H(), [q, Q] = H(!1), [N, F] = H(
+    onDropdownVisibleChange: M,
+    optionRender: E,
+    dropdownRender: B,
+    readOnly: G,
+    clearable: x = !1,
+    required: K = !1,
+    error: Z
+  }, A) => {
+    const [p, _] = H(), [N, f] = H(J), [j, b] = H(!1), [y, O] = H(), [P, R] = H(!1), [D, Q] = H(
       s ?? []
-    ), X = M1(m.offset), s1 = M1(W), [e1, U] = H(!1), h1 = z(!1), D = A(
+    ), s1 = M1(N.offset), h1 = M1(y), [X, $] = H(!1), T = q(!1), c1 = W(
       async ({
-        limit: u = k1,
-        offset: I,
-        search: j
+        limit: u = g1,
+        offset: V,
+        search: C
       }) => {
-        J(!0);
+        b(!0);
         try {
-          const C = await i({
+          const L = await i({
             limit: u,
-            offset: I,
-            search: j
+            offset: V,
+            search: C
           });
-          f(
-            (p) => I === 0 ? C.options : [...p ?? [], ...C.options]
-          ), R((p) => ({
-            ...p,
-            count: C.count
+          _(
+            (v) => V === 0 ? L.options : [...v ?? [], ...L.options]
+          ), f((v) => ({
+            ...v,
+            count: L.count
           }));
-        } catch (C) {
-          return console.error("AsyncSelect. fetchOptions error", C), [];
+        } catch (L) {
+          return console.error("AsyncSelect. fetchOptions error", L), [];
         } finally {
-          J(!1);
+          b(!1);
         }
       },
       [i]
-    ), c1 = j0((u) => {
-      K(u), u || R($);
-    }), b = A(
-      (u) => c1(u),
-      [c1]
-    ), o1 = A(
+    ), S = j0((u) => {
+      O(u), u || f(J);
+    }), e1 = W(
+      (u) => S(u),
+      [S]
+    ), a1 = W(
       async (u) => {
-        M || u && m.count && m.count > ((v == null ? void 0 : v.length) ?? 0) && R((I) => ({
-          ...I,
-          offset: I.offset + k1
+        j || u && N.count && N.count > ((p == null ? void 0 : p.length) ?? 0) && f((V) => ({
+          ...V,
+          offset: V.offset + g1
         }));
       },
-      [M, v == null ? void 0 : v.length, m.count]
-    ), a1 = A(
+      [j, p == null ? void 0 : p.length, N.count]
+    ), C1 = W(
       (u) => {
-        Q(u), !u && W && (K(void 0), R($), U(!0)), x == null || x(u);
+        R(u), !u && y && (O(void 0), f(J), $(!0)), M == null || M(u);
       },
-      [x, W]
+      [M, y]
     );
-    B(() => {
-      if (!h1.current || M) return;
-      (e1 || q && (X !== m.offset || s1 !== W || !v)) && (D({ offset: m.offset, limit: k1, search: W }), e1 && U(!1));
-    }, [e1, q, m.offset, W, X, s1, v, M]), B(() => {
-      (k || h) && D($), h1.current = !0;
-    }, []), B(() => {
-      s && F((u) => {
-        const I = s.filter(
-          (j) => !u.some((C) => C.value === j.value)
+    I(() => {
+      if (!T.current || j) return;
+      (X || P && (s1 !== N.offset || h1 !== y || !p)) && (c1({ offset: N.offset, limit: g1, search: y }), X && $(!1));
+    }, [X, P, N.offset, y, s1, h1, p, j]), I(() => {
+      (k || h) && c1(J), T.current = !0;
+    }, []), I(() => {
+      s && Q((u) => {
+        const V = s.filter(
+          (C) => !u.some((L) => L.value === C.value)
         );
-        return [...u, ...I];
+        return [...u, ...V];
       });
     }, [s]);
-    const C1 = A(
+    const z = W(
       (u) => {
         e && e(u);
-        let I = [];
-        if (L ? I = Array.isArray(u) ? u : [] : I = u ? [u] : [], W) {
-          const j = I.filter(
-            (C) => !(N != null && N.some((p) => p.value === C))
+        let V = [];
+        if (m ? V = Array.isArray(u) ? u : [] : V = u ? [u] : [], y) {
+          const C = V.filter(
+            (L) => !(D != null && D.some((v) => v.value === L))
           );
-          j.length > 0 && F((C = []) => [
-            ...C,
-            ...j.map((p) => {
-              const V = v == null ? void 0 : v.find((L1) => L1.value === p);
+          C.length > 0 && Q((L = []) => [
+            ...L,
+            ...C.map((v) => {
+              const w1 = p == null ? void 0 : p.find((o1) => o1.value === v);
               return {
-                value: p,
-                label: (V == null ? void 0 : V.label) ?? p
+                value: v,
+                label: (w1 == null ? void 0 : w1.label) ?? v
               };
             })
-          ]), K(void 0), R($), U(!0);
+          ]), O(void 0), f(J), $(!0);
         }
       },
-      [e, W, L, v, N]
-    ), P = Z1(
+      [e, y, m, p, D]
+    ), d1 = Z1(
       () => ({
         id: r,
         width: o,
-        options: v || [],
-        onChange: C1,
-        ref: E,
+        options: p || [],
+        onChange: z,
+        ref: A,
         placeholder: n,
         search: !0,
         value: l,
-        onSearchChange: b,
-        onDropdownVisibleChange: a1,
+        onSearchChange: e1,
+        onDropdownVisibleChange: C1,
         scrollThresholdValue: g,
-        onScrollToEnd: o1,
+        onScrollToEnd: a1,
         disabled: a,
-        extraOptions: N,
-        isLoading: M,
-        optionRender: Z,
-        dropdownRender: G,
-        readOnly: y,
-        clearable: _,
-        required: Y
+        extraOptions: D,
+        isLoading: j,
+        optionRender: E,
+        dropdownRender: B,
+        readOnly: G,
+        clearable: x,
+        required: K,
+        error: Z
       }),
       [
         r,
         o,
-        v,
-        C1,
-        E,
+        p,
+        z,
+        A,
         n,
         l,
-        b,
-        a1,
+        e1,
+        C1,
         g,
-        o1,
+        a1,
         a,
-        N,
-        M,
-        Z,
+        D,
+        j,
+        E,
+        B,
         G,
-        y,
-        _,
-        Y
+        x,
+        K,
+        Z
       ]
     );
-    return W1(E, () => ({
+    return W1(A, () => ({
       refetchOptions: async () => {
-        R($), K(void 0), U(!0);
+        f(J), O(void 0), $(!0);
       }
-    })), L ? /* @__PURE__ */ t(f1, { ...P, value: l, mode: L }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(f1, { ...P, value: l }) });
+    })), m ? /* @__PURE__ */ t(f1, { ...d1, value: l, mode: m }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(f1, { ...d1, value: l }) });
   }
 );
 export {

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@snmt-react-ui/async-select",
     "private": false,
-    "version": "1.7.7",
+    "version": "1.8.0",
     "type": "module",
     "main": "dist/async-select.js",
     "types": "dist/index.d.ts",
@@ -23,5 +23,5 @@
     "peerDependencies": {
         "antd": "^5.18.3"
     },
-    "gitHead": "ce3b5d9c1d396223ed981ce68efeb50c2886765a"
+    "gitHead": "8d61a4db9fb68d6fa82a8a9bad7d8f1663688f0a"
 }