@ironsource/shared-ui 2.1.11-test.27 → 2.1.11-test.41

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

@@ -4,11 +4,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     visibleIds: unknown[];
     minVisible?: number;
     maxVisible?: number;
+    maxLimitTooltipText?: string;
 }>, {
     items: () => any[];
     visibleIds: () => any[];
     minVisible: number;
     maxVisible: number;
+    maxLimitTooltipText: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:visibleIds": (visibleIds: unknown[]) => void;
 }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
@@ -16,11 +18,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     visibleIds: unknown[];
     minVisible?: number;
     maxVisible?: number;
+    maxLimitTooltipText?: string;
 }>, {
     items: () => any[];
     visibleIds: () => any[];
     minVisible: number;
     maxVisible: number;
+    maxLimitTooltipText: string;
 }>>> & {
     "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
 }, {
@@ -28,6 +32,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     visibleIds: unknown[];
     minVisible: number;
     maxVisible: number;
+    maxLimitTooltipText: 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_c0f71a49_lang.css"; //*');
-const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-c0f71a49"]]);
+// import "../../ChartLegend.vue_vue_type_style_index_0_scoped_a1c626cd_lang.css"; //*');
+const s = /* @__PURE__ */ o(e, [["__scopeId", "data-v-a1c626cd"]]);
 export {
-  a as default
+  s as default
 };

package/components/chart/ChartLegend.vue2.js

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

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

@@ -1,8 +1,7 @@
-import { TooltipItem } from 'chart.js';
-import { ValueFormat } from '@/components/chart/types';
+import { MyTooltipItem, ValueFormat } from '@/components/chart/types';
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     title?: string;
-    dataPoints: TooltipItem<'line'>[];
+    dataPoints: MyTooltipItem<'line'>[];
     xAxisFormat?: ValueFormat;
     yAxisFormat?: ValueFormat;
     totalLabel?: string;
@@ -16,7 +15,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     totalValue: 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<{
     title?: string;
-    dataPoints: TooltipItem<'line'>[];
+    dataPoints: MyTooltipItem<'line'>[];
     xAxisFormat?: ValueFormat;
     yAxisFormat?: ValueFormat;
     totalLabel?: string;
@@ -30,7 +29,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     totalValue: any;
 }>>>, {
     title: string;
-    dataPoints: TooltipItem<'line'>[];
+    dataPoints: MyTooltipItem<'line'>[];
     xAxisFormat: ValueFormat;
     yAxisFormat: ValueFormat;
     totalLabel: string;

package/components/chart/ChartTooltip.vue.js

@@ -1,7 +1,7 @@
 import o from "./ChartTooltip.vue2.js";
 /* empty css                   */import t from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_ec636f18_lang.css"; //*');
-const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-ec636f18"]]);
+// import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_6744325c_lang.css"; //*');
+const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-6744325c"]]);
 export {
   s as default
 };

package/components/chart/ChartTooltip.vue2.js

@@ -1,10 +1,15 @@
- import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_ec636f18_lang.css"; import { defineComponent as y, computed as b, openBlock as a, createElementBlock as s, createElementVNode as u, createBlock as g, unref as e, withCtx as l, createTextVNode as o, toDisplayString as r, createCommentVNode as f, Fragment as h, renderList as k, normalizeStyle as v, createVNode as d } from "vue";
-import i from "../typography/v4/Typography.vue.js";
-import { formatValue as c } from "./utils/utils.js";
-const F = { class: "chart-tooltip" }, V = { class: "tooltip-title" }, p = { class: "list" }, A = {
+ import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_6744325c_lang.css"; import { defineComponent as b, computed as x, openBlock as l, createElementBlock as c, createVNode as o, unref as t, withCtx as r, createTextVNode as i, toDisplayString as s, createCommentVNode as m, createElementVNode as f, Fragment as v, renderList as F, normalizeStyle as h, createBlock as g } from "vue";
+import n from "../typography/v4/Typography.vue.js";
+import { formatValue as d } from "./utils/utils.js";
+import k from "../icon/v4/IconV4.vue.js";
+import "../icon/v4/IconFlag.vue.js";
+const A = { class: "chart-tooltip" }, V = {
   key: 0,
+  class: "tooltip-title-wrapper"
+}, C = { class: "list" }, T = { class: "popover-label-wrapper" }, _ = {
+  key: 1,
   class: "tooltip-footer"
-}, T = /* @__PURE__ */ y({
+}, I = /* @__PURE__ */ b({
   __name: "ChartTooltip",
   props: {
     title: { default: "" },
@@ -14,68 +19,84 @@ const F = { class: "chart-tooltip" }, V = { class: "tooltip-title" }, p = { clas
     totalLabel: { default: "Total" },
     totalValue: { default: null }
   },
-  setup(t) {
-    const m = t, x = b(() => m.xAxisFormat === "date" ? "dateLong" : m.xAxisFormat);
-    return (C, _) => (a(), s("div", F, [
-      u("div", V, [
-        t.title ? (a(), g(e(i), {
-          key: 0,
-          variant: "subtitle2"
+  setup(e) {
+    const u = e, y = x(() => u.xAxisFormat === "date" ? "dateLong" : u.xAxisFormat), p = x(() => u.xAxisFormat === "date" ? "day" : u.xAxisFormat);
+    return (w, B) => (l(), c("div", A, [
+      e.title ? (l(), c("div", V, [
+        o(t(n), { variant: "subtitle2" }, {
+          default: r(() => [
+            i(s(t(d)(e.title, t(y))), 1)
+          ]),
+          _: 1
+        }),
+        o(t(n), {
+          class: "tooltip-sub-title",
+          variant: "caption"
         }, {
-          default: l(() => [
-            o(r(e(c)(t.title, e(x))), 1)
+          default: r(() => [
+            i(s(t(d)(e.title, t(p))), 1)
           ]),
           _: 1
-        })) : f("", !0)
-      ]),
-      u("ul", p, [
-        (a(!0), s(h, null, k(t.dataPoints, (n) => (a(), s("li", {
-          key: n.datasetIndex,
+        })
+      ])) : m("", !0),
+      f("ul", C, [
+        (l(!0), c(v, null, F(e.dataPoints, (a) => (l(), c("li", {
+          key: a.datasetIndex,
           class: "list__item"
         }, [
-          u("span", {
+          f("span", {
             class: "color-box",
-            style: v({
-              backgroundColor: String(n.dataset.pointBackgroundColor)
+            style: h({
+              backgroundColor: String(a.dataset.pointBackgroundColor)
             })
           }, null, 4),
-          d(e(i), {
-            variant: "body2",
-            class: "flex-grow"
-          }, {
-            default: l(() => [
-              o(r(n.dataset.label), 1)
-            ]),
-            _: 2
-          }, 1024),
-          d(e(i), { variant: "body2" }, {
-            default: l(() => [
-              o(r(e(c)(n.parsed.y, t.yAxisFormat)), 1)
+          a.dataset.icon ? (l(), g(t(k), {
+            key: 0,
+            class: "platform-icon",
+            type: a.dataset.iconType,
+            name: a.dataset.icon,
+            size: "16px"
+          }, null, 8, ["type", "name"])) : m("", !0),
+          f("div", T, [
+            o(t(n), {
+              variant: "body2",
+              class: "flex-grow truncated-label",
+              "is-truncated": ""
+            }, {
+              default: r(() => [
+                i(s(a.dataset.label), 1)
+              ]),
+              _: 2
+            }, 1024)
+          ]),
+          o(t(n), { variant: "body2" }, {
+            default: r(() => [
+              i(s(t(d)(a.parsed.y, e.yAxisFormat)), 1)
             ]),
             _: 2
           }, 1024)
         ]))), 128))
       ]),
-      t.totalValue !== null ? (a(), s("div", A, [
-        d(e(i), {
+      e.totalValue !== null ? (l(), c("div", _, [
+        o(t(n), {
           variant: "body2",
           class: "flex-grow"
         }, {
-          default: l(() => [
-            o(r(t.totalLabel), 1)
+          default: r(() => [
+            i(s(e.totalLabel), 1)
           ]),
           _: 1
         }),
-        d(e(i), { variant: "body2" }, {
-          default: l(() => [
-            o(r(e(c)(t.totalValue, t.yAxisFormat)), 1)
+        o(t(n), { variant: "body2" }, {
+          default: r(() => [
+            i(s(t(d)(e.totalValue, e.yAxisFormat)), 1)
           ]),
           _: 1
         })
-      ])) : f("", !0)
+      ])) : m("", !0)
     ]));
   }
 });
 export {
-  T as default
+  I as default
 };

package/components/chart/index.d.ts

@@ -12,10 +12,11 @@ declare const ChartTypes: () => ({
             visibleIds: unknown[];
             minVisible: number;
             maxVisible: number;
+            maxLimitTooltipText: string;
             chartType: import("./types").ChartType;
             withSettingsHeader: boolean;
             subheader: string;
-            subheaderTooltip: string;
+            withSubheaderTooltip: boolean;
             dataSets: import("./types").ChartDataSet[];
             hideLegend: boolean;
             tickCount: number;
@@ -56,6 +57,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<number>;
                 default: number;
             };
+            maxLimitTooltipText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             chartType: {
                 type: import("vue").PropType<import("./types").ChartType>;
                 default: import("./types").ChartType;
@@ -68,9 +73,9 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-            subheaderTooltip: {
-                type: import("vue").PropType<string>;
-                default: string;
+            withSubheaderTooltip: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
             };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
@@ -100,7 +105,7 @@ declare const ChartTypes: () => ({
         }>> & {
             "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
             "onUpdate:chartType"?: (chartType: import("./types").ChartType) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "xAxisFormat" | "yAxisFormat" | "parsing" | "visibleIds" | "minVisible" | "maxVisible" | "chartType" | "withSettingsHeader" | "subheader" | "subheaderTooltip" | "dataSets" | "hideLegend" | "tickCount" | "noDataIcon" | "noDataTitle" | "noDataSubtitle">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "xAxisFormat" | "yAxisFormat" | "parsing" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "chartType" | "withSettingsHeader" | "subheader" | "withSubheaderTooltip" | "dataSets" | "hideLegend" | "tickCount" | "noDataIcon" | "noDataTitle" | "noDataSubtitle">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -148,6 +153,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<number>;
                 default: number;
             };
+            maxLimitTooltipText: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             chartType: {
                 type: import("vue").PropType<import("./types").ChartType>;
                 default: import("./types").ChartType;
@@ -160,9 +169,9 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<string>;
                 default: string;
             };
-            subheaderTooltip: {
-                type: import("vue").PropType<string>;
-                default: string;
+            withSubheaderTooltip: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
             };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
@@ -204,10 +213,11 @@ declare const ChartTypes: () => ({
             visibleIds: unknown[];
             minVisible: number;
             maxVisible: number;
+            maxLimitTooltipText: string;
             chartType: import("./types").ChartType;
             withSettingsHeader: boolean;
             subheader: string;
-            subheaderTooltip: string;
+            withSubheaderTooltip: boolean;
             dataSets: import("./types").ChartDataSet[];
             hideLegend: boolean;
             tickCount: number;
@@ -268,6 +278,10 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<number>;
             default: number;
         };
+        maxLimitTooltipText: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
         chartType: {
             type: import("vue").PropType<import("./types").ChartType>;
             default: import("./types").ChartType;
@@ -280,9 +294,9 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<string>;
             default: string;
         };
-        subheaderTooltip: {
-            type: import("vue").PropType<string>;
-            default: string;
+        withSubheaderTooltip: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
         };
         dataSets: {
             type: import("vue").PropType<import("./types").ChartDataSet[]>;
@@ -350,6 +364,10 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<number>;
         default: number;
     };
+    maxLimitTooltipText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     chartType: {
         type: import("vue").PropType<import("./types").ChartType>;
         default: import("./types").ChartType;
@@ -362,9 +380,9 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<string>;
         default: string;
     };
-    subheaderTooltip: {
-        type: import("vue").PropType<string>;
-        default: string;
+    withSubheaderTooltip: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
     };
     dataSets: {
         type: import("vue").PropType<import("./types").ChartDataSet[]>;
@@ -406,10 +424,11 @@ declare const ChartTypes: () => ({
     visibleIds: unknown[];
     minVisible: number;
     maxVisible: number;
+    maxLimitTooltipText: string;
     chartType: import("./types").ChartType;
     withSettingsHeader: boolean;
     subheader: string;
-    subheaderTooltip: string;
+    withSubheaderTooltip: boolean;
     dataSets: import("./types").ChartDataSet[];
     hideLegend: boolean;
     tickCount: number;
@@ -420,6 +439,7 @@ declare const ChartTypes: () => ({
     $slots: {
         metric?(_: {}): any;
         breakdowns?(_: {}): any;
+        "subheader-tooltip"?(_: {}): any;
     };
 }))[];
 export type { ChartType, ChartDataRecord, ChartDataSet, ChartParsingConfig, } from './types';

package/components/chart/mockData.d.ts

@@ -13,12 +13,25 @@ export declare const SINGLE_DATASET_COUNTRY: {
         value: number;
     }[];
 }[];
-export declare const MULTIPLE_DATASETS_DATE: {
+export declare const MULTIPLE_DATASETS_DATE: ({
     id: string;
     label: string;
+    caption: string;
+    icon: string;
     data: {
         date: string;
         value: number;
     }[];
-}[];
+    iconType?: undefined;
+} | {
+    id: string;
+    label: string;
+    caption: string;
+    icon: string;
+    iconType: string;
+    data: {
+        date: string;
+        value: number;
+    }[];
+})[];
 export declare const generateMockData: (numSeries?: number) => any[];

package/components/chart/types.d.ts

@@ -1,5 +1,7 @@
 import { Ref } from 'vue';
 import { UseVirtualListItem } from '@vueuse/core';
+import { IconTypes } from '../icon/v4/Icon.types';
+import { ChartTypeRegistry, TooltipItem } from 'chart.js';
 export declare enum ChartType {
     Line = "line",
     Bar = "bar",
@@ -11,18 +13,30 @@ export type ChartDataSet = {
     id: string | number;
     label: string;
     data: ChartDataRecord[];
+    caption?: string;
     color?: string;
+    icon?: string;
+    iconType?: IconTypes;
 };
 export type ChartParsingConfig = {
     xAxisKey: string;
     yAxisKey: string;
 };
-export type ValueFormat = 'date' | 'dateLong' | 'number' | 'percent' | 'string';
+export type ValueFormat = 'date' | 'dateLong' | 'number' | 'percent' | 'string' | 'day';
 export type LegendItem = {
     id: string | number;
     label: string;
+    caption?: string;
     color?: string;
+    icon?: string;
+    iconType?: IconTypes;
 };
+export interface MyTooltipItem<T extends keyof ChartTypeRegistry = keyof ChartTypeRegistry> extends TooltipItem<T> {
+    dataset: {
+        icon?: string;
+        iconType?: IconTypes;
+    } & TooltipItem<T>['dataset'];
+}
 export type UseVirtualListResult = {
     list: Ref<UseVirtualListItem<LegendItem>[]>;
     containerProps: {

package/components/chart/utils/utils.js

@@ -1,11 +1,11 @@
-import { format as f } from "date-fns";
-import { formatNumber as m } from "./formatNumber.js";
+import { format as n } from "date-fns";
+import { formatNumber as d } from "./formatNumber.js";
 const p = (r, t, e) => {
   if (e === 0)
     return 0;
-  const n = t - r, o = n / e * 0.4;
-  return (n + o) / e;
-}, M = (r, t) => t === "number" ? m(r) : t === "date" ? f(new Date(r), "MMM dd") : t === "dateLong" ? f(new Date(r), "dd MMM yyyy") : String(r);
+  const f = t - r, o = f / e * 0.4;
+  return (f + o) / e;
+}, M = (r, t) => t === "day" ? n(new Date(r), "EEEE") : t === "number" ? d(r) : t === "date" ? n(new Date(r), "MMM dd") : t === "dateLong" ? n(new Date(r), "MMM dd, yyyy") : String(r);
 export {
   p as calcStepSize,
   M as formatValue