@ironsource/shared-ui 2.1.12-test.98 → 2.1.12-test.99

package/src/components/chart/ChartLegend.vue2.js

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

package/src/components/chart/ChartLoader.vue.js

@@ -0,0 +1,7 @@
+import o from "./ChartLoader.vue2.js";
+/* empty css                  */import e from "../../../_virtual/_plugin-vue_export-helper.js";
+console.log('scoped// import "../../ChartLoader.vue_vue_type_style_index_0_scoped_ffa4cc66_lang.css"; //*');
+const c = /* @__PURE__ */ e(o, [["__scopeId", "data-v-ffa4cc66"]]);
+export {
+  c as default
+};

package/src/components/chart/ChartLoader.vue2.js

@@ -0,0 +1,15 @@
+import { defineComponent as e, openBlock as o, createElementBlock as r, createElementVNode as t, createVNode as a } from "vue";
+import c from "../loader/v4/Loader.vue.js";
+const n = { class: "chart-loader" }, s = { class: "chart-loader-wrapper" }, i = /* @__PURE__ */ e({
+  __name: "ChartLoader",
+  setup(d) {
+    return (_, p) => (o(), r("div", n, [
+      t("div", s, [
+        a(c)
+      ])
+    ]));
+  }
+});
+export {
+  i as default
+};

package/src/components/chart/ChartPlane.vue.js

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

package/src/components/chart/ChartPlane.vue2.js

@@ -0,0 +1,367 @@
+import { defineComponent as ae, useCssVars as oe, computed as o, ref as g, onMounted as le, watch as h, nextTick as re, openBlock as c, createElementBlock as k, createVNode as ie, unref as _, isRef as ne, createSlots as se, withCtx as ue, renderSlot as de, createCommentVNode as A, createElementVNode as S, normalizeStyle as ce, createBlock as L } from "vue";
+import { Chart as I, ArcElement as pe, LineElement as fe, BarElement as he, PointElement as ve, LineController as me, BarController as ye, PieController as Te, ScatterController as Ce, CategoryScale as be, LinearScale as ge, Filler as ke, Tooltip as Ae } from "chart.js";
+import { HoverVerticalLine as Se } from "./plugins/HoverVerticalLine.js";
+import { prepareTickLabel as Le, formatValue as xe } from "./utils/utils.js";
+import { DEFAULT_TICK_COUNT as Ee, TOTALS_HELPER_KEY as H, BASE_COLOR_KEY as P, CHART_PADDING as Re, POINT_BORDER_COLOR as Be, TICK_LABEL_COLOR as w, TICK_LABEL_FONT as V, TICKS_EXTRA_PADDING as De, GRID_LINE_COLOR as N, HEADER_HEIGHT as Oe, COMPACT_HEADER_HEIGHT as _e, HOVER_AREA_TRANSPARENCY as Ie, HOVER_TRANSPARENCY as v } from "./consts.js";
+import { ChartType as n, DateInterval as He, TooltipOrder as F, TrendDirection as Pe } from "./types.js";
+import { useTooltipPosition as we } from "./composables/useTooltipPosition.js";
+import Ve from "./ChartTooltip.vue.js";
+import { hexColorToRgba as p } from "../../utils/color.js";
+import Ne from "./ChartHeader.vue.js";
+import { useMemoize as Fe, useVModel as Ke } from "@vueuse/core";
+import Me from "../emptyState/v4/EmptyStateV4.vue.js";
+import Ue from "./ChartLoader.vue.js";
+import { DEFAULT_CHART_COLOR as Ye } from "./colorPalette.js";
+import { TotalType as K, calculateTotal as Ge } 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 = {
+  key: 0,
+  class: "header-wrapper"
+}, je = {
+  key: 1,
+  class: "chart-plane"
+}, qe = { class: "chart" }, mt = /* @__PURE__ */ ae({
+  __name: "ChartPlane",
+  props: {
+    dataSets: { default: () => [] },
+    visibleIds: { default: () => [] },
+    highlightedId: { default: null },
+    chartType: { default: n.Line },
+    parsing: { default: void 0 },
+    xAxisFormat: { default: "string" },
+    yAxisFormat: { default: "number" },
+    xAxisDateInterval: { default: He.DAILY },
+    tickCount: { default: Ee },
+    truncateTickLabels: { type: Boolean, default: !1 },
+    header: { default: "" },
+    subheader: { default: "" },
+    subheaderTooltip: { default: null },
+    keepSubheaderVisible: { type: Boolean, default: !1 },
+    loading: { type: Boolean, default: !1 },
+    empty: { type: Boolean, default: !1 },
+    noDataIcon: { default: "file-search" },
+    noDataTitle: { default: "No data to display" },
+    noDataSubtitle: { default: "Search again with different filters" },
+    withAnimation: { type: Boolean, default: !0 },
+    typeSwitcher: { type: Boolean, default: !0 },
+    height: { default: "100%" },
+    compactHeader: { type: Boolean, default: !1 },
+    tooltipRespectsTopEdge: { type: Boolean, default: !0 },
+    tooltipTotalType: { default: K.Total },
+    tooltipTotalCalcFn: { type: Function, default: Ge },
+    tooltipOrder: { default: F.Legend },
+    trendValue: { default: null },
+    trendDirection: { default: Pe.UP },
+    trendTooltip: { default: null },
+    totalsChart: { type: Boolean, default: !1 },
+    colorsMap: { default: () => ({}) },
+    valueSuffix: { default: "" },
+    valuePrefix: { default: "" }
+  },
+  emits: ["update:chartType"],
+  setup(M, { emit: U }) {
+    oe((e) => ({
+      "2f09324f": q.value,
+      "0d942f3a": e.height
+    }));
+    const Y = Fe(Le);
+    I.register(
+      pe,
+      fe,
+      he,
+      ve,
+      me,
+      ye,
+      Te,
+      Ce,
+      be,
+      ge,
+      ke,
+      Ae,
+      Se
+    );
+    const t = M, m = Ke(t, "chartType", U), G = o(
+      () => t.withAnimation ? "" : "none"
+    ), f = g(null);
+    let i = null;
+    const x = o(() => t.empty || t.dataSets.length === 0), u = o(() => !t.loading && !x.value), y = () => {
+      f.value && (i && i.destroy(), i = new I(f.value, B.value));
+    }, $ = () => {
+      i && (i.data.datasets = R.value, i.options = B.value.options, i.update(G.value));
+    };
+    le(y), h(() => t.chartType, y), h(u, async (e) => {
+      e && (await re(), y());
+    }), h(
+      [
+        () => t.visibleIds,
+        () => t.dataSets,
+        () => t.valuePrefix,
+        () => t.valueSuffix
+      ],
+      $
+    );
+    const d = o(() => t.totalsChart), T = o(
+      () => t.chartType === n.StackedLine || t.chartType === n.StackedBar || d.value
+    ), C = o(
+      () => t.chartType === n.Line || t.chartType === n.StackedLine
+    ), z = o(() => d.value && !t.parsing.xAxisKey ? { ...t.parsing, xAxisKey: H } : t.parsing), W = o(() => d.value ? t.dataSets.map((e) => ({
+      ...e,
+      data: e.data.map((r) => ({
+        ...r,
+        [H]: e.label
+      }))
+    })) : t.dataSets), b = o(
+      () => W.value.filter((e) => t.visibleIds.includes(e.id))
+    ), Z = (e) => t.colorsMap[e] || Ye, E = o(
+      () => b.value.length && b.value.every(
+        (e) => e.data.length === 1
+      )
+    ), R = o(() => b.value.map((e, r) => {
+      const a = Z(e.id), l = T.value ? r !== 0 ? "-1" : "start" : void 0;
+      return {
+        ...e,
+        fill: l,
+        backgroundColor: p(
+          a,
+          t.chartType === n.StackedLine ? 10 : 70
+        ),
+        borderColor: a,
+        pointBackgroundColor: a,
+        pointHoverBorderColor: a,
+        maxBarThickness: 50,
+        clip: 5,
+        // draw a bit outside the chart area
+        icon: e.icon || null,
+        iconType: e.iconType || "branded",
+        [P]: a
+        // store base color for later use
+      };
+    })), X = o(
+      () => t.tooltipTotalType === K.Total ? "Total" : "Mean"
+    ), B = o(() => ({
+      type: t.chartType == n.Bar || t.chartType === n.StackedBar ? "bar" : "line",
+      // Chart Data
+      data: {
+        datasets: R.value
+      },
+      // Chart Options
+      options: {
+        parsing: z.value,
+        interaction: {
+          intersect: !1,
+          mode: d.value ? "point" : "index",
+          axis: "x"
+        },
+        // plugins
+        plugins: {
+          legend: { display: !1 },
+          title: { display: !1 },
+          hoverVerticalLine: C.value,
+          // tooltip
+          tooltip: {
+            enabled: !1,
+            position: "average",
+            external: ({ tooltip: e }) => {
+              s.value = { ...e };
+            },
+            callbacks: {
+              footer: (e) => {
+                const r = e.map((l) => l.parsed.y || 0), a = t.tooltipTotalCalcFn(
+                  r,
+                  t.tooltipTotalType
+                );
+                return [X.value, String(a)];
+              }
+            },
+            itemSort: (e, r) => {
+              if (t.tooltipOrder === F.YAxis) {
+                const a = e.parsed.y || 0, l = r.parsed.y || 0;
+                return a === l ? 0 : a > l ? -1 : 1;
+              }
+              return 0;
+            }
+          }
+        },
+        // chart layout
+        responsive: !0,
+        maintainAspectRatio: !1,
+        layout: {
+          padding: Re
+        },
+        // basic styles
+        elements: {
+          line: {
+            borderWidth: 2,
+            tension: 0.3
+          },
+          point: {
+            radius: E.value ? 3 : 1,
+            hitRadius: 8,
+            borderWidth: 0,
+            hoverRadius: 4,
+            hoverBorderWidth: 2,
+            pointHoverBackgroundColor: Be
+          },
+          bar: {
+            borderRadius: 4
+          }
+        },
+        scales: {
+          // Horizontal Axis (X)
+          x: {
+            beginAtZero: !0,
+            offset: !C.value || E.value,
+            border: { display: !1 },
+            stacked: T.value,
+            // stack on top of each other
+            // ticks
+            ticks: {
+              color: w,
+              font: V,
+              padding: 4,
+              maxRotation: 0,
+              autoSkip: !t.truncateTickLabels,
+              autoSkipPadding: 8,
+              callback: function(e, r, a) {
+                const l = this.getLabelForValue(e), ee = C.value && !d.value ? a.length - 1 : a.length, te = this.chart.scales?.x?.width / ee - De;
+                return Y({
+                  label: l,
+                  format: t.xAxisFormat,
+                  availableSpace: te,
+                  truncate: t.truncateTickLabels
+                });
+              }
+            },
+            // grid lines
+            grid: {
+              color: N,
+              drawOnChartArea: !1,
+              drawTicks: !0,
+              drawBorder: !1,
+              tickLength: 7
+            }
+          },
+          // Vertical Axis (Y)
+          y: {
+            beginAtZero: !0,
+            border: { display: !1 },
+            // hide left borderline
+            stacked: T.value,
+            // stack on top of each other
+            // ticks
+            ticks: {
+              color: w,
+              font: V,
+              count: t.tickCount + 1,
+              padding: 8,
+              min: 0,
+              callback: (e) => t.valuePrefix + xe(e, t.yAxisFormat) + t.valueSuffix
+            },
+            // grid lines
+            grid: {
+              color: N,
+              drawOnChartArea: !0,
+              drawTicks: !1
+            }
+          }
+        }
+      }
+    })), D = g(null), s = g(null), { position: O } = we(
+      f,
+      D,
+      s,
+      t.tooltipRespectsTopEdge
+    ), j = o(() => ({
+      left: `${O.value.left}px`,
+      top: `${O.value.top}px`,
+      opacity: s.value?.opacity || 0
+    })), q = o(
+      () => (t.compactHeader ? _e : Oe) + "px"
+    );
+    h(
+      () => t.highlightedId,
+      (e) => {
+        i && ($e(e) ? Q() : J(e), i.update());
+      }
+    );
+    const J = (e) => {
+      (i?.data.datasets || []).forEach((a) => {
+        ze(a);
+        const l = a[P];
+        a.id === e ? t.chartType === n.StackedLine && (a.backgroundColor = p(
+          l,
+          Ie
+        )) : (a.backgroundColor = p(l, v), a.borderColor = p(l, v), a.pointBackgroundColor = p(l, v), a.pointHoverBorderColor = p(l, v));
+      });
+    }, Q = () => {
+      (i?.data.datasets || []).forEach(We);
+    };
+    return (e, r) => (c(), k("div", Ze, [
+      u.value || e.keepSubheaderVisible ? (c(), k("div", Xe, [
+        ie(Ne, {
+          "chart-type": _(m),
+          "onUpdate:chartType": r[0] || (r[0] = (a) => ne(m) ? m.value = a : null),
+          "type-switcher": u.value ? e.typeSwitcher : !1,
+          header: u.value ? e.header : null,
+          subheader: e.subheader,
+          "subheader-tooltip": e.subheaderTooltip,
+          "trend-tooltip": e.trendTooltip,
+          compact: e.compactHeader,
+          "trend-value": u.value ? e.trendValue : null,
+          "trend-direction": e.trendDirection
+        }, se({ _: 2 }, [
+          e.$slots["subheader-tooltip"] ? {
+            name: "subheader-tooltip",
+            fn: ue(() => [
+              de(e.$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"])
+      ])) : A("", !0),
+      u.value ? (c(), k("section", je, [
+        S("div", qe, [
+          S("canvas", {
+            ref_key: "chartRef",
+            ref: f,
+            class: "chart__canvas"
+          }, null, 512),
+          S("div", {
+            ref_key: "tooltipRef",
+            ref: D,
+            class: "chart__tooltip",
+            style: ce(j.value)
+          }, [
+            s.value ? (c(), L(Ve, {
+              key: 0,
+              "totals-chart": d.value,
+              title: String(s.value.title),
+              "data-points": s.value.dataPoints,
+              "x-axis-format": e.xAxisFormat,
+              "y-axis-format": e.yAxisFormat,
+              "x-axis-date-interval": e.xAxisDateInterval,
+              "total-label": s.value.footer?.[0],
+              "total-value": Number(s.value.footer?.[1]),
+              "value-suffix": e.valueSuffix,
+              "value-prefix": e.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"])) : A("", !0)
+          ], 4)
+        ])
+      ])) : e.loading ? (c(), L(Ue, {
+        key: 2,
+        class: "chart-loading"
+      })) : x.value ? (c(), L(_(Me), {
+        key: 3,
+        class: "chart-empty",
+        variant: null,
+        title: e.noDataTitle,
+        subtitle: e.noDataSubtitle,
+        "icon-name": e.noDataIcon
+      }, null, 8, ["title", "subtitle", "icon-name"])) : A("", !0)
+    ]));
+  }
+});
+export {
+  mt as default
+};

package/src/components/chart/ChartTooltip.vue.js

@@ -0,0 +1,7 @@
+import o from "./ChartTooltip.vue2.js";
+/* empty css                   */import t from "../../../_virtual/_plugin-vue_export-helper.js";
+console.log('scoped// import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_e53c6287_lang.css"; //*');
+const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-e53c6287"]]);
+export {
+  s as default
+};

package/src/components/chart/ChartTooltip.vue2.js

@@ -0,0 +1,97 @@
+import { defineComponent as c, openBlock as a, createElementBlock as o, createBlock as f, createCommentVNode as r, Fragment as y, renderList as v, createElementVNode as p, normalizeStyle as x, unref as l, createVNode as s, withCtx as i, createTextVNode as n, toDisplayString as u } from "vue";
+import d from "../typography/v4/Typography.vue.js";
+import h from "../icon/v4/IconV4.vue.js";
+import "../icon/v4/IconFlag.vue.js";
+import { formatValue as m } from "./utils/utils.js";
+import b from "./TooltipHeader.vue.js";
+const k = { class: "chart-tooltip" }, C = {
+  key: 1,
+  class: "list"
+}, g = { class: "popover-label-wrapper" }, V = {
+  key: 2,
+  class: "tooltip-footer"
+}, N = /* @__PURE__ */ c({
+  __name: "ChartTooltip",
+  props: {
+    title: { default: "" },
+    dataPoints: { default: () => [] },
+    xAxisFormat: { default: null },
+    yAxisFormat: { default: null },
+    xAxisDateInterval: { default: null },
+    totalLabel: { default: "Total" },
+    totalValue: { default: null },
+    totalsChart: { type: Boolean, default: !1 },
+    valueSuffix: { default: "" },
+    valuePrefix: { default: "" }
+  },
+  setup(A) {
+    return (t, F) => (a(), o("div", k, [
+      t.title ? (a(), f(b, {
+        key: 0,
+        title: t.title,
+        "data-points": t.dataPoints,
+        "totals-chart": t.totalsChart,
+        "x-axis-format": t.xAxisFormat,
+        "x-axis-date-interval": t.xAxisDateInterval
+      }, null, 8, ["title", "data-points", "totals-chart", "x-axis-format", "x-axis-date-interval"])) : r("", !0),
+      t.totalsChart ? r("", !0) : (a(), o("ul", C, [
+        (a(!0), o(y, null, v(t.dataPoints, (e) => (a(), o("li", {
+          key: e.datasetIndex,
+          class: "list__item"
+        }, [
+          p("span", {
+            class: "color-box",
+            style: x({
+              backgroundColor: String(e.dataset.pointBackgroundColor)
+            })
+          }, null, 4),
+          e.dataset.icon ? (a(), f(l(h), {
+            key: 0,
+            class: "platform-icon",
+            type: e.dataset.iconType,
+            name: e.dataset.icon,
+            size: "16px"
+          }, null, 8, ["type", "name"])) : r("", !0),
+          p("div", g, [
+            s(l(d), {
+              variant: "body2",
+              class: "flex-grow truncated-label",
+              "is-truncated": ""
+            }, {
+              default: i(() => [
+                n(u(e.dataset.label), 1)
+              ]),
+              _: 2
+            }, 1024)
+          ]),
+          s(l(d), { variant: "body2" }, {
+            default: i(() => [
+              n(u(t.valuePrefix + l(m)(e.parsed.y, t.yAxisFormat) + t.valueSuffix), 1)
+            ]),
+            _: 2
+          }, 1024)
+        ]))), 128))
+      ])),
+      t.totalValue !== null ? (a(), o("div", V, [
+        s(l(d), {
+          variant: "body2",
+          class: "flex-grow"
+        }, {
+          default: i(() => [
+            n(u(t.totalLabel), 1)
+          ]),
+          _: 1
+        }),
+        s(l(d), { variant: "body2" }, {
+          default: i(() => [
+            n(u(t.valuePrefix + l(m)(t.totalValue, t.yAxisFormat) + t.valueSuffix), 1)
+          ]),
+          _: 1
+        })
+      ])) : r("", !0)
+    ]));
+  }
+});
+export {
+  N as default
+};