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

package/components/chart/ChartHeader.vue2.js

@@ -1,53 +1,86 @@
- import "../../ChartHeader.vue_vue_type_style_index_0_scoped_32001725_lang.css"; import { defineComponent as b, computed as k, openBlock as r, createElementBlock as C, normalizeClass as w, createElementVNode as i, createVNode as n, unref as a, withCtx as d, renderSlot as B, createTextVNode as m, toDisplayString as f, createBlock as c, createCommentVNode as u, isRef as S } from "vue";
-import p from "../typography/v4/Typography.vue.js";
-import g from "../switch/v4/SwitchV4.vue.js";
-import { ChartType as l } from "./types.js";
-import x from "../tooltip/v4/TooltipV4.vue.js";
-import y from "./ChartHeaderTrend.vue.js";
-const D = { class: "header-texts" }, N = { class: "header-row" }, L = { class: "header-row" }, U = /* @__PURE__ */ b({
+ import "../../ChartHeader.vue_vue_type_style_index_0_scoped_92052479_lang.css"; import { defineComponent as S, useSlots as R, computed as m, openBlock as r, createElementBlock as w, normalizeClass as B, createElementVNode as i, createVNode as f, unref as t, withCtx as o, renderSlot as P, createBlock as d, createTextVNode as u, toDisplayString as c, createCommentVNode as n, normalizeProps as v, mergeProps as g, isRef as N } from "vue";
+import s from "../typography/v4/Typography.vue.js";
+import D from "../switch/v4/SwitchV4.vue.js";
+import { ChartType as h } from "./types.js";
+import L from "../tooltip/v4/TooltipV4.vue.js";
+import V from "./ChartHeaderTrend.vue.js";
+const z = { class: "header-texts" }, E = { class: "header-row" }, O = { class: "subheader-tooltip" }, U = { class: "header-row" }, I = /* @__PURE__ */ S({
   __name: "ChartHeader",
   props: {
-    chartType: { default: l.Line },
+    chartType: { default: h.Line },
     typeSwitcher: { type: Boolean, default: !0 },
     header: { default: "" },
     subheader: { default: "" },
+    subheaderTooltipHeader: { default: null },
+    subheaderTooltipText: { default: null },
+    trendTooltipHeader: { default: null },
+    trendTooltipRangeCurrent: { default: null },
+    trendTooltipRangePrevious: { default: null },
     compact: { type: Boolean, default: !1 },
     trendValue: { default: null },
     trendDirection: { default: "up" }
   },
   emits: ["update:chartType"],
-  setup(e, { emit: v }) {
-    const V = e, h = [
-      { id: l.Line, icon: "chart-line-up" },
-      { id: l.Bar, icon: "chart-bar" },
-      { id: l.StackedLine, icon: "chart-line" }
-    ], o = k({
+  setup(e, { emit: x }) {
+    const a = e, C = R(), T = [
+      { id: h.Line, icon: "chart-line-up" },
+      { id: h.Bar, icon: "chart-bar" },
+      { id: h.StackedLine, icon: "chart-line" }
+    ], p = m({
       get() {
-        return h.find(({ id: t }) => t === V.chartType);
+        return T.find(({ id: l }) => l === a.chartType);
       },
-      set(t) {
-        v("update:chartType", t.id);
+      set(l) {
+        x("update:chartType", l.id);
       }
-    });
-    return (t, s) => (r(), C("div", {
-      class: w(["chart-header", { "chart-header--compact": e.compact }])
+    }), k = m(() => C["subheader-tooltip"] || a.subheaderTooltipText || a.subheaderTooltipHeader), b = m(() => ({
+      value: a.trendValue,
+      direction: a.trendDirection,
+      tooltipHeader: a.trendTooltipHeader,
+      tooltipRangeCurrent: a.trendTooltipRangeCurrent,
+      tooltipRangePrevious: a.trendTooltipRangePrevious
+    }));
+    return (l, y) => (r(), w("div", {
+      class: B(["chart-header", { "chart-header--compact": e.compact }])
     }, [
-      i("div", D, [
-        i("div", N, [
-          n(a(x), {
+      i("div", z, [
+        i("div", E, [
+          f(t(L), {
             placement: "right",
-            disabled: !t.$slots["subheader-tooltip"]
+            disabled: !t(k)
           }, {
-            tooltip: d(() => [
-              B(t.$slots, "subheader-tooltip", {}, void 0, !0)
+            tooltip: o(() => [
+              P(l.$slots, "subheader-tooltip", {}, () => [
+                i("div", O, [
+                  e.subheaderTooltipHeader ? (r(), d(t(s), {
+                    key: 0,
+                    variant: "h5"
+                  }, {
+                    default: o(() => [
+                      u(c(e.subheaderTooltipHeader), 1)
+                    ]),
+                    _: 1
+                  })) : n("", !0),
+                  e.subheaderTooltipText ? (r(), d(t(s), {
+                    key: 1,
+                    variant: "body2",
+                    class: "subheader-tooltip__text"
+                  }, {
+                    default: o(() => [
+                      u(c(e.subheaderTooltipText), 1)
+                    ]),
+                    _: 1
+                  })) : n("", !0)
+                ])
+              ], !0)
             ]),
-            default: d(() => [
-              n(a(p), {
+            default: o(() => [
+              f(t(s), {
                 class: "subheader",
                 variant: "h5"
               }, {
-                default: d(() => [
-                  m(f(e.subheader + (e.compact ? ":" : "")), 1)
+                default: o(() => [
+                  u(c(e.subheader + (e.compact ? ":" : "")), 1)
                 ]),
                 _: 1
               })
@@ -55,37 +88,29 @@ const D = { class: "header-texts" }, N = { class: "header-row" }, L = { class: "
             _: 3
           }, 8, ["disabled"])
         ]),
-        i("div", L, [
-          n(a(p), {
+        i("div", U, [
+          f(t(s), {
             class: "header-text",
             variant: e.compact ? "h5" : "chart2"
           }, {
-            default: d(() => [
-              m(f(e.header), 1)
+            default: o(() => [
+              u(c(e.header), 1)
             ]),
             _: 1
           }, 8, ["variant"]),
-          !e.compact && e.trendValue !== null ? (r(), c(y, {
-            key: 0,
-            value: e.trendValue,
-            direction: e.trendDirection
-          }, null, 8, ["value", "direction"])) : u("", !0)
+          !e.compact && e.trendValue !== null ? (r(), d(V, v(g({ key: 0 }, t(b))), null, 16)) : n("", !0)
         ]),
-        e.compact && e.trendValue !== null ? (r(), c(y, {
-          key: 0,
-          value: e.trendValue,
-          direction: e.trendDirection
-        }, null, 8, ["value", "direction"])) : u("", !0)
+        e.compact && e.trendValue !== null ? (r(), d(V, v(g({ key: 0 }, t(b))), null, 16)) : n("", !0)
       ]),
-      e.typeSwitcher ? (r(), c(a(g), {
+      e.typeSwitcher ? (r(), d(t(D), {
         key: 0,
-        modelValue: a(o),
-        "onUpdate:modelValue": s[0] || (s[0] = (T) => S(o) ? o.value = T : null),
-        options: h
-      }, null, 8, ["modelValue"])) : u("", !0)
+        modelValue: t(p),
+        "onUpdate:modelValue": y[0] || (y[0] = (H) => N(p) ? p.value = H : null),
+        options: T
+      }, null, 8, ["modelValue"])) : n("", !0)
     ], 2));
   }
 });
 export {
-  U as default
+  I as default
 };

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

@@ -1,18 +1,33 @@
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     value?: number | string;
     direction?: 'up' | 'down';
+    tooltipHeader?: string;
+    tooltipRangeCurrent?: string;
+    tooltipRangePrevious?: string;
 }>, {
     value: any;
     direction: string;
+    tooltipHeader: any;
+    tooltipRangeCurrent: any;
+    tooltipRangePrevious: any;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     value?: number | string;
     direction?: 'up' | 'down';
+    tooltipHeader?: string;
+    tooltipRangeCurrent?: string;
+    tooltipRangePrevious?: string;
 }>, {
     value: any;
     direction: string;
+    tooltipHeader: any;
+    tooltipRangeCurrent: any;
+    tooltipRangePrevious: any;
 }>>>, {
     value: number | string;
     direction: 'up' | 'down';
+    tooltipHeader: string;
+    tooltipRangeCurrent: string;
+    tooltipRangePrevious: string;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/components/chart/ChartHeaderTrend.vue.js

@@ -1,7 +1,7 @@
 import e from "./ChartHeaderTrend.vue2.js";
 /* empty css                       */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartHeaderTrend.vue_vue_type_style_index_0_scoped_e4c673e7_lang.css"; //*');
-const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-e4c673e7"]]);
+// import "../../ChartHeaderTrend.vue_vue_type_style_index_0_scoped_d61ed404_lang.css"; //*');
+const t = /* @__PURE__ */ o(e, [["__scopeId", "data-v-d61ed404"]]);
 export {
-  s as default
+  t as default
 };

package/components/chart/ChartHeaderTrend.vue2.js

@@ -1,32 +1,96 @@
- import "../../ChartHeaderTrend.vue_vue_type_style_index_0_scoped_e4c673e7_lang.css"; import { defineComponent as a, openBlock as n, createElementBlock as o, normalizeClass as i, createVNode as t, unref as r, withCtx as c, createTextVNode as l, toDisplayString as d } from "vue";
-import m from "../typography/v4/Typography.vue.js";
-import p from "../icon/v4/IconV4.vue.js";
+ import "../../ChartHeaderTrend.vue_vue_type_style_index_0_scoped_d61ed404_lang.css"; import { defineComponent as h, computed as v, openBlock as a, createElementBlock as p, normalizeClass as g, createVNode as n, unref as e, withCtx as o, createElementVNode as s, createBlock as c, createTextVNode as l, toDisplayString as i, createCommentVNode as d, pushScopeId as y, popScopeId as C } from "vue";
+import r from "../typography/v4/Typography.vue.js";
+import R from "../icon/v4/IconV4.vue.js";
 import "../icon/v4/IconFlag.vue.js";
-const y = /* @__PURE__ */ a({
+import x from "../tooltip/v4/TooltipV4.vue.js";
+const m = (t) => (y("data-v-d61ed404"), t = t(), C(), t), b = { class: "trend-tooltip" }, k = {
+  key: 2,
+  class: "separator"
+}, _ = /* @__PURE__ */ m(() => /* @__PURE__ */ s("hr", null, null, -1)), H = /* @__PURE__ */ m(() => /* @__PURE__ */ s("hr", null, null, -1)), B = /* @__PURE__ */ h({
   __name: "ChartHeaderTrend",
   props: {
     value: { default: null },
-    direction: { default: "up" }
+    direction: { default: "up" },
+    tooltipHeader: { default: null },
+    tooltipRangeCurrent: { default: null },
+    tooltipRangePrevious: { default: null }
   },
-  setup(e) {
-    return (u, s) => (n(), o("div", {
-      class: i(["chart-trend", [`chart-trend--${e.direction}`]])
+  setup(t) {
+    const u = t, f = v(
+      () => u.tooltipHeader || u.tooltipRangeCurrent || u.tooltipRangePrevious
+    );
+    return (P, T) => (a(), p("div", {
+      class: g(["chart-trend", [`chart-trend--${t.direction}`]])
     }, [
-      t(r(p), {
-        class: "trend-icon",
-        type: "bold",
-        name: `arrow-${e.direction}`,
-        size: "13px"
-      }, null, 8, ["name"]),
-      t(r(m), { variant: "chipLabel" }, {
-        default: c(() => [
-          l(d(e.value), 1)
+      n(e(x), {
+        disabled: !e(f)
+      }, {
+        tooltip: o(() => [
+          s("div", b, [
+            t.tooltipHeader ? (a(), c(e(r), {
+              key: 0,
+              class: "trend-tooltip__header",
+              variant: "subtitle2"
+            }, {
+              default: o(() => [
+                l(i(t.tooltipHeader), 1)
+              ]),
+              _: 1
+            })) : d("", !0),
+            t.tooltipRangeCurrent ? (a(), c(e(r), {
+              key: 1,
+              variant: "body2",
+              class: "trend-tooltip__text"
+            }, {
+              default: o(() => [
+                l(i(t.tooltipRangeCurrent), 1)
+              ]),
+              _: 1
+            })) : d("", !0),
+            t.tooltipRangeCurrent && t.tooltipRangePrevious ? (a(), p("div", k, [
+              _,
+              n(e(r), {
+                class: "separator__text",
+                variant: "caption"
+              }, {
+                default: o(() => [
+                  l(" vs. ")
+                ]),
+                _: 1
+              }),
+              H
+            ])) : d("", !0),
+            t.tooltipRangePrevious ? (a(), c(e(r), {
+              key: 3,
+              variant: "body2",
+              class: "trend-tooltip__text"
+            }, {
+              default: o(() => [
+                l(i(t.tooltipRangePrevious), 1)
+              ]),
+              _: 1
+            })) : d("", !0)
+          ])
+        ]),
+        default: o(() => [
+          n(e(R), {
+            class: "trend-icon",
+            type: "bold",
+            name: `arrow-${t.direction}`,
+            size: "13px"
+          }, null, 8, ["name"]),
+          n(e(r), { variant: "chipLabel" }, {
+            default: o(() => [
+              l(i(t.value), 1)
+            ]),
+            _: 1
+          })
         ]),
         _: 1
-      })
+      }, 8, ["disabled"])
     ], 2));
   }
 });
 export {
-  y as default
+  B as default
 };

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

@@ -5,34 +5,51 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     minVisible?: number;
     maxVisible?: number;
     maxLimitTooltipText?: string;
+    sortSelected?: unknown;
+    sortOptions?: unknown[];
+    sortOptionNameKey?: string;
 }>, {
     items: () => any[];
     visibleIds: () => any[];
     minVisible: number;
     maxVisible: number;
     maxLimitTooltipText: string;
+    sortSelected: any;
+    sortOptions: () => any[];
+    sortOptionNameKey: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:visibleIds": (visibleIds: unknown[]) => void;
+    "update:sortSelected": (sortOption: unknown) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     items: LegendItem[];
     visibleIds: unknown[];
     minVisible?: number;
     maxVisible?: number;
     maxLimitTooltipText?: string;
+    sortSelected?: unknown;
+    sortOptions?: unknown[];
+    sortOptionNameKey?: string;
 }>, {
     items: () => any[];
     visibleIds: () => any[];
     minVisible: number;
     maxVisible: number;
     maxLimitTooltipText: string;
+    sortSelected: any;
+    sortOptions: () => any[];
+    sortOptionNameKey: string;
 }>>> & {
     "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
+    "onUpdate:sortSelected"?: (sortOption: unknown) => any;
 }, {
     items: LegendItem[];
     visibleIds: unknown[];
     minVisible: number;
     maxVisible: number;
     maxLimitTooltipText: string;
+    sortSelected: any;
+    sortOptions: unknown[];
+    sortOptionNameKey: string;
 }>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/components/chart/ChartLegend.vue.js

@@ -1,7 +1,7 @@
 import e from "./ChartLegend.vue2.js";
 /* empty css                  */import o from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartLegend.vue_vue_type_style_index_0_scoped_532f23bc_lang.css"; //*');
-const c = /* @__PURE__ */ o(e, [["__scopeId", "data-v-532f23bc"]]);
+// import "../../ChartLegend.vue_vue_type_style_index_0_scoped_da487aba_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-da487aba"]]);
 export {
-  c as default
+  s as default
 };

package/components/chart/ChartLegend.vue2.js

@@ -1,124 +1,135 @@
- import "../../ChartLegend.vue_vue_type_style_index_0_scoped_532f23bc_lang.css"; import { defineComponent as S, ref as P, computed as m, openBlock as s, createElementBlock as c, createElementVNode as r, createVNode as d, unref as o, mergeProps as I, withCtx as p, createTextVNode as b, Fragment as A, renderList as F, normalizeClass as H, withModifiers as U, createBlock as k, createCommentVNode as L, toDisplayString as g } from "vue";
-import { useVirtualList as z } from "@vueuse/core";
-import f from "../typography/v4/Typography.vue.js";
-import R from "../checkbox/v4/CheckboxV4.vue.js";
+ import "../../ChartLegend.vue_vue_type_style_index_0_scoped_da487aba_lang.css"; import { defineComponent as O, ref as P, computed as b, openBlock as s, createElementBlock as p, createElementVNode as d, createVNode as c, unref as o, createBlock as v, isRef as U, createCommentVNode as h, mergeProps as T, withCtx as u, createTextVNode as x, Fragment as A, renderList as F, normalizeClass as H, withModifiers as R, toDisplayString as _ } from "vue";
+import { useVModel as z, useVirtualList as K } from "@vueuse/core";
+import k from "../typography/v4/Typography.vue.js";
+import $ from "../checkbox/v4/CheckboxV4.vue.js";
 import q from "../search/v4/SearchV4.vue.js";
 import { DEFAULT_MIN_VISIBLE as G, DEFAULT_MAX_VISIBLE as X } from "./consts.js";
-import $ from "../icon/v4/IconV4.vue.js";
+import j from "../icon/v4/IconV4.vue.js";
 import "../icon/v4/IconFlag.vue.js";
-import j from "../tooltip/v4/TooltipV4.vue.js";
-const J = { class: "chart-legend" }, K = { class: "search-box" }, O = {
+import J from "../tooltip/v4/TooltipV4.vue.js";
+import Q from "./LegendSorting.vue.js";
+const W = { class: "chart-legend" }, Y = { class: "search-box" }, Z = {
   key: 0,
   class: "empty-list"
-}, Q = ["onClick"], W = { class: "label-container" }, ne = /* @__PURE__ */ S({
+}, ee = ["onClick"], te = { class: "label-container" }, ue = /* @__PURE__ */ O({
   __name: "ChartLegend",
   props: {
     items: { default: () => [] },
     visibleIds: { default: () => [] },
     minVisible: { default: G },
     maxVisible: { default: X },
-    maxLimitTooltipText: { default: "" }
+    maxLimitTooltipText: { default: "" },
+    sortSelected: { default: null },
+    sortOptions: { default: () => [] },
+    sortOptionNameKey: { default: "" }
   },
-  emits: ["update:visibleIds"],
-  setup(h, { emit: T }) {
-    const l = h, y = 32, u = P(""), C = m(() => {
-      const t = u.value.toLowerCase();
-      return l.items.filter(
-        (i) => i.label.toLowerCase().includes(t)
+  emits: ["update:visibleIds", "update:sortSelected"],
+  setup(a, { emit: y }) {
+    const i = a, V = 32, m = z(i, "sortSelected", y), f = P(""), C = b(() => {
+      const t = f.value.toLowerCase();
+      return i.items.filter(
+        (l) => l.label.toLowerCase().includes(t)
       );
-    }), a = (t) => l.visibleIds.includes(t.id), v = m(
-      () => l.visibleIds.length >= l.maxVisible
-    ), V = m(
-      () => l.visibleIds.length <= l.minVisible
-    ), n = (t) => V.value && a(t) || v.value && !a(t), w = (t) => !l.maxLimitTooltipText || a(t) || !v.value, E = (t, i) => {
-      T(
+    }), n = (t) => i.visibleIds.includes(t.id), I = b(
+      () => i.visibleIds.length >= i.maxVisible
+    ), w = b(
+      () => i.visibleIds.length <= i.minVisible
+    ), r = (t) => w.value && n(t) || I.value && !n(t), S = (t) => !i.maxLimitTooltipText || n(t) || !I.value, E = (t, l) => {
+      y(
         "update:visibleIds",
-        t ? [...l.visibleIds, i.id] : l.visibleIds.filter((e) => e !== i.id)
+        t ? [...i.visibleIds, l.id] : i.visibleIds.filter((e) => e !== l.id)
       );
-    }, { list: x, containerProps: N, wrapperProps: B } = z(C, {
-      itemHeight: y,
+    }, { list: g, containerProps: N, wrapperProps: M } = K(C, {
+      itemHeight: V,
       overscan: 10
-    }), D = (t) => {
-      n(t) || E(!a(t), t);
+    }), B = (t) => {
+      r(t) || E(!n(t), t);
     };
-    return (t, i) => (s(), c("div", J, [
-      r("div", K, [
-        d(o(q), {
-          modelValue: u.value,
-          "onUpdate:modelValue": i[0] || (i[0] = (e) => u.value = e)
-        }, null, 8, ["modelValue"])
+    return (t, l) => (s(), p("div", W, [
+      d("div", Y, [
+        c(o(q), {
+          modelValue: f.value,
+          "onUpdate:modelValue": l[0] || (l[0] = (e) => f.value = e)
+        }, null, 8, ["modelValue"]),
+        a.sortOptions?.length > 0 ? (s(), v(Q, {
+          key: 0,
+          selected: o(m),
+          "onUpdate:selected": l[1] || (l[1] = (e) => U(m) ? m.value = e : null),
+          options: a.sortOptions,
+          "option-name-key": a.sortOptionNameKey
+        }, null, 8, ["selected", "options", "option-name-key"])) : h("", !0)
       ]),
-      r("div", I({ class: "legend" }, o(N)), [
-        r("ul", I({ class: "legend__list" }, o(B)), [
-          o(x).length === 0 ? (s(), c("li", O, [
-            d(o(f), { variant: "body2" }, {
-              default: p(() => [
-                b("No results")
+      d("div", T({ class: "legend" }, o(N)), [
+        d("ul", T({ class: "legend__list" }, o(M)), [
+          o(g).length === 0 ? (s(), p("li", Z, [
+            c(o(k), { variant: "body2" }, {
+              default: u(() => [
+                x("No results")
               ]),
               _: 1
             })
-          ])) : (s(!0), c(A, { key: 1 }, F(o(x), ({ data: e, index: M }) => (s(), c("li", {
-            key: M,
-            class: H({ "disabled-item": n(e) })
+          ])) : (s(!0), p(A, { key: 1 }, F(o(g), ({ data: e, index: D }) => (s(), p("li", {
+            key: D,
+            class: H({ "disabled-item": r(e) })
           }, [
-            d(o(j), {
-              text: h.maxLimitTooltipText,
-              disabled: w(e),
+            c(o(J), {
+              text: a.maxLimitTooltipText,
+              disabled: S(e),
               class: "disabled-tooltip"
             }, {
-              default: p(() => [
-                r("div", {
+              default: u(() => [
+                d("div", {
                   class: "item-wrapper",
-                  onClick: (_) => D(e)
+                  onClick: (L) => B(e)
                 }, [
-                  d(o(R), {
+                  c(o($), {
                     color: e.color,
-                    "is-checked": a(e),
-                    disabled: n(e),
-                    onClick: i[1] || (i[1] = U(
-                      (_) => {
-                        _.stopPropagation();
+                    "is-checked": n(e),
+                    disabled: r(e),
+                    onClick: l[2] || (l[2] = R(
+                      (L) => {
+                        L.stopPropagation();
                       },
                       ["stop"]
                     ))
                   }, null, 8, ["color", "is-checked", "disabled"]),
-                  e.icon ? (s(), k(o($), {
+                  e.icon ? (s(), v(o(j), {
                     key: 0,
                     class: "icon-color",
                     type: e.iconType,
                     name: e.icon,
                     size: "16px"
-                  }, null, 8, ["type", "name"])) : L("", !0),
-                  r("div", W, [
-                    d(o(f), {
+                  }, null, 8, ["type", "name"])) : h("", !0),
+                  d("div", te, [
+                    c(o(k), {
                       variant: "body2",
                       class: "legend-label",
                       "is-truncated": "",
-                      "with-tooltip": !n(e),
+                      "with-tooltip": !r(e),
                       "tooltip-text": e.label,
                       "tooltip-placement": "left"
                     }, {
-                      default: p(() => [
-                        b(g(e.label), 1)
+                      default: u(() => [
+                        x(_(e.label), 1)
                       ]),
                       _: 2
                     }, 1032, ["with-tooltip", "tooltip-text"]),
-                    e.caption ? (s(), k(o(f), {
+                    e.caption ? (s(), v(o(k), {
                       key: 0,
                       variant: "caption",
                       class: "legend-caption legend-label",
                       "is-truncated": "",
-                      "with-tooltip": !n(e),
+                      "with-tooltip": !r(e),
                       "tooltip-text": e.caption,
                       "tooltip-placement": "left"
                     }, {
-                      default: p(() => [
-                        b(g(e.caption), 1)
+                      default: u(() => [
+                        x(_(e.caption), 1)
                       ]),
                       _: 2
-                    }, 1032, ["with-tooltip", "tooltip-text"])) : L("", !0)
+                    }, 1032, ["with-tooltip", "tooltip-text"])) : h("", !0)
                   ])
-                ], 8, Q)
+                ], 8, ee)
               ]),
               _: 2
             }, 1032, ["text", "disabled"])
@@ -129,5 +140,5 @@ const J = { class: "chart-legend" }, K = { class: "search-box" }, O = {
   }
 });
 export {
-  ne as default
+  ue as default
 };