@ironsource/shared-ui 2.1.11-rc.29 → 2.1.11-rc.32
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.
- package/Chart.vue_vue_type_style_index_0_scoped_b6e14d9b_lang.css +1 -0
- package/ChartHeader.vue_vue_type_style_index_0_scoped_088fa9b9_lang.css +1 -0
- package/ChartLegend.vue_vue_type_style_index_0_scoped_f00a9b1f_lang.css +1 -0
- package/ChartTooltip.vue_vue_type_style_index_0_scoped_6744325c_lang.css +1 -0
- package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_2aee12ad_lang.css +1 -0
- package/components/chart/Chart.vue.d.ts +11 -3
- package/components/chart/Chart.vue.js +3 -3
- package/components/chart/Chart.vue2.js +108 -96
- package/components/chart/ChartHeader.vue.d.ts +13 -6
- package/components/chart/ChartHeader.vue.js +3 -3
- package/components/chart/ChartHeader.vue2.js +32 -29
- package/components/chart/ChartLegend.vue.d.ts +5 -0
- package/components/chart/ChartLegend.vue.js +2 -2
- package/components/chart/ChartLegend.vue2.js +93 -50
- package/components/chart/ChartTooltip.vue.d.ts +4 -5
- package/components/chart/ChartTooltip.vue.js +2 -2
- package/components/chart/ChartTooltip.vue2.js +64 -43
- package/components/chart/index.d.ts +36 -16
- package/components/chart/mockData.d.ts +15 -2
- package/components/chart/types.d.ts +15 -1
- package/components/chart/utils/utils.js +5 -5
- package/components/dropdown/v4/ConditionalDropdown.vue.d.ts +0 -10
- package/components/dropdown/v4/ConditionalDropdown.vue.js +4 -4
- package/components/dropdown/v4/ConditionalDropdown.vue2.js +69 -74
- package/components/dropdown/v4/index.d.ts +0 -18
- package/index.d.ts +0 -36
- package/index.js +1 -1
- package/package.json +1 -1
- package/Chart.vue_vue_type_style_index_0_scoped_8f471697_lang.css +0 -1
- package/ChartHeader.vue_vue_type_style_index_0_scoped_4c37736e_lang.css +0 -1
- package/ChartLegend.vue_vue_type_style_index_0_scoped_c0f71a49_lang.css +0 -1
- package/ChartTooltip.vue_vue_type_style_index_0_scoped_ec636f18_lang.css +0 -1
- package/ConditionalDropdown.vue_vue_type_style_index_0_scoped_4a67037a_lang.css +0 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import e from "./ChartLegend.vue2.js";
|
|
2
2
|
/* empty css */import o from "../../_virtual/_plugin-vue_export-helper.js";
|
|
3
|
-
// import "../../ChartLegend.
|
|
4
|
-
const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-
|
|
3
|
+
// import "../../ChartLegend.vue_vue_type_style_index_0_scoped_f00a9b1f_lang.css"; //*');
|
|
4
|
+
const a = /* @__PURE__ */ o(e, [["__scopeId", "data-v-f00a9b1f"]]);
|
|
5
5
|
export {
|
|
6
6
|
a as default
|
|
7
7
|
};
|
|
@@ -1,72 +1,115 @@
|
|
|
1
|
-
import "../../ChartLegend.
|
|
2
|
-
import { useVirtualList as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import { DEFAULT_MIN_VISIBLE as
|
|
7
|
-
|
|
1
|
+
import "../../ChartLegend.vue_vue_type_style_index_0_scoped_f00a9b1f_lang.css"; import { defineComponent as N, ref as S, computed as p, openBlock as c, createElementBlock as u, createElementVNode as a, createVNode as n, unref as l, mergeProps as x, Fragment as U, renderList as M, normalizeClass as A, withCtx as m, createBlock as F, createCommentVNode as H, createTextVNode as _, toDisplayString as I } from "vue";
|
|
2
|
+
import { useVirtualList as P } from "@vueuse/core";
|
|
3
|
+
import L from "../typography/v4/Typography.vue.js";
|
|
4
|
+
import z from "../checkbox/v4/CheckboxV4.vue.js";
|
|
5
|
+
import R from "../search/v4/SearchV4.vue.js";
|
|
6
|
+
import { DEFAULT_MIN_VISIBLE as q, DEFAULT_MAX_VISIBLE as G } from "./consts.js";
|
|
7
|
+
import X from "../icon/v4/IconV4.vue.js";
|
|
8
|
+
import "../icon/v4/IconFlag.vue.js";
|
|
9
|
+
import $ from "../tooltip/v4/TooltipV4.vue.js";
|
|
10
|
+
const j = { class: "chart-legend" }, J = { class: "search-box" }, K = ["onClick"], O = { class: "item-wrapper" }, Q = { class: "label-container" }, ae = /* @__PURE__ */ N({
|
|
8
11
|
__name: "ChartLegend",
|
|
9
12
|
props: {
|
|
10
13
|
items: { default: () => [] },
|
|
11
14
|
visibleIds: { default: () => [] },
|
|
12
|
-
minVisible: { default:
|
|
13
|
-
maxVisible: { default:
|
|
15
|
+
minVisible: { default: q },
|
|
16
|
+
maxVisible: { default: G },
|
|
17
|
+
maxLimitTooltipText: { default: "" }
|
|
14
18
|
},
|
|
15
19
|
emits: ["update:visibleIds"],
|
|
16
|
-
setup(
|
|
17
|
-
const
|
|
18
|
-
const t =
|
|
19
|
-
return
|
|
20
|
-
(
|
|
20
|
+
setup(b, { emit: T }) {
|
|
21
|
+
const o = b, k = 32, d = S(""), C = p(() => {
|
|
22
|
+
const t = d.value.toLowerCase();
|
|
23
|
+
return o.items.filter(
|
|
24
|
+
(i) => i.label.toLowerCase().includes(t)
|
|
21
25
|
);
|
|
22
|
-
}),
|
|
23
|
-
() =>
|
|
24
|
-
),
|
|
25
|
-
() =>
|
|
26
|
-
),
|
|
27
|
-
|
|
26
|
+
}), s = (t) => o.visibleIds.includes(t.id), f = p(
|
|
27
|
+
() => o.visibleIds.length >= o.maxVisible
|
|
28
|
+
), g = p(
|
|
29
|
+
() => o.visibleIds.length <= o.minVisible
|
|
30
|
+
), r = (t) => g.value && s(t) || f.value && !s(t), V = (t) => !o.maxLimitTooltipText || s(t) || !f.value, h = (t, i) => {
|
|
31
|
+
T(
|
|
28
32
|
"update:visibleIds",
|
|
29
|
-
t ? [...
|
|
33
|
+
t ? [...o.visibleIds, i.id] : o.visibleIds.filter((e) => e !== i.id)
|
|
30
34
|
);
|
|
31
|
-
}, { list:
|
|
32
|
-
itemHeight:
|
|
35
|
+
}, { list: y, containerProps: E, wrapperProps: w } = P(C, {
|
|
36
|
+
itemHeight: k,
|
|
33
37
|
overscan: 10
|
|
34
|
-
})
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
38
|
+
}), B = (t) => {
|
|
39
|
+
r(t) || h(!s(t), t);
|
|
40
|
+
};
|
|
41
|
+
return (t, i) => (c(), u("div", j, [
|
|
42
|
+
a("div", J, [
|
|
43
|
+
n(l(R), {
|
|
44
|
+
modelValue: d.value,
|
|
45
|
+
"onUpdate:modelValue": i[0] || (i[0] = (e) => d.value = e)
|
|
40
46
|
}, null, 8, ["modelValue"])
|
|
41
47
|
]),
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
(
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
"is-truncated": "",
|
|
54
|
-
class: "legend-label",
|
|
55
|
-
"with-tooltip": "",
|
|
56
|
-
"tooltip-text": e.label,
|
|
57
|
-
"tooltip-placement": "top"
|
|
48
|
+
a("div", x({ class: "legend" }, l(E)), [
|
|
49
|
+
a("ul", x({ class: "legend__list" }, l(w)), [
|
|
50
|
+
(c(!0), u(U, null, M(l(y), ({ data: e, index: D }) => (c(), u("li", {
|
|
51
|
+
key: D,
|
|
52
|
+
class: A({ "disabled-item": r(e) }),
|
|
53
|
+
onClick: (v) => B(e)
|
|
54
|
+
}, [
|
|
55
|
+
n(l($), {
|
|
56
|
+
text: b.maxLimitTooltipText,
|
|
57
|
+
disabled: V(e),
|
|
58
|
+
class: "disabled-tooltip"
|
|
58
59
|
}, {
|
|
59
|
-
default:
|
|
60
|
-
|
|
60
|
+
default: m(() => [
|
|
61
|
+
a("div", O, [
|
|
62
|
+
n(l(z), {
|
|
63
|
+
color: e.color,
|
|
64
|
+
"is-checked": s(e),
|
|
65
|
+
disabled: r(e),
|
|
66
|
+
"onUpdate:isChecked": (v) => h(v, e)
|
|
67
|
+
}, null, 8, ["color", "is-checked", "disabled", "onUpdate:isChecked"]),
|
|
68
|
+
e.icon ? (c(), F(l(X), {
|
|
69
|
+
key: 0,
|
|
70
|
+
class: "icon-color",
|
|
71
|
+
type: e.iconType,
|
|
72
|
+
name: e.icon,
|
|
73
|
+
size: "16px"
|
|
74
|
+
}, null, 8, ["type", "name"])) : H("", !0),
|
|
75
|
+
a("div", Q, [
|
|
76
|
+
n(l(L), {
|
|
77
|
+
variant: "body2",
|
|
78
|
+
class: "legend-label",
|
|
79
|
+
"is-truncated": "",
|
|
80
|
+
"with-tooltip": "",
|
|
81
|
+
"tooltip-text": e.label,
|
|
82
|
+
"tooltip-placement": "left"
|
|
83
|
+
}, {
|
|
84
|
+
default: m(() => [
|
|
85
|
+
_(I(e.label), 1)
|
|
86
|
+
]),
|
|
87
|
+
_: 2
|
|
88
|
+
}, 1032, ["tooltip-text"]),
|
|
89
|
+
n(l(L), {
|
|
90
|
+
variant: "caption",
|
|
91
|
+
class: "legend-caption legend-label",
|
|
92
|
+
"is-truncated": "",
|
|
93
|
+
"with-tooltip": "",
|
|
94
|
+
"tooltip-text": e.caption,
|
|
95
|
+
"tooltip-placement": "left"
|
|
96
|
+
}, {
|
|
97
|
+
default: m(() => [
|
|
98
|
+
_(I(e.caption), 1)
|
|
99
|
+
]),
|
|
100
|
+
_: 2
|
|
101
|
+
}, 1032, ["tooltip-text"])
|
|
102
|
+
])
|
|
103
|
+
])
|
|
61
104
|
]),
|
|
62
105
|
_: 2
|
|
63
|
-
}, 1032, ["
|
|
64
|
-
]))), 128))
|
|
106
|
+
}, 1032, ["text", "disabled"])
|
|
107
|
+
], 10, K))), 128))
|
|
65
108
|
], 16)
|
|
66
109
|
], 16)
|
|
67
110
|
]));
|
|
68
111
|
}
|
|
69
112
|
});
|
|
70
113
|
export {
|
|
71
|
-
|
|
114
|
+
ae as default
|
|
72
115
|
};
|
|
@@ -1,8 +1,7 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { ValueFormat } from '@/components/chart/types';
|
|
1
|
+
import { MyTooltipItem, ValueFormat } from '@/components/chart/types';
|
|
3
2
|
declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
4
3
|
title?: string;
|
|
5
|
-
dataPoints:
|
|
4
|
+
dataPoints: MyTooltipItem<'line'>[];
|
|
6
5
|
xAxisFormat?: ValueFormat;
|
|
7
6
|
yAxisFormat?: ValueFormat;
|
|
8
7
|
totalLabel?: string;
|
|
@@ -16,7 +15,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
16
15
|
totalValue: any;
|
|
17
16
|
}>, {}, 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<{
|
|
18
17
|
title?: string;
|
|
19
|
-
dataPoints:
|
|
18
|
+
dataPoints: MyTooltipItem<'line'>[];
|
|
20
19
|
xAxisFormat?: ValueFormat;
|
|
21
20
|
yAxisFormat?: ValueFormat;
|
|
22
21
|
totalLabel?: string;
|
|
@@ -30,7 +29,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
30
29
|
totalValue: any;
|
|
31
30
|
}>>>, {
|
|
32
31
|
title: string;
|
|
33
|
-
dataPoints:
|
|
32
|
+
dataPoints: MyTooltipItem<'line'>[];
|
|
34
33
|
xAxisFormat: ValueFormat;
|
|
35
34
|
yAxisFormat: ValueFormat;
|
|
36
35
|
totalLabel: string;
|
|
@@ -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.
|
|
4
|
-
const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-
|
|
3
|
+
// import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_6744325c_lang.css"; //*');
|
|
4
|
+
const s = /* @__PURE__ */ t(o, [["__scopeId", "data-v-6744325c"]]);
|
|
5
5
|
export {
|
|
6
6
|
s as default
|
|
7
7
|
};
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
-
import "../../ChartTooltip.
|
|
2
|
-
import
|
|
3
|
-
import { formatValue as
|
|
4
|
-
|
|
1
|
+
import "../../ChartTooltip.vue_vue_type_style_index_0_scoped_6744325c_lang.css"; import { defineComponent as b, computed as x, openBlock as l, createElementBlock as c, createVNode as o, unref as t, withCtx as r, createTextVNode as i, toDisplayString as s, createCommentVNode as m, createElementVNode as f, Fragment as v, renderList as F, normalizeStyle as h, createBlock as g } from "vue";
|
|
2
|
+
import n from "../typography/v4/Typography.vue.js";
|
|
3
|
+
import { formatValue as d } from "./utils/utils.js";
|
|
4
|
+
import k from "../icon/v4/IconV4.vue.js";
|
|
5
|
+
import "../icon/v4/IconFlag.vue.js";
|
|
6
|
+
const A = { class: "chart-tooltip" }, V = {
|
|
5
7
|
key: 0,
|
|
8
|
+
class: "tooltip-title-wrapper"
|
|
9
|
+
}, C = { class: "list" }, T = { class: "popover-label-wrapper" }, _ = {
|
|
10
|
+
key: 1,
|
|
6
11
|
class: "tooltip-footer"
|
|
7
|
-
},
|
|
12
|
+
}, I = /* @__PURE__ */ b({
|
|
8
13
|
__name: "ChartTooltip",
|
|
9
14
|
props: {
|
|
10
15
|
title: { default: "" },
|
|
@@ -14,68 +19,84 @@ const F = { class: "chart-tooltip" }, V = { class: "tooltip-title" }, p = { clas
|
|
|
14
19
|
totalLabel: { default: "Total" },
|
|
15
20
|
totalValue: { default: null }
|
|
16
21
|
},
|
|
17
|
-
setup(
|
|
18
|
-
const
|
|
19
|
-
return (
|
|
20
|
-
|
|
21
|
-
t
|
|
22
|
-
|
|
23
|
-
|
|
22
|
+
setup(e) {
|
|
23
|
+
const u = e, y = x(() => u.xAxisFormat === "date" ? "dateLong" : u.xAxisFormat), p = x(() => u.xAxisFormat === "date" ? "day" : u.xAxisFormat);
|
|
24
|
+
return (w, B) => (l(), c("div", A, [
|
|
25
|
+
e.title ? (l(), c("div", V, [
|
|
26
|
+
o(t(n), { variant: "subtitle2" }, {
|
|
27
|
+
default: r(() => [
|
|
28
|
+
i(s(t(d)(e.title, t(y))), 1)
|
|
29
|
+
]),
|
|
30
|
+
_: 1
|
|
31
|
+
}),
|
|
32
|
+
o(t(n), {
|
|
33
|
+
class: "tooltip-sub-title",
|
|
34
|
+
variant: "caption"
|
|
24
35
|
}, {
|
|
25
|
-
default:
|
|
26
|
-
|
|
36
|
+
default: r(() => [
|
|
37
|
+
i(s(t(d)(e.title, t(p))), 1)
|
|
27
38
|
]),
|
|
28
39
|
_: 1
|
|
29
|
-
})
|
|
30
|
-
]),
|
|
31
|
-
|
|
32
|
-
(
|
|
33
|
-
key:
|
|
40
|
+
})
|
|
41
|
+
])) : m("", !0),
|
|
42
|
+
f("ul", C, [
|
|
43
|
+
(l(!0), c(v, null, F(e.dataPoints, (a) => (l(), c("li", {
|
|
44
|
+
key: a.datasetIndex,
|
|
34
45
|
class: "list__item"
|
|
35
46
|
}, [
|
|
36
|
-
|
|
47
|
+
f("span", {
|
|
37
48
|
class: "color-box",
|
|
38
|
-
style:
|
|
39
|
-
backgroundColor: String(
|
|
49
|
+
style: h({
|
|
50
|
+
backgroundColor: String(a.dataset.pointBackgroundColor)
|
|
40
51
|
})
|
|
41
52
|
}, null, 4),
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
class: "
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
53
|
+
a.dataset.icon ? (l(), g(t(k), {
|
|
54
|
+
key: 0,
|
|
55
|
+
class: "platform-icon",
|
|
56
|
+
type: a.dataset.iconType,
|
|
57
|
+
name: a.dataset.icon,
|
|
58
|
+
size: "16px"
|
|
59
|
+
}, null, 8, ["type", "name"])) : m("", !0),
|
|
60
|
+
f("div", T, [
|
|
61
|
+
o(t(n), {
|
|
62
|
+
variant: "body2",
|
|
63
|
+
class: "flex-grow truncated-label",
|
|
64
|
+
"is-truncated": ""
|
|
65
|
+
}, {
|
|
66
|
+
default: r(() => [
|
|
67
|
+
i(s(a.dataset.label), 1)
|
|
68
|
+
]),
|
|
69
|
+
_: 2
|
|
70
|
+
}, 1024)
|
|
71
|
+
]),
|
|
72
|
+
o(t(n), { variant: "body2" }, {
|
|
73
|
+
default: r(() => [
|
|
74
|
+
i(s(t(d)(a.parsed.y, e.yAxisFormat)), 1)
|
|
54
75
|
]),
|
|
55
76
|
_: 2
|
|
56
77
|
}, 1024)
|
|
57
78
|
]))), 128))
|
|
58
79
|
]),
|
|
59
|
-
|
|
60
|
-
|
|
80
|
+
e.totalValue !== null ? (l(), c("div", _, [
|
|
81
|
+
o(t(n), {
|
|
61
82
|
variant: "body2",
|
|
62
83
|
class: "flex-grow"
|
|
63
84
|
}, {
|
|
64
|
-
default:
|
|
65
|
-
|
|
85
|
+
default: r(() => [
|
|
86
|
+
i(s(e.totalLabel), 1)
|
|
66
87
|
]),
|
|
67
88
|
_: 1
|
|
68
89
|
}),
|
|
69
|
-
|
|
70
|
-
default:
|
|
71
|
-
|
|
90
|
+
o(t(n), { variant: "body2" }, {
|
|
91
|
+
default: r(() => [
|
|
92
|
+
i(s(t(d)(e.totalValue, e.yAxisFormat)), 1)
|
|
72
93
|
]),
|
|
73
94
|
_: 1
|
|
74
95
|
})
|
|
75
|
-
])) :
|
|
96
|
+
])) : m("", !0)
|
|
76
97
|
]));
|
|
77
98
|
}
|
|
78
99
|
});
|
|
79
100
|
export {
|
|
80
|
-
|
|
101
|
+
I as default
|
|
81
102
|
};
|
|
@@ -12,10 +12,11 @@ declare const ChartTypes: () => ({
|
|
|
12
12
|
visibleIds: unknown[];
|
|
13
13
|
minVisible: number;
|
|
14
14
|
maxVisible: number;
|
|
15
|
+
maxLimitTooltipText: string;
|
|
15
16
|
chartType: import("./types").ChartType;
|
|
16
17
|
withSettingsHeader: boolean;
|
|
17
18
|
subheader: string;
|
|
18
|
-
|
|
19
|
+
withSubheaderTooltip: boolean;
|
|
19
20
|
dataSets: import("./types").ChartDataSet[];
|
|
20
21
|
hideLegend: boolean;
|
|
21
22
|
tickCount: number;
|
|
@@ -56,6 +57,10 @@ declare const ChartTypes: () => ({
|
|
|
56
57
|
type: import("vue").PropType<number>;
|
|
57
58
|
default: number;
|
|
58
59
|
};
|
|
60
|
+
maxLimitTooltipText: {
|
|
61
|
+
type: import("vue").PropType<string>;
|
|
62
|
+
default: string;
|
|
63
|
+
};
|
|
59
64
|
chartType: {
|
|
60
65
|
type: import("vue").PropType<import("./types").ChartType>;
|
|
61
66
|
default: import("./types").ChartType;
|
|
@@ -68,9 +73,9 @@ declare const ChartTypes: () => ({
|
|
|
68
73
|
type: import("vue").PropType<string>;
|
|
69
74
|
default: string;
|
|
70
75
|
};
|
|
71
|
-
|
|
72
|
-
type: import("vue").PropType<
|
|
73
|
-
default:
|
|
76
|
+
withSubheaderTooltip: {
|
|
77
|
+
type: import("vue").PropType<boolean>;
|
|
78
|
+
default: boolean;
|
|
74
79
|
};
|
|
75
80
|
dataSets: {
|
|
76
81
|
type: import("vue").PropType<import("./types").ChartDataSet[]>;
|
|
@@ -100,7 +105,7 @@ declare const ChartTypes: () => ({
|
|
|
100
105
|
}>> & {
|
|
101
106
|
"onUpdate:visibleIds"?: (visibleIds: unknown[]) => any;
|
|
102
107
|
"onUpdate:chartType"?: (chartType: import("./types").ChartType) => any;
|
|
103
|
-
} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "xAxisFormat" | "yAxisFormat" | "parsing" | "visibleIds" | "minVisible" | "maxVisible" | "chartType" | "withSettingsHeader" | "subheader" | "
|
|
108
|
+
} & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "header" | "loading" | "xAxisFormat" | "yAxisFormat" | "parsing" | "visibleIds" | "minVisible" | "maxVisible" | "maxLimitTooltipText" | "chartType" | "withSettingsHeader" | "subheader" | "withSubheaderTooltip" | "dataSets" | "hideLegend" | "tickCount" | "noDataIcon" | "noDataTitle" | "noDataSubtitle">;
|
|
104
109
|
$attrs: {
|
|
105
110
|
[x: string]: unknown;
|
|
106
111
|
};
|
|
@@ -148,6 +153,10 @@ declare const ChartTypes: () => ({
|
|
|
148
153
|
type: import("vue").PropType<number>;
|
|
149
154
|
default: number;
|
|
150
155
|
};
|
|
156
|
+
maxLimitTooltipText: {
|
|
157
|
+
type: import("vue").PropType<string>;
|
|
158
|
+
default: string;
|
|
159
|
+
};
|
|
151
160
|
chartType: {
|
|
152
161
|
type: import("vue").PropType<import("./types").ChartType>;
|
|
153
162
|
default: import("./types").ChartType;
|
|
@@ -160,9 +169,9 @@ declare const ChartTypes: () => ({
|
|
|
160
169
|
type: import("vue").PropType<string>;
|
|
161
170
|
default: string;
|
|
162
171
|
};
|
|
163
|
-
|
|
164
|
-
type: import("vue").PropType<
|
|
165
|
-
default:
|
|
172
|
+
withSubheaderTooltip: {
|
|
173
|
+
type: import("vue").PropType<boolean>;
|
|
174
|
+
default: boolean;
|
|
166
175
|
};
|
|
167
176
|
dataSets: {
|
|
168
177
|
type: import("vue").PropType<import("./types").ChartDataSet[]>;
|
|
@@ -204,10 +213,11 @@ declare const ChartTypes: () => ({
|
|
|
204
213
|
visibleIds: unknown[];
|
|
205
214
|
minVisible: number;
|
|
206
215
|
maxVisible: number;
|
|
216
|
+
maxLimitTooltipText: string;
|
|
207
217
|
chartType: import("./types").ChartType;
|
|
208
218
|
withSettingsHeader: boolean;
|
|
209
219
|
subheader: string;
|
|
210
|
-
|
|
220
|
+
withSubheaderTooltip: boolean;
|
|
211
221
|
dataSets: import("./types").ChartDataSet[];
|
|
212
222
|
hideLegend: boolean;
|
|
213
223
|
tickCount: number;
|
|
@@ -268,6 +278,10 @@ declare const ChartTypes: () => ({
|
|
|
268
278
|
type: import("vue").PropType<number>;
|
|
269
279
|
default: number;
|
|
270
280
|
};
|
|
281
|
+
maxLimitTooltipText: {
|
|
282
|
+
type: import("vue").PropType<string>;
|
|
283
|
+
default: string;
|
|
284
|
+
};
|
|
271
285
|
chartType: {
|
|
272
286
|
type: import("vue").PropType<import("./types").ChartType>;
|
|
273
287
|
default: import("./types").ChartType;
|
|
@@ -280,9 +294,9 @@ declare const ChartTypes: () => ({
|
|
|
280
294
|
type: import("vue").PropType<string>;
|
|
281
295
|
default: string;
|
|
282
296
|
};
|
|
283
|
-
|
|
284
|
-
type: import("vue").PropType<
|
|
285
|
-
default:
|
|
297
|
+
withSubheaderTooltip: {
|
|
298
|
+
type: import("vue").PropType<boolean>;
|
|
299
|
+
default: boolean;
|
|
286
300
|
};
|
|
287
301
|
dataSets: {
|
|
288
302
|
type: import("vue").PropType<import("./types").ChartDataSet[]>;
|
|
@@ -350,6 +364,10 @@ declare const ChartTypes: () => ({
|
|
|
350
364
|
type: import("vue").PropType<number>;
|
|
351
365
|
default: number;
|
|
352
366
|
};
|
|
367
|
+
maxLimitTooltipText: {
|
|
368
|
+
type: import("vue").PropType<string>;
|
|
369
|
+
default: string;
|
|
370
|
+
};
|
|
353
371
|
chartType: {
|
|
354
372
|
type: import("vue").PropType<import("./types").ChartType>;
|
|
355
373
|
default: import("./types").ChartType;
|
|
@@ -362,9 +380,9 @@ declare const ChartTypes: () => ({
|
|
|
362
380
|
type: import("vue").PropType<string>;
|
|
363
381
|
default: string;
|
|
364
382
|
};
|
|
365
|
-
|
|
366
|
-
type: import("vue").PropType<
|
|
367
|
-
default:
|
|
383
|
+
withSubheaderTooltip: {
|
|
384
|
+
type: import("vue").PropType<boolean>;
|
|
385
|
+
default: boolean;
|
|
368
386
|
};
|
|
369
387
|
dataSets: {
|
|
370
388
|
type: import("vue").PropType<import("./types").ChartDataSet[]>;
|
|
@@ -406,10 +424,11 @@ declare const ChartTypes: () => ({
|
|
|
406
424
|
visibleIds: unknown[];
|
|
407
425
|
minVisible: number;
|
|
408
426
|
maxVisible: number;
|
|
427
|
+
maxLimitTooltipText: string;
|
|
409
428
|
chartType: import("./types").ChartType;
|
|
410
429
|
withSettingsHeader: boolean;
|
|
411
430
|
subheader: string;
|
|
412
|
-
|
|
431
|
+
withSubheaderTooltip: boolean;
|
|
413
432
|
dataSets: import("./types").ChartDataSet[];
|
|
414
433
|
hideLegend: boolean;
|
|
415
434
|
tickCount: number;
|
|
@@ -420,6 +439,7 @@ declare const ChartTypes: () => ({
|
|
|
420
439
|
$slots: {
|
|
421
440
|
metric?(_: {}): any;
|
|
422
441
|
breakdowns?(_: {}): any;
|
|
442
|
+
"subheader-tooltip"?(_: {}): any;
|
|
423
443
|
};
|
|
424
444
|
}))[];
|
|
425
445
|
export type { ChartType, ChartDataRecord, ChartDataSet, ChartParsingConfig, } from './types';
|
|
@@ -13,12 +13,25 @@ export declare const SINGLE_DATASET_COUNTRY: {
|
|
|
13
13
|
value: number;
|
|
14
14
|
}[];
|
|
15
15
|
}[];
|
|
16
|
-
export declare const MULTIPLE_DATASETS_DATE: {
|
|
16
|
+
export declare const MULTIPLE_DATASETS_DATE: ({
|
|
17
17
|
id: string;
|
|
18
18
|
label: string;
|
|
19
|
+
caption: string;
|
|
20
|
+
icon: string;
|
|
19
21
|
data: {
|
|
20
22
|
date: string;
|
|
21
23
|
value: number;
|
|
22
24
|
}[];
|
|
23
|
-
|
|
25
|
+
iconType?: undefined;
|
|
26
|
+
} | {
|
|
27
|
+
id: string;
|
|
28
|
+
label: string;
|
|
29
|
+
caption: string;
|
|
30
|
+
icon: string;
|
|
31
|
+
iconType: string;
|
|
32
|
+
data: {
|
|
33
|
+
date: string;
|
|
34
|
+
value: number;
|
|
35
|
+
}[];
|
|
36
|
+
})[];
|
|
24
37
|
export declare const generateMockData: (numSeries?: number) => any[];
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { Ref } from 'vue';
|
|
2
2
|
import { UseVirtualListItem } from '@vueuse/core';
|
|
3
|
+
import { IconTypes } from '../icon/v4/Icon.types';
|
|
4
|
+
import { ChartTypeRegistry, TooltipItem } from 'chart.js';
|
|
3
5
|
export declare enum ChartType {
|
|
4
6
|
Line = "line",
|
|
5
7
|
Bar = "bar",
|
|
@@ -11,18 +13,30 @@ export type ChartDataSet = {
|
|
|
11
13
|
id: string | number;
|
|
12
14
|
label: string;
|
|
13
15
|
data: ChartDataRecord[];
|
|
16
|
+
caption?: string;
|
|
14
17
|
color?: string;
|
|
18
|
+
icon?: string;
|
|
19
|
+
iconType?: IconTypes;
|
|
15
20
|
};
|
|
16
21
|
export type ChartParsingConfig = {
|
|
17
22
|
xAxisKey: string;
|
|
18
23
|
yAxisKey: string;
|
|
19
24
|
};
|
|
20
|
-
export type ValueFormat = 'date' | 'dateLong' | 'number' | 'percent' | 'string';
|
|
25
|
+
export type ValueFormat = 'date' | 'dateLong' | 'number' | 'percent' | 'string' | 'day';
|
|
21
26
|
export type LegendItem = {
|
|
22
27
|
id: string | number;
|
|
23
28
|
label: string;
|
|
29
|
+
caption?: string;
|
|
24
30
|
color?: string;
|
|
31
|
+
icon?: string;
|
|
32
|
+
iconType?: IconTypes;
|
|
25
33
|
};
|
|
34
|
+
export interface MyTooltipItem<T extends keyof ChartTypeRegistry = keyof ChartTypeRegistry> extends TooltipItem<T> {
|
|
35
|
+
dataset: {
|
|
36
|
+
icon?: string;
|
|
37
|
+
iconType?: IconTypes;
|
|
38
|
+
} & TooltipItem<T>['dataset'];
|
|
39
|
+
}
|
|
26
40
|
export type UseVirtualListResult = {
|
|
27
41
|
list: Ref<UseVirtualListItem<LegendItem>[]>;
|
|
28
42
|
containerProps: {
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { format as
|
|
2
|
-
import { formatNumber as
|
|
1
|
+
import { format as n } from "date-fns";
|
|
2
|
+
import { formatNumber as d } from "./formatNumber.js";
|
|
3
3
|
const p = (r, t, e) => {
|
|
4
4
|
if (e === 0)
|
|
5
5
|
return 0;
|
|
6
|
-
const
|
|
7
|
-
return (
|
|
8
|
-
}, M = (r, t) => t === "number" ?
|
|
6
|
+
const f = t - r, o = f / e * 0.4;
|
|
7
|
+
return (f + o) / e;
|
|
8
|
+
}, M = (r, t) => t === "day" ? n(new Date(r), "EEEE") : t === "number" ? d(r) : t === "date" ? n(new Date(r), "MMM dd") : t === "dateLong" ? n(new Date(r), "MMM dd, yyyy") : String(r);
|
|
9
9
|
export {
|
|
10
10
|
p as calcStepSize,
|
|
11
11
|
M as formatValue
|
|
@@ -17,8 +17,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
17
17
|
searchQuery?: string;
|
|
18
18
|
loadMoreFn?: () => Promise<void>;
|
|
19
19
|
infiniteLoading?: boolean;
|
|
20
|
-
fetchDataDebounceTime?: number;
|
|
21
|
-
autoFocusSearch?: boolean;
|
|
22
20
|
}>, {
|
|
23
21
|
label: string;
|
|
24
22
|
testId: string;
|
|
@@ -29,8 +27,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
29
27
|
searchQuery: string;
|
|
30
28
|
loadMoreFn: any;
|
|
31
29
|
infiniteLoading: boolean;
|
|
32
|
-
fetchDataDebounceTime: number;
|
|
33
|
-
autoFocusSearch: boolean;
|
|
34
30
|
}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
35
31
|
"update:selectedCondition": (value: SelectedCondition) => void;
|
|
36
32
|
"update:appliedSelections": (value: unknown) => void;
|
|
@@ -49,8 +45,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
49
45
|
searchQuery?: string;
|
|
50
46
|
loadMoreFn?: () => Promise<void>;
|
|
51
47
|
infiniteLoading?: boolean;
|
|
52
|
-
fetchDataDebounceTime?: number;
|
|
53
|
-
autoFocusSearch?: boolean;
|
|
54
48
|
}>, {
|
|
55
49
|
label: string;
|
|
56
50
|
testId: string;
|
|
@@ -61,8 +55,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
61
55
|
searchQuery: string;
|
|
62
56
|
loadMoreFn: any;
|
|
63
57
|
infiniteLoading: boolean;
|
|
64
|
-
fetchDataDebounceTime: number;
|
|
65
|
-
autoFocusSearch: boolean;
|
|
66
58
|
}>>> & {
|
|
67
59
|
onClear?: () => any;
|
|
68
60
|
"onUpdate:selectedCondition"?: (value: SelectedCondition) => any;
|
|
@@ -77,8 +69,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
|
|
|
77
69
|
minCharsToStart: number;
|
|
78
70
|
searchQuery: string;
|
|
79
71
|
loadMoreFn: () => Promise<void>;
|
|
80
|
-
fetchDataDebounceTime: number;
|
|
81
|
-
autoFocusSearch: boolean;
|
|
82
72
|
}>;
|
|
83
73
|
export default _default;
|
|
84
74
|
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|