@ironsource/shared-ui 2.1.11-rc.0 → 2.1.11-rc.2

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

@@ -1,5 +1,5 @@
-import { useToggle as ke } from "../../../composables/useToggle.js";
-import { inject as Ve, ref as i, computed as r, watch as b, useSlots as _e, toRaw as P, nextTick as N, provide as Ge, onMounted as He } from "vue";
+import { useToggle as Ve } from "../../../composables/useToggle.js";
+import { inject as ke, ref as i, computed as r, watch as A, useSlots as _e, toRaw as P, nextTick as N, provide as Ge, onMounted as He } from "vue";
 import { isObjectInArray as ee } from "../../../utils/array.js";
 import { objectsEqual as Be } from "../../../utils/object.js";
 import { useClamp as Le, useVirtualList as Ue, onClickOutside as le } from "@vueuse/core";
@@ -7,8 +7,8 @@ import { Mode as T, Type as _, DropdownContext as qe } from "./DropdownContext.j
 import { pxToRem as $e } from "../../../utils/style.js";
 import { useEditableContext as je } from "../../table-cells/common/EditableContext.js";
 import { useGroupedOptions as Xe } from "./useGroupedOptions.js";
-const ll = (l, S, A) => {
-  const te = Ve("isTreeDropdown", !1), {
+const ll = (l, b, h) => {
+  const te = ke("isTreeDropdown", !1), {
     sortOutGroups: G,
     flattenAndMarkGroupOptions: ae,
     isGroup: H,
@@ -25,25 +25,25 @@ const ll = (l, S, A) => {
   })(B || (B = {}));
   const a = i(
     l.selected
-  ), R = je(), n = r({
+  ), C = je(), n = r({
     get() {
-      return R?.value?.value ?? a.value;
+      return C?.value?.value ?? a.value;
     },
     set(e) {
-      R.onChange?.(e), R.onClose?.(), S("update:selected", e);
+      C.onChange?.(e), C.onClose?.(), b("update:selected", e);
     }
   });
-  b(
+  A(
     () => l.selected,
     () => {
-      a.value = l.selected, s.value = l.selected;
+      a.value = l.selected, d.value = l.selected;
     }
   );
-  const ce = _e(), w = i(null), h = i(null), L = i(null), E = i(null), U = i(null), I = i(null), se = i(), q = i(null), $ = i(null), j = i(null), ve = 8, de = r(() => I.value ? I.value.getBoundingClientRect().height + ve + l.distance : 0), X = i(!1), f = i([]), x = i(-1), O = i(""), s = i(l.selected || []), z = () => I.value?.focus(), [g, fe, ge] = ke({
+  const ce = _e(), w = i(null), O = i(null), L = i(null), R = i(null), U = i(null), I = i(null), se = i(), q = i(null), $ = i(null), j = i(null), de = 8, ve = r(() => I.value ? I.value.getBoundingClientRect().height + de + l.distance : 0), X = i(!1), f = i([]), x = i(-1), m = i(""), d = i(l.selected || []), z = () => I.value?.focus(), [g, fe, ge] = Ve({
     disabled: l.disabled,
     initialValue: l.defaultOpen
   });
-  b(
+  A(
     () => l.disabled,
     (e) => {
       e !== void 0 && ge(e);
@@ -56,9 +56,9 @@ const ll = (l, S, A) => {
       return l.isOpen;
     },
     set(e) {
-      S("update:isOpen", e);
+      b("update:isOpen", e);
     }
-  }), he = r(() => o.value.length - 1), d = Le(0, 0, he), J = r(() => n.value ? l.displayValue(n.value) : ""), Oe = (e) => {
+  }), he = r(() => o.value.length - 1), v = Le(0, 0, he), J = r(() => n.value ? l.displayValue(n.value) : ""), Oe = (e) => {
     if (!e.value.length && !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix)
       return l.placeholder;
     const t = !l.multiOptionsPlaceholderPrefix && !l.multiOptionsPlaceholderSuffix ? `${e.value.length} selected` : `${l.multiOptionsPlaceholderPrefix ?? ""}${e.value.length ?? "0"}${l.multiOptionsPlaceholderSuffix ?? ""}`;
@@ -68,18 +68,18 @@ const ll = (l, S, A) => {
       return n.value ? l.displayValue(n.value) : l.placeholder;
     if (Array.isArray(a.value))
       return Oe(a);
-  }), K = r(() => {
+  }), E = r(() => {
     if (Array.isArray(a.value))
       return l.groupedOptions ? ie(o, a) : a.value.length === o.value.length;
   }), Se = r(() => !l.multi || !Array.isArray(a.value) ? !1 : l.groupedOptions ? ue(
     o,
     a
   ) : a.value.length > 0 && a.value.length < o.value.length), M = (e) => {
-    O.value = e;
-  }, D = r(() => l.groupedOptions ? ae(l.options) : l.options), Ae = r(() => {
+    m.value = e;
+  }, D = r(() => l.groupedOptions ? ae(l.options) : l.options), be = r(() => {
     if (re(
       D,
-      s
+      d
     ))
       return D.value;
     const e = {
@@ -87,64 +87,64 @@ const ll = (l, S, A) => {
       notSelected: []
     };
     P(D).value.forEach((u) => {
-      const v = (l.comparingKey ? s.value.findIndex(
-        (V) => V[l.comparingKey] === u[l.comparingKey]
-      ) > -1 : s.value.includes(u)) ? "selected" : "notSelected";
-      e[v].push(u);
+      const s = (l.comparingKey ? d.value.findIndex(
+        (k) => k[l.comparingKey] === u[l.comparingKey]
+      ) > -1 : d.value.includes(u)) ? "selected" : "notSelected";
+      e[s].push(u);
     });
     const t = l.groupedOptions ? G(e.notSelected) : e.notSelected;
     return [].concat(e.selected, t);
   }), o = r(() => {
-    const e = Array.isArray(s.value) && l.multi && A.VERSION === 4 && !te ? Ae.value : D.value;
+    const e = Array.isArray(d.value) && l.multi && h.VERSION === 4 && !te ? be.value : D.value;
     if (l.onSearch) {
-      const t = e.filter((u) => l.groupedOptions && H(u) ? u : l.onSearch(u, O.value));
+      const t = e.filter((u) => l.groupedOptions && H(u) ? u : l.onSearch(u, m.value));
       return l.groupedOptions ? G(t) : t;
     } else
       return e;
-  }), be = r(() => f.value[0]?.hasSubtitle), Q = r(() => c.mode === T.Multi), Y = r(
-    () => be.value ? A.MULTILINE_LIST_HEIGHT : A.LIST_HEIGHT
+  }), Ae = r(() => f.value[0]?.hasSubtitle), Q = r(() => c.mode === T.Multi), Y = r(
+    () => Ae.value ? h.MULTILINE_LIST_HEIGHT : h.LIST_HEIGHT
   ), {
     list: Z,
     containerProps: F,
     wrapperProps: Pe,
-    scrollTo: C
+    scrollTo: K
   } = Ue(o, {
     itemHeight: Y.value,
     overscan: l.disableVirtualScroll ? 1 / 0 : 2
   });
-  b(
+  A(
     () => l.isOpen,
     (e) => {
       W(e);
     }
-  ), b([x], async () => {
+  ), A([x], async () => {
     await N();
-  }), b(
-    [g, d, x],
+  }), A(
+    [g, v, x],
     async ([e], [t]) => {
       g.value && (await N(), x.value !== -1 && e !== t && setTimeout(() => {
-        l.multi && A.VERSION === 4 || C(x.value);
-      }), d.value && setTimeout(() => {
-        C(d.value);
+        l.multi && h.VERSION === 4 || K(x.value);
+      }), v.value && setTimeout(() => {
+        K(v.value);
       }));
     }
-  ), b(O, () => {
-    S("onsearch", O.value), C(0);
+  ), A(m, () => {
+    b("onsearch", m.value), K(0);
   });
-  const m = (e, t = !1) => {
+  const S = (e, t = !1) => {
     l.disabled || (W(e), N(() => {
-      g.value && S("opened"), g.value || S("closed"), w.value && t && w.value.focus();
+      g.value && b("opened"), g.value || b("closed"), w.value && t && w.value.focus();
     }));
   };
-  b(g, (e) => {
+  A(g, (e) => {
     if (e) {
-      O.value = "", Q.value && Array.isArray(n.value) && (s.value = P(n.value).slice());
+      m.value = "", Q.value && Array.isArray(n.value) && (d.value = P(n.value).slice());
       return;
     }
     z();
   });
   const Te = () => {
-    if (K.value) {
+    if (E.value) {
       a.value = [];
       return;
     }
@@ -158,80 +158,78 @@ const ll = (l, S, A) => {
         }
         a.value = o.value;
       }
-      S("selectAll");
+      b("selectAll");
     }
   }, we = () => {
-    Te(), A.VERSION !== 4 && (n.value = a.value);
+    Te(), h.VERSION !== 4 && (n.value = a.value);
   }, Ie = (e = !0) => {
-    a.value = [], e && (n.value = [], s.value = []), S("clear");
-  }, k = (e, t) => {
-    if (e = P(e), f.value[t]?.disabled)
+    a.value = [], e && (n.value = [], d.value = []), b("clear");
+  }, V = (e, t) => {
+    if (e = P(e), h.VERSION === 4 ? e[l.disabledOptionKey] : f.value[t]?.disabled)
       return;
     if (x.value = t, c.mode !== T.Multi) {
-      l.keepOpen || m(!1), c.goToOption(
+      l.keepOpen || S(!1), c.goToOption(
         0
         /* None */
-      ), n.value = e, M(""), z(), c.type === _.Search && h.value && (h.value.value = l.displayValue(e));
+      ), n.value = e, M(""), z(), c.type === _.Search && O.value && (O.value.value = l.displayValue(e));
       return;
     }
     if (!Array.isArray(a.value))
       return;
-    h.value?.focus();
+    O.value?.focus();
     const y = P(a.value);
     if (ee(y, e) || l.comparingKey && y.findIndex(
-      (v) => v[l.comparingKey] === e[l.comparingKey]
+      (s) => s[l.comparingKey] === e[l.comparingKey]
     ) > -1) {
-      a.value = y.filter(
-        (v) => !Be(v, e)
-      );
+      a.value = y.filter((s) => l.comparingKey ? s[l.comparingKey] !== e[l.comparingKey] : !Be(s, e));
       return;
     } else {
       a.value = [...y, e];
       return;
     }
   }, xe = (e) => f.value[e]?.disabled, c = {
-    activeIndex: d,
+    activeIndex: v,
     options: f,
     selectedOption: n,
     labelRef: U,
-    activeOption: E,
+    activeOption: R,
     listRef: w,
     clearable: l.clearable,
     type: ce.input ? _.Search : _.Dropdown,
     mode: l.multi ? T.Multi : T.Single,
-    query: O,
+    query: m,
     selectedValue: J,
-    toggle: m,
+    toggle: S,
     disabled: l.disabled,
     open: g,
     mandatory: l.mandatory,
     size: l.size,
     placeholder: l.placeholder,
-    select: k,
+    select: V,
     clearSelection: () => {
-      M(""), n.value = c.mode === T.Single ? null : [], s.value = c.mode === T.Single ? null : [], h.value && (h.value.value = "");
+      M(""), n.value = c.mode === T.Single ? null : [], d.value = c.mode === T.Single ? null : [], O.value && (O.value.value = "");
     },
     search: M,
     goToOption: async (e) => {
       if (!g.value)
         return;
-      let t = d.value + e;
+      let t = v.value + e;
       const u = f.value.filter(
-        (v) => v.disabled
+        (s) => s.disabled
       ).length, y = o.value.length - u;
       for (t > y && (t = y + 1); ; ) {
         if (!f.value[t]?.disabled) {
-          E.value = o.value[t], d.value = t;
+          R.value = o.value[t], v.value = t;
           return;
         }
-        if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!xe(d.value)) {
-          E.value = o.value[t], d.value = t;
+        if ((e === 1 || e === 10) && (t = t + 1), (e === -1 || e === -10) && (t = t + -1), !!xe(v.value)) {
+          R.value = o.value[t], v.value = t;
           return;
         }
       }
     },
     registerInput: (e) => {
-      h.value = e.value;
+      O.value = e.value;
     },
     registerOption: (e, t, u) => {
       f.value = [...f.value, { id: e, disabled: t, hasSubtitle: u }];
@@ -251,23 +249,23 @@ const ll = (l, S, A) => {
         q,
         $,
         j,
-        h,
+        O,
         F.ref
       ]
     }
   );
   const De = () => {
-    h.value && (h.value.value = c.query.value = "");
+    O.value && (O.value.value = c.query.value = "");
   };
   He(async () => {
     l.autoFocus && (await N(), setTimeout(() => {
       L.value.focus();
     })), c.goToOption(0);
   });
-  const Ce = () => {
-    X.value = K.value, n.value = a.value, Array.isArray(n.value) && (s.value = P(n.value).slice()), S("apply", n.value), m(!1), De();
+  const Ke = () => {
+    X.value = E.value, n.value = a.value, Array.isArray(n.value) && (d.value = P(n.value).slice()), b("apply", n.value), S(!1), De();
   }, p = () => {
-    Q.value && Array.isArray(s.value) && (n.value = P(s.value).slice()), O.value = "", m(!1);
+    Q.value && Array.isArray(d.value) && (n.value = P(d.value).slice()), m.value = "", S(!1);
   }, Ne = (e) => {
     if (!l.disableKeyboardEvents)
       switch (e.key) {
@@ -275,9 +273,9 @@ const ll = (l, S, A) => {
         case "Enter":
         case "ArrowUp":
         case "ArrowDown":
-          m(!0), e.preventDefault();
+          S(!0), e.preventDefault();
       }
-  }, Re = (e) => {
+  }, Ce = (e) => {
     if (!l.disableKeyboardEvents)
       switch (e.key) {
         case "ArrowUp": {
@@ -295,7 +293,7 @@ const ll = (l, S, A) => {
           break;
         }
         case "Escape": {
-          m(!1), e.preventDefault();
+          S(!1), e.preventDefault();
           break;
         }
         case "PageUp": {
@@ -314,52 +312,52 @@ const ll = (l, S, A) => {
         }
         case "Enter": {
           if (!g.value) {
-            m(!0);
+            S(!0);
             return;
           }
-          k(o.value[d.value], d.value), c.mode === T.Single && !l.keepOpen && m(!1), e.preventDefault();
+          V(o.value[v.value], v.value), c.mode === T.Single && !l.keepOpen && S(!1), e.preventDefault();
           break;
         }
       }
-  }, Ee = r(() => {
+  }, Re = r(() => {
     if (l.loading)
       return 8.5;
-    const e = l.customNumberOfDisplayedOptions || Z.value.reduce((V, Ke) => {
-      const Me = l.overrideOptionCountCalculation ? l.overrideOptionCountCalculation(Ke.data) : 1;
-      return V + Me;
-    }, 0), t = l.multi && l.showSelectAll && !O.value ? 1 : 0, u = e > A.MAX_NUMBER_OF_OPTIONS, y = e + t;
-    let v = u ? A.MAX_NUMBER_OF_OPTIONS + 0.1 : y;
-    return l.noResultsText && v === 0 && (v = v + 1), $e(
-      v * Y.value + A.PADDING_PX
+    const e = l.customNumberOfDisplayedOptions || Z.value.reduce((k, Ee) => {
+      const Me = l.overrideOptionCountCalculation ? l.overrideOptionCountCalculation(Ee.data) : 1;
+      return k + Me;
+    }, 0), t = l.multi && l.showSelectAll && !m.value ? 1 : 0, u = e > h.MAX_NUMBER_OF_OPTIONS, y = e + t;
+    let s = u ? h.MAX_NUMBER_OF_OPTIONS + 0.1 : y;
+    return l.noResultsText && s === 0 && (s = s + 1), $e(
+      s * Y.value + h.PADDING_PX
     );
   });
   return {
-    onKeydown: Re,
-    location: de,
+    onKeydown: Ce,
+    location: ve,
     open: g,
-    toggleMenu: m,
+    toggleMenu: S,
     onButtonKeydown: Ne,
     displayedValue: me,
     labelRef: U,
-    query: O,
+    query: m,
     containerProps: F,
-    calculateTableHeight: Ee,
+    calculateTableHeight: Re,
     wrapperProps: Pe,
     filteredOptions: o,
-    allSelected: K,
+    allSelected: E,
     allSelectedApplied: X,
     isIndeterminate: Se,
     onSelectAll: we,
     virtualOptions: Z,
     isSelected: oe,
     selectedOption: n,
-    selectedOptionPrevious: s,
+    selectedOptionPrevious: d,
     selectedValue: J,
-    onSelect: k,
-    activeIndex: d,
+    onSelect: V,
+    activeIndex: v,
     onCancel: p,
-    onApply: Ce,
-    scrollTo: C,
+    onApply: Ke,
+    scrollTo: K,
     onClickOutside: le,
     listRef: w,
     buttonRef: I,

package/index.js

@@ -1,4 +1,4 @@
-import './AppTrigger.vue_vue_type_style_index_0_scoped_121aac8b_lang.css';
+import './AppIcon.vue_vue_type_style_index_0_scoped_56ba337c_lang.css';
 import { AppTriggerTypes as ro } from "./components/appTrigger/index.js";
 import { AutocompleteDropdownTypes as mo } from "./components/autocompleteDropdown/index.js";
 import { MenuItemTypes as po } from "./components/menuItem/index.js";

package/package.json

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