@ironsource/shared-ui 2.1.12-rc.17 → 2.1.12-rc.19

package/components/chart/ChartTooltip.vue2.js

@@ -1,86 +1,90 @@
- import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_9e521454_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 "../../ChartTooltip.vue_vue_type_style_index_0_scoped_e53c6287_lang.css"; import { defineComponent as m, openBlock as a, createElementBlock as o, createBlock as c, createCommentVNode as r, Fragment as y, renderList as v, createElementVNode as f, normalizeStyle as h, unref as l, createVNode as i, withCtx as n, createTextVNode as s, toDisplayString as u } from "vue";
+import d from "../typography/v4/Typography.vue.js";
 import b from "../icon/v4/IconV4.vue.js";
 import "../icon/v4/IconFlag.vue.js";
-import { formatValue as f } from "./utils/utils.js";
+import { formatValue as x } from "./utils/utils.js";
 import k from "./TooltipHeader.vue.js";
 const C = { class: "chart-tooltip" }, g = {
   key: 1,
   class: "list"
-}, v = { class: "popover-label-wrapper" }, V = {
+}, V = { class: "popover-label-wrapper" }, A = {
   key: 2,
   class: "tooltip-footer"
-}, z = /* @__PURE__ */ y({
+}, L = /* @__PURE__ */ m({
   __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 }
+    totalsChart: { type: Boolean, default: !1 },
+    valueSuffix: { default: "" },
+    valuePrefix: { default: "" }
   },
   setup(t) {
-    return (F, T) => (a(), o("div", C, [
-      t.title ? (a(), u(k, {
+    return (F, S) => (a(), o("div", C, [
+      t.title ? (a(), c(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),
+        "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", g, [
-        (a(!0), o(x, null, h(t.dataPoints, (e) => (a(), o("li", {
+        (a(!0), o(y, null, v(t.dataPoints, (e) => (a(), o("li", {
           key: e.datasetIndex,
           class: "list__item"
         }, [
-          m("span", {
+          f("span", {
             class: "color-box",
-            style: p({
+            style: h({
               backgroundColor: String(e.dataset.pointBackgroundColor)
             })
           }, null, 4),
-          e.dataset.icon ? (a(), u(l(b), {
+          e.dataset.icon ? (a(), c(l(b), {
             key: 0,
             class: "platform-icon",
             type: e.dataset.iconType,
             name: e.dataset.icon,
             size: "16px"
           }, null, 8, ["type", "name"])) : r("", !0),
-          m("div", v, [
-            s(l(c), {
+          f("div", V, [
+            i(l(d), {
               variant: "body2",
               class: "flex-grow truncated-label",
               "is-truncated": ""
             }, {
-              default: i(() => [
-                n(d(e.dataset.label), 1)
+              default: n(() => [
+                s(u(e.dataset.label), 1)
               ]),
               _: 2
             }, 1024)
           ]),
-          s(l(c), { variant: "body2" }, {
-            default: i(() => [
-              n(d(l(f)(e.parsed.y, t.yAxisFormat)), 1)
+          i(l(d), { variant: "body2" }, {
+            default: n(() => [
+              s(u(t.valuePrefix + l(x)(e.parsed.y, t.yAxisFormat) + t.valueSuffix), 1)
             ]),
             _: 2
           }, 1024)
         ]))), 128))
       ])),
-      t.totalValue !== null ? (a(), o("div", V, [
-        s(l(c), {
+      t.totalValue !== null ? (a(), o("div", A, [
+        i(l(d), {
           variant: "body2",
           class: "flex-grow"
         }, {
-          default: i(() => [
-            n(d(t.totalLabel), 1)
+          default: n(() => [
+            s(u(t.totalLabel), 1)
           ]),
           _: 1
         }),
-        s(l(c), { variant: "body2" }, {
-          default: i(() => [
-            n(d(l(f)(t.totalValue, t.yAxisFormat)), 1)
+        i(l(d), { variant: "body2" }, {
+          default: n(() => [
+            s(u(t.valuePrefix + l(x)(t.totalValue, t.yAxisFormat) + t.valueSuffix), 1)
           ]),
           _: 1
         })
@@ -89,5 +93,5 @@ const C = { class: "chart-tooltip" }, g = {
   }
 });
 export {
-  z as default
+  L as default
 };

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

@@ -1,27 +1,32 @@
-import { MyTooltipItem, ValueFormat } from '@/components/chart/types';
+import { DateInterval, MyTooltipItem, ValueFormat } from '@/components/chart/types';
 declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
     title?: string;
     xAxisFormat?: ValueFormat;
+    xAxisDateInterval?: DateInterval;
     dataPoints: MyTooltipItem<'line'>[];
     totalsChart?: boolean;
 }>, {
     title: string;
     xAxisFormat: any;
+    xAxisDateInterval: 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;
+    xAxisDateInterval?: DateInterval;
     dataPoints: MyTooltipItem<'line'>[];
     totalsChart?: boolean;
 }>, {
     title: string;
     xAxisFormat: any;
+    xAxisDateInterval: any;
     dataPoints: () => any[];
     totalsChart: boolean;
 }>>>, {
     title: string;
     xAxisFormat: ValueFormat;
+    xAxisDateInterval: DateInterval;
     dataPoints: MyTooltipItem<'line'>[];
     totalsChart: boolean;
 }>;

package/components/chart/TooltipHeader.vue.js

@@ -1,7 +1,7 @@
 import o from "./TooltipHeader.vue2.js";
 /* empty css                    */import e from "../../_virtual/_plugin-vue_export-helper.js";
-// import "../../TooltipHeader.vue_vue_type_style_index_0_scoped_9f6cf389_lang.css"; //*');
-const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-9f6cf389"]]);
+// import "../../TooltipHeader.vue_vue_type_style_index_0_scoped_3b15c693_lang.css"; //*');
+const s = /* @__PURE__ */ e(o, [["__scopeId", "data-v-3b15c693"]]);
 export {
   s as default
 };

package/components/chart/TooltipHeader.vue2.js

@@ -1,59 +1,69 @@
- import "../../TooltipHeader.vue_vue_type_style_index_0_scoped_9f6cf389_lang.css"; 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 "../../TooltipHeader.vue_vue_type_style_index_0_scoped_3b15c693_lang.css"; import { defineComponent as v, computed as m, openBlock as n, createElementBlock as f, createElementVNode as A, unref as t, createCommentVNode as s, createBlock as u, createVNode as D, withCtx as d, createTextVNode as x, toDisplayString as p } from "vue";
+import { formatValue as r } from "./utils/utils.js";
+import y from "../typography/v4/Typography.vue.js";
+import { DateInterval as c } from "./types.js";
+import T 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({
+import { startOfWeek as C, endOfWeek as F, startOfMonth as I, endOfMonth as O } from "date-fns";
+import { LONG_DATE_FORMAT as i } from "./consts.js";
+const E = { class: "tooltip-title-wrapper" }, N = { class: "main-title" }, L = ["src"], P = /* @__PURE__ */ v({
   __name: "TooltipHeader",
   props: {
     title: { default: "" },
     xAxisFormat: { default: null },
+    xAxisDateInterval: { 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", {
+  setup(a) {
+    const e = a, o = m(() => e.dataPoints.length ? e.dataPoints[0].dataset : null), h = m(() => e.totalsChart ? o.value?.label || e.title : e.xAxisFormat === "date" ? g(new Date(e.title)) : r(e.title, e.xAxisFormat)), g = (l) => e.xAxisDateInterval === c.WEEKLY ? `
+      ${r(C(l), i)} -
+      ${r(F(l), i)}
+    ` : e.xAxisDateInterval === c.MONTHLY ? `
+      ${r(I(l), i)} -
+      ${r(O(l), i)}
+    ` : r(l, i);
+    return (l, M) => (n(), f("div", E, [
+      A("div", N, [
+        a.totalsChart && t(o)?.image ? (n(), f("img", {
           key: 0,
           class: "title-image",
-          src: t(a)?.image
-        }, null, 8, T)) : i("", !0),
-        o.totalsChart && t(a)?.countryFlag ? (r(), n(t(k), {
+          src: t(o)?.image
+        }, null, 8, L)) : s("", !0),
+        a.totalsChart && t(o)?.countryFlag ? (n(), u(t(k), {
           key: 1,
-          "country-code": t(a).countryFlag
-        }, null, 8, ["country-code"])) : i("", !0),
-        o.totalsChart && t(a)?.icon ? (r(), n(t(C), {
+          "country-code": t(o).countryFlag
+        }, null, 8, ["country-code"])) : s("", !0),
+        a.totalsChart && t(o)?.icon ? (n(), u(t(T), {
           key: 2,
           class: "platform-icon",
-          type: t(a)?.iconType,
-          name: t(a)?.icon,
+          type: t(o)?.iconType,
+          name: t(o)?.icon,
           size: "16px"
-        }, null, 8, ["type", "name"])) : i("", !0),
-        F(t(f), {
+        }, null, 8, ["type", "name"])) : s("", !0),
+        D(t(y), {
           class: "title-text",
           variant: "subtitle2"
         }, {
-          default: c(() => [
-            u(m(t(y)), 1)
+          default: d(() => [
+            x(p(t(h)), 1)
           ]),
           _: 1
         })
       ]),
-      o.xAxisFormat === "date" ? (r(), n(t(f), {
+      a.xAxisFormat === "date" && a.xAxisDateInterval !== t(c).WEEKLY && a.xAxisDateInterval !== t(c).MONTHLY ? (n(), u(t(y), {
         key: 0,
         class: "tooltip-sub-title",
         variant: "caption"
       }, {
-        default: c(() => [
-          u(m(t(d)(o.title, t(x))), 1)
+        default: d(() => [
+          x(p(t(r)(a.title, "day")), 1)
         ]),
         _: 1
-      })) : i("", !0)
+      })) : s("", !0)
     ]));
   }
 });
 export {
-  D as default
+  P as default
 };

package/components/chart/consts.d.ts

@@ -1,4 +1,4 @@
-import { DropdownTypeOption, Font } from './types';
+import { DropdownTypeOption, Font, ValueFormat } from './types';
 export declare const POINT_BORDER_COLOR = "#fcfcfc";
 export declare const GRID_LINE_COLOR = "#E4E4E4";
 export declare const TICK_LABEL_COLOR = "#646464";
@@ -32,4 +32,5 @@ export declare const CHART_PADDING: {
     top: number;
     bottom: number;
 };
-export declare const TICKS_EXTRA_PADDING = 10;
+export declare const TICKS_EXTRA_PADDING = 6;
+export declare const LONG_DATE_FORMAT: ValueFormat;

package/components/chart/consts.js

@@ -7,17 +7,17 @@ const t = "#fcfcfc", n = "#E4E4E4", T = "#646464", o = {
   { id: _.Line, name: "Line" },
   { id: _.StackedLine, name: "Stack" },
   { id: _.Bar, name: "Bar" }
-], N = 76, I = 43, s = 312, L = 187, e = "__TOTALS_HELPER_KEY__", i = "___BASE_COLOR__", C = "Bidding", D = "ironSource", K = "UnityAds", P = "Meta", H = "Google", S = "Mintegral", B = "AppLovin", a = "InMobi", G = "DT Exchange", M = "Pangle", r = "Liftoff Monetize", W = 10, F = 70, f = {
+], N = 76, L = 43, s = 312, I = 187, e = "__TOTALS_HELPER_KEY__", D = "___BASE_COLOR__", i = "Bidding", C = "ironSource", K = "UnityAds", P = "Meta", H = "Google", S = "Mintegral", a = "AppLovin", B = "InMobi", G = "DT Exchange", M = "Pangle", r = "Liftoff Monetize", F = 10, W = 70, f = {
   left: 18,
   right: 18,
   top: 18,
   bottom: 11
-}, U = 10;
+}, d = 6, g = "dateLong";
 export {
-  i as BASE_COLOR_KEY,
-  C as BIDDING_PREFIX,
+  D as BASE_COLOR_KEY,
+  i as BIDDING_PREFIX,
   f as CHART_PADDING,
-  I as COMPACT_HEADER_HEIGHT,
+  L as COMPACT_HEADER_HEIGHT,
   s as DEFAULT_CHART_PLANE_HEIGHT,
   R as DEFAULT_MAX_VISIBLE,
   A as DEFAULT_MIN_VISIBLE,
@@ -25,21 +25,22 @@ export {
   c as DROPDOWN_TYPE_OPTIONS,
   n as GRID_LINE_COLOR,
   N as HEADER_HEIGHT,
-  F as HOVER_AREA_TRANSPARENCY,
-  W as HOVER_TRANSPARENCY,
-  L as MIN_PLANE_HEIGHT,
+  W as HOVER_AREA_TRANSPARENCY,
+  F as HOVER_TRANSPARENCY,
+  g as LONG_DATE_FORMAT,
+  I as MIN_PLANE_HEIGHT,
   H as NETWORK_AD_MOB,
-  B as NETWORK_APPLOVIN,
+  a as NETWORK_APPLOVIN,
   G as NETWORK_DT_EXCHANGE,
   P as NETWORK_FACEBOOK_META,
-  a as NETWORK_INMOBI,
-  D as NETWORK_IRON_SOURCE,
+  B as NETWORK_INMOBI,
+  C as NETWORK_IRON_SOURCE,
   r as NETWORK_LIFTOFF,
   S as NETWORK_MINTEGRAL,
   M as NETWORK_PANGLE,
   K as NETWORK_UNITY_ADS,
   t as POINT_BORDER_COLOR,
-  U as TICKS_EXTRA_PADDING,
+  d as TICKS_EXTRA_PADDING,
   T as TICK_LABEL_COLOR,
   o as TICK_LABEL_FONT,
   e as TOTALS_HELPER_KEY

package/components/chart/index.d.ts

@@ -17,9 +17,12 @@ declare const ChartTypes: () => ({
             chartType: ChartType;
             hideLegend: boolean;
             xAxisFormat: import("./types").ValueFormat;
+            xAxisDateInterval: import("./types").DateInterval;
             totalsChart: boolean;
             parsing: import("./types").ChartParsingConfig;
             yAxisFormat: import("./types").ValueFormat;
+            valueSuffix: string;
+            valuePrefix: string;
             dataSets: import("./types").ChartDataSet[];
             trendTooltip: any;
             subheader: string;
@@ -29,6 +32,7 @@ declare const ChartTypes: () => ({
             tickCount: number;
             truncateTickLabels: boolean;
             keepSubheaderVisible: boolean;
+            empty: boolean;
             noDataIcon: string;
             noDataTitle: string;
             noDataSubtitle: string;
@@ -89,6 +93,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<import("./types").ValueFormat>;
                 default: string;
             };
+            xAxisDateInterval: {
+                type: import("vue").PropType<import("./types").DateInterval>;
+                default: import("./types").DateInterval;
+            };
             totalsChart: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -101,6 +109,14 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<import("./types").ValueFormat>;
                 default: string;
             };
+            valueSuffix: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            valuePrefix: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
                 required: true;
@@ -145,6 +161,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            empty: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             noDataIcon: {
                 type: import("vue").PropType<string>;
                 default: string;
@@ -189,7 +209,7 @@ declare const ChartTypes: () => ({
             "onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
             "onUpdate:sortSelected"?: (sortOption: unknown) => any;
             "onUpdate:chartType"?: (chartType: ChartType) => any;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "totalsChart" | "parsing" | "yAxisFormat" | "dataSets" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "fullHeight" | "withSettingsHeader" | "extraCharts">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "sortSelected" | "sortOptions" | "sortOptionNameKey" | "chartType" | "hideLegend" | "xAxisFormat" | "xAxisDateInterval" | "totalsChart" | "parsing" | "yAxisFormat" | "valueSuffix" | "valuePrefix" | "dataSets" | "trendTooltip" | "subheader" | "subheaderTooltip" | "trendValue" | "trendDirection" | "tickCount" | "truncateTickLabels" | "keepSubheaderVisible" | "empty" | "noDataIcon" | "noDataTitle" | "noDataSubtitle" | "withAnimation" | "tooltipTotalType" | "tooltipTotalCalcFn" | "tooltipOrder" | "fullHeight" | "withSettingsHeader" | "extraCharts">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -253,6 +273,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<import("./types").ValueFormat>;
                 default: string;
             };
+            xAxisDateInterval: {
+                type: import("vue").PropType<import("./types").DateInterval>;
+                default: import("./types").DateInterval;
+            };
             totalsChart: {
                 type: import("vue").PropType<boolean>;
                 default: boolean;
@@ -265,6 +289,14 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<import("./types").ValueFormat>;
                 default: string;
             };
+            valueSuffix: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
+            valuePrefix: {
+                type: import("vue").PropType<string>;
+                default: string;
+            };
             dataSets: {
                 type: import("vue").PropType<import("./types").ChartDataSet[]>;
                 required: true;
@@ -309,6 +341,10 @@ declare const ChartTypes: () => ({
                 type: import("vue").PropType<boolean>;
                 default: boolean;
             };
+            empty: {
+                type: import("vue").PropType<boolean>;
+                default: boolean;
+            };
             noDataIcon: {
                 type: import("vue").PropType<string>;
                 default: string;
@@ -370,9 +406,12 @@ declare const ChartTypes: () => ({
             chartType: ChartType;
             hideLegend: boolean;
             xAxisFormat: import("./types").ValueFormat;
+            xAxisDateInterval: import("./types").DateInterval;
             totalsChart: boolean;
             parsing: import("./types").ChartParsingConfig;
             yAxisFormat: import("./types").ValueFormat;
+            valueSuffix: string;
+            valuePrefix: string;
             dataSets: import("./types").ChartDataSet[];
             trendTooltip: any;
             subheader: string;
@@ -382,6 +421,7 @@ declare const ChartTypes: () => ({
             tickCount: number;
             truncateTickLabels: boolean;
             keepSubheaderVisible: boolean;
+            empty: boolean;
             noDataIcon: string;
             noDataTitle: string;
             noDataSubtitle: string;
@@ -462,6 +502,10 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<import("./types").ValueFormat>;
             default: string;
         };
+        xAxisDateInterval: {
+            type: import("vue").PropType<import("./types").DateInterval>;
+            default: import("./types").DateInterval;
+        };
         totalsChart: {
             type: import("vue").PropType<boolean>;
             default: boolean;
@@ -474,6 +518,14 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<import("./types").ValueFormat>;
             default: string;
         };
+        valueSuffix: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
+        valuePrefix: {
+            type: import("vue").PropType<string>;
+            default: string;
+        };
         dataSets: {
             type: import("vue").PropType<import("./types").ChartDataSet[]>;
             required: true;
@@ -518,6 +570,10 @@ declare const ChartTypes: () => ({
             type: import("vue").PropType<boolean>;
             default: boolean;
         };
+        empty: {
+            type: import("vue").PropType<boolean>;
+            default: boolean;
+        };
         noDataIcon: {
             type: import("vue").PropType<string>;
             default: string;
@@ -616,6 +672,10 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<import("./types").ValueFormat>;
         default: string;
     };
+    xAxisDateInterval: {
+        type: import("vue").PropType<import("./types").DateInterval>;
+        default: import("./types").DateInterval;
+    };
     totalsChart: {
         type: import("vue").PropType<boolean>;
         default: boolean;
@@ -628,6 +688,14 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<import("./types").ValueFormat>;
         default: string;
     };
+    valueSuffix: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    valuePrefix: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     dataSets: {
         type: import("vue").PropType<import("./types").ChartDataSet[]>;
         required: true;
@@ -672,6 +740,10 @@ declare const ChartTypes: () => ({
         type: import("vue").PropType<boolean>;
         default: boolean;
     };
+    empty: {
+        type: import("vue").PropType<boolean>;
+        default: boolean;
+    };
     noDataIcon: {
         type: import("vue").PropType<string>;
         default: string;
@@ -733,9 +805,12 @@ declare const ChartTypes: () => ({
     chartType: ChartType;
     hideLegend: boolean;
     xAxisFormat: import("./types").ValueFormat;
+    xAxisDateInterval: import("./types").DateInterval;
     totalsChart: boolean;
     parsing: import("./types").ChartParsingConfig;
     yAxisFormat: import("./types").ValueFormat;
+    valueSuffix: string;
+    valuePrefix: string;
     dataSets: import("./types").ChartDataSet[];
     trendTooltip: any;
     subheader: string;
@@ -745,6 +820,7 @@ declare const ChartTypes: () => ({
     tickCount: number;
     truncateTickLabels: boolean;
     keepSubheaderVisible: boolean;
+    empty: boolean;
     noDataIcon: string;
     noDataTitle: string;
     noDataSubtitle: string;

package/components/chart/mockData.d.ts

@@ -6,6 +6,14 @@ export declare const SINGLE_DATASET_DATE: {
         value: number;
     }[];
 }[];
+export declare const SINGLE_DATASET_DATE_MONTHLY: {
+    id: string;
+    label: string;
+    data: {
+        date: string;
+        value: number;
+    }[];
+}[];
 export declare const SINGLE_DATASET_COUNTRY: {
     id: string;
     countryFlag: string;

package/components/chart/types.d.ts

@@ -8,6 +8,11 @@ export declare enum ChartType {
     StackedLine = "stackedLine",
     StackedBar = "stackedBar"
 }
+export declare enum DateInterval {
+    DAILY = "daily",
+    WEEKLY = "weekly",
+    MONTHLY = "monthly"
+}
 export type ChartDataRecord = Record<string, unknown>;
 export type ChartDataSet = {
     id: string | number;

package/components/chart/types.js

@@ -1,6 +1,7 @@
-var e = /* @__PURE__ */ ((a) => (a.Line = "line", a.Bar = "bar", a.StackedLine = "stackedLine", a.StackedBar = "stackedBar", a))(e || {}), n = /* @__PURE__ */ ((a) => (a.Legend = "legend", a.YAxis = "yAxis", a))(n || {}), r = /* @__PURE__ */ ((a) => (a.UP = "up", a.DOWN = "down", a.NEUTRAL = "right", a))(r || {});
+var e = /* @__PURE__ */ ((L) => (L.Line = "line", L.Bar = "bar", L.StackedLine = "stackedLine", L.StackedBar = "stackedBar", L))(e || {}), r = /* @__PURE__ */ ((L) => (L.DAILY = "daily", L.WEEKLY = "weekly", L.MONTHLY = "monthly", L))(r || {}), a = /* @__PURE__ */ ((L) => (L.Legend = "legend", L.YAxis = "yAxis", L))(a || {}), n = /* @__PURE__ */ ((L) => (L.UP = "up", L.DOWN = "down", L.NEUTRAL = "right", L))(n || {});
 export {
   e as ChartType,
-  n as TooltipOrder,
-  r as TrendDirection
+  r as DateInterval,
+  a as TooltipOrder,
+  n as TrendDirection
 };

package/components/chart/utils/utils.d.ts

@@ -1,4 +1,4 @@
 import { PrepareTicksLabelArgs, ValueFormat } from '@/components/chart/types';
 export declare const calcStepSize: (min: number, max: number, tickCount: number) => number;
-export declare const formatValue: (value: number | string, valueFormat: ValueFormat) => string;
+export declare const formatValue: (value: number | string | Date, valueFormat: ValueFormat) => string;
 export declare const prepareTickLabel: ({ label, format, availableSpace, truncate, }: PrepareTicksLabelArgs) => string | string[];

package/components/chart/utils/utils.js

@@ -1,27 +1,27 @@
 import { format as f } from "date-fns";
-import { TICK_LABEL_FONT as a } from "../consts.js";
-import { nFormatter as c } from "../../../utils/formatNumbers.js";
-import { truncateTextToFit as d } from "../../../utils/text.js";
-import { REGEX_LINEBREAK as m } from "../../../consts/regex.js";
+import { TICK_LABEL_FONT as c } from "../consts.js";
+import { nFormatter as d } from "../../../utils/formatNumbers.js";
+import { truncateTextToFit as E } from "../../../utils/text.js";
+import { REGEX_LINEBREAK as i } from "../../../consts/regex.js";
 const g = (r, t, e) => {
   if (e === 0)
     return 0;
   const n = t - r, o = n / e * 0.4;
   return (n + o) / e;
-}, E = (r, t) => t === "day" ? f(new Date(r), "EEEE") : t === "number" ? c(r) : t === "date" ? f(new Date(r), "MMM dd") : t === "dateLong" ? f(new Date(r), "MMM dd, yyyy") : String(r), w = ({
+}, a = (r, t) => t === "day" ? f(new Date(r), "EEEE") : t === "number" ? d(r) : t === "date" ? f(new Date(r), "MMM dd") : t === "dateLong" ? f(new Date(r), "MMM dd, yyyy") : String(r), w = ({
   label: r,
   format: t,
   availableSpace: e,
   truncate: n = !1
 }) => {
-  const s = m.test(r), o = (p) => {
-    const i = E(p, t);
-    return n ? d(i, a, e) : i;
+  const s = i.test(r), o = (p) => {
+    const m = a(p, t);
+    return n && e > 0 ? E(m, c, e) : m;
   };
-  return s ? r.split(m).map(o) : o(r);
+  return s ? r.split(i).map(o) : o(r);
 };
 export {
   g as calcStepSize,
-  E as formatValue,
+  a as formatValue,
   w as prepareTickLabel
 };

package/index.js

@@ -1,4 +1,4 @@
-import './AppTrigger.vue_vue_type_style_index_0_scoped_121aac8b_lang.css';
+import './IncludeExcludeOption.vue_vue_type_style_index_0_scoped_91bc7787_lang.css';
 import { AppTriggerTypes as eo } from "./components/appTrigger/index.js";
 import { AutocompleteDropdownTypes as mo } from "./components/autocompleteDropdown/index.js";
 import { MenuItemTypes as ao } from "./components/menuItem/index.js";