@ironsource/shared-ui 2.1.12-test.86 → 2.1.12-test.87

package/Chart.vue_vue_type_style_index_0_scoped_e8f25a03_lang.css

@@ -0,0 +1 @@
+.chart-container[data-v-e8f25a03]{border:1px solid var(--common-divider);background:var(--background-paper);display:flex;border-radius:0 0 6px 6px;width:100%}.chart-planes[data-v-e8f25a03]{width:100%;height:100%;overflow-y:auto}.chart-planes.with-legend[data-v-e8f25a03]{width:calc(100% - 221px)}.chart-planes .extra-chart-plane[data-v-e8f25a03]{border-top:1px solid var(--common-divider)}.chart-sidebar[data-v-e8f25a03]{border-left:1px solid var(--common-divider)}

package/ChartHeader.vue_vue_type_style_index_0_scoped_af520313_lang.css

@@ -0,0 +1 @@
+.chart-header[data-v-af520313]{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 0}.chart-header--compact[data-v-af520313]{padding-top:22px}.chart-header--compact .header-texts[data-v-af520313]{flex-direction:row}.chart-header--compact .header-text[data-v-af520313]{color:var(--text-secondary)}.header-row[data-v-af520313]{display:flex;align-items:flex-end;gap:4px}.header-texts[data-v-af520313]{display:flex;flex-direction:column;color:var(--text-primary);gap:4px;cursor:default}.header-actions[data-v-af520313]{display:flex;align-items:center;gap:var(--spacing-200)}

package/ChartPlane.vue_vue_type_style_index_0_scoped_4f67d41d_lang.css

@@ -0,0 +1 @@
+.chart-plane-container[data-v-4f67d41d]{--headerHeight: var(--11153e48);width:100%;height:var(--30644433);position:relative}.header-wrapper[data-v-4f67d41d]{position:absolute;width:100%;height:var(--headerHeight);top:0;z-index:1}.chart-plane[data-v-4f67d41d]{padding-top:var(--headerHeight);height:100%}.chart-empty[data-v-4f67d41d]{background:var(--background-paper)}.chart[data-v-4f67d41d]{width:100%;height:100%;position:relative}.chart__canvas[data-v-4f67d41d]{width:100%;height:100%}.chart__tooltip[data-v-4f67d41d]{position:absolute;pointer-events:none;transition:all .1s ease;min-width:214px;max-width:270px;z-index:1}

package/components/chart/Chart.vue.d.ts

@@ -33,6 +33,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
         rangeCurrent?: string;
         rangePrevious?: string;
     };
+    noteText?: string;
     noDataIcon?: string;
     noDataTitle?: string;
     noDataSubtitle?: string;
@@ -73,6 +74,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     trendValue: any;
     trendDirection: TrendDirection;
     trendTooltip: any;
+    noteText: string;
     noDataIcon: string;
     noDataTitle: string;
     noDataSubtitle: string;
@@ -124,6 +126,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
         rangeCurrent?: string;
         rangePrevious?: string;
     };
+    noteText?: string;
     noDataIcon?: string;
     noDataTitle?: string;
     noDataSubtitle?: string;
@@ -164,6 +167,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     trendValue: any;
     trendDirection: TrendDirection;
     trendTooltip: any;
+    noteText: string;
     noDataIcon: string;
     noDataTitle: string;
     noDataSubtitle: string;
@@ -206,6 +210,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     subheaderTooltip: any;
     trendValue: string | number;
     trendDirection: TrendDirection;
+    noteText: string;
     dataSets: ChartDataSet[];
     tickCount: number;
     truncateTickLabels: boolean;

package/components/chart/Chart.vue.js

@@ -1,7 +1,7 @@
 import o from "./Chart.vue2.js";
-/* empty css            */import _ from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../Chart.vue_vue_type_style_index_0_scoped_03771fa3_lang.css"; //*');
-const a = /* @__PURE__ */ _(o, [["__scopeId", "data-v-03771fa3"]]);
+/* empty css            */import e from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../Chart.vue_vue_type_style_index_0_scoped_e8f25a03_lang.css"; //*');
+const a = /* @__PURE__ */ e(o, [["__scopeId", "data-v-e8f25a03"]]);
 export {
   a as default
 };

package/components/chart/Chart.vue2.js

@@ -1,4 +1,4 @@
- import "../../Chart.vue_vue_type_style_index_0_scoped_03771fa3_lang.css"; import { defineComponent as U, ref as O, computed as n, openBlock as s, createElementBlock as m, Fragment as C, createBlock as I, unref as i, isRef as b, withCtx as d, renderSlot as u, createCommentVNode as D, createElementVNode as k, mergeProps as g, normalizeClass as E, createVNode as L, createSlots as N, renderList as M } from "vue";
+ import "../../Chart.vue_vue_type_style_index_0_scoped_e8f25a03_lang.css"; import { defineComponent as U, ref as O, computed as n, openBlock as s, createElementBlock as m, Fragment as C, createBlock as I, unref as i, isRef as b, withCtx as d, renderSlot as u, createCommentVNode as D, createElementVNode as k, mergeProps as g, normalizeClass as E, createVNode as L, createSlots as N, renderList as M } from "vue";
 import { useVModel as A } from "@vueuse/core";
 import $ from "./ChartLegend.vue.js";
 import K from "./SettingsHeader.vue.js";
@@ -39,6 +39,7 @@ const _ = {
     trendValue: { default: null },
     trendDirection: { default: J.UP },
     trendTooltip: { default: null },
+    noteText: { default: "" },
     noDataIcon: { default: "file-search" },
     noDataTitle: { default: "No data to display" },
     noDataSubtitle: { default: "Search again with different filters" },
@@ -67,6 +68,7 @@ const _ = {
       truncateTickLabels: e.truncateTickLabels,
       header: e.header,
       subheader: e.subheader,
+      noteText: e.noteText,
       loading: e.loading,
       empty: e.empty,
       noDataIcon: e.noDataIcon,
@@ -89,9 +91,9 @@ const _ = {
       highlightedId: h.value,
       valueSuffix: e.valueSuffix,
       valuePrefix: e.valuePrefix
-    })), V = n(() => e.dataSets), v = n(() => e.visibleIds), T = n(() => e.extraCharts.length), x = n(() => 1 + T.value), F = (t) => t === T.value - 1, { colorsMap: f } = z({
+    })), V = n(() => e.dataSets), T = n(() => e.visibleIds), v = n(() => e.extraCharts.length), x = n(() => 1 + v.value), F = (t) => t === v.value - 1, { colorsMap: f } = z({
       dataSets: V,
-      visibleIds: v
+      visibleIds: T
     }), w = n(() => e.dataSets.map((t) => ({
       id: t.id,
       label: t.label,
@@ -155,7 +157,7 @@ const _ = {
             "highlighted-id": h.value,
             "onUpdate:highlighted-id": o[3] || (o[3] = (l) => h.value = l),
             items: i(w),
-            "visible-ids": i(v),
+            "visible-ids": i(T),
             "max-limit-tooltip-text": a.maxLimitTooltipText,
             "sort-options": a.sortOptions,
             "sort-option-name-key": a.sortOptionNameKey,

package/components/chart/ChartHeader.vue.d.ts

@@ -16,6 +16,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     compact: boolean;
     trendValue?: string | number;
     trendDirection?: TrendDirection;
+    noteText?: string;
 }>, {
     chartType: ChartType;
     typeSwitcher: boolean;
@@ -26,6 +27,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     compact: boolean;
     trendValue: any;
     trendDirection: TrendDirection;
+    noteText: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:chartType": (type: ChartType) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -45,6 +47,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     compact: boolean;
     trendValue?: string | number;
     trendDirection?: TrendDirection;
+    noteText?: string;
 }>, {
     chartType: ChartType;
     typeSwitcher: boolean;
@@ -55,6 +58,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     compact: boolean;
     trendValue: any;
     trendDirection: TrendDirection;
+    noteText: string;
 }>>> & {
     "onUpdate:chartType"?: (type: ChartType) => any;
 }, {
@@ -67,6 +71,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     typeSwitcher: boolean;
     trendValue: string | number;
     trendDirection: TrendDirection;
+    noteText: string;
 }>, {
     "subheader-tooltip"?(_: {}): any;
 }>;

package/components/chart/ChartHeader.vue.js

@@ -1,7 +1,7 @@
 import e from "./ChartHeader.vue2.js";
 /* empty css                  */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartHeader.vue_vue_type_style_index_0_scoped_da34b108_lang.css"; //*');
-const r = /* @__PURE__ */ o(e, [["__scopeId", "data-v-da34b108"]]);
+// import "../../ChartHeader.vue_vue_type_style_index_0_scoped_af520313_lang.css"; //*');
+const r = /* @__PURE__ */ o(e, [["__scopeId", "data-v-af520313"]]);
 export {
   r as default
 };

package/components/chart/ChartHeader.vue2.js

@@ -1,13 +1,14 @@
- import "../../ChartHeader.vue_vue_type_style_index_0_scoped_da34b108_lang.css"; import { defineComponent as k, computed as h, openBlock as o, createElementBlock as S, normalizeClass as w, createElementVNode as m, createVNode as p, createSlots as C, withCtx as f, renderSlot as B, unref as a, createTextVNode as g, toDisplayString as x, createBlock as n, normalizeProps as y, mergeProps as T, createCommentVNode as i, isRef as D } from "vue";
-import N from "../typography/v4/Typography.vue.js";
+ import "../../ChartHeader.vue_vue_type_style_index_0_scoped_af520313_lang.css"; import { defineComponent as k, computed as m, openBlock as r, createElementBlock as C, normalizeClass as S, createElementVNode as c, createVNode as p, createSlots as w, withCtx as f, renderSlot as x, unref as a, createTextVNode as B, toDisplayString as N, createBlock as l, normalizeProps as y, mergeProps as T, createCommentVNode as d, isRef as g } from "vue";
+import D from "../typography/v4/Typography.vue.js";
 import P from "../switch/v4/SwitchV4.vue.js";
-import { ChartType as d, TrendDirection as H } from "./types.js";
+import H from "../chip/v4/ChipV4.vue.js";
+import { ChartType as n, TrendDirection as L } from "./types.js";
 import b from "./ChartHeaderTrend.vue.js";
-import L from "./SubHeader.vue.js";
-const z = { class: "header-texts" }, E = { class: "header-row" }, A = /* @__PURE__ */ k({
+import $ from "./SubHeader.vue.js";
+const z = { class: "header-texts" }, E = { class: "header-row" }, U = { class: "header-actions" }, I = /* @__PURE__ */ k({
   __name: "ChartHeader",
   props: {
-    chartType: { default: d.Line },
+    chartType: { default: n.Line },
     typeSwitcher: { type: Boolean, default: !0 },
     header: { default: "" },
     subheader: { default: "" },
@@ -15,66 +16,73 @@ const z = { class: "header-texts" }, E = { class: "header-row" }, A = /* @__PURE
     trendTooltip: { default: null },
     compact: { type: Boolean, default: !1 },
     trendValue: { default: null },
-    trendDirection: { default: H.UP }
+    trendDirection: { default: L.UP },
+    noteText: { default: "" }
   },
   emits: ["update:chartType"],
   setup(e, { emit: V }) {
-    const r = e, c = [
-      { id: d.Line, icon: "chart-line-up" },
-      { id: d.Bar, icon: "chart-bar" },
-      { id: d.StackedLine, icon: "chart-line" }
-    ], l = h({
+    const o = e, u = [
+      { id: n.Line, icon: "chart-line-up" },
+      { id: n.Bar, icon: "chart-bar" },
+      { id: n.StackedLine, icon: "chart-line" }
+    ], i = m({
       get() {
-        return c.find(({ id: t }) => t === r.chartType);
+        return u.find(({ id: t }) => t === o.chartType);
       },
       set(t) {
         V("update:chartType", t.id);
       }
-    }), u = h(() => ({
-      value: r.trendValue,
-      direction: r.trendDirection,
-      trendTooltip: r.trendTooltip
+    }), s = m(() => ({
+      value: o.trendValue,
+      direction: o.trendDirection,
+      trendTooltip: o.trendTooltip
     }));
-    return (t, s) => (o(), S("div", {
-      class: w(["chart-header", { "chart-header--compact": e.compact }])
+    return (t, h) => (r(), C("div", {
+      class: S(["chart-header", { "chart-header--compact": e.compact }])
     }, [
-      m("div", z, [
-        p(L, {
+      c("div", z, [
+        p($, {
           subheader: e.subheader,
           "subheader-tooltip": e.subheaderTooltip,
           "show-separator": e.compact && (!!e.header || !!e.trendValue)
-        }, C({ _: 2 }, [
+        }, w({ _: 2 }, [
           t.$slots["subheader-tooltip"] ? {
             name: "subheader-tooltip",
             fn: f(() => [
-              B(t.$slots, "subheader-tooltip", {}, void 0, !0)
+              x(t.$slots, "subheader-tooltip", {}, void 0, !0)
             ]),
             key: "0"
           } : void 0
         ]), 1032, ["subheader", "subheader-tooltip", "show-separator"]),
-        m("div", E, [
-          p(a(N), {
+        c("div", E, [
+          p(a(D), {
             class: "header-text",
             variant: e.compact ? "h5" : "chart2"
           }, {
             default: f(() => [
-              g(x(e.header), 1)
+              B(N(e.header), 1)
             ]),
             _: 1
           }, 8, ["variant"]),
-          !e.compact && e.trendValue !== null ? (o(), n(b, y(T({ key: 0 }, a(u))), null, 16)) : i("", !0)
+          !e.compact && e.trendValue !== null ? (r(), l(b, y(T({ key: 0 }, a(s))), null, 16)) : d("", !0)
         ]),
-        e.compact && e.trendValue !== null ? (o(), n(b, y(T({ key: 0 }, a(u))), null, 16)) : i("", !0)
+        e.compact && e.trendValue !== null ? (r(), l(b, y(T({ key: 0 }, a(s))), null, 16)) : d("", !0)
       ]),
-      e.typeSwitcher ? (o(), n(a(P), {
-        key: 0,
-        modelValue: a(l),
-        "onUpdate:modelValue": s[0] || (s[0] = (v) => D(l) ? l.value = v : null),
-        options: c
-      }, null, 8, ["modelValue"])) : i("", !0)
+      c("div", U, [
+        e.noteText ? (r(), l(a(H), {
+          key: 0,
+          label: `Note: ${e.noteText}`
+        }, null, 8, ["label"])) : d("", !0),
+        e.typeSwitcher ? (r(), l(a(P), {
+          key: 1,
+          modelValue: a(i),
+          "onUpdate:modelValue": h[0] || (h[0] = (v) => g(i) ? i.value = v : null),
+          options: u
+        }, null, 8, ["modelValue"])) : d("", !0)
+      ])
     ], 2));
   }
 });
 export {
-  A as default
+  I as default
 };

package/components/chart/ChartPlane.vue.d.ts

@@ -27,6 +27,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     typeSwitcher?: boolean;
     height?: string;
     compactHeader?: boolean;
+    noteText?: string;
     tooltipRespectsTopEdge?: boolean;
     tooltipTotalType?: TotalType;
     tooltipTotalCalcFn?: (values: number[], totalType: TotalType) => number;
@@ -66,6 +67,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     typeSwitcher: boolean;
     height: string;
     compactHeader: boolean;
+    noteText: string;
     tooltipRespectsTopEdge: boolean;
     tooltipTotalType: TotalType;
     tooltipTotalCalcFn: (values: number[], totalType: TotalType) => number;
@@ -106,6 +108,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     typeSwitcher?: boolean;
     height?: string;
     compactHeader?: boolean;
+    noteText?: string;
     tooltipRespectsTopEdge?: boolean;
     tooltipTotalType?: TotalType;
     tooltipTotalCalcFn?: (values: number[], totalType: TotalType) => number;
@@ -145,6 +148,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     typeSwitcher: boolean;
     height: string;
     compactHeader: boolean;
+    noteText: string;
     tooltipRespectsTopEdge: boolean;
     tooltipTotalType: TotalType;
     tooltipTotalCalcFn: (values: number[], totalType: TotalType) => number;
@@ -178,6 +182,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     typeSwitcher: boolean;
     trendValue: string | number;
     trendDirection: TrendDirection;
+    noteText: string;
     dataSets: ChartDataSet[];
     tickCount: number;
     truncateTickLabels: boolean;

package/components/chart/ChartPlane.vue.js

@@ -1,7 +1,7 @@
-import e from "./ChartPlane.vue2.js";
-/* empty css                 */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartPlane.vue_vue_type_style_index_0_scoped_ff7e556e_lang.css"; //*');
-const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-ff7e556e"]]);
+import o from "./ChartPlane.vue2.js";
+/* empty css                 */import e from "../../_virtual/_plugin-vue_export-helper.js";
+// import "../../ChartPlane.vue_vue_type_style_index_0_scoped_4f67d41d_lang.css"; //*');
+const a = /* @__PURE__ */ e(o, [["__scopeId", "data-v-4f67d41d"]]);
 export {
   a as default
 };

package/components/chart/ChartPlane.vue2.js

@@ -1,9 +1,9 @@
- import "../../ChartPlane.vue_vue_type_style_index_0_scoped_ff7e556e_lang.css"; import { defineComponent as ae, useCssVars as oe, unref as s, computed as l, ref as k, onMounted as le, watch as v, nextTick as re, openBlock as p, createElementBlock as A, createVNode as ie, isRef as ne, createSlots as se, withCtx as de, renderSlot as ue, createCommentVNode as S, createElementVNode as L, normalizeStyle as ce, createBlock as E } from "vue";
+ import "../../ChartPlane.vue_vue_type_style_index_0_scoped_4f67d41d_lang.css"; import { defineComponent as ae, useCssVars as oe, unref as s, computed as l, ref as k, onMounted as le, watch as v, nextTick as re, openBlock as p, createElementBlock as A, createVNode as ie, isRef as ne, createSlots as se, withCtx as ue, renderSlot as de, createCommentVNode as S, createElementVNode as L, normalizeStyle as ce, createBlock as E } from "vue";
 import { Chart as P, ArcElement as fe, LineElement as pe, BarElement as he, PointElement as me, LineController as ve, BarController as ye, PieController as Te, ScatterController as Ce, CategoryScale as be, LinearScale as ge, Filler as xe, Tooltip as ke } from "chart.js";
 import { HoverVerticalLine as Ae } from "./plugins/HoverVerticalLine.js";
 import { prepareTickLabel as Se, formatValue as Le } from "./utils/utils.js";
 import { DEFAULT_TICK_COUNT as Ee, TOTALS_HELPER_KEY as w, BASE_COLOR_KEY as V, CHART_PADDING as Re, POINT_BORDER_COLOR as Be, TICK_LABEL_COLOR as N, TICK_LABEL_FONT as F, TICKS_EXTRA_PADDING as De, GRID_LINE_COLOR as K, HEADER_HEIGHT as Oe, COMPACT_HEADER_HEIGHT as Ie, HOVER_AREA_TRANSPARENCY as He, HOVER_TRANSPARENCY as y } from "./consts.js";
-import { ChartType as d, DateInterval as Pe, TooltipOrder as M, TrendDirection as we } from "./types.js";
+import { ChartType as u, DateInterval as Pe, TooltipOrder as M, TrendDirection as we } from "./types.js";
 import { useTooltipPosition as Ve } from "./composables/useTooltipPosition.js";
 import Ne from "./ChartTooltip.vue.js";
 import { hexColorToRgba as h } from "../../utils/color.js";
@@ -11,8 +11,8 @@ import Fe from "./ChartHeader.vue.js";
 import { useMemoize as Ke, useVModel as Me } from "@vueuse/core";
 import Ue from "../emptyState/v4/EmptyStateV4.vue.js";
 import Ye from "./ChartLoader.vue.js";
-import { DEFAULT_CHART_COLOR as _e } from "./colorPalette.js";
-import { TotalType as U, calculateTotal as Ge } from "../../utils/totals.js";
+import { DEFAULT_CHART_COLOR as Ge } from "./colorPalette.js";
+import { TotalType as U, calculateTotal as _e } from "../../utils/totals.js";
 import { isNullOrUndefined as $e } from "../../utils/utils.js";
 import { storeOriginalDatasetColors as ze, restoreOriginalDatasetColors as We } from "./utils/highlightUtils.js";
 const Ze = { class: "chart-plane-container" }, Xe = {
@@ -27,7 +27,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
     dataSets: { default: () => [] },
     visibleIds: { default: () => [] },
     highlightedId: { default: null },
-    chartType: { default: d.Line },
+    chartType: { default: u.Line },
     parsing: { default: void 0 },
     xAxisFormat: { default: "string" },
     yAxisFormat: { default: "number" },
@@ -47,9 +47,10 @@ const Ze = { class: "chart-plane-container" }, Xe = {
     typeSwitcher: { type: Boolean, default: !0 },
     height: { default: "100%" },
     compactHeader: { type: Boolean, default: !1 },
+    noteText: { default: "" },
     tooltipRespectsTopEdge: { type: Boolean, default: !0 },
     tooltipTotalType: { default: U.Total },
-    tooltipTotalCalcFn: { type: Function, default: Ge },
+    tooltipTotalCalcFn: { type: Function, default: _e },
     tooltipOrder: { default: M.Legend },
     trendValue: { default: null },
     trendDirection: { default: we.UP },
@@ -63,10 +64,10 @@ const Ze = { class: "chart-plane-container" }, Xe = {
   setup(o, { emit: Y }) {
     const e = o;
     oe((t) => ({
-      "2f09324f": s(q),
-      "0d942f3a": o.height
+      "11153e48": s(q),
+      30644433: o.height
     }));
-    const _ = Ke(Se);
+    const G = Ke(Se);
     P.register(
       fe,
       pe,
@@ -82,14 +83,14 @@ const Ze = { class: "chart-plane-container" }, Xe = {
       ke,
       Ae
     );
-    const T = Me(e, "chartType", Y), G = l(
+    const T = Me(e, "chartType", Y), _ = l(
       () => e.withAnimation ? "" : "none"
     ), m = k(null);
     let n = null;
     const R = l(() => e.empty || e.dataSets.length === 0), c = l(() => !e.loading && !R.value), C = () => {
       m.value && (n && n.destroy(), n = new P(m.value, O.value));
     }, $ = () => {
-      n && (n.data.datasets = D.value, n.options = O.value.options, n.update(G.value));
+      n && (n.data.datasets = D.value, n.options = O.value.options, n.update(_.value));
     };
     le(C), v(() => e.chartType, C), v(c, async (t) => {
       t && (await re(), C());
@@ -103,9 +104,9 @@ const Ze = { class: "chart-plane-container" }, Xe = {
       $
     );
     const f = l(() => e.totalsChart), b = l(
-      () => e.chartType === d.StackedLine || e.chartType === d.StackedBar || f.value
+      () => e.chartType === u.StackedLine || e.chartType === u.StackedBar || f.value
     ), g = l(
-      () => e.chartType === d.Line || e.chartType === d.StackedLine
+      () => e.chartType === u.Line || e.chartType === u.StackedLine
     ), z = l(() => f.value && !e.parsing.xAxisKey ? { ...e.parsing, xAxisKey: w } : e.parsing), W = l(() => f.value ? e.dataSets.map((t) => ({
       ...t,
       data: t.data.map((i) => ({
@@ -114,7 +115,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
       }))
     })) : e.dataSets), x = l(
       () => W.value.filter((t) => e.visibleIds.includes(t.id))
-    ), Z = (t) => e.colorsMap[t] || _e, B = l(
+    ), Z = (t) => e.colorsMap[t] || Ge, B = l(
       () => x.value.length && x.value.every(
         (t) => t.data.length === 1
       )
@@ -125,7 +126,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
         fill: r,
         backgroundColor: h(
           a,
-          e.chartType === d.StackedLine ? 10 : 70
+          e.chartType === u.StackedLine ? 10 : 70
         ),
         borderColor: a,
         pointBackgroundColor: a,
@@ -141,7 +142,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
     })), X = l(
       () => e.tooltipTotalType === U.Total ? "Total" : "Mean"
     ), O = l(() => ({
-      type: e.chartType == d.Bar || e.chartType === d.StackedBar ? "bar" : "line",
+      type: e.chartType == u.Bar || e.chartType === u.StackedBar ? "bar" : "line",
       // Chart Data
       data: {
         datasets: D.value
@@ -164,7 +165,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
             enabled: !1,
             position: "average",
             external: ({ tooltip: t }) => {
-              u.value = { ...t };
+              d.value = { ...t };
             },
             callbacks: {
               footer: (t) => {
@@ -226,7 +227,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
               autoSkipPadding: 8,
               callback: function(t, i, a) {
                 const r = this.getLabelForValue(t), ee = g.value && !f.value ? a.length - 1 : a.length, te = this.chart.scales?.x?.width / ee - De;
-                return _({
+                return G({
                   label: r,
                   format: e.xAxisFormat,
                   availableSpace: te,
@@ -268,15 +269,15 @@ const Ze = { class: "chart-plane-container" }, Xe = {
           }
         }
       }
-    })), I = k(null), u = k(null), { position: H } = Ve(
+    })), I = k(null), d = k(null), { position: H } = Ve(
       m,
       I,
-      u,
+      d,
       e.tooltipRespectsTopEdge
     ), j = l(() => ({
       left: `${H.value.left}px`,
       top: `${H.value.top}px`,
-      opacity: u.value?.opacity || 0
+      opacity: d.value?.opacity || 0
     })), q = l(
       () => (e.compactHeader ? Ie : Oe) + "px"
     );
@@ -290,7 +291,7 @@ const Ze = { class: "chart-plane-container" }, Xe = {
       (n?.data.datasets || []).forEach((a) => {
         ze(a);
         const r = a[V];
-        a.id === t ? e.chartType === d.StackedLine && (a.backgroundColor = h(
+        a.id === t ? e.chartType === u.StackedLine && (a.backgroundColor = h(
           r,
           He
         )) : (a.backgroundColor = h(r, y), a.borderColor = h(r, y), a.pointBackgroundColor = h(r, y), a.pointHoverBorderColor = h(r, y));
@@ -310,16 +311,17 @@ const Ze = { class: "chart-plane-container" }, Xe = {
           "trend-tooltip": o.trendTooltip,
           compact: o.compactHeader,
           "trend-value": s(c) ? o.trendValue : null,
-          "trend-direction": o.trendDirection
+          "trend-direction": o.trendDirection,
+          "note-text": o.noteText
         }, se({ _: 2 }, [
           t.$slots["subheader-tooltip"] ? {
             name: "subheader-tooltip",
-            fn: de(() => [
-              ue(t.$slots, "subheader-tooltip", {}, void 0, !0)
+            fn: ue(() => [
+              de(t.$slots, "subheader-tooltip", {}, void 0, !0)
             ]),
             key: "0"
           } : void 0
-        ]), 1032, ["chart-type", "type-switcher", "header", "subheader", "subheader-tooltip", "trend-tooltip", "compact", "trend-value", "trend-direction"])
+        ]), 1032, ["chart-type", "type-switcher", "header", "subheader", "subheader-tooltip", "trend-tooltip", "compact", "trend-value", "trend-direction", "note-text"])
       ])) : S("", !0),
       s(c) ? (p(), A("section", je, [
         L("div", qe, [
@@ -334,16 +336,16 @@ const Ze = { class: "chart-plane-container" }, Xe = {
             class: "chart__tooltip",
             style: ce(s(j))
           }, [
-            u.value ? (p(), E(Ne, {
+            d.value ? (p(), E(Ne, {
               key: 0,
               "totals-chart": s(f),
-              title: String(u.value.title),
-              "data-points": u.value.dataPoints,
+              title: String(d.value.title),
+              "data-points": d.value.dataPoints,
               "x-axis-format": o.xAxisFormat,
               "y-axis-format": o.yAxisFormat,
               "x-axis-date-interval": o.xAxisDateInterval,
-              "total-label": u.value.footer?.[0],
-              "total-value": Number(u.value.footer?.[1]),
+              "total-label": d.value.footer?.[0],
+              "total-value": Number(d.value.footer?.[1]),
               "value-suffix": o.valueSuffix,
               "value-prefix": o.valuePrefix
             }, null, 8, ["totals-chart", "title", "data-points", "x-axis-format", "y-axis-format", "x-axis-date-interval", "total-label", "total-value", "value-suffix", "value-prefix"])) : S("", !0)

package/components/chart/index.d.ts

@@ -28,6 +28,7 @@ declare const ChartTypes: () => ({
             subheaderTooltip: any;
             trendValue: string | number;
             trendDirection: TrendDirection;
+            noteText: string;
             dataSets: import("./types").ChartDataSet[];
             tickCount: number;
             truncateTickLabels: boolean;
@@ -145,6 +146,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<TrendDirection>;
                 default: TrendDirection;
             };
+            noteText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
                 required: true;
@@ -214,7 +219,7 @@ declare const ChartTypes: () => ({
             "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
             "onUpdate:sortSelected"?: (sortOption: unknown) => any;
             "onUpdate:chartType"?: (chartType: ChartType) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "dataSets" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "fullHeight" | "fullHeightBottomSpacing" | "withSettingsHeader" | "extraCharts">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "noteText" | "dataSets" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "fullHeight" | "fullHeightBottomSpacing" | "withSettingsHeader" | "extraCharts">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -329,6 +334,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<TrendDirection>;
                 default: TrendDirection;
             };
+            noteText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
                 required: true;
@@ -426,6 +435,7 @@ declare const ChartTypes: () => ({
             subheaderTooltip: any;
             trendValue: string | number;
             trendDirection: TrendDirection;
+            noteText: string;
             dataSets: import("./types").ChartDataSet[];
             tickCount: number;
             truncateTickLabels: boolean;
@@ -563,6 +573,10 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<TrendDirection>;
             default: TrendDirection;
         };
+        noteText: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
         dataSets: {
             type: import("vue").PropType<import("./types").ChartDataSet[]>;
             required: true;
@@ -737,6 +751,10 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<TrendDirection>;
         default: TrendDirection;
     };
+    noteText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     dataSets: {
         type: import("vue").PropType<import("./types").ChartDataSet[]>;
         required: true;
@@ -834,6 +852,7 @@ declare const ChartTypes: () => ({
     subheaderTooltip: any;
     trendValue: string | number;
     trendDirection: TrendDirection;
+    noteText: string;
     dataSets: import("./types").ChartDataSet[];
     tickCount: number;
     truncateTickLabels: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ironsource/shared-ui",
-  "version": "2.1.12-test.86",
+  "version": "2.1.12-test.87",
   "engines": {
     "npm": ">=7.0.0",
     "node": ">=16.0.0"

package/Chart.vue_vue_type_style_index_0_scoped_03771fa3_lang.css

@@ -1 +0,0 @@
-.chart-container[data-v-03771fa3]{border:1px solid var(--common-divider);background:var(--background-paper);display:flex;border-radius:0 0 6px 6px;width:100%}.chart-planes[data-v-03771fa3]{width:100%;height:100%;overflow-y:auto}.chart-planes.with-legend[data-v-03771fa3]{width:calc(100% - 221px)}.chart-planes .extra-chart-plane[data-v-03771fa3]{border-top:1px solid var(--common-divider)}.chart-sidebar[data-v-03771fa3]{border-left:1px solid var(--common-divider)}

package/ChartHeader.vue_vue_type_style_index_0_scoped_da34b108_lang.css

@@ -1 +0,0 @@
-.chart-header[data-v-da34b108]{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 0}.chart-header--compact[data-v-da34b108]{padding-top:22px}.chart-header--compact .header-texts[data-v-da34b108]{flex-direction:row}.chart-header--compact .header-text[data-v-da34b108]{color:var(--text-secondary)}.header-row[data-v-da34b108]{display:flex;align-items:flex-end;gap:4px}.header-texts[data-v-da34b108]{display:flex;flex-direction:column;color:var(--text-primary);gap:4px;cursor:default}

package/ChartPlane.vue_vue_type_style_index_0_scoped_ff7e556e_lang.css

@@ -1 +0,0 @@
-.chart-plane-container[data-v-ff7e556e]{--headerHeight: var(--2f09324f);width:100%;height:var(--0d942f3a);position:relative}.header-wrapper[data-v-ff7e556e]{position:absolute;width:100%;height:var(--headerHeight);top:0;z-index:1}.chart-plane[data-v-ff7e556e]{padding-top:var(--headerHeight);height:100%}.chart-empty[data-v-ff7e556e]{background:var(--background-paper)}.chart[data-v-ff7e556e]{width:100%;height:100%;position:relative}.chart__canvas[data-v-ff7e556e]{width:100%;height:100%}.chart__tooltip[data-v-ff7e556e]{position:absolute;pointer-events:none;transition:all .1s ease;min-width:214px;max-width:270px;z-index:1}