@ironsource/shared-ui 2.1.12-rc.15 → 2.1.12-rc.16

package/components/chart/ChartTooltip.vue2.js

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

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

@@ -0,0 +1,45 @@
+import { MyTooltipItem, ValueFormat } from '@/components/chart/types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+    title?: string;
+    xAxisFormat?: ValueFormat;
+    dataPoints: MyTooltipItem<'line'>[];
+    totalsChart?: boolean;
+}>, {
+    title: string;
+    xAxisFormat: any;
+    dataPoints: () => any[];
+    totalsChart: boolean;
+}>, {}, 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;
+    xAxisFormat?: ValueFormat;
+    dataPoints: MyTooltipItem<'line'>[];
+    totalsChart?: boolean;
+}>, {
+    title: string;
+    xAxisFormat: any;
+    dataPoints: () => any[];
+    totalsChart: boolean;
+}>>>, {
+    title: string;
+    xAxisFormat: ValueFormat;
+    dataPoints: MyTooltipItem<'line'>[];
+    totalsChart: boolean;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/components/chart/components/TooltipHeader.vue.js

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

package/components/chart/components/TooltipHeader.vue2.js

@@ -0,0 +1,59 @@
+import { defineComponent as h, computed as l, openBlock as r, createElementBlock as s, createElementVNode as g, unref as t, createCommentVNode as i, createBlock as n, createVNode as F, withCtx as c, createTextVNode as u, toDisplayString as m } from "vue";
+import { formatValue as d } from "../utils/utils.js";
+import f from "../../typography/v4/Typography.vue.js";
+import C from "../../icon/v4/IconV4.vue.js";
+import k from "../../icon/v4/IconFlag.vue.js";
+const v = { class: "tooltip-title-wrapper" }, A = { class: "main-title" }, T = ["src"], D = /* @__PURE__ */ h({
+  __name: "TooltipHeader",
+  props: {
+    title: { default: "" },
+    xAxisFormat: { default: null },
+    dataPoints: { default: () => [] },
+    totalsChart: { type: Boolean, default: !1 }
+  },
+  setup(o) {
+    const e = o, a = l(() => e.dataPoints.length ? e.dataPoints[0].dataset : null), p = l(() => e.xAxisFormat === "date" ? "dateLong" : e.xAxisFormat), x = l(() => e.xAxisFormat === "date" ? "day" : e.xAxisFormat), y = l(() => e.totalsChart ? a.value?.label || e.title : d(e.title, p.value));
+    return (V, b) => (r(), s("div", v, [
+      g("div", A, [
+        o.totalsChart && t(a)?.image ? (r(), s("img", {
+          key: 0,
+          class: "title-image",
+          src: t(a)?.image
+        }, null, 8, T)) : i("", !0),
+        o.totalsChart && t(a)?.countryFlag ? (r(), n(t(k), {
+          key: 1,
+          "country-code": t(a).countryFlag
+        }, null, 8, ["country-code"])) : i("", !0),
+        o.totalsChart && t(a)?.icon ? (r(), n(t(C), {
+          key: 2,
+          class: "platform-icon",
+          type: t(a)?.iconType,
+          name: t(a)?.icon,
+          size: "16px"
+        }, null, 8, ["type", "name"])) : i("", !0),
+        F(t(f), {
+          class: "title-text",
+          variant: "subtitle2"
+        }, {
+          default: c(() => [
+            u(m(t(y)), 1)
+          ]),
+          _: 1
+        })
+      ]),
+      o.xAxisFormat === "date" ? (r(), n(t(f), {
+        key: 0,
+        class: "tooltip-sub-title",
+        variant: "caption"
+      }, {
+        default: c(() => [
+          u(m(t(d)(o.title, t(x))), 1)
+        ]),
+        _: 1
+      })) : i("", !0)
+    ]));
+  }
+});
+export {
+  D as default
+};

package/components/chart/consts.d.ts

@@ -1,12 +1,8 @@
-import { DropdownTypeOption } from './types';
+import { DropdownTypeOption, Font } from './types';
 export declare const POINT_BORDER_COLOR = "#fcfcfc";
 export declare const GRID_LINE_COLOR = "#E4E4E4";
 export declare const TICK_LABEL_COLOR = "#646464";
-export declare const TICK_LABEL_FONT: {
-    size: number;
-    weight: number;
-    family: string;
-};
+export declare const TICK_LABEL_FONT: Font;
 export declare const DEFAULT_TICK_COUNT = 4;
 export declare const DEFAULT_MIN_VISIBLE = 1;
 export declare const DEFAULT_MAX_VISIBLE = 5;
@@ -16,6 +12,7 @@ export declare const COMPACT_HEADER_HEIGHT = 43;
 export declare const DEFAULT_CHART_PLANE_HEIGHT = 312;
 export declare const MIN_PLANE_HEIGHT = 187;
 export declare const TOTALS_HELPER_KEY = "__TOTALS_HELPER_KEY__";
+export declare const BASE_COLOR_KEY = "___BASE_COLOR__";
 export declare const BIDDING_PREFIX = "Bidding";
 export declare const NON_BIDDING_PREFIX = "Non-bidding";
 export declare const NETWORK_ID_IRON_SOURCE = 9899;
@@ -28,3 +25,12 @@ export declare const NETWORK_ID_INMOBI = 9938;
 export declare const NETWORK_ID_DT_EXCHANGE = 9950;
 export declare const NETWORK_ID_PANGLE = 9952;
 export declare const NETWORK_ID_LIFTOFF = 9962;
+export declare const HOVER_TRANSPARENCY = 10;
+export declare const HOVER_AREA_TRANSPARENCY = 70;
+export declare const CHART_PADDING: {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+};
+export declare const TICKS_EXTRA_PADDING = 10;

package/components/chart/consts.js

@@ -1,37 +1,47 @@
 import { ChartType as _ } from "./types.js";
-const I = "#fcfcfc", T = "#E4E4E4", O = "#646464", n = {
+const I = "#fcfcfc", T = "#E4E4E4", t = "#646464", O = {
   size: 12,
   weight: 400,
   family: "Inter"
-}, t = 4, N = 1, c = 5, o = [
+}, n = 4, N = 1, R = 5, o = [
   { id: _.Line, name: "Line" },
   { id: _.StackedLine, name: "Stack" },
   { id: _.Bar, name: "Bar" }
-], D = 76, L = 43, R = 312, s = 187, A = "__TOTALS_HELPER_KEY__", K = "Bidding", i = "Non-bidding", C = 9899, H = 9917, P = 9939, B = 9942, e = 9953, F = 9935, W = 9938, G = 9950, a = 9952, S = 9962;
+], c = 76, A = 43, s = 312, D = 187, L = "__TOTALS_HELPER_KEY__", C = "___BASE_COLOR__", K = "Bidding", P = "Non-bidding", H = 9899, i = 9917, B = 9939, S = 9942, e = 9953, G = 9935, F = 9938, W = 9950, a = 9952, d = 9962, r = 10, M = 70, m = {
+  left: 18,
+  right: 18,
+  top: 18,
+  bottom: 11
+}, U = 10;
 export {
+  C as BASE_COLOR_KEY,
   K as BIDDING_PREFIX,
-  L as COMPACT_HEADER_HEIGHT,
-  R as DEFAULT_CHART_PLANE_HEIGHT,
-  c as DEFAULT_MAX_VISIBLE,
+  m as CHART_PADDING,
+  A as COMPACT_HEADER_HEIGHT,
+  s as DEFAULT_CHART_PLANE_HEIGHT,
+  R as DEFAULT_MAX_VISIBLE,
   N as DEFAULT_MIN_VISIBLE,
-  t as DEFAULT_TICK_COUNT,
+  n as DEFAULT_TICK_COUNT,
   o as DROPDOWN_TYPE_OPTIONS,
   T as GRID_LINE_COLOR,
-  D as HEADER_HEIGHT,
-  s as MIN_PLANE_HEIGHT,
-  B as NETWORK_ID_AD_MOB,
-  F as NETWORK_ID_APPLOVIN,
-  G as NETWORK_ID_DT_EXCHANGE,
-  P as NETWORK_ID_FACEBOOK_META,
-  W as NETWORK_ID_INMOBI,
-  C as NETWORK_ID_IRON_SOURCE,
-  S as NETWORK_ID_LIFTOFF,
+  c as HEADER_HEIGHT,
+  M as HOVER_AREA_TRANSPARENCY,
+  r as HOVER_TRANSPARENCY,
+  D as MIN_PLANE_HEIGHT,
+  S as NETWORK_ID_AD_MOB,
+  G as NETWORK_ID_APPLOVIN,
+  W as NETWORK_ID_DT_EXCHANGE,
+  B as NETWORK_ID_FACEBOOK_META,
+  F as NETWORK_ID_INMOBI,
+  H as NETWORK_ID_IRON_SOURCE,
+  d as NETWORK_ID_LIFTOFF,
   e as NETWORK_ID_MINTEGRAL,
   a as NETWORK_ID_PANGLE,
-  H as NETWORK_ID_UNITY_ADS,
-  i as NON_BIDDING_PREFIX,
+  i as NETWORK_ID_UNITY_ADS,
+  P as NON_BIDDING_PREFIX,
   I as POINT_BORDER_COLOR,
-  O as TICK_LABEL_COLOR,
-  n as TICK_LABEL_FONT,
-  A as TOTALS_HELPER_KEY
+  U as TICKS_EXTRA_PADDING,
+  t as TICK_LABEL_COLOR,
+  O as TICK_LABEL_FONT,
+  L as TOTALS_HELPER_KEY
 };

package/components/chart/index.d.ts

@@ -16,8 +16,9 @@ declare const ChartTypes: () => ({
             chartType: import("./types").ChartType;
             hideLegend: boolean;
             xAxisFormat: import("./types").ValueFormat;
-            yAxisFormat: import("./types").ValueFormat;
+            totalsChart: boolean;
             parsing: import("./types").ChartParsingConfig;
+            yAxisFormat: import("./types").ValueFormat;
             dataSets: import("./types").ChartDataSet[];
             trendTooltip: any;
             subheader: string;
@@ -25,13 +26,13 @@ declare const ChartTypes: () => ({
             trendValue: string | number;
             trendDirection: "up" | "down";
             tickCount: number;
+            truncateTickLabels: boolean;
             noDataIcon: string;
             noDataTitle: string;
             noDataSubtitle: string;
             withAnimation: boolean;
             tooltipTotalType: import("../../utils/totals").TotalType;
             tooltipTotalCalcFn: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
-            totalsChart: boolean;
             fullHeight: boolean;
             withSettingsHeader: boolean;
             extraCharts: Record<string, unknown>[];
@@ -85,14 +86,18 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<import("./types").ValueFormat>;
                 default: string;
             };
-            yAxisFormat: {
-                type: import("vue").PropType<import("./types").ValueFormat>;
-                default: string;
+            totalsChart: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
             };
             parsing: {
                 type: import("vue").PropType<import("./types").ChartParsingConfig>;
                 default: any;
             };
+            yAxisFormat: {
+                type: import("vue").PropType<import("./types").ValueFormat>;
+                default: string;
+            };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
                 required: true;
@@ -129,6 +134,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<number>;
                 default: number;
             };
+            truncateTickLabels: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             noDataIcon: {
                 type: import("vue").PropType<string>;
                 default: string;
@@ -153,10 +162,6 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<(values: number[], totalType: import("../../utils/totals").TotalType) => number>;
                 default: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
             };
-            totalsChart: {
-                type: import("vue").PropType<boolean>;
-                default: boolean;
-            };
             fullHeight: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -173,7 +178,7 @@ declare const ChartTypes: () => ({
             "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
             "onUpdate:sortSelected"?: (sortOption: unknown) => any;
             "onUpdate:chartType"?: (chartType: import("./types").ChartType) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "yAxisFormat" | "parsing" | "dataSets" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "tickCount" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "totalsChart" | "fullHeight" | "withSettingsHeader" | "extraCharts">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "totalsChart" | "parsing" | "yAxisFormat" | "dataSets" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "tickCount" | "truncateTickLabels" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "fullHeight" | "withSettingsHeader" | "extraCharts">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -237,14 +242,18 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<import("./types").ValueFormat>;
                 default: string;
             };
-            yAxisFormat: {
-                type: import("vue").PropType<import("./types").ValueFormat>;
-                default: string;
+            totalsChart: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
             };
             parsing: {
                 type: import("vue").PropType<import("./types").ChartParsingConfig>;
                 default: any;
             };
+            yAxisFormat: {
+                type: import("vue").PropType<import("./types").ValueFormat>;
+                default: string;
+            };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
                 required: true;
@@ -281,6 +290,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<number>;
                 default: number;
             };
+            truncateTickLabels: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             noDataIcon: {
                 type: import("vue").PropType<string>;
                 default: string;
@@ -305,10 +318,6 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<(values: number[], totalType: import("../../utils/totals").TotalType) => number>;
                 default: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
             };
-            totalsChart: {
-                type: import("vue").PropType<boolean>;
-                default: boolean;
-            };
             fullHeight: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -342,8 +351,9 @@ declare const ChartTypes: () => ({
             chartType: import("./types").ChartType;
             hideLegend: boolean;
             xAxisFormat: import("./types").ValueFormat;
-            yAxisFormat: import("./types").ValueFormat;
+            totalsChart: boolean;
             parsing: import("./types").ChartParsingConfig;
+            yAxisFormat: import("./types").ValueFormat;
             dataSets: import("./types").ChartDataSet[];
             trendTooltip: any;
             subheader: string;
@@ -351,13 +361,13 @@ declare const ChartTypes: () => ({
             trendValue: string | number;
             trendDirection: "up" | "down";
             tickCount: number;
+            truncateTickLabels: boolean;
             noDataIcon: string;
             noDataTitle: string;
             noDataSubtitle: string;
             withAnimation: boolean;
             tooltipTotalType: import("../../utils/totals").TotalType;
             tooltipTotalCalcFn: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
-            totalsChart: boolean;
             fullHeight: boolean;
             withSettingsHeader: boolean;
             extraCharts: Record<string, unknown>[];
@@ -431,14 +441,18 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<import("./types").ValueFormat>;
             default: string;
         };
-        yAxisFormat: {
-            type: import("vue").PropType<import("./types").ValueFormat>;
-            default: string;
+        totalsChart: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
         };
         parsing: {
             type: import("vue").PropType<import("./types").ChartParsingConfig>;
             default: any;
         };
+        yAxisFormat: {
+            type: import("vue").PropType<import("./types").ValueFormat>;
+            default: string;
+        };
         dataSets: {
             type: import("vue").PropType<import("./types").ChartDataSet[]>;
             required: true;
@@ -475,6 +489,10 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<number>;
             default: number;
         };
+        truncateTickLabels: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
         noDataIcon: {
             type: import("vue").PropType<string>;
             default: string;
@@ -499,10 +517,6 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<(values: number[], totalType: import("../../utils/totals").TotalType) => number>;
             default: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
         };
-        totalsChart: {
-            type: import("vue").PropType<boolean>;
-            default: boolean;
-        };
         fullHeight: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -573,14 +587,18 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<import("./types").ValueFormat>;
         default: string;
     };
-    yAxisFormat: {
-        type: import("vue").PropType<import("./types").ValueFormat>;
-        default: string;
+    totalsChart: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
     };
     parsing: {
         type: import("vue").PropType<import("./types").ChartParsingConfig>;
         default: any;
     };
+    yAxisFormat: {
+        type: import("vue").PropType<import("./types").ValueFormat>;
+        default: string;
+    };
     dataSets: {
         type: import("vue").PropType<import("./types").ChartDataSet[]>;
         required: true;
@@ -617,6 +635,10 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<number>;
         default: number;
     };
+    truncateTickLabels: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
     noDataIcon: {
         type: import("vue").PropType<string>;
         default: string;
@@ -641,10 +663,6 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<(values: number[], totalType: import("../../utils/totals").TotalType) => number>;
         default: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
     };
-    totalsChart: {
-        type: import("vue").PropType<boolean>;
-        default: boolean;
-    };
     fullHeight: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -678,8 +696,9 @@ declare const ChartTypes: () => ({
     chartType: import("./types").ChartType;
     hideLegend: boolean;
     xAxisFormat: import("./types").ValueFormat;
-    yAxisFormat: import("./types").ValueFormat;
+    totalsChart: boolean;
     parsing: import("./types").ChartParsingConfig;
+    yAxisFormat: import("./types").ValueFormat;
     dataSets: import("./types").ChartDataSet[];
     trendTooltip: any;
     subheader: string;
@@ -687,13 +706,13 @@ declare const ChartTypes: () => ({
     trendValue: string | number;
     trendDirection: "up" | "down";
     tickCount: number;
+    truncateTickLabels: boolean;
     noDataIcon: string;
     noDataTitle: string;
     noDataSubtitle: string;
     withAnimation: boolean;
     tooltipTotalType: import("../../utils/totals").TotalType;
     tooltipTotalCalcFn: (values: number[], totalType: import("../../utils/totals").TotalType) => number;
-    totalsChart: boolean;
     fullHeight: boolean;
     withSettingsHeader: boolean;
     extraCharts: Record<string, unknown>[];

package/components/chart/mockData.d.ts

@@ -8,6 +8,7 @@ export declare const SINGLE_DATASET_DATE: {
 }[];
 export declare const SINGLE_DATASET_COUNTRY: {
     id: string;
+    countryFlag: string;
     label: string;
     data: {
         value: number;
@@ -15,6 +16,16 @@ export declare const SINGLE_DATASET_COUNTRY: {
         value3: number;
     }[];
 }[];
+export declare const SINGLE_DATASET_APP: {
+    id: string;
+    label: string;
+    icon: string;
+    image: string;
+    data: {
+        app: string;
+        value: number;
+    }[];
+}[];
 export declare const MULTIPLE_DATASETS_DATE: ({
     id: number;
     label: string;