@ironsource/shared-ui 2.1.12-test.68 → 2.1.12-test.70

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/Chart.vue_vue_type_style_index_0_scoped_03771fa3_lang.css +1 -0
  2. package/ChartPlane.vue_vue_type_style_index_0_scoped_903fc6ae_lang.css +1 -0
  3. package/ChartTooltip.vue_vue_type_style_index_0_scoped_e53c6287_lang.css +1 -0
  4. package/TooltipHeader.vue_vue_type_style_index_0_scoped_3b15c693_lang.css +1 -0
  5. package/components/chart/Chart.vue.d.ts +26 -1
  6. package/components/chart/Chart.vue.js +4 -4
  7. package/components/chart/Chart.vue2.js +68 -56
  8. package/components/chart/ChartPlane.vue.d.ts +21 -1
  9. package/components/chart/ChartPlane.vue.js +4 -4
  10. package/components/chart/ChartPlane.vue2.js +152 -141
  11. package/components/chart/ChartStoryArgs.d.ts +20 -1
  12. package/components/chart/ChartTooltip.vue.d.ts +16 -1
  13. package/components/chart/ChartTooltip.vue.js +2 -2
  14. package/components/chart/ChartTooltip.vue2.js +33 -29
  15. package/components/chart/TooltipHeader.vue.d.ts +6 -1
  16. package/components/chart/TooltipHeader.vue.js +2 -2
  17. package/components/chart/TooltipHeader.vue2.js +37 -27
  18. package/components/chart/colorPalette.js +20 -20
  19. package/components/chart/composables/useChartHeight.d.ts +1 -1
  20. package/components/chart/composables/useChartHeight.js +16 -14
  21. package/components/chart/consts.d.ts +13 -12
  22. package/components/chart/consts.js +33 -32
  23. package/components/chart/index.d.ts +96 -1
  24. package/components/chart/mockData.d.ts +8 -0
  25. package/components/chart/types.d.ts +6 -0
  26. package/components/chart/types.js +4 -3
  27. package/components/chart/utils/utils.d.ts +1 -1
  28. package/components/chart/utils/utils.js +10 -10
  29. package/index.js +1 -1
  30. package/package.json +1 -1
  31. package/Chart.vue_vue_type_style_index_0_scoped_82f5b24e_lang.css +0 -1
  32. package/ChartPlane.vue_vue_type_style_index_0_scoped_5c80d8cd_lang.css +0 -1
  33. package/ChartTooltip.vue_vue_type_style_index_0_scoped_9e521454_lang.css +0 -1
  34. package/TooltipHeader.vue_vue_type_style_index_0_scoped_9f6cf389_lang.css +0 -1
@@ -1,44 +1,46 @@
1
- import "../../ChartPlane.vue_vue_type_style_index_0_scoped_5c80d8cd_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 p, createElementBlock as S, createVNode as ce, isRef as de, createSlots as ue, withCtx as pe, renderSlot as fe, createCommentVNode as A, createElementVNode as x, normalizeStyle as he, createBlock as L } from "vue";
2
- import { Chart as F, ArcElement as me, LineElement as ve, BarElement as ye, PointElement as Te, LineController as Ce, BarController as ge, PieController as be, ScatterController as ke, CategoryScale as Se, LinearScale as Ae, Filler as xe, Tooltip as Le } from "chart.js";
1
+ 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";
2
+ 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";
3
3
  import { HoverVerticalLine as Ee } from "./plugins/HoverVerticalLine.js";
4
- import { prepareTickLabel as Re, formatValue as Be, calcStepSize as Oe } from "./utils/utils.js";
5
- import { DEFAULT_TICK_COUNT as De, TOTALS_HELPER_KEY as _, BASE_COLOR_KEY as K, CHART_PADDING as E, 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 Ie, HOVER_AREA_TRANSPARENCY as Ne, HOVER_TRANSPARENCY as C } from "./consts.js";
6
- import { ChartType as c, TooltipOrder as G, TrendDirection as Pe } from "./types.js";
7
- import { useTooltipPosition as Fe } from "./composables/useTooltipPosition.js";
8
- import _e from "./ChartTooltip.vue.js";
9
- import { hexColorToRgba as f } from "../../utils/color.js";
10
- import { useChartValues as Ke } from "./composables/useChartValues.js";
11
- import Me from "./ChartHeader.vue.js";
12
- import { useMemoize as Ue, useVModel as ze } from "@vueuse/core";
13
- import Ge from "../emptyState/v4/EmptyStateV4.vue.js";
14
- import Ye from "./ChartLoader.vue.js";
15
- import { DEFAULT_CHART_COLOR as $e } from "./colorPalette.js";
16
- import { TotalType as Y, calculateTotal as We } from "../../utils/totals.js";
17
- import { isNullOrUndefined as Ze } from "../../utils/utils.js";
18
- import { storeOriginalDatasetColors as Xe, restoreOriginalDatasetColors as je } from "./utils/highlightUtils.js";
19
- const qe = { class: "chart-plane-container" }, Je = {
4
+ import { prepareTickLabel as Re, formatValue as Be, calcStepSize as De } from "./utils/utils.js";
5
+ 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";
6
+ import { ChartType as u, DateInterval as Fe, TooltipOrder as Y, TrendDirection as Ke } from "./types.js";
7
+ import { useTooltipPosition as Me } from "./composables/useTooltipPosition.js";
8
+ import Ue from "./ChartTooltip.vue.js";
9
+ import { hexColorToRgba as h } from "../../utils/color.js";
10
+ import { useChartValues as ze } from "./composables/useChartValues.js";
11
+ import Ye from "./ChartHeader.vue.js";
12
+ import { useMemoize as _e, useVModel as Ge } from "@vueuse/core";
13
+ import $e from "../emptyState/v4/EmptyStateV4.vue.js";
14
+ import We from "./ChartLoader.vue.js";
15
+ import { DEFAULT_CHART_COLOR as Ze } from "./colorPalette.js";
16
+ import { TotalType as _, calculateTotal as Xe } from "../../utils/totals.js";
17
+ import { isNullOrUndefined as je } from "../../utils/utils.js";
18
+ import { storeOriginalDatasetColors as qe, restoreOriginalDatasetColors as Je } from "./utils/highlightUtils.js";
19
+ const Qe = { class: "chart-plane-container" }, et = {
20
20
  key: 0,
21
21
  class: "header-wrapper"
22
- }, Qe = {
22
+ }, tt = {
23
23
  key: 1,
24
24
  class: "chart-plane"
25
- }, et = { class: "chart" }, Ct = /* @__PURE__ */ re({
25
+ }, at = { class: "chart" }, gt = /* @__PURE__ */ re({
26
26
  __name: "ChartPlane",
27
27
  props: {
28
28
  dataSets: { default: () => [] },
29
29
  visibleIds: { default: () => [] },
30
30
  highlightedId: { default: null },
31
- chartType: { default: c.Line },
31
+ chartType: { default: u.Line },
32
32
  parsing: { default: void 0 },
33
33
  xAxisFormat: { default: "string" },
34
34
  yAxisFormat: { default: "number" },
35
- tickCount: { default: De },
36
- truncateTickLabels: { type: Boolean, default: !0 },
35
+ xAxisDateInterval: { default: Fe.DAILY },
36
+ tickCount: { default: Oe },
37
+ truncateTickLabels: { type: Boolean, default: !1 },
37
38
  header: { default: "" },
38
39
  subheader: { default: "" },
39
40
  subheaderTooltip: { default: null },
40
41
  keepSubheaderVisible: { type: Boolean, default: !1 },
41
42
  loading: { type: Boolean, default: !1 },
43
+ empty: { type: Boolean, default: !1 },
42
44
  noDataIcon: { default: "file-search" },
43
45
  noDataTitle: { default: "No data to display" },
44
46
  noDataSubtitle: { default: "Search again with different filters" },
@@ -47,74 +49,76 @@ const qe = { class: "chart-plane-container" }, Je = {
47
49
  height: { default: "100%" },
48
50
  compactHeader: { type: Boolean, default: !1 },
49
51
  tooltipRespectsTopEdge: { type: Boolean, default: !0 },
50
- tooltipTotalType: { default: Y.Total },
51
- tooltipTotalCalcFn: { type: Function, default: We },
52
- tooltipOrder: { default: G.Legend },
52
+ tooltipTotalType: { default: _.Total },
53
+ tooltipTotalCalcFn: { type: Function, default: Xe },
54
+ tooltipOrder: { default: Y.Legend },
53
55
  trendValue: { default: null },
54
- trendDirection: { default: Pe.UP },
56
+ trendDirection: { default: Ke.UP },
55
57
  trendTooltip: { default: null },
56
58
  totalsChart: { type: Boolean, default: !1 },
57
- colorsMap: { default: () => ({}) }
59
+ colorsMap: { default: () => ({}) },
60
+ valueSuffix: { default: "" },
61
+ valuePrefix: { default: "" }
58
62
  },
59
63
  emits: ["update:chartType"],
60
- setup(o, { emit: $ }) {
61
- const t = o;
62
- ie((e) => ({
63
- "1ae03326": s(te),
64
- "42303d50": o.height
64
+ setup(o, { emit: G }) {
65
+ const e = o;
66
+ ie((t) => ({
67
+ d271311a: s(ee),
68
+ "6c5bc85e": o.height
65
69
  }));
66
- const W = Ue(Re);
67
- F.register(
70
+ const $ = _e(Re);
71
+ N.register(
68
72
  me,
69
73
  ve,
70
74
  ye,
71
75
  Te,
72
76
  Ce,
73
- ge,
74
77
  be,
78
+ ge,
79
+ xe,
75
80
  ke,
76
81
  Se,
77
82
  Ae,
78
- xe,
79
83
  Le,
80
84
  Ee
81
85
  );
82
- const g = ze(t, "chartType", $), Z = l(
83
- () => t.withAnimation ? "" : "none"
86
+ const b = Ge(e, "chartType", G), W = l(
87
+ () => e.withAnimation ? "" : "none"
84
88
  ), m = k(null);
85
89
  let n = null;
86
- const R = l(() => t.dataSets.length === 0), u = l(() => !t.loading && !R.value), b = () => {
87
- m.value && (n && n.destroy(), n = new F(m.value, V.value));
88
- }, X = () => {
89
- n && (n.data.datasets = H.value, n.options = V.value.options, n.update(Z.value));
90
+ const R = l(() => e.empty || e.dataSets.length === 0), d = l(() => !e.loading && !R.value), g = () => {
91
+ m.value && (n && n.destroy(), n = new N(m.value, I.value));
92
+ }, Z = () => {
93
+ n && (n.data.datasets = O.value, n.options = I.value.options, n.update(W.value));
90
94
  };
91
- ne(b), T(() => t.chartType, b), T(u, async (e) => {
92
- e && (await se(), b());
93
- }), T([() => t.visibleIds, () => t.dataSets], X);
94
- const h = l(() => t.totalsChart), v = l(
95
- () => t.chartType === c.StackedLine || t.chartType === c.StackedBar || h.value
96
- ), B = l(
97
- () => t.chartType === c.Line || t.chartType === c.StackedLine
98
- ), O = l(() => h.value && !t.parsing.xAxisKey ? { ...t.parsing, xAxisKey: _ } : t.parsing), j = l(() => h.value ? t.dataSets.map((e) => ({
99
- ...e,
100
- data: e.data.map((i) => ({
95
+ ne(g), T(() => e.chartType, g), T(d, async (t) => {
96
+ t && (await se(), g());
97
+ }), T([() => e.visibleIds, () => e.dataSets], Z);
98
+ const p = l(() => e.totalsChart), v = l(
99
+ () => e.chartType === u.StackedLine || e.chartType === u.StackedBar || p.value
100
+ ), x = l(
101
+ () => e.chartType === u.Line || e.chartType === u.StackedLine
102
+ ), B = l(() => p.value && !e.parsing.xAxisKey ? { ...e.parsing, xAxisKey: F } : e.parsing), X = l(() => p.value ? e.dataSets.map((t) => ({
103
+ ...t,
104
+ data: t.data.map((i) => ({
101
105
  ...i,
102
- [_]: e.label
106
+ [F]: t.label
103
107
  }))
104
- })) : t.dataSets), y = l(
105
- () => j.value.filter((e) => t.visibleIds.includes(e.id))
106
- ), q = (e) => t.colorsMap[e] || $e, D = l(
108
+ })) : e.dataSets), y = l(
109
+ () => X.value.filter((t) => e.visibleIds.includes(t.id))
110
+ ), j = (t) => e.colorsMap[t] || Ze, D = l(
107
111
  () => y.value.length && y.value.every(
108
- (e) => e.data.length === 1
112
+ (t) => t.data.length === 1
109
113
  )
110
- ), H = l(() => y.value.map((e, i) => {
111
- const a = q(e.id), r = v.value ? i !== 0 ? "-1" : "start" : void 0;
114
+ ), O = l(() => y.value.map((t, i) => {
115
+ const a = j(t.id), r = v.value ? i !== 0 ? "-1" : "start" : void 0;
112
116
  return {
113
- ...e,
117
+ ...t,
114
118
  fill: r,
115
- backgroundColor: f(
119
+ backgroundColor: h(
116
120
  a,
117
- t.chartType === c.StackedLine ? 10 : 70
121
+ e.chartType === u.StackedLine ? 10 : 70
118
122
  ),
119
123
  borderColor: a,
120
124
  pointBackgroundColor: a,
@@ -122,51 +126,51 @@ const qe = { class: "chart-plane-container" }, Je = {
122
126
  maxBarThickness: 50,
123
127
  clip: 5,
124
128
  // draw a bit outside the chart area
125
- icon: e.icon || null,
126
- iconType: e.iconType || "branded",
129
+ icon: t.icon || null,
130
+ iconType: t.iconType || "branded",
127
131
  [K]: a
128
132
  // store base color for later use
129
133
  };
130
- })), J = l(
131
- () => t.tooltipTotalType === Y.Total ? "Total" : "Mean"
132
- ), V = l(() => ({
133
- type: t.chartType == c.Bar || t.chartType === c.StackedBar ? "bar" : "line",
134
+ })), q = l(
135
+ () => e.tooltipTotalType === _.Total ? "Total" : "Mean"
136
+ ), I = l(() => ({
137
+ type: e.chartType == u.Bar || e.chartType === u.StackedBar ? "bar" : "line",
134
138
  // Chart Data
135
139
  data: {
136
- datasets: H.value
140
+ datasets: O.value
137
141
  },
138
142
  // Chart Options
139
143
  options: {
140
- parsing: O.value,
144
+ parsing: B.value,
141
145
  interaction: {
142
146
  intersect: !1,
143
- mode: h.value ? "point" : "index",
147
+ mode: p.value ? "point" : "index",
144
148
  axis: "x"
145
149
  },
146
150
  // plugins
147
151
  plugins: {
148
152
  legend: { display: !1 },
149
153
  title: { display: !1 },
150
- hoverVerticalLine: B.value,
154
+ hoverVerticalLine: x.value,
151
155
  // tooltip
152
156
  tooltip: {
153
157
  enabled: !1,
154
158
  position: "average",
155
- external: ({ tooltip: e }) => {
156
- d.value = { ...e };
159
+ external: ({ tooltip: t }) => {
160
+ c.value = { ...t };
157
161
  },
158
162
  callbacks: {
159
- footer: (e) => {
160
- const i = e.map((r) => r.parsed.y || 0), a = t.tooltipTotalCalcFn(
163
+ footer: (t) => {
164
+ const i = t.map((r) => r.parsed.y || 0), a = e.tooltipTotalCalcFn(
161
165
  i,
162
- t.tooltipTotalType
166
+ e.tooltipTotalType
163
167
  );
164
- return [J.value, String(a)];
168
+ return [q.value, String(a)];
165
169
  }
166
170
  },
167
- itemSort: (e, i) => {
168
- if (t.tooltipOrder === G.YAxis) {
169
- const a = e.parsed.y || 0, r = i.parsed.y || 0;
171
+ itemSort: (t, i) => {
172
+ if (e.tooltipOrder === Y.YAxis) {
173
+ const a = t.parsed.y || 0, r = i.parsed.y || 0;
170
174
  return a === r ? 0 : a > r ? -1 : 1;
171
175
  }
172
176
  return 0;
@@ -177,7 +181,7 @@ const qe = { class: "chart-plane-container" }, Je = {
177
181
  responsive: !0,
178
182
  maintainAspectRatio: !1,
179
183
  layout: {
180
- padding: E
184
+ padding: Ie
181
185
  },
182
186
  // basic styles
183
187
  elements: {
@@ -201,7 +205,7 @@ const qe = { class: "chart-plane-container" }, Je = {
201
205
  // Horizontal Axis (X)
202
206
  x: {
203
207
  beginAtZero: !0,
204
- offset: !B.value || D.value,
208
+ offset: !x.value || D.value,
205
209
  border: { display: !1 },
206
210
  stacked: v.value,
207
211
  // stack on top of each other
@@ -210,13 +214,16 @@ const qe = { class: "chart-plane-container" }, Je = {
210
214
  color: M,
211
215
  font: U,
212
216
  padding: 4,
213
- callback: function(e, i, a) {
214
- const r = this.getLabelForValue(e), le = this.chart.width / a.length - (E.left + E.right + Ve);
215
- return W({
217
+ maxRotation: 0,
218
+ autoSkip: !e.truncateTickLabels,
219
+ autoSkipPadding: 8,
220
+ callback: function(t, i, a) {
221
+ const r = this.getLabelForValue(t), oe = x.value && !p.value ? a.length - 1 : a.length, le = this.chart.scales?.x?.width / oe - Ve;
222
+ return $({
216
223
  label: r,
217
- format: t.xAxisFormat,
224
+ format: e.xAxisFormat,
218
225
  availableSpace: le,
219
- truncate: t.truncateTickLabels
226
+ truncate: e.truncateTickLabels
220
227
  });
221
228
  }
222
229
  },
@@ -242,9 +249,9 @@ const qe = { class: "chart-plane-container" }, Je = {
242
249
  font: U,
243
250
  padding: 8,
244
251
  stepSize: P.value,
245
- min: N.value,
246
- max: P.value * t.tickCount,
247
- callback: (e) => Be(e, t.yAxisFormat)
252
+ min: w.value,
253
+ max: P.value * e.tickCount,
254
+ callback: (t) => Be(t, e.yAxisFormat)
248
255
  },
249
256
  // grid lines
250
257
  grid: {
@@ -255,96 +262,100 @@ const qe = { class: "chart-plane-container" }, Je = {
255
262
  }
256
263
  }
257
264
  }
258
- })), w = k(null), d = k(null), { position: I } = Fe(
265
+ })), H = k(null), c = k(null), { position: V } = Me(
259
266
  m,
260
- w,
261
- d,
262
- t.tooltipRespectsTopEdge
263
- ), Q = l(() => ({
264
- left: `${I.value.left}px`,
265
- top: `${I.value.top}px`,
266
- opacity: d.value?.opacity || 0
267
- })), { minValue: N, maxValue: ee } = Ke({
268
- parsingConfig: O.value,
267
+ H,
268
+ c,
269
+ e.tooltipRespectsTopEdge
270
+ ), J = l(() => ({
271
+ left: `${V.value.left}px`,
272
+ top: `${V.value.top}px`,
273
+ opacity: c.value?.opacity || 0
274
+ })), { minValue: w, maxValue: Q } = ze({
275
+ parsingConfig: B.value,
269
276
  dataSets: y,
270
277
  isStacked: v
271
278
  }), P = l(
272
- () => Oe(N.value, ee.value, t.tickCount)
273
- ), te = l(
274
- () => (t.compactHeader ? Ie : we) + "px"
279
+ () => De(w.value, Q.value, e.tickCount)
280
+ ), ee = l(
281
+ () => (e.compactHeader ? Pe : we) + "px"
275
282
  );
276
283
  T(
277
- () => t.highlightedId,
278
- (e) => {
279
- n && (Ze(e) ? oe() : ae(e), n.update());
284
+ () => e.highlightedId,
285
+ (t) => {
286
+ n && (je(t) ? ae() : te(t), n.update());
280
287
  }
281
288
  );
282
- const ae = (e) => {
289
+ const te = (t) => {
283
290
  (n?.data.datasets || []).forEach((a) => {
284
- Xe(a);
291
+ qe(a);
285
292
  const r = a[K];
286
- a.id === e ? t.chartType === c.StackedLine && (a.backgroundColor = f(
293
+ a.id === t ? e.chartType === u.StackedLine && (a.backgroundColor = h(
287
294
  r,
288
295
  Ne
289
- )) : (a.backgroundColor = f(r, C), a.borderColor = f(r, C), a.pointBackgroundColor = f(r, C), a.pointHoverBorderColor = f(r, C));
296
+ )) : (a.backgroundColor = h(r, C), a.borderColor = h(r, C), a.pointBackgroundColor = h(r, C), a.pointHoverBorderColor = h(r, C));
290
297
  });
291
- }, oe = () => {
292
- (n?.data.datasets || []).forEach(je);
298
+ }, ae = () => {
299
+ (n?.data.datasets || []).forEach(Je);
293
300
  };
294
- return (e, i) => (p(), S("div", qe, [
295
- s(u) || o.keepSubheaderVisible ? (p(), S("div", Je, [
296
- ce(Me, {
297
- "chart-type": s(g),
298
- "onUpdate:chart-type": i[0] || (i[0] = (a) => de(g) ? g.value = a : null),
299
- "type-switcher": s(u) ? o.typeSwitcher : !1,
300
- header: s(u) ? o.header : null,
301
+ return (t, i) => (f(), S("div", Qe, [
302
+ s(d) || o.keepSubheaderVisible ? (f(), S("div", et, [
303
+ ue(Ye, {
304
+ "chart-type": s(b),
305
+ "onUpdate:chart-type": i[0] || (i[0] = (a) => ce(b) ? b.value = a : null),
306
+ "type-switcher": s(d) ? o.typeSwitcher : !1,
307
+ header: s(d) ? o.header : null,
301
308
  subheader: o.subheader,
302
309
  "subheader-tooltip": o.subheaderTooltip,
303
310
  "trend-tooltip": o.trendTooltip,
304
311
  compact: o.compactHeader,
305
- "trend-value": s(u) ? o.trendValue : null,
312
+ "trend-value": s(d) ? o.trendValue : null,
306
313
  "trend-direction": o.trendDirection
307
- }, ue({ _: 2 }, [
308
- e.$slots["subheader-tooltip"] ? {
314
+ }, de({ _: 2 }, [
315
+ t.$slots["subheader-tooltip"] ? {
309
316
  name: "subheader-tooltip",
310
317
  fn: pe(() => [
311
- fe(e.$slots, "subheader-tooltip", {}, void 0, !0)
318
+ fe(t.$slots, "subheader-tooltip", {}, void 0, !0)
312
319
  ]),
313
320
  key: "0"
314
321
  } : void 0
315
322
  ]), 1032, ["chart-type", "type-switcher", "header", "subheader", "subheader-tooltip", "trend-tooltip", "compact", "trend-value", "trend-direction"])
316
323
  ])) : A("", !0),
317
- s(u) ? (p(), S("section", Qe, [
318
- x("div", et, [
319
- x("canvas", {
324
+ s(d) ? (f(), S("section", tt, [
325
+ L("div", at, [
326
+ L("canvas", {
320
327
  ref_key: "chartRef",
321
328
  ref: m,
322
329
  class: "chart__canvas"
323
330
  }, null, 512),
324
- x("div", {
331
+ L("div", {
325
332
  ref_key: "tooltipRef",
326
- ref: w,
333
+ ref: H,
327
334
  class: "chart__tooltip",
328
- style: he(s(Q))
335
+ style: he(s(J))
329
336
  }, [
330
- d.value ? (p(), L(_e, {
337
+ c.value ? (f(), E(Ue, {
331
338
  key: 0,
332
- "totals-chart": s(h),
333
- title: String(d.value.title),
334
- "data-points": d.value.dataPoints,
339
+ "totals-chart": s(p),
340
+ title: String(c.value.title),
341
+ "data-points": c.value.dataPoints,
335
342
  "x-axis-format": o.xAxisFormat,
336
343
  "y-axis-format": o.yAxisFormat,
337
- "total-label": d.value.footer?.[0],
338
- "total-value": Number(d.value.footer?.[1])
339
- }, null, 8, ["totals-chart", "title", "data-points", "x-axis-format", "y-axis-format", "total-label", "total-value"])) : A("", !0)
344
+ "x-axis-date-interval": o.xAxisDateInterval,
345
+ "total-label": c.value.footer?.[0],
346
+ "total-value": Number(c.value.footer?.[1]),
347
+ "value-suffix": o.valueSuffix,
348
+ "value-prefix": o.valuePrefix
349
+ }, 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)
340
350
  ], 4)
341
351
  ])
342
- ])) : o.loading ? (p(), L(Ye, {
352
+ ])) : o.loading ? (f(), E(We, {
343
353
  key: 2,
344
354
  class: "chart-loading"
345
- })) : s(R) ? (p(), L(s(Ge), {
355
+ })) : s(R) ? (f(), E(s($e), {
346
356
  key: 3,
347
357
  class: "chart-empty",
358
+ variant: null,
348
359
  title: o.noDataTitle,
349
360
  subtitle: o.noDataSubtitle,
350
361
  "icon-name": o.noDataIcon
@@ -353,5 +364,5 @@ const qe = { class: "chart-plane-container" }, Je = {
353
364
  }
354
365
  });
355
366
  export {
356
- Ct as default
367
+ gt as default
357
368
  };
@@ -1,4 +1,4 @@
1
- import { ChartType, TooltipOrder, TrendDirection } from '@/components/chart/types';
1
+ import { ChartType, DateInterval, TooltipOrder, TrendDirection } from '@/components/chart/types';
2
2
  export declare const chartStoryArgs: {
3
3
  chartType: {
4
4
  control: {
@@ -17,6 +17,10 @@ export declare const chartStoryArgs: {
17
17
  options: string[];
18
18
  description: string;
19
19
  };
20
+ xAxisDateInterval: {
21
+ options: DateInterval[];
22
+ description: string;
23
+ };
20
24
  parsing: {
21
25
  description: string;
22
26
  };
@@ -112,6 +116,12 @@ export declare const chartStoryArgs: {
112
116
  type: string;
113
117
  };
114
118
  };
119
+ empty: {
120
+ description: string;
121
+ control: {
122
+ type: string;
123
+ };
124
+ };
115
125
  withAnimation: {
116
126
  control: {
117
127
  type: string;
@@ -132,6 +142,15 @@ export declare const chartStoryArgs: {
132
142
  type: string;
133
143
  };
134
144
  };
145
+ fullHeightBottomSpacing: {
146
+ table: {
147
+ category: string;
148
+ };
149
+ description: string;
150
+ control: {
151
+ type: string;
152
+ };
153
+ };
135
154
  withSettingsHeader: {
136
155
  table: {
137
156
  category: string;
@@ -1,44 +1,59 @@
1
- import { MyTooltipItem, ValueFormat } from '@/components/chart/types';
1
+ import { DateInterval, MyTooltipItem, ValueFormat } from '@/components/chart/types';
2
2
  declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
3
3
  title?: string;
4
4
  dataPoints: MyTooltipItem<'line'>[];
5
5
  xAxisFormat?: ValueFormat;
6
6
  yAxisFormat?: ValueFormat;
7
+ xAxisDateInterval?: DateInterval;
7
8
  totalLabel?: string;
8
9
  totalValue?: number;
9
10
  totalsChart?: boolean;
11
+ valueSuffix?: string;
12
+ valuePrefix?: string;
10
13
  }>, {
11
14
  title: string;
12
15
  dataPoints: () => any[];
13
16
  xAxisFormat: any;
14
17
  yAxisFormat: any;
18
+ xAxisDateInterval: any;
15
19
  totalLabel: string;
16
20
  totalValue: any;
17
21
  totalsChart: boolean;
22
+ valueSuffix: string;
23
+ valuePrefix: string;
18
24
  }>, {}, 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<{
19
25
  title?: string;
20
26
  dataPoints: MyTooltipItem<'line'>[];
21
27
  xAxisFormat?: ValueFormat;
22
28
  yAxisFormat?: ValueFormat;
29
+ xAxisDateInterval?: DateInterval;
23
30
  totalLabel?: string;
24
31
  totalValue?: number;
25
32
  totalsChart?: boolean;
33
+ valueSuffix?: string;
34
+ valuePrefix?: string;
26
35
  }>, {
27
36
  title: string;
28
37
  dataPoints: () => any[];
29
38
  xAxisFormat: any;
30
39
  yAxisFormat: any;
40
+ xAxisDateInterval: any;
31
41
  totalLabel: string;
32
42
  totalValue: any;
33
43
  totalsChart: boolean;
44
+ valueSuffix: string;
45
+ valuePrefix: string;
34
46
  }>>>, {
35
47
  title: string;
36
48
  xAxisFormat: ValueFormat;
49
+ xAxisDateInterval: DateInterval;
37
50
  dataPoints: MyTooltipItem<'line'>[];
38
51
  totalsChart: boolean;
39
52
  yAxisFormat: ValueFormat;
40
53
  totalLabel: string;
41
54
  totalValue: number;
55
+ valueSuffix: string;
56
+ valuePrefix: string;
42
57
  }>;
43
58
  export default _default;
44
59
  type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
@@ -1,7 +1,7 @@
1
1
  import o from "./ChartTooltip.vue2.js";
2
2
  /* empty css */import t from "../../_virtual/_plugin-vue_export-helper.js";
3
- // import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_9e521454_lang.css"; //*');
4
- const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-9e521454"]]);
3
+ // import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_e53c6287_lang.css"; //*');
4
+ const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-e53c6287"]]);
5
5
  export {
6
6
  s as default
7
7
  };