@sentropic/design-system-vue 0.18.0 → 0.20.0
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/dist/AppHeader.d.ts +53 -0
- package/dist/AppHeader.d.ts.map +1 -0
- package/dist/AppHeader.js +88 -0
- package/dist/AppHeader.js.map +1 -0
- package/dist/Avatar.d.ts +1 -1
- package/dist/AvatarGroup.d.ts +1 -1
- package/dist/CopyButton.d.ts +1 -1
- package/dist/GaugeChart.d.ts +1 -1
- package/dist/IdentityMenu.d.ts +119 -0
- package/dist/IdentityMenu.d.ts.map +1 -0
- package/dist/IdentityMenu.js +181 -0
- package/dist/IdentityMenu.js.map +1 -0
- package/dist/KpiCard.d.ts +1 -1
- package/dist/LanguageToggle.d.ts +82 -0
- package/dist/LanguageToggle.d.ts.map +1 -0
- package/dist/LanguageToggle.js +72 -0
- package/dist/LanguageToggle.js.map +1 -0
- package/dist/LollipopChart.d.ts +90 -0
- package/dist/LollipopChart.d.ts.map +1 -0
- package/dist/LollipopChart.js +254 -0
- package/dist/LollipopChart.js.map +1 -0
- package/dist/NumberInput.d.ts +1 -1
- package/dist/ParetoChart.d.ts +64 -0
- package/dist/ParetoChart.d.ts.map +1 -0
- package/dist/ParetoChart.js +212 -0
- package/dist/ParetoChart.js.map +1 -0
- package/dist/ProgressBar.d.ts +1 -1
- package/dist/Rating.d.ts +1 -1
- package/dist/Slider.d.ts +1 -1
- package/dist/TimePicker.d.ts +1 -1
- package/dist/index.d.ts +10 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +5 -0
- package/dist/index.js.map +1 -1
- package/dist/styles.css +564 -0
- package/package.json +2 -2
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import { defineComponent, h, ref } from "vue";
|
|
2
|
+
import { classNames } from "./classNames.js";
|
|
3
|
+
function ChevronDownIcon(open) {
|
|
4
|
+
return h("svg", {
|
|
5
|
+
width: 16,
|
|
6
|
+
height: 16,
|
|
7
|
+
viewBox: "0 0 24 24",
|
|
8
|
+
fill: "none",
|
|
9
|
+
stroke: "currentColor",
|
|
10
|
+
"stroke-width": 2,
|
|
11
|
+
"stroke-linecap": "round",
|
|
12
|
+
"stroke-linejoin": "round",
|
|
13
|
+
"aria-hidden": "true",
|
|
14
|
+
focusable: "false",
|
|
15
|
+
class: classNames("st-languageToggle__chevron", open && "st-languageToggle__chevron--open"),
|
|
16
|
+
}, [h("path", { d: "m6 9 6 6 6-6" })]);
|
|
17
|
+
}
|
|
18
|
+
export const LanguageToggle = defineComponent({
|
|
19
|
+
name: "LanguageToggle",
|
|
20
|
+
props: {
|
|
21
|
+
locale: { type: String, default: "fr" },
|
|
22
|
+
frLabel: { type: String, default: "FR" },
|
|
23
|
+
enLabel: { type: String, default: "EN" },
|
|
24
|
+
label: { type: String, default: "Langue" },
|
|
25
|
+
variant: { type: String, default: "select" },
|
|
26
|
+
accordionLabel: { type: String, default: "Langue" },
|
|
27
|
+
class: { type: String, default: undefined },
|
|
28
|
+
},
|
|
29
|
+
emits: ["localeChange"],
|
|
30
|
+
setup(props, { emit }) {
|
|
31
|
+
const open = ref(false);
|
|
32
|
+
const choose = (next) => emit("localeChange", next);
|
|
33
|
+
return () => {
|
|
34
|
+
if (props.variant === "accordion") {
|
|
35
|
+
return h("div", { class: classNames("st-languageToggle", props.class) }, [
|
|
36
|
+
h("button", {
|
|
37
|
+
type: "button",
|
|
38
|
+
class: "st-languageToggle__accordionTrigger",
|
|
39
|
+
"aria-expanded": open.value ? "true" : "false",
|
|
40
|
+
onClick: () => (open.value = !open.value),
|
|
41
|
+
}, [h("span", props.accordionLabel), ChevronDownIcon(open.value)]),
|
|
42
|
+
open.value
|
|
43
|
+
? h("div", { class: "st-languageToggle__accordionPanel" }, [
|
|
44
|
+
h("button", {
|
|
45
|
+
type: "button",
|
|
46
|
+
class: classNames("st-languageToggle__option", props.locale === "fr" && "st-languageToggle__option--active"),
|
|
47
|
+
"aria-current": props.locale === "fr" ? "true" : "false",
|
|
48
|
+
onClick: () => choose("fr"),
|
|
49
|
+
}, props.frLabel),
|
|
50
|
+
h("button", {
|
|
51
|
+
type: "button",
|
|
52
|
+
class: classNames("st-languageToggle__option", props.locale === "en" && "st-languageToggle__option--active"),
|
|
53
|
+
"aria-current": props.locale === "en" ? "true" : "false",
|
|
54
|
+
onClick: () => choose("en"),
|
|
55
|
+
}, props.enLabel),
|
|
56
|
+
])
|
|
57
|
+
: null,
|
|
58
|
+
]);
|
|
59
|
+
}
|
|
60
|
+
return h("select", {
|
|
61
|
+
class: classNames("st-languageToggle__select", props.class),
|
|
62
|
+
value: props.locale,
|
|
63
|
+
"aria-label": props.label,
|
|
64
|
+
onChange: (event) => choose(event.target.value),
|
|
65
|
+
}, [
|
|
66
|
+
h("option", { value: "fr" }, props.frLabel),
|
|
67
|
+
h("option", { value: "en" }, props.enLabel),
|
|
68
|
+
]);
|
|
69
|
+
};
|
|
70
|
+
},
|
|
71
|
+
});
|
|
72
|
+
//# sourceMappingURL=LanguageToggle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LanguageToggle.js","sourceRoot":"","sources":["../src/LanguageToggle.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
export type LollipopChartTone = "category1" | "category2" | "category3" | "category4" | "category5" | "category6" | "category7" | "category8";
|
|
2
|
+
export type LollipopChartDatum = {
|
|
3
|
+
label: string;
|
|
4
|
+
value: number;
|
|
5
|
+
tone?: LollipopChartTone;
|
|
6
|
+
};
|
|
7
|
+
export type LollipopChartProps = {
|
|
8
|
+
data: LollipopChartDatum[];
|
|
9
|
+
width?: number;
|
|
10
|
+
height?: number;
|
|
11
|
+
orientation?: "vertical" | "horizontal";
|
|
12
|
+
label: string;
|
|
13
|
+
/**
|
|
14
|
+
* Fixed value-axis domain `[min, max]`. When provided (and finite), the value
|
|
15
|
+
* scale uses it instead of the data-derived min/max — letting several
|
|
16
|
+
* LollipopCharts in a grid share one scale. When absent or invalid, the scale
|
|
17
|
+
* falls back to the auto data range (unchanged).
|
|
18
|
+
*/
|
|
19
|
+
domain?: [number, number];
|
|
20
|
+
class?: string;
|
|
21
|
+
};
|
|
22
|
+
export declare const LollipopChart: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
23
|
+
data: {
|
|
24
|
+
type: () => LollipopChartDatum[];
|
|
25
|
+
default: () => never[];
|
|
26
|
+
};
|
|
27
|
+
width: {
|
|
28
|
+
type: NumberConstructor;
|
|
29
|
+
default: number;
|
|
30
|
+
};
|
|
31
|
+
height: {
|
|
32
|
+
type: NumberConstructor;
|
|
33
|
+
default: number;
|
|
34
|
+
};
|
|
35
|
+
orientation: {
|
|
36
|
+
type: () => "vertical" | "horizontal";
|
|
37
|
+
default: string;
|
|
38
|
+
};
|
|
39
|
+
label: {
|
|
40
|
+
type: StringConstructor;
|
|
41
|
+
required: true;
|
|
42
|
+
};
|
|
43
|
+
domain: {
|
|
44
|
+
type: () => [number, number];
|
|
45
|
+
default: undefined;
|
|
46
|
+
};
|
|
47
|
+
class: {
|
|
48
|
+
type: StringConstructor;
|
|
49
|
+
default: undefined;
|
|
50
|
+
};
|
|
51
|
+
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
52
|
+
[key: string]: any;
|
|
53
|
+
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
54
|
+
data: {
|
|
55
|
+
type: () => LollipopChartDatum[];
|
|
56
|
+
default: () => never[];
|
|
57
|
+
};
|
|
58
|
+
width: {
|
|
59
|
+
type: NumberConstructor;
|
|
60
|
+
default: number;
|
|
61
|
+
};
|
|
62
|
+
height: {
|
|
63
|
+
type: NumberConstructor;
|
|
64
|
+
default: number;
|
|
65
|
+
};
|
|
66
|
+
orientation: {
|
|
67
|
+
type: () => "vertical" | "horizontal";
|
|
68
|
+
default: string;
|
|
69
|
+
};
|
|
70
|
+
label: {
|
|
71
|
+
type: StringConstructor;
|
|
72
|
+
required: true;
|
|
73
|
+
};
|
|
74
|
+
domain: {
|
|
75
|
+
type: () => [number, number];
|
|
76
|
+
default: undefined;
|
|
77
|
+
};
|
|
78
|
+
class: {
|
|
79
|
+
type: StringConstructor;
|
|
80
|
+
default: undefined;
|
|
81
|
+
};
|
|
82
|
+
}>> & Readonly<{}>, {
|
|
83
|
+
class: string;
|
|
84
|
+
data: LollipopChartDatum[];
|
|
85
|
+
width: number;
|
|
86
|
+
height: number;
|
|
87
|
+
orientation: "horizontal" | "vertical";
|
|
88
|
+
domain: [number, number];
|
|
89
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
90
|
+
//# sourceMappingURL=LollipopChart.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LollipopChart.d.ts","sourceRoot":"","sources":["../src/LollipopChart.ts"],"names":[],"mappings":"AAKA,MAAM,MAAM,iBAAiB,GACzB,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AAEhB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,EAAE,kBAAkB,EAAE,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAKF,eAAO,MAAM,aAAa;;cAGC,MAAM,kBAAkB,EAAE;;;;;;;;;;;;cAGlB,MAAM,UAAU,GAAG,YAAY;;;;;;;;cAE1B,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;;;;;;cALnC,MAAM,kBAAkB,EAAE;;;;;;;;;;;;cAGlB,MAAM,UAAU,GAAG,YAAY;;;;;;;;cAE1B,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;;;;;;;;;4EAyT5D,CAAC"}
|
|
@@ -0,0 +1,254 @@
|
|
|
1
|
+
import { defineComponent, h, ref } from "vue";
|
|
2
|
+
import { classNames } from "./classNames.js";
|
|
3
|
+
import { chartDataList, formatTick, niceTicks, scaleLinear } from "./chartScale.js";
|
|
4
|
+
import { contrastTextForTone } from "./chartContrast.js";
|
|
5
|
+
const MARGIN = { top: 12, right: 16, bottom: 32, left: 44 };
|
|
6
|
+
const DOT_RADIUS = 5;
|
|
7
|
+
export const LollipopChart = defineComponent({
|
|
8
|
+
name: "LollipopChart",
|
|
9
|
+
props: {
|
|
10
|
+
data: { type: Array, default: () => [] },
|
|
11
|
+
width: { type: Number, default: 480 },
|
|
12
|
+
height: { type: Number, default: 240 },
|
|
13
|
+
orientation: { type: String, default: "vertical" },
|
|
14
|
+
label: { type: String, required: true },
|
|
15
|
+
domain: { type: Array, default: undefined },
|
|
16
|
+
class: { type: String, default: undefined },
|
|
17
|
+
},
|
|
18
|
+
setup(props, { attrs }) {
|
|
19
|
+
const hoveredIndex = ref(null);
|
|
20
|
+
function handleLeave() {
|
|
21
|
+
hoveredIndex.value = null;
|
|
22
|
+
}
|
|
23
|
+
function handleVisualPointerMove(event) {
|
|
24
|
+
const target = event.target;
|
|
25
|
+
if (!(target instanceof Element)) {
|
|
26
|
+
hoveredIndex.value = null;
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
const index = Number(target.getAttribute("data-chart-index"));
|
|
30
|
+
hoveredIndex.value = Number.isInteger(index) ? index : null;
|
|
31
|
+
}
|
|
32
|
+
return () => {
|
|
33
|
+
const width = props.width ?? 480;
|
|
34
|
+
const height = props.height ?? 240;
|
|
35
|
+
const orientation = props.orientation ?? "vertical";
|
|
36
|
+
const label = props.label;
|
|
37
|
+
const data = props.data ?? [];
|
|
38
|
+
// Valid data: finite value.
|
|
39
|
+
const validData = data.filter((d) => Number.isFinite(d.value));
|
|
40
|
+
// A domain is honoured only when finite and ordered (min < max).
|
|
41
|
+
const domain = props.domain;
|
|
42
|
+
const validDomain = domain && Number.isFinite(domain[0]) && Number.isFinite(domain[1]) && domain[0] < domain[1]
|
|
43
|
+
? [domain[0], domain[1]]
|
|
44
|
+
: null;
|
|
45
|
+
const values = validData.map((d) => d.value);
|
|
46
|
+
const minRaw = validDomain ? validDomain[0] : Math.min(0, ...values);
|
|
47
|
+
const maxRaw = validDomain ? validDomain[1] : Math.max(0, ...values);
|
|
48
|
+
const ticks = niceTicks(minRaw, maxRaw, 5);
|
|
49
|
+
const domainMin = ticks[0];
|
|
50
|
+
const domainMax = ticks[ticks.length - 1];
|
|
51
|
+
const plotWidth = Math.max(width - MARGIN.left - MARGIN.right, 1);
|
|
52
|
+
const plotHeight = Math.max(height - MARGIN.top - MARGIN.bottom, 1);
|
|
53
|
+
let lollipops = [];
|
|
54
|
+
if (validData.length !== 0) {
|
|
55
|
+
if (orientation === "vertical") {
|
|
56
|
+
const band = plotWidth / validData.length;
|
|
57
|
+
const zeroY = scaleLinear(0, domainMin, domainMax, plotHeight, 0);
|
|
58
|
+
lollipops = validData.map((d, i) => {
|
|
59
|
+
const valueY = scaleLinear(d.value, domainMin, domainMax, plotHeight, 0);
|
|
60
|
+
const cx = MARGIN.left + band * (i + 0.5);
|
|
61
|
+
return {
|
|
62
|
+
datum: d,
|
|
63
|
+
tone: (d.tone ?? "category1"),
|
|
64
|
+
stemX1: cx,
|
|
65
|
+
stemY1: MARGIN.top + zeroY,
|
|
66
|
+
stemX2: cx,
|
|
67
|
+
stemY2: MARGIN.top + valueY,
|
|
68
|
+
cx,
|
|
69
|
+
cy: MARGIN.top + valueY,
|
|
70
|
+
labelX: cx,
|
|
71
|
+
labelY: height - MARGIN.bottom + 16,
|
|
72
|
+
};
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
else {
|
|
76
|
+
// horizontal
|
|
77
|
+
const band = plotHeight / validData.length;
|
|
78
|
+
const zeroX = scaleLinear(0, domainMin, domainMax, 0, plotWidth);
|
|
79
|
+
lollipops = validData.map((d, i) => {
|
|
80
|
+
const valueX = scaleLinear(d.value, domainMin, domainMax, 0, plotWidth);
|
|
81
|
+
const cy = MARGIN.top + band * (i + 0.5);
|
|
82
|
+
return {
|
|
83
|
+
datum: d,
|
|
84
|
+
tone: (d.tone ?? "category1"),
|
|
85
|
+
stemX1: MARGIN.left + zeroX,
|
|
86
|
+
stemY1: cy,
|
|
87
|
+
stemX2: MARGIN.left + valueX,
|
|
88
|
+
stemY2: cy,
|
|
89
|
+
cx: MARGIN.left + valueX,
|
|
90
|
+
cy,
|
|
91
|
+
labelX: MARGIN.left - 6,
|
|
92
|
+
labelY: cy,
|
|
93
|
+
};
|
|
94
|
+
});
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
const dataValueItems = validData.map((d) => `${d.label}: ${d.value}`);
|
|
98
|
+
const valueAxisTicks = ticks.map((tick) => {
|
|
99
|
+
if (orientation === "vertical") {
|
|
100
|
+
return {
|
|
101
|
+
value: tick,
|
|
102
|
+
x1: MARGIN.left,
|
|
103
|
+
x2: MARGIN.left + plotWidth,
|
|
104
|
+
y: MARGIN.top + scaleLinear(tick, domainMin, domainMax, plotHeight, 0),
|
|
105
|
+
x: undefined,
|
|
106
|
+
y1: undefined,
|
|
107
|
+
y2: undefined,
|
|
108
|
+
};
|
|
109
|
+
}
|
|
110
|
+
return {
|
|
111
|
+
value: tick,
|
|
112
|
+
x: MARGIN.left + scaleLinear(tick, domainMin, domainMax, 0, plotWidth),
|
|
113
|
+
y1: MARGIN.top,
|
|
114
|
+
y2: MARGIN.top + plotHeight,
|
|
115
|
+
x1: undefined,
|
|
116
|
+
x2: undefined,
|
|
117
|
+
y: undefined,
|
|
118
|
+
};
|
|
119
|
+
});
|
|
120
|
+
const svgChildren = [];
|
|
121
|
+
// gridlines + value axis ticks
|
|
122
|
+
for (const tick of valueAxisTicks) {
|
|
123
|
+
if (orientation === "vertical") {
|
|
124
|
+
svgChildren.push(h("line", {
|
|
125
|
+
key: `g${tick.value}`,
|
|
126
|
+
class: "st-lollipopChart__grid",
|
|
127
|
+
x1: tick.x1,
|
|
128
|
+
x2: tick.x2,
|
|
129
|
+
y1: tick.y,
|
|
130
|
+
y2: tick.y,
|
|
131
|
+
}), h("text", {
|
|
132
|
+
key: `t${tick.value}`,
|
|
133
|
+
class: "st-lollipopChart__tickLabel",
|
|
134
|
+
x: MARGIN.left - 6,
|
|
135
|
+
y: tick.y,
|
|
136
|
+
"text-anchor": "end",
|
|
137
|
+
"dominant-baseline": "middle",
|
|
138
|
+
}, formatTick(tick.value)));
|
|
139
|
+
}
|
|
140
|
+
else {
|
|
141
|
+
svgChildren.push(h("line", {
|
|
142
|
+
key: `g${tick.value}`,
|
|
143
|
+
class: "st-lollipopChart__grid",
|
|
144
|
+
x1: tick.x,
|
|
145
|
+
x2: tick.x,
|
|
146
|
+
y1: tick.y1,
|
|
147
|
+
y2: tick.y2,
|
|
148
|
+
}), h("text", {
|
|
149
|
+
key: `t${tick.value}`,
|
|
150
|
+
class: "st-lollipopChart__tickLabel",
|
|
151
|
+
x: tick.x,
|
|
152
|
+
y: height - MARGIN.bottom + 16,
|
|
153
|
+
"text-anchor": "middle",
|
|
154
|
+
}, formatTick(tick.value)));
|
|
155
|
+
}
|
|
156
|
+
}
|
|
157
|
+
// axes
|
|
158
|
+
svgChildren.push(h("line", {
|
|
159
|
+
class: "st-lollipopChart__axis",
|
|
160
|
+
x1: MARGIN.left,
|
|
161
|
+
x2: MARGIN.left,
|
|
162
|
+
y1: MARGIN.top,
|
|
163
|
+
y2: height - MARGIN.bottom,
|
|
164
|
+
}), h("line", {
|
|
165
|
+
class: "st-lollipopChart__axis",
|
|
166
|
+
x1: MARGIN.left,
|
|
167
|
+
x2: width - MARGIN.right,
|
|
168
|
+
y1: height - MARGIN.bottom,
|
|
169
|
+
y2: height - MARGIN.bottom,
|
|
170
|
+
}));
|
|
171
|
+
// category labels
|
|
172
|
+
for (const pop of lollipops) {
|
|
173
|
+
if (orientation === "vertical") {
|
|
174
|
+
svgChildren.push(h("text", {
|
|
175
|
+
key: `cat-${pop.datum.label}`,
|
|
176
|
+
class: "st-lollipopChart__categoryLabel",
|
|
177
|
+
x: pop.labelX,
|
|
178
|
+
y: pop.labelY,
|
|
179
|
+
"text-anchor": "middle",
|
|
180
|
+
}, pop.datum.label));
|
|
181
|
+
}
|
|
182
|
+
else {
|
|
183
|
+
svgChildren.push(h("text", {
|
|
184
|
+
key: `cat-${pop.datum.label}`,
|
|
185
|
+
class: "st-lollipopChart__categoryLabel",
|
|
186
|
+
x: pop.labelX,
|
|
187
|
+
y: pop.labelY,
|
|
188
|
+
"text-anchor": "end",
|
|
189
|
+
"dominant-baseline": "middle",
|
|
190
|
+
}, pop.datum.label));
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
// stems + dots + value labels (decorative, inside aria-hidden SVG)
|
|
194
|
+
for (let i = 0; i < lollipops.length; i++) {
|
|
195
|
+
const pop = lollipops[i];
|
|
196
|
+
svgChildren.push(h("line", {
|
|
197
|
+
key: `stem-${pop.datum.label}`,
|
|
198
|
+
class: "st-lollipopChart__stem",
|
|
199
|
+
x1: pop.stemX1,
|
|
200
|
+
y1: pop.stemY1,
|
|
201
|
+
x2: pop.stemX2,
|
|
202
|
+
y2: pop.stemY2,
|
|
203
|
+
}), h("circle", {
|
|
204
|
+
key: `dot-${pop.datum.label}`,
|
|
205
|
+
class: `st-lollipopChart__dot st-lollipopChart__dot--${pop.tone}`,
|
|
206
|
+
cx: pop.cx,
|
|
207
|
+
cy: pop.cy,
|
|
208
|
+
r: DOT_RADIUS,
|
|
209
|
+
"data-chart-index": i,
|
|
210
|
+
}), h("text", {
|
|
211
|
+
key: `val-${pop.datum.label}`,
|
|
212
|
+
class: "st-lollipopChart__valueLabel",
|
|
213
|
+
x: pop.cx,
|
|
214
|
+
y: orientation === "vertical" ? pop.cy - DOT_RADIUS - 4 : pop.cy,
|
|
215
|
+
dx: orientation === "vertical" ? 0 : DOT_RADIUS + 4,
|
|
216
|
+
"text-anchor": orientation === "vertical" ? "middle" : "start",
|
|
217
|
+
"dominant-baseline": orientation === "vertical" ? "auto" : "middle",
|
|
218
|
+
style: `fill: ${contrastTextForTone(pop.tone)}`,
|
|
219
|
+
}, formatTick(pop.datum.value)));
|
|
220
|
+
}
|
|
221
|
+
const hovered = hoveredIndex.value !== null ? lollipops[hoveredIndex.value] : undefined;
|
|
222
|
+
return h("div", { ...attrs, class: classNames("st-lollipopChart", props.class) }, [
|
|
223
|
+
h("div", {
|
|
224
|
+
class: "st-lollipopChart__visual",
|
|
225
|
+
role: "img",
|
|
226
|
+
"aria-label": label,
|
|
227
|
+
onPointermove: handleVisualPointerMove,
|
|
228
|
+
onPointerleave: handleLeave,
|
|
229
|
+
}, [
|
|
230
|
+
h("svg", {
|
|
231
|
+
viewBox: `0 0 ${width} ${height}`,
|
|
232
|
+
preserveAspectRatio: "xMidYMid meet",
|
|
233
|
+
width: "100%",
|
|
234
|
+
height: "100%",
|
|
235
|
+
focusable: "false",
|
|
236
|
+
"aria-hidden": "true",
|
|
237
|
+
}, svgChildren),
|
|
238
|
+
]),
|
|
239
|
+
chartDataList(label, dataValueItems),
|
|
240
|
+
hovered
|
|
241
|
+
? h("div", {
|
|
242
|
+
class: "st-lollipopChart__tooltip",
|
|
243
|
+
role: "presentation",
|
|
244
|
+
style: `left: ${(hovered.cx / width) * 100}%; top: ${(hovered.cy / height) * 100}%`,
|
|
245
|
+
}, [
|
|
246
|
+
h("span", { class: "st-lollipopChart__tooltipLabel" }, hovered.datum.label),
|
|
247
|
+
h("span", { class: "st-lollipopChart__tooltipValue" }, String(hovered.datum.value)),
|
|
248
|
+
])
|
|
249
|
+
: null,
|
|
250
|
+
]);
|
|
251
|
+
};
|
|
252
|
+
},
|
|
253
|
+
});
|
|
254
|
+
//# sourceMappingURL=LollipopChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LollipopChart.js","sourceRoot":"","sources":["../src/LollipopChart.ts"],"names":[],"mappings":"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"}
|
package/dist/NumberInput.d.ts
CHANGED
|
@@ -122,9 +122,9 @@ export declare const NumberInput: import("vue").DefineComponent<import("vue").Ex
|
|
|
122
122
|
class: string;
|
|
123
123
|
label: undefined;
|
|
124
124
|
disabled: boolean;
|
|
125
|
+
size: NumberInputSize;
|
|
125
126
|
min: string | number;
|
|
126
127
|
max: string | number;
|
|
127
|
-
size: NumberInputSize;
|
|
128
128
|
value: string | number | null;
|
|
129
129
|
helperText: undefined;
|
|
130
130
|
modelValue: string | number;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
export type ParetoChartTone = "category1" | "category2" | "category3" | "category4" | "category5" | "category6" | "category7" | "category8";
|
|
2
|
+
export type ParetoChartDatum = {
|
|
3
|
+
label: string;
|
|
4
|
+
value: number;
|
|
5
|
+
tone?: ParetoChartTone;
|
|
6
|
+
};
|
|
7
|
+
export type ParetoChartProps = {
|
|
8
|
+
data: ParetoChartDatum[];
|
|
9
|
+
width?: number;
|
|
10
|
+
height?: number;
|
|
11
|
+
label: string;
|
|
12
|
+
class?: string;
|
|
13
|
+
};
|
|
14
|
+
export declare const ParetoChart: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
15
|
+
data: {
|
|
16
|
+
type: () => ParetoChartDatum[];
|
|
17
|
+
default: () => never[];
|
|
18
|
+
};
|
|
19
|
+
width: {
|
|
20
|
+
type: NumberConstructor;
|
|
21
|
+
default: number;
|
|
22
|
+
};
|
|
23
|
+
height: {
|
|
24
|
+
type: NumberConstructor;
|
|
25
|
+
default: number;
|
|
26
|
+
};
|
|
27
|
+
label: {
|
|
28
|
+
type: StringConstructor;
|
|
29
|
+
required: true;
|
|
30
|
+
};
|
|
31
|
+
class: {
|
|
32
|
+
type: StringConstructor;
|
|
33
|
+
default: undefined;
|
|
34
|
+
};
|
|
35
|
+
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
36
|
+
[key: string]: any;
|
|
37
|
+
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
38
|
+
data: {
|
|
39
|
+
type: () => ParetoChartDatum[];
|
|
40
|
+
default: () => never[];
|
|
41
|
+
};
|
|
42
|
+
width: {
|
|
43
|
+
type: NumberConstructor;
|
|
44
|
+
default: number;
|
|
45
|
+
};
|
|
46
|
+
height: {
|
|
47
|
+
type: NumberConstructor;
|
|
48
|
+
default: number;
|
|
49
|
+
};
|
|
50
|
+
label: {
|
|
51
|
+
type: StringConstructor;
|
|
52
|
+
required: true;
|
|
53
|
+
};
|
|
54
|
+
class: {
|
|
55
|
+
type: StringConstructor;
|
|
56
|
+
default: undefined;
|
|
57
|
+
};
|
|
58
|
+
}>> & Readonly<{}>, {
|
|
59
|
+
class: string;
|
|
60
|
+
data: ParetoChartDatum[];
|
|
61
|
+
width: number;
|
|
62
|
+
height: number;
|
|
63
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
64
|
+
//# sourceMappingURL=ParetoChart.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ParetoChart.d.ts","sourceRoot":"","sources":["../src/ParetoChart.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,eAAe,GACvB,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AAEhB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,eAAe,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,gBAAgB,EAAE,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAMF,eAAO,MAAM,WAAW;;cAGG,MAAM,gBAAgB,EAAE;;;;;;;;;;;;;;;;;;;;;;;cAAxB,MAAM,gBAAgB,EAAE;;;;;;;;;;;;;;;;;;;;;;;;4EAuRjD,CAAC"}
|