@snmt-react-ui/async-select 1.6.4 → 1.7.0

package/dist/async-select.js

@@ -1,22 +1,22 @@
 import "./index.css";
-import { jsx as t, Fragment as b, jsxs as c } from "react/jsx-runtime";
-import { createContext as $, forwardRef as n1, useState as x, useRef as e1, useEffect as G, useCallback as I, useContext as z, useImperativeHandle as x1 } from "react";
+import { jsx as t, Fragment as K, jsxs as c } from "react/jsx-runtime";
+import { createContext as P, forwardRef as s1, useState as x, useRef as i1, useEffect as G, useCallback as Z, useContext as $, useImperativeHandle as x1 } from "react";
 import { Select as _1, Flex as R1, Avatar as H1, Checkbox as E1, Typography as V1, Tag as Z1, Popover as I1 } from "antd";
 var W1 = Object.defineProperty, B1 = (o, i, e) => i in o ? W1(o, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[i] = e, A1 = (o, i, e) => B1(o, i + "", e), G1 = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
 function y1() {
   if (console && console.warn) {
     for (var o = arguments.length, i = new Array(o), e = 0; e < o; e++)
       i[e] = arguments[e];
-    T(i[0]) && (i[0] = `react-i18next:: ${i[0]}`), console.warn(...i);
+    b(i[0]) && (i[0] = `react-i18next:: ${i[0]}`), console.warn(...i);
   }
 }
-const c1 = {};
-function r1() {
+const a1 = {};
+function n1() {
   for (var o = arguments.length, i = new Array(o), e = 0; e < o; e++)
     i[e] = arguments[e];
-  T(i[0]) && c1[i[0]] || (T(i[0]) && (c1[i[0]] = /* @__PURE__ */ new Date()), y1(...i));
+  b(i[0]) && a1[i[0]] || (b(i[0]) && (a1[i[0]] = /* @__PURE__ */ new Date()), y1(...i));
 }
-const g1 = (o, i) => () => {
+const k1 = (o, i) => () => {
   if (o.isInitialized)
     i();
   else {
@@ -27,12 +27,12 @@ const g1 = (o, i) => () => {
     };
     o.on("initialized", e);
   }
-}, a1 = (o, i, e) => {
-  o.loadNamespaces(i, g1(o, e));
-}, d1 = (o, i, e, l) => {
-  T(e) && (e = [e]), e.forEach((r) => {
+}, d1 = (o, i, e) => {
+  o.loadNamespaces(i, k1(o, e));
+}, C1 = (o, i, e, l) => {
+  b(e) && (e = [e]), e.forEach((r) => {
     o.options.ns.indexOf(r) < 0 && o.options.ns.push(r);
-  }), o.loadLanguages(i, g1(o, l));
+  }), o.loadLanguages(i, k1(o, l));
 }, D1 = function(o, i) {
   let e = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
   const l = i.languages[0], r = i.options ? i.options.fallbackLng : !1, a = i.languages[i.languages.length - 1];
@@ -44,13 +44,13 @@ const g1 = (o, i) => () => {
   return e.bindI18n && e.bindI18n.indexOf("languageChanging") > -1 && i.services.backendConnector.backend && i.isLanguageChangingTo && !k(i.isLanguageChangingTo, o) ? !1 : !!(i.hasResourceBundle(l, o) || !i.services.backendConnector.backend || i.options.resources && !i.options.partialBundledLanguages || k(l, o) && (!r || k(a, o)));
 }, j1 = function(o, i) {
   let e = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-  return !i.languages || !i.languages.length ? (r1("i18n.languages were undefined or empty", i.languages), !0) : i.options.ignoreJSONStructure !== void 0 ? i.hasLoadedNamespace(o, {
+  return !i.languages || !i.languages.length ? (n1("i18n.languages were undefined or empty", i.languages), !0) : i.options.ignoreJSONStructure !== void 0 ? i.hasLoadedNamespace(o, {
     lng: e.lng,
     precheck: (l, r) => {
       if (e.bindI18n && e.bindI18n.indexOf("languageChanging") > -1 && l.services.backendConnector.backend && l.isLanguageChangingTo && !r(l.isLanguageChangingTo, o)) return !1;
     }
   }) : D1(o, i, e);
-}, T = (o) => typeof o == "string", T1 = (o) => typeof o == "object" && o !== null, Y1 = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g, b1 = {
+}, b = (o) => typeof o == "string", T1 = (o) => typeof o == "object" && o !== null, Y1 = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g, b1 = {
   "&amp;": "&",
   "&#38;": "&",
   "&lt;": "<",
@@ -84,7 +84,7 @@ let F1 = {
 };
 const S1 = () => F1;
 let U1;
-const P1 = () => U1, $1 = $();
+const P1 = () => U1, $1 = P();
 class z1 {
   constructor() {
     A1(this, "getUsedNamespaces", () => Object.keys(this.usedNamespaces)), this.usedNamespaces = {};
@@ -96,24 +96,24 @@ class z1 {
   }
 }
 const J1 = (o, i) => {
-  const e = e1();
+  const e = i1();
   return G(() => {
     e.current = o;
   }, [o, i]), e.current;
-}, k1 = (o, i, e, l) => o.getFixedT(i, e, l), q1 = (o, i, e, l) => I(k1(o, i, e, l), [o, i, e, l]), Q1 = function(o) {
+}, p1 = (o, i, e, l) => o.getFixedT(i, e, l), q1 = (o, i, e, l) => Z(p1(o, i, e, l), [o, i, e, l]), Q1 = function(o) {
   let i = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
   const {
     i18n: e
   } = i, {
     i18n: l,
     defaultNS: r
-  } = z($1) || {}, a = e || l || P1();
+  } = $($1) || {}, a = e || l || P1();
   if (a && !a.reportNamespaces && (a.reportNamespaces = new z1()), !a) {
-    r1("You will need to pass in an i18next instance by using initReactI18next");
-    const L = (f, M) => T(M) ? M : T1(M) && T(M.defaultValue) ? M.defaultValue : Array.isArray(f) ? f[f.length - 1] : f, N = [L, {}, !1];
-    return N.t = L, N.i18n = {}, N.ready = !1, N;
+    n1("You will need to pass in an i18next instance by using initReactI18next");
+    const L = (N, M) => b(M) ? M : T1(M) && b(M.defaultValue) ? M.defaultValue : Array.isArray(N) ? N[N.length - 1] : N, v = [L, {}, !1];
+    return v.t = L, v.i18n = {}, v.ready = !1, v;
   }
-  a.options.react && a.options.react.wait !== void 0 && r1("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 && n1("It seems you are still using the old wait option, you may migrate to the new useSuspense behaviour.");
   const k = {
     ...S1(),
     ...a.options.react,
@@ -123,36 +123,36 @@ const J1 = (o, i) => {
     keyPrefix: p
   } = k;
   let g = o;
-  g = T(g) ? [g] : g || ["translation"], a.reportNamespaces.addUsedNamespaces && a.reportNamespaces.addUsedNamespaces(g);
-  const h = (a.isInitialized || a.initializedStoreOnce) && g.every((L) => j1(L, a, k)), s = q1(a, i.lng || null, k.nsMode === "fallback" ? g : g[0], p), v = () => s, E = () => k1(a, i.lng || null, k.nsMode === "fallback" ? g : g[0], p), [W, B] = x(v);
+  g = b(g) ? [g] : g || ["translation"], a.reportNamespaces.addUsedNamespaces && a.reportNamespaces.addUsedNamespaces(g);
+  const h = (a.isInitialized || a.initializedStoreOnce) && g.every((L) => j1(L, a, k)), s = q1(a, i.lng || null, k.nsMode === "fallback" ? g : g[0], p), f = () => s, E = () => p1(a, i.lng || null, k.nsMode === "fallback" ? g : g[0], p), [I, W] = x(f);
   let u = g.join();
   i.lng && (u = `${i.lng}${u}`);
-  const y = J1(u), R = e1(!0);
+  const y = J1(u), R = i1(!0);
   G(() => {
     const {
       bindI18n: L,
-      bindI18nStore: N
+      bindI18nStore: v
     } = k;
-    R.current = !0, !h && !n && (i.lng ? d1(a, i.lng, g, () => {
-      R.current && B(E);
-    }) : a1(a, g, () => {
-      R.current && B(E);
-    })), h && y && y !== u && R.current && B(E);
-    const f = () => {
-      R.current && B(E);
+    R.current = !0, !h && !n && (i.lng ? C1(a, i.lng, g, () => {
+      R.current && W(E);
+    }) : d1(a, g, () => {
+      R.current && W(E);
+    })), h && y && y !== u && R.current && W(E);
+    const N = () => {
+      R.current && W(E);
     };
-    return L && a && a.on(L, f), N && a && a.store.on(N, f), () => {
-      R.current = !1, L && a && L.split(" ").forEach((M) => a.off(M, f)), N && a && N.split(" ").forEach((M) => a.store.off(M, f));
+    return L && a && a.on(L, N), v && a && a.store.on(v, N), () => {
+      R.current = !1, L && a && L.split(" ").forEach((M) => a.off(M, N)), v && a && v.split(" ").forEach((M) => a.store.off(M, N));
     };
   }, [a, u]), G(() => {
-    R.current && h && B(v);
+    R.current && h && W(f);
   }, [a, p, h]);
-  const A = [W, a, h];
-  if (A.t = W, A.i18n = a, A.ready = h, h || !h && !n) return A;
+  const B = [I, a, h];
+  if (B.t = I, B.i18n = a, B.ready = h, h || !h && !n) return B;
   throw new Promise((L) => {
-    i.lng ? d1(a, i.lng, g, () => L()) : a1(a, g, () => L());
+    i.lng ? C1(a, i.lng, g, () => L()) : d1(a, g, () => L());
   });
-}, X = ({
+}, e1 = ({
   children: o,
   direction: i = "row",
   flexWrap: e = "nowrap",
@@ -188,12 +188,12 @@ const J1 = (o, i) => {
     }
   );
 };
-var j = /* @__PURE__ */ ((o) => (o.GREY_LIGHT_0 = "var(--grey-light-0)", o.GREY_LIGHT_1 = "var(--grey-light-1)", o.GREY_LIGHT_2 = "var(--grey-light-2)", o.GREY_LIGHT_3 = "var(--grey-light-3)", o.GREY_LIGHT_4 = "var(--grey-light-4)", o.GREY_DARK_1 = "var(--grey-dark-1)", o.GREY_DARK_2 = "var(--grey-dark-2)", o.GREY_DARK_3 = "var(--grey-dark-3)", o.GREY_DARK_4 = "var(--grey-dark-4)", o.GREY_DARK_5 = "var(--grey-dark-5)", o.BLUE_PRIMARY = "var(--blue-primary)", o.BLUE_HOVER = "var(--blue-hover)", o.BLUE_LIGHT_1 = "var(--blue-light-1)", o.BLUE_LIGHT_2 = "var(--blue-light-2)", o.BLUE_LIGHT_3 = "var(--blue-light-3)", o.BLUE_LIGHT_4 = "var(--blue-light-4)", o.BLUE_DARK_1 = "var(--blue-dark-1)", o.PURPLE_LIGHT = "var(--purple-light)", o.PURPLE_DARK = "var(--purple-dark)", o.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", o.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", o.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", o.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", o.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", o.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", o.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", o))(j || {});
-const s1 = $({
+var Y = /* @__PURE__ */ ((o) => (o.GREY_LIGHT_0 = "var(--grey-light-0)", o.GREY_LIGHT_1 = "var(--grey-light-1)", o.GREY_LIGHT_2 = "var(--grey-light-2)", o.GREY_LIGHT_3 = "var(--grey-light-3)", o.GREY_LIGHT_4 = "var(--grey-light-4)", o.GREY_DARK_1 = "var(--grey-dark-1)", o.GREY_DARK_2 = "var(--grey-dark-2)", o.GREY_DARK_3 = "var(--grey-dark-3)", o.GREY_DARK_4 = "var(--grey-dark-4)", o.GREY_DARK_5 = "var(--grey-dark-5)", o.BLUE_PRIMARY = "var(--blue-primary)", o.BLUE_HOVER = "var(--blue-hover)", o.BLUE_LIGHT_1 = "var(--blue-light-1)", o.BLUE_LIGHT_2 = "var(--blue-light-2)", o.BLUE_LIGHT_3 = "var(--blue-light-3)", o.BLUE_LIGHT_4 = "var(--blue-light-4)", o.BLUE_DARK_1 = "var(--blue-dark-1)", o.PURPLE_LIGHT = "var(--purple-light)", o.PURPLE_DARK = "var(--purple-dark)", o.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", o.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", o.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", o.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", o.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", o.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", o.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", o))(Y || {});
+const h1 = P({
   locale: "en",
   theme: "light"
 });
-s1.Provider;
+h1.Provider;
 const e2 = ({
   checked: o = !0,
   indeterminate: i = !1,
@@ -206,7 +206,7 @@ const e2 = ({
   G(() => {
     n(o), g(i);
   }, [o, i]);
-  const { theme: h } = z(s1);
+  const { theme: h } = $(h1);
   return /* @__PURE__ */ t(
     E1,
     {
@@ -222,11 +222,11 @@ const e2 = ({
   );
 };
 var C = /* @__PURE__ */ ((o) => (o.GREY_LIGHT_0 = "var(--grey-light-0)", o.GREY_LIGHT_1 = "var(--grey-light-1)", o.GREY_LIGHT_2 = "var(--grey-light-2)", o.GREY_LIGHT_3 = "var(--grey-light-3)", o.GREY_LIGHT_4 = "var(--grey-light-4)", o.GREY_DARK_1 = "var(--grey-dark-1)", o.GREY_DARK_2 = "var(--grey-dark-2)", o.GREY_DARK_3 = "var(--grey-dark-3)", o.GREY_DARK_4 = "var(--grey-dark-4)", o.GREY_DARK_5 = "var(--grey-dark-5)", o.BLUE_PRIMARY = "var(--blue-primary)", o.BLUE_HOVER = "var(--blue-hover)", o.BLUE_LIGHT_1 = "var(--blue-light-1)", o.BLUE_LIGHT_2 = "var(--blue-light-2)", o.BLUE_LIGHT_3 = "var(--blue-light-3)", o.BLUE_LIGHT_4 = "var(--blue-light-4)", o.BLUE_DARK_1 = "var(--blue-dark-1)", o.PURPLE_LIGHT = "var(--purple-light)", o.PURPLE_DARK = "var(--purple-dark)", o.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", o.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", o.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", o.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", o.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", o.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", o.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", o))(C || {});
-const p1 = $({
+const L1 = P({
   locale: "en",
   theme: "light"
 });
-p1.Provider;
+L1.Provider;
 const i2 = ({
   width: o = 20,
   height: i = 20,
@@ -3270,7 +3270,7 @@ const i2 = ({
       }
     )
   }
-), Q = ({
+), X = ({
   name: o,
   width: i,
   height: e,
@@ -3279,14 +3279,14 @@ const i2 = ({
   disabled: a = !1,
   onClick: k
 }) => {
-  const [n, p] = x(r), { theme: g } = z(p1), h = a ? g && g === "dark" ? C.GREY_LIGHT_4 : C.GREY_DARK_1 : l, s = a ? void 0 : k;
+  const [n, p] = x(r), { theme: g } = $(L1), h = a ? g && g === "dark" ? C.GREY_LIGHT_4 : C.GREY_DARK_1 : l, s = a ? void 0 : k;
   return G(() => {
     if (r) {
       s && !a && p(`${r} clickable`);
       return;
     }
     s && !a && p("clickable");
-  }, [s, r, a]), /* @__PURE__ */ t(b, { children: (() => {
+  }, [s, r, a]), /* @__PURE__ */ t(K, { children: (() => {
     switch (o) {
       case "nextIcon":
         return P2({ width: i, height: e, color: h, className: n, onClick: s });
@@ -3529,7 +3529,7 @@ const i2 = ({
       case "projects":
         return Z5({ width: i, height: e, color: h, className: n, onClick: s });
       default:
-        return /* @__PURE__ */ t(b, { children: "No Icon provided" });
+        return /* @__PURE__ */ t(K, { children: "No Icon provided" });
     }
   })() });
 }, { Title: I5, Text: W5 } = V1, B5 = {
@@ -3537,7 +3537,7 @@ const i2 = ({
   h2: 2,
   h3: 3,
   h4: 4
-}, A5 = n1(
+}, A5 = s1(
   ({
     align: o = "inherit",
     variant: i = "body1",
@@ -3572,11 +3572,11 @@ const i2 = ({
   }
 );
 var w = /* @__PURE__ */ ((o) => (o.GREY_LIGHT_0 = "var(--grey-light-0)", o.GREY_LIGHT_1 = "var(--grey-light-1)", o.GREY_LIGHT_2 = "var(--grey-light-2)", o.GREY_LIGHT_3 = "var(--grey-light-3)", o.GREY_LIGHT_4 = "var(--grey-light-4)", o.GREY_DARK_1 = "var(--grey-dark-1)", o.GREY_DARK_2 = "var(--grey-dark-2)", o.GREY_DARK_3 = "var(--grey-dark-3)", o.GREY_DARK_4 = "var(--grey-dark-4)", o.GREY_DARK_5 = "var(--grey-dark-5)", o.BLUE_PRIMARY = "var(--blue-primary)", o.BLUE_HOVER = "var(--blue-hover)", o.BLUE_LIGHT_1 = "var(--blue-light-1)", o.BLUE_LIGHT_2 = "var(--blue-light-2)", o.BLUE_LIGHT_3 = "var(--blue-light-3)", o.BLUE_LIGHT_4 = "var(--blue-light-4)", o.BLUE_DARK_1 = "var(--blue-dark-1)", o.PURPLE_LIGHT = "var(--purple-light)", o.PURPLE_DARK = "var(--purple-dark)", o.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", o.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", o.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", o.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", o.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", o.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", o.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", o))(w || {});
-const L1 = $({
+const m1 = P({
   locale: "en",
   theme: "light"
 });
-L1.Provider;
+m1.Provider;
 const G5 = ({
   width: o = 20,
   height: i = 20,
@@ -6629,14 +6629,14 @@ const G5 = ({
   disabled: a = !1,
   onClick: k
 }) => {
-  const [n, p] = x(r), { theme: g } = z(L1), h = a ? g && g === "dark" ? w.GREY_LIGHT_4 : w.GREY_DARK_1 : l, s = a ? void 0 : k;
+  const [n, p] = x(r), { theme: g } = $(m1), h = a ? g && g === "dark" ? w.GREY_LIGHT_4 : w.GREY_DARK_1 : l, s = a ? void 0 : k;
   return G(() => {
     if (r) {
       s && !a && p(`${r} clickable`);
       return;
     }
     s && !a && p("clickable");
-  }, [s, r, a]), /* @__PURE__ */ t(b, { children: (() => {
+  }, [s, r, a]), /* @__PURE__ */ t(K, { children: (() => {
     switch (o) {
       case "nextIcon":
         return H3({ width: i, height: e, color: h, className: n, onClick: s });
@@ -6879,17 +6879,17 @@ const G5 = ({
       case "projects":
         return a6({ width: i, height: e, color: h, className: n, onClick: s });
       default:
-        return /* @__PURE__ */ t(b, { children: "No Icon provided" });
+        return /* @__PURE__ */ t(K, { children: "No Icon provided" });
     }
   })() });
 };
-var P = /* @__PURE__ */ ((o) => (o.GREY_LIGHT_0 = "var(--grey-light-0)", o.GREY_LIGHT_1 = "var(--grey-light-1)", o.GREY_LIGHT_2 = "var(--grey-light-2)", o.GREY_LIGHT_3 = "var(--grey-light-3)", o.GREY_LIGHT_4 = "var(--grey-light-4)", o.GREY_DARK_1 = "var(--grey-dark-1)", o.GREY_DARK_2 = "var(--grey-dark-2)", o.GREY_DARK_3 = "var(--grey-dark-3)", o.GREY_DARK_4 = "var(--grey-dark-4)", o.GREY_DARK_5 = "var(--grey-dark-5)", o.BLUE_PRIMARY = "var(--blue-primary)", o.BLUE_HOVER = "var(--blue-hover)", o.BLUE_LIGHT_1 = "var(--blue-light-1)", o.BLUE_LIGHT_2 = "var(--blue-light-2)", o.BLUE_LIGHT_3 = "var(--blue-light-3)", o.BLUE_LIGHT_4 = "var(--blue-light-4)", o.BLUE_DARK_1 = "var(--blue-dark-1)", o.PURPLE_LIGHT = "var(--purple-light)", o.PURPLE_DARK = "var(--purple-dark)", o.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", o.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", o.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", o.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", o.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", o.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", o.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", o))(P || {});
-const C6 = $({
+var U = /* @__PURE__ */ ((o) => (o.GREY_LIGHT_0 = "var(--grey-light-0)", o.GREY_LIGHT_1 = "var(--grey-light-1)", o.GREY_LIGHT_2 = "var(--grey-light-2)", o.GREY_LIGHT_3 = "var(--grey-light-3)", o.GREY_LIGHT_4 = "var(--grey-light-4)", o.GREY_DARK_1 = "var(--grey-dark-1)", o.GREY_DARK_2 = "var(--grey-dark-2)", o.GREY_DARK_3 = "var(--grey-dark-3)", o.GREY_DARK_4 = "var(--grey-dark-4)", o.GREY_DARK_5 = "var(--grey-dark-5)", o.BLUE_PRIMARY = "var(--blue-primary)", o.BLUE_HOVER = "var(--blue-hover)", o.BLUE_LIGHT_1 = "var(--blue-light-1)", o.BLUE_LIGHT_2 = "var(--blue-light-2)", o.BLUE_LIGHT_3 = "var(--blue-light-3)", o.BLUE_LIGHT_4 = "var(--blue-light-4)", o.BLUE_DARK_1 = "var(--blue-dark-1)", o.PURPLE_LIGHT = "var(--purple-light)", o.PURPLE_DARK = "var(--purple-dark)", o.NOTIFICATION_WARNING_LIGHT = "var(--notification-warning-light)", o.NOTIFICATION_WARNING_DARK = "var(--notification-warning-dark)", o.NOTIFICATION_SUCCESS_LIGHT = "var(--notification-success-light)", o.NOTIFICATION_SUCCESS_DARK = "var(--notification-success-dark)", o.NOTIFICATION_ERROR_LIGHT = "var(--notification-error-light)", o.NOTIFICATION_ERROR_DARK = "var(--notification-error-dark)", o.NOTIFICATION_ERROR_DARK_MODE = "var(--notification-error-dark-mode)", o))(U || {});
+const C6 = P({
   locale: "en",
   theme: "light"
 });
 C6.Provider;
-const m1 = ({
+const u1 = ({
   children: o,
   width: i,
   size: e = "small",
@@ -6908,7 +6908,7 @@ const m1 = ({
         d6,
         {
           name: "errorSmall",
-          color: a ? P.GREY_DARK_1 : P.GREY_DARK_2,
+          color: a ? U.GREY_DARK_1 : U.GREY_DARK_2,
           width: k,
           height: k,
           onClick: n
@@ -6921,7 +6921,7 @@ const m1 = ({
         A5,
         {
           variant: e === "small" ? "body4" : "body2",
-          color: a ? P.GREY_DARK_2 : P.GREY_DARK_5,
+          color: a ? U.GREY_DARK_2 : U.GREY_DARK_5,
           children: o
         }
       ) : o
@@ -6972,29 +6972,29 @@ const k6 = ({
   options: a,
   extraOptions: k
 }) => {
-  const { locale: n } = z(s1), { t: p } = Q1("common", { lng: n }), [g, h] = x(!1);
+  const { locale: n } = $(h1), { t: p } = Q1("common", { lng: n }), [g, h] = x(!1);
   if (G(() => {
     o.length || h(!1);
   }, [o]), !o.length)
     return null;
-  const s = (v) => {
-    var E, W;
-    return ((E = a == null ? void 0 : a.find((u) => u.value === v)) == null ? void 0 : E.label) || ((W = k == null ? void 0 : k.find((u) => u.value === v)) == null ? void 0 : W.label) || v;
+  const s = (f) => {
+    var E, I;
+    return ((E = a == null ? void 0 : a.find((u) => u.value === f)) == null ? void 0 : E.label) || ((I = k == null ? void 0 : k.find((u) => u.value === f)) == null ? void 0 : I.label) || f;
   };
   return /* @__PURE__ */ c(
     w6,
     {
       content: (
         // 90: paddings + margins + gaps and so on
-        /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, className: "snmt-popover-from-select", children: /* @__PURE__ */ t(X, { gap: 6, flexWrap: "wrap", children: o.map(({ value: v }) => /* @__PURE__ */ t(
-          m1,
+        /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, className: "snmt-popover-from-select", children: /* @__PURE__ */ t(e1, { gap: 6, flexWrap: "wrap", children: o.map(({ value: f }) => /* @__PURE__ */ t(
+          u1,
           {
-            onClose: () => i(v),
+            onClose: () => i(f),
             closable: l,
             disabled: r,
-            children: s(v)
+            children: s(f)
           },
-          v
+          f
         )) }) })
       ),
       placement: "bottomRight",
@@ -7007,7 +7007,7 @@ const k6 = ({
       ]
     }
   );
-}, C1 = ({ size: o = 30, color: i = "#004ed7" }) => {
+}, w1 = ({ size: o = 30, color: i = "#004ed7" }) => {
   const e = `no-repeat linear-gradient(${i} 
     calc(50% - 10px), #0000 0 calc(50% + 10px), ${i} 0)`, l = {
     width: o,
@@ -7015,7 +7015,7 @@ const k6 = ({
     backgroundSize: "20% calc(200% + 20px)"
   };
   return /* @__PURE__ */ t("span", { className: "snmt-loader", style: l });
-}, w1 = n1(
+}, g1 = s1(
   ({
     value: o,
     onChange: i,
@@ -7029,83 +7029,83 @@ const k6 = ({
     clearable: g = !1,
     scrollThresholdValue: h = 50,
     onSearchChange: s,
-    onDropdownVisibleChange: v,
+    onDropdownVisibleChange: f,
     onScrollToEnd: E,
-    onPopupScroll: W,
-    id: B,
+    onPopupScroll: I,
+    id: W,
     extraOptions: u,
     dropdownRender: y,
     optionRender: R,
-    isLoading: A,
+    isLoading: B,
     readOnly: L
-  }, N) => {
-    const [f, M] = x(!1), [J, D] = x(!1), [Y, K] = x(!0), [H, O] = x(o), F = e1(null);
+  }, v) => {
+    const [N, M] = x(!1), [O, z] = x(!1), [D, j] = x(!0), [H, F] = x(o), J = i1(null);
     G(() => {
-      O(o);
+      F(o);
     }, [o]);
-    const _ = (d) => {
-      M(d), v && v(d);
-    }, i1 = (d, m) => {
-      var Z;
-      return !!((Z = m == null ? void 0 : m.label) != null && Z.toString().toLowerCase().includes(d.toLowerCase()));
+    const q = (d) => {
+      M(d), f && f(d);
+    }, _ = (d, m) => {
+      var V;
+      return !!((V = m == null ? void 0 : m.label) != null && V.toString().toLowerCase().includes(d.toLowerCase()));
     }, o1 = () => {
-      D(!0);
-    }, S = () => {
-      D(!1);
-    }, V = I(
+      z(!0);
+    }, t1 = () => {
+      z(!1);
+    }, A = Z(
       (d) => {
-        if (O(d), l) {
-          const Z = d;
-          i == null || i(Z);
+        if (F(d), l) {
+          const V = d;
+          i == null || i(V);
           return;
         }
         const m = d;
         i == null || i(m);
       },
       [l, i]
-    ), u1 = I(() => {
+    ), T = Z(() => {
       if (!L) {
         if (l) {
-          V([]);
+          A([]);
           return;
         }
-        V("");
+        A("");
       }
-    }, [V, l, L]), q = I(
+    }, [A, l, L]), Q = Z(
       (d) => {
-        const m = H.filter((Z) => Z !== d);
-        V(m), O(m);
+        const m = H.filter((V) => V !== d);
+        A(m), F(m);
       },
-      [V, H]
-    ), h1 = I(
+      [A, H]
+    ), c1 = Z(
       (d) => (H == null ? void 0 : H.indexOf(d)) === 0 ? (
         // if the search input is empty
         // then display the placeholder, else do not display it
-        /* @__PURE__ */ t("span", { className: "custom-placeholder", children: Y ? e : "" })
-      ) : /* @__PURE__ */ t(b, {}),
-      [Y, H, e]
+        /* @__PURE__ */ t("span", { className: "custom-placeholder", children: D ? e : "" })
+      ) : /* @__PURE__ */ t(K, {}),
+      [D, H, e]
     ), v1 = (d) => {
       d.preventDefault(), d.stopPropagation();
     }, N1 = async (d) => {
       const { target: m } = d;
-      m.scrollTop + m.offsetHeight >= m.scrollHeight - h && (E == null || E(!0)), W && await W(d);
-    }, t1 = I(
+      m.scrollTop + m.offsetHeight >= m.scrollHeight - h && (E == null || E(!0)), I && await I(d);
+    }, l1 = Z(
       (d) => {
-        var m, Z;
-        return ((m = a.find((l1) => l1.value === d)) == null ? void 0 : m.label) || ((Z = u == null ? void 0 : u.find(
-          (l1) => l1.value === d
-        )) == null ? void 0 : Z.label) || d;
+        var m, V;
+        return ((m = a.find((r1) => r1.value === d)) == null ? void 0 : m.label) || ((V = u == null ? void 0 : u.find(
+          (r1) => r1.value === d
+        )) == null ? void 0 : V.label) || d;
       },
       [u, a]
-    ), f1 = I(
+    ), f1 = Z(
       (d) => {
         var m;
         return /* @__PURE__ */ t(
           k6,
           {
             values: d,
-            onTagClose: q,
-            maxWidth: ((m = F.current) == null ? void 0 : m.clientWidth) || 0,
+            onTagClose: Q,
+            maxWidth: ((m = J.current) == null ? void 0 : m.clientWidth) || 0,
             disabled: n,
             closable: !L,
             options: a,
@@ -7113,17 +7113,17 @@ const k6 = ({
           }
         );
       },
-      [n, u, q, a, L]
-    ), M1 = I(
-      ({ label: d, value: m, mode: Z }) => Z === "filter" ? h1(m) : /* @__PURE__ */ t("div", { onMouseDown: v1, className: "tag-wrapper", children: /* @__PURE__ */ t(m1, { onClose: () => q(m), disabled: n, children: typeof d == "object" ? d : t1(m) }) }),
-      [n, t1, q, h1]
+      [n, u, Q, a, L]
+    ), M1 = Z(
+      ({ label: d, value: m, mode: V }) => V === "filter" ? c1(m) : /* @__PURE__ */ t("div", { onMouseDown: v1, className: "tag-wrapper", children: /* @__PURE__ */ t(u1, { onClose: () => Q(m), disabled: n, children: typeof d == "object" ? d : l1(m) }) }),
+      [n, l1, Q, c1]
     );
     return /* @__PURE__ */ c(
       "div",
       {
-        className: `snmt-select ${J ? "snmt-select-focused" : ""} 
+        className: `snmt-select ${O ? "snmt-select-focused" : ""} 
                 ${l ? "" : "snmt-select-single"} ${L ? "snmt-select-read-only" : ""}`,
-        ref: F,
+        ref: J,
         style: { width: k },
         children: [
           /* @__PURE__ */ t(
@@ -7131,73 +7131,73 @@ const k6 = ({
             {
               className: "snmt-select-blank",
               popupClassName: L ? "dropdown-read-only" : "",
-              id: B,
-              ref: N,
+              id: W,
+              ref: v,
               showSearch: !!r,
-              filterOption: r && i1,
-              onDropdownVisibleChange: _,
+              filterOption: r && _,
+              onDropdownVisibleChange: q,
               placeholder: e ? p ? `${e}*` : e : void 0,
               disabled: n,
               value: H || void 0,
-              labelRender: (d) => t1(d.value),
+              labelRender: (d) => l1(d.value),
               mode: l === "filter" ? "multiple" : l,
-              onChange: V,
+              onChange: A,
               onFocus: o1,
-              onBlur: S,
+              onBlur: t1,
               onSearch: (d) => {
-                K(!d), s && s(d);
+                j(!d), s && s(d);
               },
-              onSelect: () => K(!0),
-              onDeselect: () => K(!0),
+              onSelect: () => j(!0),
+              onDeselect: () => j(!0),
               tagRender: (d) => M1({ ...d, mode: l }),
               maxTagCount: "responsive",
               maxTagPlaceholder: f1,
               onPopupScroll: N1,
-              prefix: A && /* @__PURE__ */ t(C1, { size: 15 }),
-              suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(b, { children: [
-                H && !!H.length && (l || g) && /* @__PURE__ */ t("div", { onClick: u1, children: /* @__PURE__ */ t(
-                  Q,
+              prefix: B && /* @__PURE__ */ t(w1, { size: 15 }),
+              suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(K, { children: [
+                H && !!H.length && (l || g) && /* @__PURE__ */ t("div", { onClick: T, children: /* @__PURE__ */ t(
+                  X,
                   {
                     name: "cancel",
-                    color: n ? j.GREY_DARK_1 : j.GREY_DARK_5
+                    color: n ? Y.GREY_DARK_1 : Y.GREY_DARK_5
                   }
                 ) }),
                 /* @__PURE__ */ t(
-                  Q,
+                  X,
                   {
                     name: "selectArrowIcon",
-                    color: n ? j.GREY_DARK_1 : j.GREY_DARK_5,
-                    className: f ? "select-arrow-rotated" : "select-arrow",
-                    onClick: () => M(!f)
+                    color: n ? Y.GREY_DARK_1 : Y.GREY_DARK_5,
+                    className: N ? "select-arrow-rotated" : "select-arrow",
+                    onClick: () => M(!N)
                   }
                 )
               ] }) }),
-              removeIcon: /* @__PURE__ */ t(Q, { name: "errorSmall", color: j.GREY_DARK_2 }),
+              removeIcon: /* @__PURE__ */ t(X, { name: "errorSmall", color: Y.GREY_DARK_2 }),
               options: a,
-              optionRender: (d) => R ? R(d.data) : /* @__PURE__ */ c(X, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
-                /* @__PURE__ */ c(X, { alignItems: "center", gap: 12, children: [
+              optionRender: (d) => R ? R(d.data) : /* @__PURE__ */ c(e1, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
+                /* @__PURE__ */ c(e1, { alignItems: "center", gap: 12, children: [
                   l && /* @__PURE__ */ t(
                     e2,
                     {
                       checked: !!(H != null && H.includes(d.value))
                     }
                   ),
-                  /* @__PURE__ */ c(X, { alignItems: "center", gap: 8, children: [
+                  /* @__PURE__ */ c(e1, { alignItems: "center", gap: 8, children: [
                     d.data.image && /* @__PURE__ */ t(X1, { src: d.data.image, size: 20 }),
                     /* @__PURE__ */ t("span", { children: d.label })
                   ] })
                 ] }),
                 !l && H === d.value && /* @__PURE__ */ t(
-                  Q,
+                  X,
                   {
                     name: "ok",
-                    color: j.BLUE_PRIMARY,
+                    color: Y.BLUE_PRIMARY,
                     width: 16,
                     height: 16
                   }
                 )
               ] }),
-              dropdownRender: A ? () => /* @__PURE__ */ t(
+              dropdownRender: B ? () => /* @__PURE__ */ t(
                 "div",
                 {
                   style: {
@@ -7205,7 +7205,7 @@ const k6 = ({
                     display: "grid",
                     justifyContent: "center"
                   },
-                  children: /* @__PURE__ */ t(C1, { size: 28 })
+                  children: /* @__PURE__ */ t(w1, { size: 28 })
                 }
               ) : (d) => y ? y(d) : d
             }
@@ -7213,7 +7213,7 @@ const k6 = ({
           /* @__PURE__ */ t(
             "fieldset",
             {
-              className: `${J ? "fieldset-focused" : ""}
+              className: `${O ? "fieldset-focused" : ""}
                      ${n ? "fieldset-disabled" : ""} 
                      ${typeof o == "string" && o ? "fieldset-filled" : ""} 
                      ${typeof o == "object" && o != null && o.length ? "fieldset-filled" : ""}`,
@@ -7226,7 +7226,7 @@ const k6 = ({
   }
 );
 function p6(o, i = 500) {
-  const e = e1();
+  const e = i1();
   return G(() => () => {
     e.current && clearTimeout(e.current);
   }, []), (...r) => {
@@ -7236,10 +7236,10 @@ function p6(o, i = 500) {
     clearTimeout(e.current), e.current = a;
   };
 }
-const U = {
+const S = {
   limit: 100,
   offset: 0
-}, f6 = n1(
+}, f6 = s1(
   ({
     loadOptions: o,
     width: i,
@@ -7253,39 +7253,40 @@ const U = {
     loadOnClosedState: g,
     extraOptions: h,
     onDropdownVisibleChange: s,
-    optionRender: v,
+    optionRender: f,
     dropdownRender: E,
-    readOnly: W,
-    clearable: B
-  }, u) => {
-    const [y, R] = x([]), [A, L] = x(U), [N, f] = x(!1), [M, J] = x(null), D = I(
-      async (_ = !1, i1) => {
+    readOnly: I,
+    clearable: W,
+    required: u = !1
+  }, y) => {
+    const [R, B] = x([]), [L, v] = x(S), [N, M] = x(!1), [O, z] = x(null), D = Z(
+      async (_ = !1, o1) => {
         if (!N) {
-          f(!0);
+          M(!0);
           try {
-            const o1 = _ ? { ...U, search: i1 } : A, S = await o(o1);
-            R(
-              (V) => _ ? S.options : [...V, ...S.options]
-            ), J(S.count), L((V) => ({
-              ...V,
-              offset: V.offset + V.limit
+            const t1 = _ ? { ...S, search: o1 } : L, A = await o(t1);
+            B(
+              (T) => _ ? A.options : [...T, ...A.options]
+            ), z(A.count), v((T) => ({
+              ...T,
+              offset: T.offset + T.limit
             }));
           } finally {
-            f(!1);
+            M(!1);
           }
         }
       },
-      [A, o, N]
-    ), Y = p6(D), K = I(
+      [L, o, N]
+    ), j = p6(D), H = Z(
       (_) => {
-        _ === "" || _ === void 0 || _ === null ? (L(U), Y(!0)) : Y(!0, _);
+        _ === "" || _ === void 0 || _ === null ? (v(S), j(!0)) : j(!0, _);
       },
-      [Y]
-    ), H = async (_) => {
-      _ && M !== null && M > y.length && await D(!1);
-    }, O = I(
+      [j]
+    ), F = async (_) => {
+      _ && O !== null && O > R.length && await D(!1);
+    }, J = Z(
       (_) => {
-        _ && !g && (R([]), L(U), D(!0)), s == null || s(_);
+        _ && !g && (B([]), v(S), D(!0)), s == null || s(_);
       },
       // eslint-disable-next-line
       [g]
@@ -7293,33 +7294,34 @@ const U = {
     G(() => {
       g && D(!1);
     }, []);
-    const F = {
+    const q = {
       id: r,
       width: i,
-      options: y,
+      options: R,
       onChange: e,
-      ref: u,
+      ref: y,
       placeholder: n,
       search: !0,
       value: l,
-      onSearchChange: K,
-      onDropdownVisibleChange: O,
+      onSearchChange: H,
+      onDropdownVisibleChange: J,
       scrollThresholdValue: k,
-      onScrollToEnd: H,
+      onScrollToEnd: F,
       loadOnClosedState: g,
       disabled: a,
       extraOptions: h,
       isLoading: N,
-      optionRender: v,
+      optionRender: f,
       dropdownRender: E,
-      readOnly: W,
-      clearable: B
+      readOnly: I,
+      clearable: W,
+      required: u
     };
-    return x1(u, () => ({
+    return x1(y, () => ({
       refetchOptions: async () => {
-        L(U), await D(!0);
+        v(S), await D(!0);
       }
-    })), p ? /* @__PURE__ */ t(w1, { ...F, onChange: e, value: l, mode: p }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(w1, { ...F, onChange: e, value: l }) });
+    })), p ? /* @__PURE__ */ t(g1, { ...q, onChange: e, value: l, mode: p }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(g1, { ...q, onChange: e, value: l }) });
   }
 );
 export {

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@snmt-react-ui/async-select",
     "private": false,
-    "version": "1.6.4",
+    "version": "1.7.0",
     "type": "module",
     "main": "dist/async-select.js",
     "types": "dist/index.d.ts",
@@ -23,5 +23,5 @@
     "peerDependencies": {
         "antd": "^5.18.3"
     },
-    "gitHead": "2aa76eed0bef46d8a3e18551ba17e67836e4de65"
+    "gitHead": "ace8423c66d4f4f62ce7a72d3110e19580ea6e7c"
 }