@snmt-react-ui/async-select 1.5.0 → 1.5.2

package/dist/async-select.js

@@ -56,15 +56,15 @@ const R1 = ({
   E(() => {
     s(i), k(o);
   }, [i, o]);
-  const { theme: n } = o1(h1);
+  const { theme: h } = o1(h1);
   return /* @__PURE__ */ t(
     M1,
     {
-      className: `snmt-checkbox snmt-checkbox-${n}`,
+      className: `snmt-checkbox snmt-checkbox-${h}`,
       checked: g,
       indeterminate: p,
-      onChange: (h) => {
-        w && g || (k(!1), s(h.target.checked), l && l(h));
+      onChange: (n) => {
+        w && g || (k(!1), s(n.target.checked), l && l(n));
       },
       disabled: r,
       children: e
@@ -3064,7 +3064,7 @@ const H1 = ({
       )
     ] }) })
   }
-), U = ({
+), P = ({
   name: i,
   width: o,
   height: e,
@@ -3073,253 +3073,253 @@ const H1 = ({
   disabled: w = !1,
   onClick: g
 }) => {
-  const [s, p] = u(r), { theme: k } = o1(c1), n = w ? k && k === "dark" ? d.GREY_LIGHT_4 : d.GREY_DARK_1 : l, h = w ? void 0 : g;
+  const [s, p] = u(r), { theme: k } = o1(c1), h = w ? k && k === "dark" ? d.GREY_LIGHT_4 : d.GREY_DARK_1 : l, n = w ? void 0 : g;
   return E(() => {
     if (r) {
-      h && !w && p(`${r} clickable`);
+      n && !w && p(`${r} clickable`);
       return;
     }
-    h && !w && p("clickable");
-  }, [h, r, w]), /* @__PURE__ */ t(I, { children: (() => {
+    n && !w && p("clickable");
+  }, [n, r, w]), /* @__PURE__ */ t(I, { children: (() => {
     switch (i) {
       case "nextIcon":
-        return u2({ width: o, height: e, color: n, className: s, onClick: h });
+        return u2({ width: o, height: e, color: h, className: s, onClick: n });
       case "prevIcon":
-        return v2({ width: o, height: e, color: n, className: s, onClick: h });
+        return v2({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowUp":
-        return H1({ width: o, height: e, color: n, className: s, onClick: h });
+        return H1({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDown":
-        return V1({ width: o, height: e, color: n, className: s, onClick: h });
+        return V1({ width: o, height: e, color: h, className: s, onClick: n });
       case "info":
-        return E1({ width: o, height: e, color: n, className: s, onClick: h });
+        return E1({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowRight":
-        return Z1({ width: o, height: e, color: n, className: s, onClick: h });
+        return Z1({ width: o, height: e, color: h, className: s, onClick: n });
       case "calendar":
-        return W1({ width: o, height: e, color: n, className: s, onClick: h });
+        return W1({ width: o, height: e, color: h, className: s, onClick: n });
       case "ok":
-        return I1({ width: o, height: e, color: n, className: s, onClick: h });
+        return I1({ width: o, height: e, color: h, className: s, onClick: n });
       case "cancel":
-        return B1({ width: o, height: e, color: n, className: s, onClick: h });
+        return B1({ width: o, height: e, color: h, className: s, onClick: n });
       case "add":
-        return A1({ width: o, height: e, color: n, className: s, onClick: h });
+        return A1({ width: o, height: e, color: h, className: s, onClick: n });
       case "list":
-        return G1({ width: o, height: e, color: n, className: s, onClick: h });
+        return G1({ width: o, height: e, color: h, className: s, onClick: n });
       case "dragAndDrop":
-        return D1({ width: o, height: e, color: n, className: s, onClick: h });
+        return D1({ width: o, height: e, color: h, className: s, onClick: n });
       case "filter":
-        return j1({ width: o, height: e, color: n, className: s, onClick: h });
+        return j1({ width: o, height: e, color: h, className: s, onClick: n });
       case "attention":
-        return T1({ width: o, height: e, color: n, className: s, onClick: h });
+        return T1({ width: o, height: e, color: h, className: s, onClick: n });
       case "plus":
-        return y1({ width: o, height: e, color: n, className: s, onClick: h });
+        return y1({ width: o, height: e, color: h, className: s, onClick: n });
       case "time":
-        return Y1({ width: o, height: e, color: n, className: s, onClick: h });
+        return Y1({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDownLong":
         return K1({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "users":
-        return O1({ width: o, height: e, color: n, className: s, onClick: h });
+        return O1({ width: o, height: e, color: h, className: s, onClick: n });
       case "mySkillsMatrix":
         return b1({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "skills":
-        return F1({ width: o, height: e, color: n, className: s, onClick: h });
+        return F1({ width: o, height: e, color: h, className: s, onClick: n });
       case "skillsMatrices":
         return S1({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "history":
-        return U1({ width: o, height: e, color: n, className: s, onClick: h });
+        return U1({ width: o, height: e, color: h, className: s, onClick: n });
       case "logOut":
-        return P1({ width: o, height: e, color: n, className: s, onClick: h });
+        return P1({ width: o, height: e, color: h, className: s, onClick: n });
       case "settings":
-        return $1({ width: o, height: e, color: n, className: s, onClick: h });
+        return $1({ width: o, height: e, color: h, className: s, onClick: n });
       case "addSkill":
-        return z1({ width: o, height: e, color: n, className: s, onClick: h });
+        return z1({ width: o, height: e, color: h, className: s, onClick: n });
       case "conversation":
-        return q1({ width: o, height: e, color: n, className: s, onClick: h });
+        return q1({ width: o, height: e, color: h, className: s, onClick: n });
       case "trash":
-        return J1({ width: o, height: e, color: n, className: s, onClick: h });
+        return J1({ width: o, height: e, color: h, className: s, onClick: n });
       case "settings4":
-        return Q1({ width: o, height: e, color: n, className: s, onClick: h });
+        return Q1({ width: o, height: e, color: h, className: s, onClick: n });
       case "edit2":
-        return X1({ width: o, height: e, color: n, className: s, onClick: h });
+        return X1({ width: o, height: e, color: h, className: s, onClick: n });
       case "notifications":
         return e2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "success":
-        return o2({ width: o, height: e, color: n, className: s, onClick: h });
+        return o2({ width: o, height: e, color: h, className: s, onClick: n });
       case "attentionSmall":
         return i2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "errorSmall":
-        return t2({ width: o, height: e, color: n, className: s, onClick: h });
+        return t2({ width: o, height: e, color: h, className: s, onClick: n });
       case "infoMedium":
-        return l2({ width: o, height: e, color: n, className: s, onClick: h });
+        return l2({ width: o, height: e, color: h, className: s, onClick: n });
       case "attentionMedium":
         return r2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "errorMedium":
-        return s2({ width: o, height: e, color: n, className: s, onClick: h });
+        return s2({ width: o, height: e, color: h, className: s, onClick: n });
       case "faviconSkills":
         return C2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "visibilityIcon":
         return n2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "visibilityOffIcon":
         return h2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "selectArrowIcon":
         return c2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "expandArrowIcon":
         return a2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "expandActiveArrowIcon":
         return d2({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "camera":
-        return w2({ width: o, height: e, color: n, className: s, onClick: h });
+        return w2({ width: o, height: e, color: h, className: s, onClick: n });
       case "sortUp":
-        return k2({ width: o, height: e, color: n, className: s, onClick: h });
+        return k2({ width: o, height: e, color: h, className: s, onClick: n });
       case "sortDown":
-        return g2({ width: o, height: e, color: n, className: s, onClick: h });
+        return g2({ width: o, height: e, color: h, className: s, onClick: n });
       case "logOut2":
-        return p2({ width: o, height: e, color: n, className: s, onClick: h });
+        return p2({ width: o, height: e, color: h, className: s, onClick: n });
       case "search":
-        return L2({ width: o, height: e, color: n, className: s, onClick: h });
+        return L2({ width: o, height: e, color: h, className: s, onClick: n });
       case "handRock":
-        return m2({ width: o, height: e, color: n, className: s, onClick: h });
+        return m2({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowUpFilled":
-        return f2({ width: o, height: e, color: n, className: s, onClick: h });
+        return f2({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDownFilled":
-        return N2({ width: o, height: e, color: n, className: s, onClick: h });
+        return N2({ width: o, height: e, color: h, className: s, onClick: n });
       case "link":
-        return M2({ width: o, height: e, color: n, className: s, onClick: h });
+        return M2({ width: o, height: e, color: h, className: s, onClick: n });
       case "telegram":
-        return _2({ width: o, height: e, color: n, className: s, onClick: h });
+        return _2({ width: o, height: e, color: h, className: s, onClick: n });
       case "mail":
-        return H2({ width: o, height: e, color: n, className: s, onClick: h });
+        return H2({ width: o, height: e, color: h, className: s, onClick: n });
       case "github":
-        return x2({ width: o, height: e, color: n, className: s, onClick: h });
+        return x2({ width: o, height: e, color: h, className: s, onClick: n });
       case "linkedIn":
-        return R2({ width: o, height: e, color: n, className: s, onClick: h });
+        return R2({ width: o, height: e, color: h, className: s, onClick: n });
       case "emptyStateIcon":
-        return V2({ width: o, height: e, color: n, className: s, onClick: h });
+        return V2({ width: o, height: e, color: h, className: s, onClick: n });
       case "filtersIcon":
-        return E2({ width: o, height: e, color: n, className: s, onClick: h });
+        return E2({ width: o, height: e, color: h, className: s, onClick: n });
       case "dotMenuIcon":
-        return Z2({ width: o, height: e, color: n, className: s, onClick: h });
+        return Z2({ width: o, height: e, color: h, className: s, onClick: n });
       case "plusCircle":
-        return W2({ width: o, height: e, color: n, className: s, onClick: h });
+        return W2({ width: o, height: e, color: h, className: s, onClick: n });
       case "warning":
-        return I2({ width: o, height: e, color: n, className: s, onClick: h });
+        return I2({ width: o, height: e, color: h, className: s, onClick: n });
       case "back":
-        return B2({ width: o, height: e, color: n, className: s, onClick: h });
+        return B2({ width: o, height: e, color: h, className: s, onClick: n });
       case "bell":
-        return A2({ width: o, height: e, color: n, className: s, onClick: h });
+        return A2({ width: o, height: e, color: h, className: s, onClick: n });
       case "contract":
-        return D2({ width: o, height: e, color: n, className: s, onClick: h });
+        return D2({ width: o, height: e, color: h, className: s, onClick: n });
       case "trash2":
-        return G2({ width: o, height: e, color: n, className: s, onClick: h });
+        return G2({ width: o, height: e, color: h, className: s, onClick: n });
       case "manager":
-        return j2({ width: o, height: e, color: n, className: s, onClick: h });
+        return j2({ width: o, height: e, color: h, className: s, onClick: n });
       case "resourceManager":
-        return T2({ width: o, height: e, color: n, className: s, onClick: h });
+        return T2({ width: o, height: e, color: h, className: s, onClick: n });
       case "settings2":
-        return y2({ width: o, height: e, color: n, className: s, onClick: h });
+        return y2({ width: o, height: e, color: h, className: s, onClick: n });
       case "image":
-        return Y2({ width: o, height: e, color: n, className: s, onClick: h });
+        return Y2({ width: o, height: e, color: h, className: s, onClick: n });
       case "upload":
-        return K2({ width: o, height: e, color: n, className: s, onClick: h });
+        return K2({ width: o, height: e, color: h, className: s, onClick: n });
       case "edit":
-        return O2({ width: o, height: e, color: n, className: s, onClick: h });
+        return O2({ width: o, height: e, color: h, className: s, onClick: n });
       case "location":
-        return b2({ width: o, height: e, color: n, className: s, onClick: h });
+        return b2({ width: o, height: e, color: h, className: s, onClick: n });
       case "plus2":
-        return F2({ width: o, height: e, color: n, className: s, onClick: h });
+        return F2({ width: o, height: e, color: h, className: s, onClick: n });
       case "search2":
-        return S2({ width: o, height: e, color: n, className: s, onClick: h });
+        return S2({ width: o, height: e, color: h, className: s, onClick: n });
       case "fastArrowLeft":
-        return U2({ width: o, height: e, color: n, className: s, onClick: h });
+        return U2({ width: o, height: e, color: h, className: s, onClick: n });
       case "fastArrowRight":
-        return P2({ width: o, height: e, color: n, className: s, onClick: h });
+        return P2({ width: o, height: e, color: h, className: s, onClick: n });
       case "crossInCircle":
-        return $2({ width: o, height: e, color: n, className: s, onClick: h });
+        return $2({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowUp2":
-        return q2({ width: o, height: e, color: n, className: s, onClick: h });
+        return q2({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDown2":
-        return z2({ width: o, height: e, color: n, className: s, onClick: h });
+        return z2({ width: o, height: e, color: h, className: s, onClick: n });
       case "filledArrowLeft":
-        return J2({ width: o, height: e, color: n, className: s, onClick: h });
+        return J2({ width: o, height: e, color: h, className: s, onClick: n });
       case "filledArrowRight":
-        return Q2({ width: o, height: e, color: n, className: s, onClick: h });
+        return Q2({ width: o, height: e, color: h, className: s, onClick: n });
       case "burgerMenu":
-        return X2({ width: o, height: e, color: n, className: s, onClick: h });
+        return X2({ width: o, height: e, color: h, className: s, onClick: n });
       case "signOut":
-        return e5({ width: o, height: e, color: n, className: s, onClick: h });
+        return e5({ width: o, height: e, color: h, className: s, onClick: n });
       case "refresh":
-        return o5({ width: o, height: e, color: n, className: s, onClick: h });
+        return o5({ width: o, height: e, color: h, className: s, onClick: n });
       default:
         return /* @__PURE__ */ t(I, { children: "No Icon provided" });
     }
@@ -6365,253 +6365,253 @@ const s5 = ({
   disabled: w = !1,
   onClick: g
 }) => {
-  const [s, p] = u(r), { theme: k } = o1(a1), n = w ? k && k === "dark" ? C.GREY_LIGHT_4 : C.GREY_DARK_1 : l, h = w ? void 0 : g;
+  const [s, p] = u(r), { theme: k } = o1(a1), h = w ? k && k === "dark" ? C.GREY_LIGHT_4 : C.GREY_DARK_1 : l, n = w ? void 0 : g;
   return E(() => {
     if (r) {
-      h && !w && p(`${r} clickable`);
+      n && !w && p(`${r} clickable`);
       return;
     }
-    h && !w && p("clickable");
-  }, [h, r, w]), /* @__PURE__ */ t(I, { children: (() => {
+    n && !w && p("clickable");
+  }, [n, r, w]), /* @__PURE__ */ t(I, { children: (() => {
     switch (i) {
       case "nextIcon":
-        return Q5({ width: o, height: e, color: n, className: s, onClick: h });
+        return Q5({ width: o, height: e, color: h, className: s, onClick: n });
       case "prevIcon":
-        return X5({ width: o, height: e, color: n, className: s, onClick: h });
+        return X5({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowUp":
-        return s5({ width: o, height: e, color: n, className: s, onClick: h });
+        return s5({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDown":
-        return n5({ width: o, height: e, color: n, className: s, onClick: h });
+        return n5({ width: o, height: e, color: h, className: s, onClick: n });
       case "info":
-        return h5({ width: o, height: e, color: n, className: s, onClick: h });
+        return h5({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowRight":
-        return c5({ width: o, height: e, color: n, className: s, onClick: h });
+        return c5({ width: o, height: e, color: h, className: s, onClick: n });
       case "calendar":
-        return a5({ width: o, height: e, color: n, className: s, onClick: h });
+        return a5({ width: o, height: e, color: h, className: s, onClick: n });
       case "ok":
-        return d5({ width: o, height: e, color: n, className: s, onClick: h });
+        return d5({ width: o, height: e, color: h, className: s, onClick: n });
       case "cancel":
-        return C5({ width: o, height: e, color: n, className: s, onClick: h });
+        return C5({ width: o, height: e, color: h, className: s, onClick: n });
       case "add":
-        return w5({ width: o, height: e, color: n, className: s, onClick: h });
+        return w5({ width: o, height: e, color: h, className: s, onClick: n });
       case "list":
-        return k5({ width: o, height: e, color: n, className: s, onClick: h });
+        return k5({ width: o, height: e, color: h, className: s, onClick: n });
       case "dragAndDrop":
-        return g5({ width: o, height: e, color: n, className: s, onClick: h });
+        return g5({ width: o, height: e, color: h, className: s, onClick: n });
       case "filter":
-        return p5({ width: o, height: e, color: n, className: s, onClick: h });
+        return p5({ width: o, height: e, color: h, className: s, onClick: n });
       case "attention":
-        return L5({ width: o, height: e, color: n, className: s, onClick: h });
+        return L5({ width: o, height: e, color: h, className: s, onClick: n });
       case "plus":
-        return m5({ width: o, height: e, color: n, className: s, onClick: h });
+        return m5({ width: o, height: e, color: h, className: s, onClick: n });
       case "time":
-        return u5({ width: o, height: e, color: n, className: s, onClick: h });
+        return u5({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDownLong":
         return v5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "users":
-        return N5({ width: o, height: e, color: n, className: s, onClick: h });
+        return N5({ width: o, height: e, color: h, className: s, onClick: n });
       case "mySkillsMatrix":
         return f5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "skills":
-        return M5({ width: o, height: e, color: n, className: s, onClick: h });
+        return M5({ width: o, height: e, color: h, className: s, onClick: n });
       case "skillsMatrices":
         return x5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "history":
-        return _5({ width: o, height: e, color: n, className: s, onClick: h });
+        return _5({ width: o, height: e, color: h, className: s, onClick: n });
       case "logOut":
-        return R5({ width: o, height: e, color: n, className: s, onClick: h });
+        return R5({ width: o, height: e, color: h, className: s, onClick: n });
       case "settings":
-        return H5({ width: o, height: e, color: n, className: s, onClick: h });
+        return H5({ width: o, height: e, color: h, className: s, onClick: n });
       case "addSkill":
-        return V5({ width: o, height: e, color: n, className: s, onClick: h });
+        return V5({ width: o, height: e, color: h, className: s, onClick: n });
       case "conversation":
-        return E5({ width: o, height: e, color: n, className: s, onClick: h });
+        return E5({ width: o, height: e, color: h, className: s, onClick: n });
       case "trash":
-        return Z5({ width: o, height: e, color: n, className: s, onClick: h });
+        return Z5({ width: o, height: e, color: h, className: s, onClick: n });
       case "settings4":
-        return W5({ width: o, height: e, color: n, className: s, onClick: h });
+        return W5({ width: o, height: e, color: h, className: s, onClick: n });
       case "edit2":
-        return I5({ width: o, height: e, color: n, className: s, onClick: h });
+        return I5({ width: o, height: e, color: h, className: s, onClick: n });
       case "notifications":
         return B5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "success":
-        return A5({ width: o, height: e, color: n, className: s, onClick: h });
+        return A5({ width: o, height: e, color: h, className: s, onClick: n });
       case "attentionSmall":
         return G5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "errorSmall":
-        return D5({ width: o, height: e, color: n, className: s, onClick: h });
+        return D5({ width: o, height: e, color: h, className: s, onClick: n });
       case "infoMedium":
-        return j5({ width: o, height: e, color: n, className: s, onClick: h });
+        return j5({ width: o, height: e, color: h, className: s, onClick: n });
       case "attentionMedium":
         return T5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "errorMedium":
-        return y5({ width: o, height: e, color: n, className: s, onClick: h });
+        return y5({ width: o, height: e, color: h, className: s, onClick: n });
       case "faviconSkills":
         return S5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "visibilityIcon":
         return Y5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "visibilityOffIcon":
         return K5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "selectArrowIcon":
         return O5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "expandArrowIcon":
         return b5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "expandActiveArrowIcon":
         return F5({
           width: o,
           height: e,
-          color: n,
+          color: h,
           className: s,
-          onClick: h
+          onClick: n
         });
       case "camera":
-        return U5({ width: o, height: e, color: n, className: s, onClick: h });
+        return U5({ width: o, height: e, color: h, className: s, onClick: n });
       case "sortUp":
-        return P5({ width: o, height: e, color: n, className: s, onClick: h });
+        return P5({ width: o, height: e, color: h, className: s, onClick: n });
       case "sortDown":
-        return $5({ width: o, height: e, color: n, className: s, onClick: h });
+        return $5({ width: o, height: e, color: h, className: s, onClick: n });
       case "logOut2":
-        return z5({ width: o, height: e, color: n, className: s, onClick: h });
+        return z5({ width: o, height: e, color: h, className: s, onClick: n });
       case "search":
-        return q5({ width: o, height: e, color: n, className: s, onClick: h });
+        return q5({ width: o, height: e, color: h, className: s, onClick: n });
       case "handRock":
-        return J5({ width: o, height: e, color: n, className: s, onClick: h });
+        return J5({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowUpFilled":
-        return o3({ width: o, height: e, color: n, className: s, onClick: h });
+        return o3({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDownFilled":
-        return e3({ width: o, height: e, color: n, className: s, onClick: h });
+        return e3({ width: o, height: e, color: h, className: s, onClick: n });
       case "link":
-        return i3({ width: o, height: e, color: n, className: s, onClick: h });
+        return i3({ width: o, height: e, color: h, className: s, onClick: n });
       case "telegram":
-        return l3({ width: o, height: e, color: n, className: s, onClick: h });
+        return l3({ width: o, height: e, color: h, className: s, onClick: n });
       case "mail":
-        return s3({ width: o, height: e, color: n, className: s, onClick: h });
+        return s3({ width: o, height: e, color: h, className: s, onClick: n });
       case "github":
-        return t3({ width: o, height: e, color: n, className: s, onClick: h });
+        return t3({ width: o, height: e, color: h, className: s, onClick: n });
       case "linkedIn":
-        return r3({ width: o, height: e, color: n, className: s, onClick: h });
+        return r3({ width: o, height: e, color: h, className: s, onClick: n });
       case "emptyStateIcon":
-        return n3({ width: o, height: e, color: n, className: s, onClick: h });
+        return n3({ width: o, height: e, color: h, className: s, onClick: n });
       case "filtersIcon":
-        return h3({ width: o, height: e, color: n, className: s, onClick: h });
+        return h3({ width: o, height: e, color: h, className: s, onClick: n });
       case "dotMenuIcon":
-        return c3({ width: o, height: e, color: n, className: s, onClick: h });
+        return c3({ width: o, height: e, color: h, className: s, onClick: n });
       case "plusCircle":
-        return a3({ width: o, height: e, color: n, className: s, onClick: h });
+        return a3({ width: o, height: e, color: h, className: s, onClick: n });
       case "warning":
-        return d3({ width: o, height: e, color: n, className: s, onClick: h });
+        return d3({ width: o, height: e, color: h, className: s, onClick: n });
       case "back":
-        return C3({ width: o, height: e, color: n, className: s, onClick: h });
+        return C3({ width: o, height: e, color: h, className: s, onClick: n });
       case "bell":
-        return w3({ width: o, height: e, color: n, className: s, onClick: h });
+        return w3({ width: o, height: e, color: h, className: s, onClick: n });
       case "contract":
-        return g3({ width: o, height: e, color: n, className: s, onClick: h });
+        return g3({ width: o, height: e, color: h, className: s, onClick: n });
       case "trash2":
-        return k3({ width: o, height: e, color: n, className: s, onClick: h });
+        return k3({ width: o, height: e, color: h, className: s, onClick: n });
       case "manager":
-        return p3({ width: o, height: e, color: n, className: s, onClick: h });
+        return p3({ width: o, height: e, color: h, className: s, onClick: n });
       case "resourceManager":
-        return L3({ width: o, height: e, color: n, className: s, onClick: h });
+        return L3({ width: o, height: e, color: h, className: s, onClick: n });
       case "settings2":
-        return m3({ width: o, height: e, color: n, className: s, onClick: h });
+        return m3({ width: o, height: e, color: h, className: s, onClick: n });
       case "image":
-        return u3({ width: o, height: e, color: n, className: s, onClick: h });
+        return u3({ width: o, height: e, color: h, className: s, onClick: n });
       case "upload":
-        return v3({ width: o, height: e, color: n, className: s, onClick: h });
+        return v3({ width: o, height: e, color: h, className: s, onClick: n });
       case "edit":
-        return N3({ width: o, height: e, color: n, className: s, onClick: h });
+        return N3({ width: o, height: e, color: h, className: s, onClick: n });
       case "location":
-        return f3({ width: o, height: e, color: n, className: s, onClick: h });
+        return f3({ width: o, height: e, color: h, className: s, onClick: n });
       case "plus2":
-        return M3({ width: o, height: e, color: n, className: s, onClick: h });
+        return M3({ width: o, height: e, color: h, className: s, onClick: n });
       case "search2":
-        return x3({ width: o, height: e, color: n, className: s, onClick: h });
+        return x3({ width: o, height: e, color: h, className: s, onClick: n });
       case "fastArrowLeft":
-        return _3({ width: o, height: e, color: n, className: s, onClick: h });
+        return _3({ width: o, height: e, color: h, className: s, onClick: n });
       case "fastArrowRight":
-        return R3({ width: o, height: e, color: n, className: s, onClick: h });
+        return R3({ width: o, height: e, color: h, className: s, onClick: n });
       case "crossInCircle":
-        return H3({ width: o, height: e, color: n, className: s, onClick: h });
+        return H3({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowUp2":
-        return E3({ width: o, height: e, color: n, className: s, onClick: h });
+        return E3({ width: o, height: e, color: h, className: s, onClick: n });
       case "arrowDown2":
-        return V3({ width: o, height: e, color: n, className: s, onClick: h });
+        return V3({ width: o, height: e, color: h, className: s, onClick: n });
       case "filledArrowLeft":
-        return Z3({ width: o, height: e, color: n, className: s, onClick: h });
+        return Z3({ width: o, height: e, color: h, className: s, onClick: n });
       case "filledArrowRight":
-        return W3({ width: o, height: e, color: n, className: s, onClick: h });
+        return W3({ width: o, height: e, color: h, className: s, onClick: n });
       case "burgerMenu":
-        return I3({ width: o, height: e, color: n, className: s, onClick: h });
+        return I3({ width: o, height: e, color: h, className: s, onClick: n });
       case "signOut":
-        return B3({ width: o, height: e, color: n, className: s, onClick: h });
+        return B3({ width: o, height: e, color: h, className: s, onClick: n });
       case "refresh":
-        return A3({ width: o, height: e, color: n, className: s, onClick: h });
+        return A3({ width: o, height: e, color: h, className: s, onClick: n });
       default:
         return /* @__PURE__ */ t(I, { children: "No Icon provided" });
     }
@@ -6719,28 +6719,28 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
   E(() => {
     i.length || s(!1);
   }, [i]);
-  const p = (n) => {
-    n.preventDefault(), n.stopPropagation();
+  const p = (h) => {
+    h.preventDefault(), h.stopPropagation();
   };
   if (!i.length)
     return null;
-  const k = (n) => {
-    var h, H;
-    return ((h = r == null ? void 0 : r.find((V) => V.value === n)) == null ? void 0 : h.label) || ((H = w == null ? void 0 : w.find((V) => V.value === n)) == null ? void 0 : H.label) || n;
+  const k = (h) => {
+    var n, H;
+    return ((n = r == null ? void 0 : r.find((V) => V.value === h)) == null ? void 0 : n.label) || ((H = w == null ? void 0 : w.find((V) => V.value === h)) == null ? void 0 : H.label) || h;
   };
   return /* @__PURE__ */ t("div", { onMouseDown: p, className: "wrapper", children: /* @__PURE__ */ t(
     Y3,
     {
       content: (
         // 90: paddings + margins + gaps and so on
-        /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, children: /* @__PURE__ */ t($, { gap: 6, flexWrap: "wrap", children: i.map(({ value: n }) => /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { style: { maxWidth: e - 90 }, children: /* @__PURE__ */ t($, { gap: 6, flexWrap: "wrap", children: i.map(({ value: h }) => /* @__PURE__ */ t(
           C1,
           {
-            onClose: () => o(n),
+            onClose: () => o(h),
             closable: !l,
-            children: k(n)
+            children: k(h)
           },
-          n
+          h
         )) }) })
       ),
       placement: "bottomRight",
@@ -6772,33 +6772,33 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
     disabled: s = !1,
     required: p = !1,
     scrollThresholdValue: k = 50,
-    onSearchChange: n,
-    onDropdownVisibleChange: h,
+    onSearchChange: h,
+    onDropdownVisibleChange: n,
     onScrollToEnd: H,
     onPopupScroll: B,
     id: V,
     extraOptions: _,
     dropdownRender: A,
-    optionRender: O,
-    isLoading: b,
-    readOnly: f
-  }, G) => {
-    const [D, j] = u(!1), [F, R] = u(!1), [Z, T] = u(!0), [v, y] = u(i), Y = r1(null);
+    optionRender: G,
+    isLoading: F,
+    readOnly: N
+  }, D) => {
+    const [j, T] = u(!1), [S, R] = u(!1), [Z, y] = u(!0), [v, Y] = u(i), K = r1(null);
     E(() => {
-      y(i);
+      Y(i);
     }, [i]);
     const m = (a) => {
-      j(a), h && h(a);
+      T(a), n && n(a);
     }, J = (a, L) => {
       var M;
       return !!((M = L == null ? void 0 : L.label) != null && M.toString().toLowerCase().includes(a.toLowerCase()));
     }, Q = () => {
       R(!0);
-    }, K = () => {
+    }, O = () => {
       R(!1);
-    }, N = x(
+    }, f = x(
       (a) => {
-        if (y(a), l) {
+        if (Y(a), l) {
           const M = a;
           o == null || o(M);
           return;
@@ -6808,19 +6808,19 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
       },
       [l, o]
     ), k1 = x(() => {
-      if (!f) {
+      if (!N) {
         if (l) {
-          N([]);
+          f([]);
           return;
         }
-        N("");
+        f("");
       }
-    }, [N, l, f]), S = x(
+    }, [f, l, N]), U = x(
       (a) => {
         const L = v.filter((M) => M !== a);
-        N(L), y(L);
+        f(L), Y(L);
       },
-      [N, v]
+      [f, v]
     ), i1 = x(
       (a) => (v == null ? void 0 : v.indexOf(a)) === 0 ? (
         // if the search input is empty
@@ -6848,34 +6848,34 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
           K3,
           {
             values: a,
-            onTagClose: S,
-            maxWidth: ((L = Y.current) == null ? void 0 : L.clientWidth) || 0,
-            disabled: s || f,
+            onTagClose: U,
+            maxWidth: ((L = K.current) == null ? void 0 : L.clientWidth) || 0,
+            disabled: s || N,
             options: w,
             extraOptions: _
           }
         );
       },
-      [s, _, S, w, f]
+      [s, _, U, w, N]
     ), m1 = x(
-      ({ label: a, value: L, mode: M }) => M === "filter" ? i1(L) : /* @__PURE__ */ t("div", { onMouseDown: g1, className: "tag-wrapper", children: /* @__PURE__ */ t(C1, { onClose: () => S(L), closable: !s, children: /* @__PURE__ */ t(w1, { variant: "body4", children: typeof a == "object" ? a : X(L) }) }) }),
-      [s, X, S, i1]
+      ({ label: a, value: L, mode: M }) => M === "filter" ? i1(L) : /* @__PURE__ */ t("div", { onMouseDown: g1, className: "tag-wrapper", children: /* @__PURE__ */ t(C1, { onClose: () => U(L), closable: !s, children: /* @__PURE__ */ t(w1, { variant: "body4", children: typeof a == "object" ? a : X(L) }) }) }),
+      [s, X, U, i1]
     );
     return /* @__PURE__ */ c(
       "div",
       {
-        className: `snmt-select ${F ? "snmt-select-focused" : ""} 
-                ${l ? "" : "snmt-select-single"} ${f ? "snmt-select-read-only" : ""}`,
-        ref: Y,
+        className: `snmt-select ${S ? "snmt-select-focused" : ""} 
+                ${l ? "" : "snmt-select-single"} ${N ? "snmt-select-read-only" : ""}`,
+        ref: K,
         style: { width: g },
         children: [
           /* @__PURE__ */ t(
             v1,
             {
               className: "snmt-select-blank",
-              popupClassName: f ? "dropdown-read-only" : "",
+              popupClassName: N ? "dropdown-read-only" : "",
               id: V,
-              ref: G,
+              ref: D,
               showSearch: !!r,
               filterOption: r && J,
               onDropdownVisibleChange: m,
@@ -6884,34 +6884,34 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
               value: v || void 0,
               labelRender: (a) => X(a.value),
               mode: l === "filter" ? "multiple" : l,
-              onChange: N,
+              onChange: f,
               onFocus: Q,
-              onBlur: K,
+              onBlur: O,
               onSearch: (a) => {
-                T(!a), n && n(a);
+                y(!a), h && h(a);
               },
-              onSelect: () => T(!0),
-              onDeselect: () => T(!0),
+              onSelect: () => y(!0),
+              onDeselect: () => y(!0),
               tagRender: (a) => m1({ ...a, mode: l }),
               maxTagCount: "responsive",
               maxTagPlaceholder: L1,
               onPopupScroll: p1,
-              prefix: f && !i && /* @__PURE__ */ t(t1, { size: 15 }),
+              prefix: N && !i && /* @__PURE__ */ t(t1, { size: 15 }),
               suffixIcon: /* @__PURE__ */ t("div", { className: "wrapper-suffix-icon", children: l !== "filter" && /* @__PURE__ */ c(I, { children: [
-                l && v && !!v.length && /* @__PURE__ */ t("div", { onClick: k1, children: /* @__PURE__ */ t(U, { name: "cancel" }) }),
+                l && v && !!v.length && /* @__PURE__ */ t("div", { onClick: k1, children: /* @__PURE__ */ t(P, { name: "cancel" }) }),
                 /* @__PURE__ */ t(
-                  U,
+                  P,
                   {
                     name: "selectArrowIcon",
                     color: s ? W.GREY_DARK_1 : W.GREY_DARK_5,
-                    className: D ? "select-arrow-rotated" : "select-arrow",
-                    onClick: () => j(!D)
+                    className: j ? "select-arrow-rotated" : "select-arrow",
+                    onClick: () => T(!j)
                   }
                 )
               ] }) }),
-              removeIcon: /* @__PURE__ */ t(U, { name: "errorSmall", color: W.GREY_DARK_2 }),
+              removeIcon: /* @__PURE__ */ t(P, { name: "errorSmall", color: W.GREY_DARK_2 }),
               options: w,
-              optionRender: (a) => O ? O(a.data) : /* @__PURE__ */ c($, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
+              optionRender: (a) => G ? G(a.data) : /* @__PURE__ */ c($, { justifyContent: "space-between", alignItems: "center", flex: "1", children: [
                 /* @__PURE__ */ c($, { alignItems: "center", gap: 12, children: [
                   l && /* @__PURE__ */ t(
                     R1,
@@ -6925,7 +6925,7 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
                   ] })
                 ] }),
                 !l && v === a.value && /* @__PURE__ */ t(
-                  U,
+                  P,
                   {
                     name: "ok",
                     color: W.BLUE_PRIMARY,
@@ -6934,7 +6934,7 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
                   }
                 )
               ] }),
-              dropdownRender: b ? () => /* @__PURE__ */ t(
+              dropdownRender: F ? () => /* @__PURE__ */ t(
                 "div",
                 {
                   style: {
@@ -6950,7 +6950,7 @@ const C1 = ({ children: i, width: o, size: e = "small", onClose: l, closable: r
           /* @__PURE__ */ t(
             "fieldset",
             {
-              className: `${F ? "fieldset-focused" : ""}
+              className: `${S ? "fieldset-focused" : ""}
                      ${s ? "fieldset-disabled" : ""} 
                      ${typeof i == "string" && i ? "fieldset-filled" : ""} 
                      ${typeof i == "object" && i != null && i.length ? "fieldset-filled" : ""}`,
@@ -6973,7 +6973,7 @@ function O3(i, o = 500) {
     clearTimeout(e.current), e.current = w;
   };
 }
-const P = {
+const b = {
   limit: 100,
   offset: 0
 }, $3 = q(
@@ -6988,40 +6988,40 @@ const P = {
     placeholder: s,
     mode: p,
     loadOnClosedState: k,
-    extraOptions: n,
-    onDropdownVisibleChange: h,
+    extraOptions: h,
+    onDropdownVisibleChange: n,
     optionRender: H,
     dropdownRender: B,
     readOnly: V
   }, _) => {
-    const [A, O] = u([]), [b, f] = u(P), [G, D] = u(!1), [j, F] = u(null), R = x(
+    const [A, G] = u([]), [F, N] = u(b), [D, j] = u(!1), [T, S] = u(null), R = x(
       async (m = !1, J) => {
-        if (!G) {
-          D(!0);
+        if (!D) {
+          j(!0);
           try {
-            const Q = m ? { ...P, search: J } : b, K = await i(Q);
-            O(
-              (N) => m ? K.options : [...N, ...K.options]
-            ), F(K.count), f((N) => ({
-              ...N,
-              offset: N.offset + N.limit
+            const Q = m ? { ...b, search: J } : F, O = await i(Q);
+            G(
+              (f) => m ? O.options : [...f, ...O.options]
+            ), S(O.count), N((f) => ({
+              ...f,
+              offset: f.offset + f.limit
             }));
           } finally {
-            D(!1);
+            j(!1);
           }
         }
       },
-      [b, i, G]
-    ), Z = O3(R), T = x(
+      [F, i, D]
+    ), Z = O3(R), y = x(
       (m) => {
-        m === "" || m === void 0 || m === null ? (f(P), Z(!0)) : Z(!0, m);
+        m === "" || m === void 0 || m === null ? (N(b), Z(!0)) : Z(!0, m);
       },
       [Z]
     ), v = async (m) => {
-      m && j !== null && j > A.length && await R(!1);
-    }, y = x(
+      m && T !== null && T > A.length && await R(!1);
+    }, Y = x(
       (m) => {
-        m && !k && R(!1), h && h(m);
+        m && !k && (G([]), N(b), R(!0)), n == null || n(m);
       },
       // eslint-disable-next-line
       [k]
@@ -7029,7 +7029,7 @@ const P = {
     E(() => {
       k && R(!1);
     }, []);
-    const Y = {
+    const K = {
       id: r,
       width: o,
       options: A,
@@ -7038,23 +7038,23 @@ const P = {
       placeholder: s,
       search: !0,
       value: l,
-      onSearchChange: T,
-      onDropdownVisibleChange: y,
+      onSearchChange: y,
+      onDropdownVisibleChange: Y,
       scrollThresholdValue: g,
       onScrollToEnd: v,
       loadOnClosedState: k,
       disabled: w,
-      extraOptions: n,
-      isLoading: G,
+      extraOptions: h,
+      isLoading: D,
       optionRender: H,
       dropdownRender: B,
       readOnly: V
     };
     return u1(_, () => ({
       refetchOptions: async () => {
-        f(P), await R(!0);
+        N(b), await R(!0);
       }
-    })), p ? /* @__PURE__ */ t(l1, { ...Y, onChange: e, value: l, mode: p }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(l1, { ...Y, onChange: e, value: l }) });
+    })), p ? /* @__PURE__ */ t(l1, { ...K, onChange: e, value: l, mode: p }) : /* @__PURE__ */ t("div", { className: "snmt-async-select", children: /* @__PURE__ */ t(l1, { ...K, onChange: e, value: l }) });
   }
 );
 export {

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@snmt-react-ui/async-select",
     "private": false,
-    "version": "1.5.0",
+    "version": "1.5.2",
     "type": "module",
     "main": "dist/async-select.js",
     "types": "dist/index.d.ts",
@@ -18,10 +18,10 @@
         "build": "tsc && vite build"
     },
     "dependencies": {
-        "@snmt-react-ui/select": "^1.12.0"
+        "@snmt-react-ui/select": "^1.13.0"
     },
     "peerDependencies": {
         "antd": "^5.18.3"
     },
-    "gitHead": "7be922c2cfdfbbba8daf541f78bb957ac462cdc5"
+    "gitHead": "3110b4a7202e4a6ded1eea349bee8b81d67cfc02"
 }