@ironsource/shared-ui 2.1.12-rc.3 → 2.1.12-rc.4

package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_96c7507e_lang.css

@@ -0,0 +1 @@
+.custom-list-area[data-v-96c7507e]{color:var(--text-secondary);width:100%;text-align:center;box-sizing:border-box;padding:20px 43px}.inline-search[data-v-96c7507e]{width:100%}.contain-accept[data-v-96c7507e]{padding:6px 8px;margin-bottom:4px;cursor:pointer}.contain-accept[data-v-96c7507e]:hover{background-color:var(--action-hover);border-radius:.5rem}.contain-accept--query[data-v-96c7507e]{margin-left:4px;display:inline-flex;color:var(--primary-main)}

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

@@ -7,7 +7,7 @@ import { Mode as T, Type as U, DropdownContext as $e } from "./DropdownContext.j
 import { pxToRem as je } from "../../../utils/style.js";
 import { useEditableContext as ze } from "../../table-cells/common/EditableContext.js";
 import { useGroupedOptions as We } from "./useGroupedOptions.js";
-const al = (e, v, g) => {
+const al = (e, d, g) => {
   const B = ke("isTreeDropdown", !1), {
     sortOutGroups: H,
     flattenAndMarkGroupOptions: ue,
@@ -31,16 +31,16 @@ const al = (e, v, g) => {
       return K?.value?.value ?? a.value;
     },
     set(l) {
-      K.onChange?.(l), K.onClose?.(), v("update:selected", l);
+      K.onChange?.(l), K.onClose?.(), d("update:selected", l);
     }
   });
   b(
     () => e.selected,
     () => {
-      a.value = e.selected, d.value = e.selected;
+      a.value = e.selected, v.value = e.selected;
     }
   );
-  const de = Ge(), w = r(null), m = r(null), j = r(null), R = r(null), z = r(null), I = r(null), ve = r(), W = r(null), J = r(null), Q = r(null), fe = 8, ge = c(() => I.value ? I.value.getBoundingClientRect().height + fe + e.distance : 0), D = r(!1), y = r([]), x = r(-1), h = r(""), d = r(e.selected || []), Y = () => I.value?.focus(), [O, ye, he] = Ve({
+  const de = Ge(), w = r(null), m = r(null), j = r(null), R = r(null), z = r(null), I = r(null), ve = r(), W = r(null), J = r(null), Q = r(null), fe = 8, ge = c(() => I.value ? I.value.getBoundingClientRect().height + fe + e.distance : 0), D = r(!1), y = r([]), x = r(-1), h = r(""), v = r(e.selected || []), Y = () => I.value?.focus(), [O, ye, he] = Ve({
     disabled: e.disabled,
     initialValue: e.defaultOpen
   });
@@ -57,7 +57,7 @@ const al = (e, v, g) => {
       return e.isOpen;
     },
     set(l) {
-      v("update:isOpen", l);
+      d("update:isOpen", l);
     }
   }), Se = c(() => o.value.length - 1), f = He(0, 0, Se), F = c(() => n.value ? e.displayValue(n.value) : ""), me = (l) => {
     if (!l.value.length && !e.multiOptionsPlaceholderPrefix && !e.multiOptionsPlaceholderSuffix)
@@ -80,7 +80,7 @@ const al = (e, v, g) => {
   }, M = c(() => e.groupedOptions ? ue(e.options) : e.options), Pe = c(() => {
     if (oe(
       M,
-      d
+      v
     ))
       return M.value;
     const l = {
@@ -88,15 +88,15 @@ const al = (e, v, g) => {
       notSelected: []
     };
     P(M).value.forEach((i) => {
-      const u = (e.comparingKey ? d.value.findIndex(
+      const u = (e.comparingKey ? v.value.findIndex(
         (L) => L[e.comparingKey] === i[e.comparingKey]
-      ) > -1 : d.value.includes(i)) ? "selected" : "notSelected";
+      ) > -1 : v.value.includes(i)) ? "selected" : "notSelected";
       l[u].push(i);
     });
     const t = e.groupedOptions ? H(l.notSelected) : l.notSelected;
     return [].concat(l.selected, t);
   }), o = c(() => {
-    const l = Array.isArray(d.value) && e.multi && g.VERSION === 4 && !B ? Pe.value : M.value;
+    const l = Array.isArray(v.value) && e.multi && g.VERSION === 4 && !B ? Pe.value : M.value;
     if (e.onSearch) {
       const t = l.filter((i) => e.groupedOptions && q(i) ? i : e.onSearch(i, h.value));
       return e.groupedOptions ? H(t) : t;
@@ -130,16 +130,16 @@ const al = (e, v, g) => {
       }));
     }
   ), b(h, () => {
-    v("onsearch", h.value), C(0);
+    d("onsearch", h.value), C(0);
   });
   const A = (l, t = !1) => {
     e.disabled || (Z(l), N(() => {
-      O.value && v("opened"), O.value || v("closed"), w.value && t && w.value.focus();
+      O.value && d("opened"), O.value || d("closed"), w.value && t && w.value.focus();
     }));
   };
   b(O, (l) => {
     if (l) {
-      h.value = "", p.value && Array.isArray(n.value) && (d.value = P(n.value).slice());
+      h.value = "", p.value && Array.isArray(n.value) && (v.value = P(n.value).slice());
       return;
     }
     Y();
@@ -159,12 +159,12 @@ const al = (e, v, g) => {
         }
         a.value = o.value;
       }
-      v("selectAll");
+      d("selectAll");
     }
   }, xe = () => {
     Ie(), g.VERSION !== 4 && (n.value = a.value);
   }, De = (l = !0) => {
-    a.value = [], l && (n.value = [], d.value = []), e.dynamicFilterMode || v("clear-all");
+    a.value = [], l ? (n.value = [], v.value = [], d("clear")) : e.dynamicFilterMode || d("clear");
   }, G = (l, t) => {
     if (l = P(l), g.VERSION === 4 ? l[e.disabledOptionKey] : y.value[t]?.disabled)
       return;
@@ -208,7 +208,7 @@ const al = (e, v, g) => {
     placeholder: e.placeholder,
     select: G,
     clearSelection: () => {
-      _(""), n.value = s.mode === T.Single ? null : [], d.value = s.mode === T.Single ? null : [], m.value && (m.value.value = "");
+      _(""), n.value = s.mode === T.Single ? null : [], v.value = s.mode === T.Single ? null : [], m.value && (m.value.value = "");
     },
     search: _,
     goToOption: async (l) => {
@@ -267,9 +267,9 @@ const al = (e, v, g) => {
     ) : D.value = e.options.length === e.selected.length);
   });
   const le = () => {
-    e.multi && (n.value = a.value, Array.isArray(n.value) && (d.value = P(n.value).slice(), D.value = e.groupedOptions ? ce(e.options) === n.value.length : e.options.length === n.value.length)), v("apply", n.value), v("allSelectedChanged", E.value), A(!1), Ce();
+    e.multi && (n.value = a.value, Array.isArray(n.value) && (v.value = P(n.value).slice(), D.value = e.groupedOptions ? ce(e.options) === n.value.length : e.options.length === n.value.length)), d("apply", n.value), d("allSelectedChanged", E.value), A(!1), Ce();
   }, te = () => {
-    p.value && Array.isArray(d.value) && (n.value = P(d.value).slice()), h.value = "", A(!1);
+    p.value && Array.isArray(v.value) && (n.value = P(v.value).slice()), h.value = "", A(!1);
   }, Ne = (l) => {
     if (!e.disableKeyboardEvents)
       switch (l.key) {
@@ -338,11 +338,11 @@ const al = (e, v, g) => {
   return Xe(
     k.ref,
     () => {
-      !e.loadMoreLoading && e.infiniteLoading && v("loadMore");
+      !e.loadMoreLoading && e.infiniteLoading && d("loadMore");
     },
     { distance: e.infiniteScrollThreshold }
   ), b(a, () => {
-    v("unsavedSelectionUpdate", a.value);
+    d("unsavedSelectionUpdate", a.value);
   }), {
     onKeydown: Ke,
     location: ge,
@@ -363,7 +363,7 @@ const al = (e, v, g) => {
     virtualOptions: V,
     isSelected: se,
     selectedOption: n,
-    selectedOptionPrevious: d,
+    selectedOptionPrevious: v,
     selectedValue: F,
     onSelect: G,
     activeIndex: f,

package/components/dropdown/v4/ConditionalDropdown.vue.js

@@ -1,7 +1,7 @@
 import o from "./ConditionalDropdown.vue2.js";
 /* empty css                          */import e from "../../../_virtual/_plugin-vue_export-helper.js";
-// import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_3a2aeea3_lang.css"; //*');
-const p = /* @__PURE__ */ e(o, [["__scopeId", "data-v-3a2aeea3"]]);
+// import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_96c7507e_lang.css"; //*');
+const n = /* @__PURE__ */ e(o, [["__scopeId", "data-v-96c7507e"]]);
 export {
-  p as default
+  n as default
 };

package/components/dropdown/v4/ConditionalDropdown.vue2.js

@@ -1,4 +1,4 @@
- import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_3a2aeea3_lang.css"; import { defineComponent as W, computed as O, ref as s, watch as K, onMounted as q, openBlock as D, createBlock as G, unref as d, withCtx as f, createVNode as g, mergeProps as H, createElementVNode as J, isRef as X, normalizeProps as Y, guardReactiveProps as Z, createElementBlock as _, createTextVNode as ee, toDisplayString as le, createCommentVNode as oe } from "vue";
+ import "../../../ConditionalDropdown.vue_vue_type_style_index_0_scoped_96c7507e_lang.css"; import { defineComponent as W, computed as O, ref as s, watch as K, onMounted as q, openBlock as D, createBlock as G, unref as c, withCtx as f, createVNode as g, mergeProps as H, createElementVNode as J, isRef as X, normalizeProps as Y, guardReactiveProps as Z, createElementBlock as _, createTextVNode as ee, toDisplayString as le, createCommentVNode as oe } from "vue";
 import F from "./DropdownV4.vue.js";
 import "./DefaultDropdownTrigger.vue.js";
 import "./IconButtonDropdownTrigger.vue.js";
@@ -55,8 +55,8 @@ const re = { class: "conditional-container" }, se = {
     }), L = () => {
       const { appliedSelections: l } = e;
       return l ? Array.isArray(l) ? l : [l] : [];
-    }, w = s(null), c = s(!0), a = s([]), n = s(L()), T = s(!0), p = s(!1), C = s(!1), u = s(e.searchQuery), B = s(""), m = s(e.label), k = s([]), U = O(() => (!u.value || u.value?.length < e.minCharsToStart) && !a.value.length ? `Enter at least ${e.minCharsToStart} characters to begin` : "No results found"), I = O(() => {
-      const l = c.value ? 4 : 4.5, t = a.value.length > 4 ? a.value.length : l;
+    }, w = s(null), p = s(!0), a = s([]), n = s(L()), T = s(!0), d = s(!1), C = s(!1), u = s(e.searchQuery), B = s(""), m = s(e.label), k = s([]), U = O(() => (!u.value || u.value?.length < e.minCharsToStart) && !a.value.length ? `Enter at least ${e.minCharsToStart} characters to begin` : "No results found"), I = O(() => {
+      const l = p.value ? 4 : 4.5, t = a.value.length > 4 ? a.value.length : l;
       if (e.groupedOptions) {
         let o = 0;
         return a.value.forEach((y) => {
@@ -80,14 +80,14 @@ const re = { class: "conditional-container" }, se = {
       return [];
     }, A = async (l) => {
       try {
-        p.value = !0;
+        d.value = !0;
         const t = await e.fetchFnCallback(l), o = M(
           l,
           t
         );
-        a.value = [...o, ...t], p.value = !1;
+        a.value = [...o, ...t], d.value = !1;
       } catch (t) {
-        p.value = !1, console.error("Error fetching data:", t);
+        d.value = !1, console.error("Error fetching data:", t);
       }
     }, E = async () => {
       if (e.infiniteLoading)
@@ -104,7 +104,7 @@ const re = { class: "conditional-container" }, se = {
     ), b = (l) => {
       l.length >= e.minCharsToStart ? (V(l), w.value?.scrollTo(0)) : e.infiniteLoading && i.value.multi ? a.value = k.value || [] : a.value = [];
     }, x = () => {
-      u.value && a.value.length && !p.value && !i.value.multi ? a.value[0].conditionalOptions ? a.value[0] = {
+      u.value && a.value.length && !d.value && !i.value.multi ? a.value[0].conditionalOptions ? a.value[0] = {
         [e.optionNameKey]: u.value,
         conditionalOptions: !0,
         conditionalName: i.value.label,
@@ -119,7 +119,7 @@ const re = { class: "conditional-container" }, se = {
         ...a.value
       ] : a.value.length && a.value[0].conditionalOptions && a.value.shift();
     }, N = () => {
-      c.value && n.value.length === 0 ? m.value = e.label : m.value = `${e.label} ${i.value.label.toLowerCase()}`;
+      p.value && n.value.length === 0 ? m.value = e.label : m.value = `${e.label} ${i.value.label.toLowerCase()}`;
     };
     K(u, () => {
       b(u.value);
@@ -132,14 +132,14 @@ const re = { class: "conditional-container" }, se = {
       }
     );
     const P = () => {
-      c.value && n.value.length === 0 ? (i.value = null, S.value = [], i.value = null) : (B.value = u.value, S.value = c.value ? [...n.value] : { ...n.value }, T.value = c.value), N();
+      p.value && n.value.length === 0 ? (i.value = null, S.value = [], i.value = null) : (B.value = u.value, S.value = p.value ? [...n.value] : { ...n.value }, T.value = p.value), N();
     };
     K(i, (l, t) => {
-      i.value.multi ? (p.value = !0, !t.multi && l.multi && (Array.isArray(e.appliedSelections) ? n.value = e.appliedSelections : n.value = [e.appliedSelections]), setTimeout(() => {
-        p.value = !1, c.value = !0;
-      }, 100)) : setTimeout(() => {
-        c.value = !1;
-      }, 100);
+      i.value.multi ? (d.value = !0, !t.multi && l.multi && (Array.isArray(e.appliedSelections) ? n.value = e.appliedSelections : n.value = [e.appliedSelections]), setTimeout(() => {
+        d.value = !1, p.value = !0;
+      }, 100)) : (d.value = !0, setTimeout(() => {
+        d.value = !1, p.value = !1;
+      }, 100));
     });
     const Q = (l) => {
       k.value = l;
@@ -154,23 +154,23 @@ const re = { class: "conditional-container" }, se = {
     const $ = () => {
       h("closed");
     };
-    return (l, t) => (D(), G(d(F), {
+    return (l, t) => (D(), G(c(F), {
       ref_key: "dropdownRef",
       ref: w,
       selected: n.value,
       "onUpdate:selected": t[2] || (t[2] = (o) => n.value = o),
       "predefined-trigger": "chip",
       "display-value": (o) => o?.[r.optionNameKey],
-      multi: c.value,
+      multi: p.value,
       options: a.value,
       placeholder: m.value,
       "search-placeholder": "Search",
       "option-name-key": r.optionNameKey,
       "with-conditions": "",
       "inline-search": "",
-      "custom-number-of-displayed-options": d(I),
+      "custom-number-of-displayed-options": c(I),
       "options-list-width": "330px",
-      loading: p.value || r.loadingOverride,
+      loading: d.value || r.loadingOverride,
       "load-more-loading": C.value,
       "comparing-key": r.comparingKey,
       "is-open": r.isOpen,
@@ -189,9 +189,9 @@ const re = { class: "conditional-container" }, se = {
       onClosed: $
     }, {
       "dropdown-trigger": f(({ defaultTriggerProps: o }) => [
-        g(d(ae), H(o, {
+        g(c(ae), H(o, {
           label: m.value,
-          "selected-option": d(S),
+          "selected-option": c(S),
           multi: T.value,
           "cancel-all-selected-display": "",
           "display-value-in-quotes": !Array.isArray(n.value) && n.value.conditionalOptions,
@@ -200,8 +200,8 @@ const re = { class: "conditional-container" }, se = {
       ]),
       "dropdown-conditions": f(() => [
         J("div", re, [
-          g(d(F), {
-            selected: d(i),
+          g(c(F), {
+            selected: c(i),
             "onUpdate:selected": t[0] || (t[0] = (o) => X(i) ? i.value = o : null),
             options: r.conditionalOptions,
             "option-name-key": "label",
@@ -210,14 +210,14 @@ const re = { class: "conditional-container" }, se = {
             size: "small"
           }, {
             "dropdown-trigger": f(({ buttonTriggerProps: o }) => [
-              g(d(te), Y(Z(o)), null, 16)
+              g(c(te), Y(Z(o)), null, 16)
             ]),
             _: 1
           }, 8, ["selected", "options", "display-value"])
         ])
       ]),
       "inline-search": f(() => [
-        g(d(ne), {
+        g(c(ne), {
           modelValue: u.value,
           "onUpdate:modelValue": t[1] || (t[1] = (o) => u.value = o),
           class: "inline-search",
@@ -228,10 +228,10 @@ const re = { class: "conditional-container" }, se = {
         }, null, 8, ["modelValue", "auto-focus"])
       ]),
       "custom-list-area": f(() => [
-        !a.value.length && !p.value ? (D(), _("div", se, [
+        !a.value.length && !d.value ? (D(), _("div", se, [
           g(ie, { variant: "body1" }, {
             default: f(() => [
-              ee(le(d(U)), 1)
+              ee(le(c(U)), 1)
             ]),
             _: 1
           })

package/index.js

@@ -1,4 +1,4 @@
-import './MenuItem.vue_vue_type_style_index_0_scoped_67e53b85_lang.css';
+import './Typography.vue_vue_type_style_index_0_scoped_07b259bf_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.12-rc.3",
+  "version": "2.1.12-rc.4",
   "engines": {
     "npm": ">=7.0.0",
     "node": ">=16.0.0"

package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_3a2aeea3_lang.css

@@ -1 +0,0 @@
-.custom-list-area[data-v-3a2aeea3]{color:var(--text-secondary);width:100%;text-align:center;box-sizing:border-box;padding:20px 43px}.inline-search[data-v-3a2aeea3]{width:100%}.contain-accept[data-v-3a2aeea3]{padding:6px 8px;margin-bottom:4px;cursor:pointer}.contain-accept[data-v-3a2aeea3]:hover{background-color:var(--action-hover);border-radius:.5rem}.contain-accept--query[data-v-3a2aeea3]{margin-left:4px;display:inline-flex;color:var(--primary-main)}