@ironsource/shared-ui 2.1.6-rc.21 → 2.1.6-rc.22

package/components/dropdown/common/Dropdown.common.js

@@ -1,9 +1,9 @@
 import { useToggle as me } from "../../../composables/useToggle.js";
-import { ref as n, computed as r, watch as P, useSlots as Pe, toRaw as A, nextTick as D, provide as Te, onMounted as we } from "vue";
+import { ref as n, computed as r, watch as m, useSlots as Pe, toRaw as A, nextTick as N, provide as Te, onMounted as we } from "vue";
 import { isObjectInArray as W } from "../../../utils/array.js";
 import { objectsEqual as xe } from "../../../utils/object.js";
 import { useClamp as Ie, useVirtualList as De, onClickOutside as Y } from "@vueuse/core";
-import { Mode as m, Type as _, DropdownContext as Ne } from "./DropdownContext.js";
+import { Mode as P, Type as _, DropdownContext as Ne } from "./DropdownContext.js";
 import { pxToRem as Re } from "../../../utils/style.js";
 import { useEditableContext as Ee } from "../../table-cells/common/EditableContext.js";
 const Ue = (l, O, b) => {
@@ -14,25 +14,25 @@ const Ue = (l, O, b) => {
   })(k || (k = {}));
   const a = n(
     l.selected
-  ), N = Ee(), u = r({
+  ), R = Ee(), u = r({
     get() {
-      return N?.value?.value ?? a.value;
+      return R?.value?.value ?? a.value;
     },
     set(e) {
-      N.onChange?.(e), N.onClose?.(), O("update:selected", e);
+      R.onChange?.(e), R.onClose?.(), O("update:selected", e);
     }
   });
-  P(
+  m(
     () => l.selected,
     () => {
       a.value = l.selected, v.value = l.selected;
     }
   );
-  const p = Pe(), T = n(null), g = n(null), V = n(null), R = n(null), H = n(null), w = n(null), F = n(), B = n(null), L = n(null), U = n(null), ee = 8, le = r(() => w.value ? w.value.getBoundingClientRect().height + ee + l.distance : 0), c = n([]), x = n(-1), I = n(""), v = n(l.selected || []), q = () => w.value?.focus(), [d, te, ae] = me({
+  const p = Pe(), w = n(null), g = n(null), V = n(null), E = n(null), H = n(null), x = n(null), F = n(), B = n(null), L = n(null), U = n(null), ee = 8, le = r(() => x.value ? x.value.getBoundingClientRect().height + ee + l.distance : 0), c = n([]), I = n(-1), T = n(""), v = n(l.selected || []), q = () => x.value?.focus(), [d, te, ae] = me({
     disabled: l.disabled,
     initialValue: l.defaultOpen
   });
-  P(
+  m(
     () => l.disabled,
     (e) => {
       e !== void 0 && ae(e);
@@ -60,8 +60,8 @@ const Ue = (l, O, b) => {
   }), $ = r(() => {
     if (Array.isArray(a.value))
       return a.value.length === s.value.length;
-  }), oe = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), E = (e) => {
-    I.value = e;
+  }), oe = r(() => !l.multi || !Array.isArray(a.value) ? !1 : a.value.length > 0 && a.value.length < s.value.length), M = (e) => {
+    T.value = e;
   }, se = r(() => {
     const e = A(v.value), t = {
       selected: [],
@@ -73,41 +73,43 @@ const Ue = (l, O, b) => {
     }), [].concat(t.selected, t.notSelected);
   }), s = r(() => {
     const e = Array.isArray(v.value) && l.multi && b.VERSION === 4 ? se.value : l.options;
-    return l.onSearch ? e.filter((t) => l.onSearch(t, I.value)) : e;
-  }), ce = r(() => c.value[0]?.hasSubtitle), X = r(() => i.mode === m.Multi), j = r(
+    return l.onSearch ? e.filter((t) => l.onSearch(t, T.value)) : e;
+  }), ce = r(() => c.value[0]?.hasSubtitle), X = r(() => i.mode === P.Multi), j = r(
     () => ce.value ? b.MULTILINE_LIST_HEIGHT : b.LIST_HEIGHT
   ), {
     list: z,
     containerProps: J,
     wrapperProps: ve,
-    scrollTo: M
+    scrollTo: D
   } = De(s, {
     itemHeight: j.value,
     overscan: 2
   });
-  P(
+  m(
     () => l.isOpen,
     (e) => {
       G(e);
     }
-  ), P([x], async () => {
-    await D();
-  }), P(
-    [d, o, x],
+  ), m([I], async () => {
+    await N();
+  }), m(
+    [d, o, I],
     async ([e], [t]) => {
-      d.value && (await D(), x.value !== -1 && e !== t && setTimeout(() => {
-        l.multi && b.VERSION === 4 || M(x.value);
+      d.value && (await N(), I.value !== -1 && e !== t && setTimeout(() => {
+        l.multi && b.VERSION === 4 || D(I.value);
       }), o.value && setTimeout(() => {
-        M(o.value);
+        D(o.value);
       }));
     }
-  );
+  ), m(T, () => {
+    D(0);
+  });
   const h = (e, t = !1) => {
-    l.disabled || (G(e), D(() => {
-      d.value && O("opened"), d.value || O("closed"), T.value && t && T.value.focus();
+    l.disabled || (G(e), N(() => {
+      d.value && O("opened"), d.value || O("closed"), w.value && t && w.value.focus();
     }));
   };
-  P(d, (e) => {
+  m(d, (e) => {
     if (e) {
       X.value && Array.isArray(u.value) && (v.value = A(u.value).slice());
       return;
@@ -133,11 +135,11 @@ const Ue = (l, O, b) => {
   }, C = (e, t) => {
     if (e = A(e), c.value[t]?.disabled)
       return;
-    if (x.value = t, i.mode !== m.Multi) {
+    if (I.value = t, i.mode !== P.Multi) {
       l.keepOpen || h(!1), i.goToOption(
         0
         /* None */
-      ), u.value = e, E(""), q(), i.type === _.Search && g.value && (g.value.value = l.displayValue(e));
+      ), u.value = e, M(""), q(), i.type === _.Search && g.value && (g.value.value = l.displayValue(e));
       return;
     }
     if (!Array.isArray(a.value))
@@ -158,12 +160,12 @@ const Ue = (l, O, b) => {
     options: c,
     selectedOption: u,
     labelRef: H,
-    activeOption: R,
-    listRef: T,
+    activeOption: E,
+    listRef: w,
     clearable: l.clearable,
     type: p.input ? _.Search : _.Dropdown,
-    mode: l.multi ? m.Multi : m.Single,
-    query: I,
+    mode: l.multi ? P.Multi : P.Single,
+    query: T,
     selectedValue: K,
     toggle: h,
     disabled: l.disabled,
@@ -173,9 +175,9 @@ const Ue = (l, O, b) => {
     placeholder: l.placeholder,
     select: C,
     clearSelection: () => {
-      E(""), u.value = i.mode === m.Single ? null : [], v.value = i.mode === m.Single ? null : [], g.value && (g.value.value = "");
+      M(""), u.value = i.mode === P.Single ? null : [], v.value = i.mode === P.Single ? null : [], g.value && (g.value.value = "");
     },
-    search: E,
+    search: M,
     goToOption: async (e) => {
       if (!d.value)
         return;
@@ -185,11 +187,11 @@ const Ue = (l, O, b) => {
       ).length, S = s.value.length - y;
       for (t > S && (t = S + 1); ; ) {
         if (!c.value[t]?.disabled) {
-          R.value = s.value[t], o.value = t;
+          E.value = s.value[t], o.value = t;
           return;
         }
         if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!he(o.value)) {
-          R.value = s.value[t], o.value = t;
+          E.value = s.value[t], o.value = t;
           return;
         }
       }
@@ -205,13 +207,13 @@ const Ue = (l, O, b) => {
     }
   };
   Te(Ne, i), Y(
-    T,
+    w,
     () => {
       d.value && Q();
     },
     {
       ignore: [
-        w,
+        x,
         B,
         L,
         U,
@@ -224,14 +226,14 @@ const Ue = (l, O, b) => {
     g.value && (g.value.value = i.query.value = "");
   };
   we(async () => {
-    l.autoFocus && (await D(), setTimeout(() => {
+    l.autoFocus && (await N(), setTimeout(() => {
       V.value.focus();
     })), i.goToOption(0);
   });
   const Se = () => {
     u.value = a.value, Array.isArray(u.value) && (v.value = A(u.value).slice()), O("apply", u.value), h(!1), ye();
   }, Q = () => {
-    X.value && Array.isArray(v.value) && (u.value = A(v.value).slice()), I.value = "", h(!1);
+    X.value && Array.isArray(v.value) && (u.value = A(v.value).slice()), T.value = "", h(!1);
   }, be = (e) => {
     if (!l.disableKeyboardEvents)
       switch (e.key) {
@@ -281,7 +283,7 @@ const Ue = (l, O, b) => {
             h(!0);
             return;
           }
-          C(s.value[o.value], o.value), i.mode === m.Single && !l.keepOpen && h(!1), e.preventDefault();
+          C(s.value[o.value], o.value), i.mode === P.Single && !l.keepOpen && h(!1), e.preventDefault();
           break;
         }
       }
@@ -300,7 +302,7 @@ const Ue = (l, O, b) => {
     onButtonKeydown: be,
     displayedValue: re,
     labelRef: H,
-    query: I,
+    query: T,
     containerProps: J,
     calculateTableHeight: Oe,
     wrapperProps: ve,
@@ -317,10 +319,10 @@ const Ue = (l, O, b) => {
     activeIndex: o,
     onCancel: Q,
     onApply: Se,
-    scrollTo: M,
+    scrollTo: D,
     onClickOutside: Y,
-    listRef: T,
-    buttonRef: w,
+    listRef: w,
+    buttonRef: x,
     apply: B,
     cancel: L,
     el: V,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ironsource/shared-ui",
-  "version": "2.1.6-rc.21",
+  "version": "2.1.6-rc.22",
   "engines": {
     "npm": ">=7.0.0",
     "node": ">=16.0.0"