@ironsource/shared-ui 2.1.12-rc.25 → 2.1.12-rc.26

package/ChartPlane.vue_vue_type_style_index_0_scoped_ff7e556e_lang.css

@@ -0,0 +1 @@
+.chart-plane-container[data-v-ff7e556e]{--headerHeight: var(--2f09324f);width:100%;height:var(--0d942f3a);position:relative}.header-wrapper[data-v-ff7e556e]{position:absolute;width:100%;height:var(--headerHeight);top:0;z-index:1}.chart-plane[data-v-ff7e556e]{padding-top:var(--headerHeight);height:100%}.chart-empty[data-v-ff7e556e]{background:var(--background-paper)}.chart[data-v-ff7e556e]{width:100%;height:100%;position:relative}.chart__canvas[data-v-ff7e556e]{width:100%;height:100%}.chart__tooltip[data-v-ff7e556e]{position:absolute;pointer-events:none;transition:all .1s ease;min-width:214px;max-width:270px;z-index:1}

package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_683b8a75_lang.css

@@ -0,0 +1 @@
+.custom-list-area[data-v-683b8a75]{color:var(--text-secondary);width:100%;text-align:center;box-sizing:border-box;padding:63px 10px}.inline-search[data-v-683b8a75]{width:100%}.contain-accept[data-v-683b8a75]{padding:6px 8px;margin-bottom:4px;cursor:pointer}.contain-accept[data-v-683b8a75]:hover{background-color:var(--action-hover);border-radius:.5rem}.contain-accept--query[data-v-683b8a75]{margin-left:4px;display:inline-flex;color:var(--primary-main)}

package/DataGrid.vue_vue_type_style_index_0_scoped_0963bb3c_lang.css

@@ -0,0 +1 @@
+.sticky[data-v-0963bb3c]{position:sticky}.table-container[data-v-0963bb3c]{width:100%;position:relative;display:flex;flex-direction:column}.table-header[data-v-0963bb3c]{display:flex;align-items:center;height:calc(var(--spacing-800) - 1px);border-bottom:1px solid var(--common-divider);background-color:var(--background-paper-elevation-0);position:sticky;left:0;padding:var(--spacing-300)}.table-header .table-title[data-v-0963bb3c]{display:flex;flex:1;align-items:center;justify-content:flex-start;height:100%;color:var(--text-primary)}.table-header .table-header-right[data-v-0963bb3c]{display:flex;align-items:center;height:100%}.table-header .search-wrapper[data-v-0963bb3c]{width:13.75rem}.table-header.isStickyHeader[data-v-0963bb3c]{z-index:calc(var(--63c838b5) + 3);top:0}.table-head-container[data-v-0963bb3c]{display:flex;align-items:center;white-space:nowrap;color:var(--text-primary)}.table-footer[data-v-0963bb3c]{color:var(--text-primary);background-color:var(--background-paper-elevation-0);padding:0 var(--spacing-300);display:flex;align-items:center;min-height:var(--spacing-600);border:1px solid var(--common-divider);border-radius:var(--border-radius-md);border-top-right-radius:0;border-top-left-radius:0}.table-body-wrapper[data-v-0963bb3c]{display:inline-table}.table-header-pre-search-content[data-v-0963bb3c]{margin-right:var(--spacing-100);display:flex;align-items:center}.table-header-actions[data-v-0963bb3c]{margin-left:var(--spacing-100);display:flex;align-items:center}.table-row[data-v-0963bb3c]{position:relative}.table-row.loading[data-v-0963bb3c]{opacity:.7}.table-row:not(.expanded):last-child>td[data-v-0963bb3c]{border-bottom:none}.table-row.expanded:last-child>.expanded-row[data-v-0963bb3c]{border-bottom:none}.expanded-row[data-v-0963bb3c]{grid-column:var(--8cc8612e);border-bottom:1px solid var(--common-divider);background-color:var(--background-default)}table[data-v-0963bb3c]{position:relative;display:block;overflow:auto;background:var(--background-paper-elevation-0);border:1px solid var(--common-divider);color:var(--text-primary);text-align:left;table-layout:fixed;width:100%;max-height:100%;border-radius:var(--border-radius-md);border-collapse:collapse;border-spacing:0}table.hasFooter[data-v-0963bb3c]{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom:none}table td[data-v-0963bb3c],table th[data-v-0963bb3c]{line-height:normal;padding:0 var(--spacing-200)}table td[data-v-0963bb3c]:first-of-type,table th[data-v-0963bb3c]:first-of-type{padding-left:var(--spacing-300)}table td[data-v-0963bb3c]:last-of-type,table th[data-v-0963bb3c]:last-of-type{padding-right:var(--spacing-300)}table td.expand-toggle-cell[data-v-0963bb3c],table th.expand-toggle-cell[data-v-0963bb3c]{padding-left:var(--spacing-150);padding-right:var(--spacing-75)}table>thead[data-v-0963bb3c]{border-bottom:none;z-index:calc(var(--63c838b5) + 1);display:inline-table;min-width:100%}table>thead>tr[data-v-0963bb3c]{color:var(--text-primary);border-bottom:1px solid var(--common-divider);height:var(--spacing-500);display:grid;grid-template-columns:var(--ec9ca7bc)}table>thead>tr>th[data-v-0963bb3c]{background:var(--background-paper-elevation-0);width:100%;display:flex;align-items:center;cursor:default}table>thead>tr>th.isSortable[data-v-0963bb3c]{cursor:pointer}table>thead>tr>td[data-v-0963bb3c]{display:flex;align-items:center}table>thead>tr>th.bordered[data-v-0963bb3c],table>thead>tr>td.bordered[data-v-0963bb3c]{border-right:1px solid var(--common-divider)}table>thead>tr>th.bordered.isStickyRight[data-v-0963bb3c],table>thead>tr>td.bordered.isStickyRight[data-v-0963bb3c]{border-right:none;border-left:1px solid var(--common-divider)}table>thead>tr>th.isTextRight[data-v-0963bb3c],table>thead>tr>td.isTextRight[data-v-0963bb3c]{justify-content:flex-end}table>thead.sticky[data-v-0963bb3c]{position:sticky;top:0;background:var(--background-default)}table>thead.isStickyHeader[data-v-0963bb3c]{z-index:calc(var(--63c838b5) + 2);top:calc(var(--spacing-800) - 1px)}table .totals-row[data-v-0963bb3c]{height:40px}table .totals-row[data-v-0963bb3c]:hover{background:var(--background-paper-elevation-1)}table>tbody[data-v-0963bb3c]{display:block}table>tbody>*>tr[data-v-0963bb3c]{background-color:var(--background-default);height:auto;display:grid;align-items:center;grid-template-columns:var(--ec9ca7bc)}table>tbody>*>tr:nth-of-type(2n)>td[data-v-0963bb3c]{background-color:var(--background-default)}table>tbody>*>tr:hover:not(.loading)>td[data-v-0963bb3c],table>tbody>*>tr.activeMenu>td[data-v-0963bb3c]{background-color:var(--background-paper-elevation-1)}table>tbody td[data-v-0963bb3c]{background-color:var(--background-default);border:none;min-width:0;display:flex;height:auto;width:100%;place-items:center;border-bottom:1px solid var(--common-divider);justify-content:start}table>tbody td.bordered[data-v-0963bb3c]{border-right:1px solid var(--common-divider)}table>tbody td.bordered.isStickyRight[data-v-0963bb3c]{border-right:none;border-left:1px solid var(--common-divider)}table>tbody td.isTextRight[data-v-0963bb3c]{justify-content:flex-end;text-align:right}.underlined[data-v-0963bb3c]{border-bottom:.0625rem dashed var(--default-outlined-border)}.underlined[data-v-0963bb3c]:hover{cursor:help}.section-container[data-v-0963bb3c]{left:0}.sections[data-v-0963bb3c]{display:flex}.section[data-v-0963bb3c]{padding:0 1.5rem;background:var(--background-default);left:0;height:32px;display:flex;align-items:flex-end;border-right:1px solid var(--common-divider)}.table-cell[data-v-0963bb3c]{width:100%}.empty-state[data-v-0963bb3c]{min-height:250px}.floating-row[data-v-0963bb3c]{display:flex;inset:0;pointer-events:none;position:absolute;z-index:calc(var(--63c838b5) + 1)}.floating-row *[data-v-0963bb3c-s]{pointer-events:auto}.bg[data-v-0963bb3c]{background:var(--background-default)}

package/DropdownV4.vue_vue_type_style_index_0_scoped_1f7f7f9c_lang.css

@@ -0,0 +1 @@
+.v-enter-active[data-v-1f7f7f9c],.v-leave-active[data-v-1f7f7f9c]{transition:opacity .25s ease}ol[data-v-1f7f7f9c],ul[data-v-1f7f7f9c],menu[data-v-1f7f7f9c]{list-style:none;margin:0;padding:0}.dropdown.full-width[data-v-1f7f7f9c],.dropdown.full-width .button__container[data-v-1f7f7f9c]{width:100%}.dropdown-list-wrapper[data-v-1f7f7f9c]{display:flex;flex-direction:column;padding:.5rem .5rem .25rem}.dropdown-list-wrapper--multi[data-v-1f7f7f9c]{padding:.5rem}.list-container--multi[data-v-1f7f7f9c]{margin-bottom:0}.inline-search .inline-search-wrapper[data-v-1f7f7f9c]{display:flex;gap:4px;padding-bottom:.25rem}.inline-search .inline-search-wrapper .search-container[data-v-1f7f7f9c]{width:100%}.inline-search .list-container[data-v-1f7f7f9c]{padding-top:0}.no-result-container[data-v-1f7f7f9c]{height:100%;display:flex;align-items:center;padding:.375rem .5rem;color:var(--text-disabled)}.no-result[data-v-1f7f7f9c]{color:var(--text-disabled);padding-left:.5rem}.list[data-v-1f7f7f9c]{outline:none;display:flex;flex-direction:column;width:100%;min-height:2rem}.list--multi[data-v-1f7f7f9c]{margin-bottom:.5rem;border-bottom-left-radius:0;border-bottom-right-radius:0}.list--with-conditions[data-v-1f7f7f9c]{min-height:0;margin-bottom:0}.image-slot[data-v-1f7f7f9c]{margin-right:.5rem}.actions-wrapper[data-v-1f7f7f9c]{display:flex;width:100%;padding:.5rem .5rem .5rem .125rem;padding-bottom:0;border-top:1px solid var(--common-divider);justify-content:space-between;margin-top:.25rem}.apply-button[data-v-1f7f7f9c]{margin-left:.5rem}

package/OptionV4.vue_vue_type_style_index_0_scoped_9560a062_lang.css

@@ -0,0 +1 @@
+.label[data-v-9560a062]{color:#41454d}.item-container[data-v-9560a062]{width:100%;display:flex;align-items:center;cursor:pointer;border-radius:var(--border-radius-lg);margin-bottom:.25rem;color:var(--text-primary);padding:6px 8px}.item-container--disabled[data-v-9560a062]{cursor:initial;color:var(--text-disabled)}.item-container[data-v-9560a062]:hover:not(.item-container--disabled){background-color:var(--action-hover)}.item-container--active[data-v-9560a062],.item-container[data-v-9560a062]:active{background-color:var(--action-selected)}.item-container:not(.item-container--multi).item-container--selected[data-v-9560a062]{background-color:var(--action-selected)}.subtitle[data-v-9560a062]{color:#7b838c;line-height:1rem}.clear-button[data-v-9560a062]{display:flex;padding:0 4px;color:#7b838c;align-items:center;height:auto;background-image:none;min-width:auto;border:none;background-color:transparent}.clear-button[data-v-9560a062]:hover{color:#3083ff}.item[data-v-9560a062]{width:100%;display:flex;gap:.5rem;align-items:center}.item--with-icon[data-v-9560a062],.item--multi[data-v-9560a062]{display:flex;flex-direction:row;align-items:center;justify-content:start}.item .image[data-v-9560a062]{width:20px;height:20px;flex:none}.item .image img[data-v-9560a062]{width:20px;height:20px;border-radius:4px}.item .flag[data-v-9560a062]{width:16px;height:16px}.item .flag img[data-v-9560a062]{width:16px;height:16px;border-radius:50%}.item .start-icon[data-v-9560a062],.item .end-icon[data-v-9560a062]{display:flex;color:var(--action-active)}.item .end-text-icon[data-v-9560a062]{display:inline-flex}.item .option-text[data-v-9560a062]{line-height:1.1875rem}.text-container[data-v-9560a062]{width:100%;text-overflow:ellipsis;overflow:hidden}.v4-tooltip.tooltip-option[data-v-9560a062]{display:block}.tooltip-option[data-v-9560a062] .container{width:100%}.app-trigger--icon[data-v-9560a062]{color:var(--action-active);transform:rotate(-90deg);transition:transform .2s}.app-trigger--icon.expanded[data-v-9560a062]{transform:rotate(0)}.option-warning[data-v-9560a062]{display:flex}.option-warning__icon[data-v-9560a062]{color:var(--warning-main)}.option-content[data-v-9560a062]{display:flex}.option-content[data-v-9560a062]:not(.option-content-vertical){gap:.5rem;align-items:center}.option-content-horizontal[data-v-9560a062]{justify-content:space-between;gap:.5rem}.option-content-vertical[data-v-9560a062]{flex-direction:column}.option-text .main-text[data-v-9560a062]{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left}.option-text .main-text .conditional-option-label[data-v-9560a062]{color:var(--text-secondary);display:inline-flex}.option-text .main-text .conditional-option-value[data-v-9560a062]{margin-left:4px;display:inline-flex;color:var(--primary-main)}.option-text .caption-text[data-v-9560a062]{color:var(--text-secondary)}.multiline-tooltip[data-v-9560a062]{display:flex;flex-direction:column}

package/SwitchV4.vue_vue_type_style_index_0_scoped_cd6621a7_lang.css

@@ -0,0 +1 @@
+.switch[data-v-cd6621a7]{position:relative;display:inline-flex;background:var(--default-main);border-radius:var(--border-radius-md);border:1px solid var(--default-outlined-border);overflow:hidden}.switch--variant-primary .option--selected[data-v-cd6621a7]{background:var(--primary-main-8-p)}.switch--variant-primary .option[data-v-cd6621a7]:hover{background:var(--primary-light)}.switch--variant-primary .option[data-v-cd6621a7]:hover .icon{color:var(--primary-main)}.switch--variant-default .option--selected[data-v-cd6621a7]{background:var(--action-selected)}.switch--variant-default .option--selected[data-v-cd6621a7] .icon{color:var(--text-primary)}.option[data-v-cd6621a7]{border-radius:0;padding:3px}.option-wrapper[data-v-cd6621a7]:not(:last-child){border-right:1px solid var(--default-outlined-border)}

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

@@ -201,12 +201,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     yAxisFormat: ValueFormat;
     valueSuffix: string;
     valuePrefix: string;
-    dataSets: ChartDataSet[];
     trendTooltip: any;
     subheader: string;
     subheaderTooltip: any;
     trendValue: string | number;
     trendDirection: TrendDirection;
+    dataSets: ChartDataSet[];
     tickCount: number;
     truncateTickLabels: boolean;
     keepSubheaderVisible: boolean;

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

@@ -172,13 +172,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     yAxisFormat: ValueFormat;
     valueSuffix: string;
     valuePrefix: string;
-    dataSets: ChartDataSet[];
     trendTooltip: any;
     subheader: string;
     subheaderTooltip: any;
     typeSwitcher: boolean;
     trendValue: string | number;
     trendDirection: TrendDirection;
+    dataSets: ChartDataSet[];
     tickCount: number;
     truncateTickLabels: boolean;
     keepSubheaderVisible: boolean;

package/components/chart/ChartPlane.vue.js

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

package/components/chart/ChartPlane.vue2.js

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