@ironsource/shared-ui 2.1.12-rc.9 → 2.1.12-test.57

package/components/chart/SettingsHeader.vue.js

@@ -1,7 +1,7 @@
 import e from "./SettingsHeader.vue2.js";
 /* empty css                     */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_9b6cd9d9_lang.css"; //*');
-const d = /* @__PURE__ */ o(e, [["__scopeId", "data-v-9b6cd9d9"]]);
+// import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_fba2eaa4_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-fba2eaa4"]]);
 export {
-  d as default
+  s as default
 };

package/components/chart/SettingsHeader.vue2.js

@@ -1,5 +1,5 @@
- import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_9b6cd9d9_lang.css"; import { defineComponent as h, computed as g, openBlock as y, createElementBlock as f, createElementVNode as r, normalizeClass as a, createVNode as l, unref as t, isRef as v, withCtx as T, mergeProps as w, renderSlot as p } from "vue";
-import b from "../dropdown/v4/DropdownV4.vue.js";
+ import "../../SettingsHeader.vue_vue_type_style_index_0_scoped_fba2eaa4_lang.css"; import { defineComponent as h, computed as g, openBlock as y, createElementBlock as f, createElementVNode as r, normalizeClass as l, renderSlot as i, createVNode as p, unref as t, isRef as v, withCtx as T, mergeProps as b } from "vue";
+import w from "../dropdown/v4/DropdownV4.vue.js";
 import "../dropdown/v4/DefaultDropdownTrigger.vue.js";
 import "../dropdown/v4/IconButtonDropdownTrigger.vue.js";
 import "../dropdown/v4/ChipDropdownTrigger.vue.js";
@@ -10,7 +10,7 @@ import "../dropdown/v4/TreeDropdown.vue.js";
 import "../dropdown/v4/OptionV4.vue.js";
 import "../dropdown/v4/ConditionalDropdown.vue.js";
 import { DROPDOWN_TYPE_OPTIONS as c } from "./consts.js";
-const _ = { class: "settings-header-container" }, B = { class: "chart-type-selection" }, x = /* @__PURE__ */ h({
+const B = { class: "settings-header-container" }, C = { class: "chart-type-selection" }, H = /* @__PURE__ */ h({
   __name: "SettingsHeader",
   props: {
     chartType: null,
@@ -25,41 +25,42 @@ const _ = { class: "settings-header-container" }, B = { class: "chart-type-selec
       set(e) {
         m("update:chartType", e.id);
       }
-    }), i = (e) => `Chart: ${e.name}`;
-    return (e, d) => (y(), f("div", _, [
+    }), d = (e) => `Chart: ${e.name}`;
+    return (e, a) => (y(), f("div", B, [
       r("div", {
-        class: a(["settings", { "settings-spacer": !s.hideLegend }])
+        class: l(["settings", { "settings-spacer": !s.hideLegend }])
       }, [
-        r("div", B, [
-          l(t(b), {
+        i(e.$slots, "before-chart-type", {}, void 0, !0),
+        r("div", C, [
+          p(t(w), {
             selected: t(o),
-            "onUpdate:selected": d[0] || (d[0] = (n) => v(o) ? o.value = n : null),
+            "onUpdate:selected": a[0] || (a[0] = (n) => v(o) ? o.value = n : null),
             options: t(c),
             "option-name-key": "name",
-            "display-value": i,
+            "display-value": d,
             placeholder: "Select chart type",
             size: "small"
           }, {
             "dropdown-trigger": T(({ buttonTriggerProps: n }) => [
-              l(t(k), w(n, {
-                label: i(t(o))
+              p(t(k), b(n, {
+                label: d(t(o))
               }), null, 16, ["label"])
             ]),
             _: 1
           }, 8, ["selected", "options"])
         ]),
         r("div", null, [
-          p(e.$slots, "metric", {}, void 0, !0)
+          i(e.$slots, "metric", {}, void 0, !0)
         ])
       ], 2),
       r("div", {
-        class: a(["breakdowns", { "breakdowns-border": !s.hideLegend }])
+        class: l(["breakdowns", { "breakdowns-border": !s.hideLegend }])
       }, [
-        p(e.$slots, "breakdowns", {}, void 0, !0)
+        i(e.$slots, "breakdowns", {}, void 0, !0)
       ], 2)
     ]));
   }
 });
 export {
-  x as default
+  H as default
 };

package/components/chart/colorPalette.d.ts

@@ -0,0 +1,4 @@
+import { HexColor } from '@is-ssp/chart/types';
+export declare const DEFAULT_CHART_COLOR: HexColor;
+export declare const COLOR_PALETTE: HexColor[];
+export declare const RESERVED_COLORS_MAP: Record<string, HexColor>;

package/components/chart/colorPalette.js

@@ -0,0 +1,54 @@
+import { BIDDING_PREFIX as F, NETWORK_ID_UNITY_ADS as N, NETWORK_ID_AD_MOB as R, NETWORK_ID_IRON_SOURCE as $, NON_BIDDING_PREFIX as E, NETWORK_ID_MINTEGRAL as B, NETWORK_ID_APPLOVIN as _, NETWORK_ID_FACEBOOK_META as D, NETWORK_ID_LIFTOFF as A, NETWORK_ID_PANGLE as O, NETWORK_ID_INMOBI as I, NETWORK_ID_DT_EXCHANGE as C } from "./consts.js";
+const t = "#c9c9c9", K = [
+  "#80BCFE",
+  "#9999FF",
+  "#5883E4",
+  "#80CBC4",
+  "#FFC670",
+  "#FF7557",
+  "#0D7EA0",
+  "#673AFF",
+  "#CA80DC",
+  "#FEBBB2"
+], W = {
+  total: "#646464",
+  // AB tests
+  A: "#FFC134",
+  B: "#4F4FF5",
+  // Countries
+  US: "#272EC4",
+  CN: "#F52E1E",
+  GB: "#0082FF",
+  DE: "#FFD600",
+  JP: "#BA0029",
+  AU: "#009BCB",
+  FR: "#34A853",
+  // Ad formats
+  Rewarded: "#0082FF",
+  Interstitial: "#009BCB",
+  Banner: "#9668FF",
+  Native: "#FF35A2",
+  // Ad sources
+  [`${F}-${N}`]: "#9668FF",
+  [`${F}-${R}`]: "#34A853",
+  [`${F}-${$}`]: "#272EC4",
+  [`${E}-${$}`]: "#5C63E7",
+  [`${F}-${B}`]: "#00D8B2",
+  [`${F}-${_}`]: "#009BCB",
+  [`${E}-${_}`]: "#80CDE5",
+  [`${F}-${D}`]: "#0082FF",
+  [`${E}-${D}`]: "#52AAFF",
+  [`${F}-${A}`]: "#FF35A2",
+  [`${E}-${A}`]: "#FF9AD1",
+  [`${F}-${O}`]: "#F52E1E",
+  [`${E}-${O}`]: "#FA9F97",
+  [`${F}-${I}`]: "#FFD600",
+  [`${E}-${I}`]: "#FFEC8A",
+  [`${F}-${C}`]: "#BA0029",
+  [`${E}-${C}`]: "#DD8094"
+};
+export {
+  K as COLOR_PALETTE,
+  t as DEFAULT_CHART_COLOR,
+  W as RESERVED_COLORS_MAP
+};

package/components/chart/composables/useColorsMap.d.ts

@@ -1,10 +1,10 @@
 import { Ref } from 'vue';
-import { ChartDataSet } from '@is-ssp/chart';
+import { ChartDataSet } from '@/components/chart';
 type UseColorsMapArgs = {
     dataSets: Ref<ChartDataSet[]>;
     visibleIds: Ref<unknown[]>;
 };
 export declare const useColorsMap: ({ dataSets, visibleIds }: UseColorsMapArgs) => {
-    colorsMap: import("vue").ComputedRef<{}>;
+    colorsMap: Ref<Record<string, `#${string}`>>;
 };
 export {};

package/components/chart/composables/useColorsMap.js

@@ -1,17 +1,46 @@
-import { computed as e } from "vue";
-import { COLOR_PALETTE as a } from "../consts.js";
-const n = ({ dataSets: t, visibleIds: l }) => {
-  const c = e(
-    () => t.value.filter(
-      (o) => l.value.includes(o.id)
-    )
-  );
-  return {
-    colorsMap: e(
-      () => c.value.reduce((o, r, u) => (o[r.id] = r.color || a[u] || "#000000", o), {})
+import { computed as n, ref as r, watch as E } from "vue";
+import { RESERVED_COLORS_MAP as c, COLOR_PALETTE as O, DEFAULT_CHART_COLOR as R } from "../colorPalette.js";
+const T = ({ dataSets: u, visibleIds: i }) => {
+  const a = n(
+    () => u.value.filter(
+      (o) => i.value.includes(o.id)
     )
+  ), l = r({
+    ...c
+    // destructuring is important to avoid mutating the reserved colors object
+  }), s = r([]), v = n(
+    () => O.filter((o) => !s.value.includes(o))
+  ), d = () => {
+    a.value.forEach((o) => {
+      const e = String(o.id);
+      if (!l.value[e]) {
+        const t = o.color || v.value[0] || R;
+        C(e, t);
+      }
+    });
+  }, f = () => {
+    Object.keys(l.value).forEach((o) => {
+      const e = a.value.find((m) => String(m.id) === o), t = !!c[o];
+      !e && !t && p(o);
+    });
+  }, C = (o, e) => {
+    l.value[String(o)] = e, s.value.push(e);
+  }, p = (o) => {
+    const e = l.value[o];
+    delete l.value[o];
+    const t = s.value.indexOf(e);
+    t > -1 && s.value.splice(t, 1);
+  };
+  return E(
+    a,
+    () => {
+      f(), d();
+    },
+    { immediate: !0 }
+  ), {
+    colorsMap: l
   };
 };
 export {
-  n as useColorsMap
+  T as useColorsMap
 };

package/components/chart/consts.d.ts

@@ -7,7 +7,6 @@ export declare const TICK_LABEL_FONT: {
     weight: number;
     family: string;
 };
-export declare const COLOR_PALETTE: string[];
 export declare const DEFAULT_TICK_COUNT = 4;
 export declare const DEFAULT_MIN_VISIBLE = 1;
 export declare const DEFAULT_MAX_VISIBLE = 5;
@@ -17,3 +16,15 @@ export declare const COMPACT_HEADER_HEIGHT = 43;
 export declare const DEFAULT_CHART_PLANE_HEIGHT = 312;
 export declare const MIN_PLANE_HEIGHT = 187;
 export declare const TOTALS_HELPER_KEY = "__TOTALS_HELPER_KEY__";
+export declare const BIDDING_PREFIX = "Bidding";
+export declare const NON_BIDDING_PREFIX = "Non-bidding";
+export declare const NETWORK_ID_IRON_SOURCE = 9899;
+export declare const NETWORK_ID_UNITY_ADS = 9917;
+export declare const NETWORK_ID_FACEBOOK_META = 9939;
+export declare const NETWORK_ID_AD_MOB = 9942;
+export declare const NETWORK_ID_MINTEGRAL = 9953;
+export declare const NETWORK_ID_APPLOVIN = 9935;
+export declare const NETWORK_ID_INMOBI = 9938;
+export declare const NETWORK_ID_DT_EXCHANGE = 9950;
+export declare const NETWORK_ID_PANGLE = 9952;
+export declare const NETWORK_ID_LIFTOFF = 9962;

package/components/chart/consts.js

@@ -1,32 +1,37 @@
-import { ChartType as E } from "./types.js";
-const L = "#fcfcfc", T = "#E4E4E4", n = "#646464", t = {
+import { ChartType as _ } from "./types.js";
+const I = "#fcfcfc", T = "#E4E4E4", O = "#646464", n = {
   size: 12,
   weight: 400,
   family: "Inter"
-}, c = [
-  "#80BCFE",
-  "#9999FF",
-  "#5883E4",
-  "#80CBC4",
-  "#FFC670"
-], O = 4, I = 1, o = 5, A = [
-  { id: E.Line, name: "Line" },
-  { id: E.StackedLine, name: "Stack" },
-  { id: E.Bar, name: "Bar" }
-], C = 76, s = 43, H = 312, R = 187, e = "__TOTALS_HELPER_KEY__";
+}, t = 4, N = 1, c = 5, o = [
+  { id: _.Line, name: "Line" },
+  { id: _.StackedLine, name: "Stack" },
+  { id: _.Bar, name: "Bar" }
+], D = 76, L = 43, R = 312, s = 187, A = "__TOTALS_HELPER_KEY__", K = "Bidding", i = "Non-bidding", C = 9899, H = 9917, P = 9939, B = 9942, e = 9953, F = 9935, W = 9938, G = 9950, a = 9952, S = 9962;
 export {
-  c as COLOR_PALETTE,
-  s as COMPACT_HEADER_HEIGHT,
-  H as DEFAULT_CHART_PLANE_HEIGHT,
-  o as DEFAULT_MAX_VISIBLE,
-  I as DEFAULT_MIN_VISIBLE,
-  O as DEFAULT_TICK_COUNT,
-  A as DROPDOWN_TYPE_OPTIONS,
+  K as BIDDING_PREFIX,
+  L as COMPACT_HEADER_HEIGHT,
+  R as DEFAULT_CHART_PLANE_HEIGHT,
+  c as DEFAULT_MAX_VISIBLE,
+  N as DEFAULT_MIN_VISIBLE,
+  t as DEFAULT_TICK_COUNT,
+  o as DROPDOWN_TYPE_OPTIONS,
   T as GRID_LINE_COLOR,
-  C as HEADER_HEIGHT,
-  R as MIN_PLANE_HEIGHT,
-  L as POINT_BORDER_COLOR,
-  n as TICK_LABEL_COLOR,
-  t as TICK_LABEL_FONT,
-  e as TOTALS_HELPER_KEY
+  D as HEADER_HEIGHT,
+  s as MIN_PLANE_HEIGHT,
+  B as NETWORK_ID_AD_MOB,
+  F as NETWORK_ID_APPLOVIN,
+  G as NETWORK_ID_DT_EXCHANGE,
+  P as NETWORK_ID_FACEBOOK_META,
+  W as NETWORK_ID_INMOBI,
+  C as NETWORK_ID_IRON_SOURCE,
+  S as NETWORK_ID_LIFTOFF,
+  e as NETWORK_ID_MINTEGRAL,
+  a as NETWORK_ID_PANGLE,
+  H as NETWORK_ID_UNITY_ADS,
+  i as NON_BIDDING_PREFIX,
+  I as POINT_BORDER_COLOR,
+  O as TICK_LABEL_COLOR,
+  n as TICK_LABEL_FONT,
+  A as TOTALS_HELPER_KEY
 };