@sentropic/design-system-react 0.14.0 → 0.16.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/BulletChart.d.ts +17 -0
- package/dist/BulletChart.d.ts.map +1 -0
- package/dist/BulletChart.js +185 -0
- package/dist/BulletChart.js.map +1 -0
- package/dist/BumpChart.d.ts +17 -0
- package/dist/BumpChart.d.ts.map +1 -0
- package/dist/BumpChart.js +142 -0
- package/dist/BumpChart.js.map +1 -0
- package/dist/CalendarHeatmapChart.d.ts +14 -0
- package/dist/CalendarHeatmapChart.d.ts.map +1 -0
- package/dist/CalendarHeatmapChart.js +138 -0
- package/dist/CalendarHeatmapChart.js.map +1 -0
- package/dist/CandlestickChart.d.ts +17 -0
- package/dist/CandlestickChart.d.ts.map +1 -0
- package/dist/CandlestickChart.js +116 -0
- package/dist/CandlestickChart.js.map +1 -0
- package/dist/FilterBar.d.ts +3 -0
- package/dist/FilterBar.d.ts.map +1 -0
- package/dist/FilterBar.js +2 -0
- package/dist/FilterBar.js.map +1 -0
- package/dist/FilterPill.d.ts +3 -0
- package/dist/FilterPill.d.ts.map +1 -0
- package/dist/FilterPill.js +2 -0
- package/dist/FilterPill.js.map +1 -0
- package/dist/MarimekkoChart.d.ts +21 -0
- package/dist/MarimekkoChart.d.ts.map +1 -0
- package/dist/MarimekkoChart.js +88 -0
- package/dist/MarimekkoChart.js.map +1 -0
- package/dist/ParallelCoordinatesChart.d.ts +19 -0
- package/dist/ParallelCoordinatesChart.d.ts.map +1 -0
- package/dist/ParallelCoordinatesChart.js +116 -0
- package/dist/ParallelCoordinatesChart.js.map +1 -0
- package/dist/SelectionChip.d.ts +3 -0
- package/dist/SelectionChip.d.ts.map +1 -0
- package/dist/SelectionChip.js +2 -0
- package/dist/SelectionChip.js.map +1 -0
- package/dist/catalog.d.ts +43 -0
- package/dist/catalog.d.ts.map +1 -1
- package/dist/catalog.js +59 -0
- package/dist/catalog.js.map +1 -1
- package/dist/index.d.ts +18 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +9 -0
- package/dist/index.js.map +1 -1
- package/dist/styles.css +825 -0
- package/package.json +1 -1
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { classNames } from "./classNames.js";
|
|
4
|
+
import { ChartDataList } from "./chartScale.js";
|
|
5
|
+
const MARGIN = { top: 12, right: 16, bottom: 32, left: 52 };
|
|
6
|
+
function scaleLinear(v, d0, d1, r0, r1) {
|
|
7
|
+
if (d1 === d0)
|
|
8
|
+
return r0;
|
|
9
|
+
return r0 + ((v - d0) * (r1 - r0)) / (d1 - d0);
|
|
10
|
+
}
|
|
11
|
+
function niceTicks(min, max, target = 5) {
|
|
12
|
+
if (!Number.isFinite(min) || !Number.isFinite(max) || min === max) {
|
|
13
|
+
const base = Number.isFinite(max) ? max : 0;
|
|
14
|
+
return [base];
|
|
15
|
+
}
|
|
16
|
+
const range = max - min;
|
|
17
|
+
const rough = range / Math.max(target - 1, 1);
|
|
18
|
+
const pow = Math.pow(10, Math.floor(Math.log10(rough)));
|
|
19
|
+
const norm = rough / pow;
|
|
20
|
+
let step;
|
|
21
|
+
if (norm < 1.5)
|
|
22
|
+
step = 1 * pow;
|
|
23
|
+
else if (norm < 3)
|
|
24
|
+
step = 2 * pow;
|
|
25
|
+
else if (norm < 7)
|
|
26
|
+
step = 5 * pow;
|
|
27
|
+
else
|
|
28
|
+
step = 10 * pow;
|
|
29
|
+
const start = Math.floor(min / step) * step;
|
|
30
|
+
const end = Math.ceil(max / step) * step;
|
|
31
|
+
const ticks = [];
|
|
32
|
+
for (let v = start; v <= end + step / 2; v += step) {
|
|
33
|
+
ticks.push(Number(v.toFixed(10)));
|
|
34
|
+
}
|
|
35
|
+
return ticks;
|
|
36
|
+
}
|
|
37
|
+
function formatTick(v) {
|
|
38
|
+
if (Math.abs(v) >= 1000)
|
|
39
|
+
return `${(v / 1000).toFixed(v % 1000 === 0 ? 0 : 1)}k`;
|
|
40
|
+
if (Number.isInteger(v))
|
|
41
|
+
return String(v);
|
|
42
|
+
return v.toFixed(1);
|
|
43
|
+
}
|
|
44
|
+
export function CandlestickChart({ data = [], label, width = 480, height = 240, className, ...rest }) {
|
|
45
|
+
const [hoveredIndex, setHoveredIndex] = React.useState(null);
|
|
46
|
+
const plotWidth = Math.max(width - MARGIN.left - MARGIN.right, 1);
|
|
47
|
+
const plotHeight = Math.max(height - MARGIN.top - MARGIN.bottom, 1);
|
|
48
|
+
// FIX: filter invalid candles BEFORE domain
|
|
49
|
+
const validData = data.filter((d) => Number.isFinite(d.open) &&
|
|
50
|
+
Number.isFinite(d.high) &&
|
|
51
|
+
Number.isFinite(d.low) &&
|
|
52
|
+
Number.isFinite(d.close));
|
|
53
|
+
const allVals = [];
|
|
54
|
+
for (const d of validData) {
|
|
55
|
+
// Domain includes open/high/low/close (not just high/low)
|
|
56
|
+
allVals.push(d.open, d.high, d.low, d.close);
|
|
57
|
+
}
|
|
58
|
+
const rawMin = allVals.length === 0 ? 0 : Math.min(...allVals);
|
|
59
|
+
const rawMax = allVals.length === 0 ? 1 : Math.max(...allVals);
|
|
60
|
+
// Flat domain → fallback range 1 to avoid division by zero
|
|
61
|
+
const safeRawMax = rawMax === rawMin ? rawMin + 1 : rawMax;
|
|
62
|
+
const ticks = niceTicks(rawMin, safeRawMax, 5);
|
|
63
|
+
const domainMin = ticks[0] ?? rawMin;
|
|
64
|
+
const domainMax = ticks[ticks.length - 1] ?? safeRawMax;
|
|
65
|
+
const candles = React.useMemo(() => {
|
|
66
|
+
if (validData.length === 0)
|
|
67
|
+
return [];
|
|
68
|
+
const band = plotWidth / validData.length;
|
|
69
|
+
const bodyW = band * 0.55;
|
|
70
|
+
return validData.map((d, i) => {
|
|
71
|
+
// FIX: clamp high/low to guarantee high≥max(O,C) and low≤min(O,C)
|
|
72
|
+
const clampedHigh = Math.max(d.high, d.open, d.close);
|
|
73
|
+
const clampedLow = Math.min(d.low, d.open, d.close);
|
|
74
|
+
const bullish = d.close >= d.open;
|
|
75
|
+
const centerX = MARGIN.left + band * i + band / 2;
|
|
76
|
+
const bodyTop = MARGIN.top + scaleLinear(Math.max(d.open, d.close), domainMin, domainMax, plotHeight, 0);
|
|
77
|
+
const bodyBot = MARGIN.top + scaleLinear(Math.min(d.open, d.close), domainMin, domainMax, plotHeight, 0);
|
|
78
|
+
const highY = MARGIN.top + scaleLinear(clampedHigh, domainMin, domainMax, plotHeight, 0);
|
|
79
|
+
const lowY = MARGIN.top + scaleLinear(clampedLow, domainMin, domainMax, plotHeight, 0);
|
|
80
|
+
return {
|
|
81
|
+
datum: d,
|
|
82
|
+
index: i,
|
|
83
|
+
bullish,
|
|
84
|
+
centerX,
|
|
85
|
+
bodyX: centerX - bodyW / 2,
|
|
86
|
+
bodyY: bodyTop,
|
|
87
|
+
bodyW,
|
|
88
|
+
bodyH: Math.max(bodyBot - bodyTop, 0.5),
|
|
89
|
+
wickHighY: highY,
|
|
90
|
+
wickLowY: lowY,
|
|
91
|
+
tooltipY: bodyTop,
|
|
92
|
+
};
|
|
93
|
+
});
|
|
94
|
+
}, [validData, plotWidth, domainMin, domainMax, plotHeight]);
|
|
95
|
+
const dataValueItems = validData.map((d) => `${d.label}: O ${d.open} H ${d.high} L ${d.low} C ${d.close}`);
|
|
96
|
+
function handlePointerMove(event) {
|
|
97
|
+
const target = event.target;
|
|
98
|
+
if (!(target instanceof Element)) {
|
|
99
|
+
setHoveredIndex(null);
|
|
100
|
+
return;
|
|
101
|
+
}
|
|
102
|
+
const idx = Number(target.getAttribute("data-chart-index"));
|
|
103
|
+
setHoveredIndex(Number.isInteger(idx) ? idx : null);
|
|
104
|
+
}
|
|
105
|
+
const hoveredCandle = hoveredIndex !== null ? candles[hoveredIndex] : undefined;
|
|
106
|
+
return (_jsxs("div", { ...rest, className: classNames("st-candlestickChart", className), children: [_jsx("div", { className: "st-candlestickChart__visual", role: "img", "aria-label": label, onPointerMove: handlePointerMove, onPointerLeave: () => setHoveredIndex(null), children: _jsxs("svg", { viewBox: `0 0 ${width} ${height}`, preserveAspectRatio: "xMidYMid meet", width: "100%", height: "100%", focusable: "false", "aria-hidden": "true", children: [ticks.map((tick) => {
|
|
107
|
+
const ty = MARGIN.top + scaleLinear(tick, domainMin, domainMax, plotHeight, 0);
|
|
108
|
+
return (_jsxs(React.Fragment, { children: [_jsx("line", { className: "st-candlestickChart__grid", x1: MARGIN.left, x2: width - MARGIN.right, y1: ty, y2: ty }), _jsx("text", { className: "st-candlestickChart__tickLabel", x: MARGIN.left - 6, y: ty, textAnchor: "end", dominantBaseline: "middle", children: formatTick(tick) })] }, tick));
|
|
109
|
+
}), _jsx("line", { className: "st-candlestickChart__axis", x1: MARGIN.left, x2: MARGIN.left, y1: MARGIN.top, y2: height - MARGIN.bottom }), _jsx("line", { className: "st-candlestickChart__axis", x1: MARGIN.left, x2: width - MARGIN.right, y1: height - MARGIN.bottom, y2: height - MARGIN.bottom }), candles.map((c, i) => (_jsxs(React.Fragment, { children: [_jsx("line", { className: `st-candlestickChart__wick st-candlestickChart__wick--${c.bullish ? "up" : "down"}`, x1: c.centerX, x2: c.centerX, y1: c.wickHighY, y2: c.wickLowY, "data-chart-index": i }), _jsx("rect", { className: classNames("st-candlestickChart__body", `st-candlestickChart__body--${c.bullish ? "up" : "down"}`, hoveredIndex !== null && hoveredIndex !== i
|
|
110
|
+
? "st-candlestickChart__body--dim"
|
|
111
|
+
: undefined), x: c.bodyX, y: c.bodyY, width: c.bodyW, height: c.bodyH, rx: 1, "data-chart-index": i }), _jsx("text", { className: "st-candlestickChart__categoryLabel", x: c.centerX, y: height - MARGIN.bottom + 16, textAnchor: "middle", children: c.datum.label })] }, `${i}-${c.datum.label}`)))] }) }), _jsx(ChartDataList, { label: label, items: dataValueItems }), hoveredCandle ? (_jsxs("div", { className: "st-candlestickChart__tooltip", role: "presentation", style: {
|
|
112
|
+
left: `${(hoveredCandle.centerX / width) * 100}%`,
|
|
113
|
+
top: `${(hoveredCandle.tooltipY / height) * 100}%`,
|
|
114
|
+
}, children: [_jsx("span", { className: "st-candlestickChart__tooltipLabel", children: hoveredCandle.datum.label }), _jsxs("span", { className: "st-candlestickChart__tooltipValue", children: ["O ", hoveredCandle.datum.open, " H ", hoveredCandle.datum.high, " L ", hoveredCandle.datum.low, " ", "C ", hoveredCandle.datum.close] })] })) : null] }));
|
|
115
|
+
}
|
|
116
|
+
//# sourceMappingURL=CandlestickChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CandlestickChart.js","sourceRoot":"","sources":["../src/CandlestickChart.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterBar.d.ts","sourceRoot":"","sources":["../src/FilterBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,YAAY,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterBar.js","sourceRoot":"","sources":["../src/FilterBar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterPill.d.ts","sourceRoot":"","sources":["../src/FilterPill.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FilterPill.js","sourceRoot":"","sources":["../src/FilterPill.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export type MarimekkoChartTone = "category1" | "category2" | "category3" | "category4" | "category5" | "category6" | "category7" | "category8";
|
|
3
|
+
export type MarimekkoChartSegment = {
|
|
4
|
+
label: string;
|
|
5
|
+
value: number;
|
|
6
|
+
tone?: MarimekkoChartTone;
|
|
7
|
+
};
|
|
8
|
+
export type MarimekkoChartDatum = {
|
|
9
|
+
label: string;
|
|
10
|
+
width: number;
|
|
11
|
+
segments: MarimekkoChartSegment[];
|
|
12
|
+
};
|
|
13
|
+
export type MarimekkoChartProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
14
|
+
data: MarimekkoChartDatum[];
|
|
15
|
+
label: string;
|
|
16
|
+
width?: number;
|
|
17
|
+
height?: number;
|
|
18
|
+
className?: string;
|
|
19
|
+
};
|
|
20
|
+
export declare function MarimekkoChart({ data, label, width, height, className, ...rest }: MarimekkoChartProps): import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
//# sourceMappingURL=MarimekkoChart.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MarimekkoChart.d.ts","sourceRoot":"","sources":["../src/MarimekkoChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,kBAAkB,GAC1B,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AAEhB,MAAM,MAAM,qBAAqB,GAAG;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,kBAAkB,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,qBAAqB,EAAE,CAAC;CACnC,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,CAAC,GAAG;IAC1F,IAAI,EAAE,mBAAmB,EAAE,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AASF,wBAAgB,cAAc,CAAC,EAC7B,IAAS,EACT,KAAK,EACL,KAAW,EACX,MAAY,EACZ,SAAS,EACT,GAAG,IAAI,EACR,EAAE,mBAAmB,2CA4LrB"}
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { classNames } from "./classNames.js";
|
|
4
|
+
import { ChartDataList } from "./chartScale.js";
|
|
5
|
+
import { contrastTextForTone } from "./chartContrast.js";
|
|
6
|
+
const TONES = [
|
|
7
|
+
"category1", "category2", "category3", "category4",
|
|
8
|
+
"category5", "category6", "category7", "category8",
|
|
9
|
+
];
|
|
10
|
+
const MARGIN = { top: 12, right: 16, bottom: 32, left: 8 };
|
|
11
|
+
export function MarimekkoChart({ data = [], label, width = 480, height = 300, className, ...rest }) {
|
|
12
|
+
const [hoveredKey, setHoveredKey] = React.useState(null);
|
|
13
|
+
const plotWidth = Math.max(width - MARGIN.left - MARGIN.right, 1);
|
|
14
|
+
const plotHeight = Math.max(height - MARGIN.top - MARGIN.bottom, 1);
|
|
15
|
+
// FIX: ignore (skip) non-finite or <=0 widths, NO Math.abs
|
|
16
|
+
const totalWidth = React.useMemo(() => {
|
|
17
|
+
const sum = data.reduce((acc, d) => {
|
|
18
|
+
const w = d.width;
|
|
19
|
+
return acc + (Number.isFinite(w) && w > 0 ? w : 0);
|
|
20
|
+
}, 0);
|
|
21
|
+
return sum > 0 ? sum : 1;
|
|
22
|
+
}, [data]);
|
|
23
|
+
const cells = React.useMemo(() => {
|
|
24
|
+
let xCursor = MARGIN.left;
|
|
25
|
+
const result = [];
|
|
26
|
+
for (const datum of data) {
|
|
27
|
+
const safeW = Number.isFinite(datum.width) && datum.width > 0 ? datum.width : 0;
|
|
28
|
+
// FIX: skip invalid columns (zero or non-finite width)
|
|
29
|
+
if (safeW <= 0)
|
|
30
|
+
continue;
|
|
31
|
+
const colW = (safeW / totalWidth) * plotWidth;
|
|
32
|
+
const colPct = safeW / totalWidth;
|
|
33
|
+
// FIX: ignore non-finite or <=0 segments (NO Math.abs, NO 0.5px floor)
|
|
34
|
+
const validSegs = datum.segments.filter((s) => Number.isFinite(s.value) && s.value > 0);
|
|
35
|
+
const segSum = validSegs.reduce((acc, s) => acc + s.value, 0);
|
|
36
|
+
const safeSum = segSum > 0 ? segSum : 1;
|
|
37
|
+
let yCursor = MARGIN.top;
|
|
38
|
+
for (let si = 0; si < validSegs.length; si++) {
|
|
39
|
+
const seg = validSegs[si];
|
|
40
|
+
const pct = seg.value / safeSum;
|
|
41
|
+
const segH = pct * plotHeight;
|
|
42
|
+
const tone = seg.tone ?? TONES[si % TONES.length];
|
|
43
|
+
result.push({
|
|
44
|
+
key: `${datum.label}-${seg.label}`,
|
|
45
|
+
catLabel: datum.label,
|
|
46
|
+
segLabel: seg.label,
|
|
47
|
+
tone,
|
|
48
|
+
x: xCursor,
|
|
49
|
+
y: yCursor,
|
|
50
|
+
// FIX: no min floor at 0.5px for zeros (they are filtered)
|
|
51
|
+
w: Math.max(colW - 1, 1),
|
|
52
|
+
h: Math.max(segH, 1),
|
|
53
|
+
cx: xCursor + colW / 2,
|
|
54
|
+
cy: yCursor + segH / 2,
|
|
55
|
+
pct,
|
|
56
|
+
colPct,
|
|
57
|
+
});
|
|
58
|
+
yCursor += segH;
|
|
59
|
+
}
|
|
60
|
+
xCursor += colW;
|
|
61
|
+
}
|
|
62
|
+
return result;
|
|
63
|
+
}, [data, totalWidth, plotWidth, plotHeight]);
|
|
64
|
+
// FIX a11y: SR includes column width share (colPct) in addition to segment %
|
|
65
|
+
const dataValueItems = cells.map((c) => `${c.catLabel}, ${c.segLabel}: ${Math.round(c.pct * 100)}% (colonne ${Math.round(c.colPct * 100)}%)`);
|
|
66
|
+
function handlePointerMove(event) {
|
|
67
|
+
const target = event.target;
|
|
68
|
+
if (!(target instanceof Element)) {
|
|
69
|
+
setHoveredKey(null);
|
|
70
|
+
return;
|
|
71
|
+
}
|
|
72
|
+
setHoveredKey(target.getAttribute("data-chart-key") ?? null);
|
|
73
|
+
}
|
|
74
|
+
const hoveredCell = hoveredKey !== null ? cells.find((c) => c.key === hoveredKey) ?? null : null;
|
|
75
|
+
return (_jsxs("div", { ...rest, className: classNames("st-marimekkoChart", className), children: [_jsx("div", { className: "st-marimekkoChart__visual", role: "img", "aria-label": label, onPointerMove: handlePointerMove, onPointerLeave: () => setHoveredKey(null), children: _jsxs("svg", { viewBox: `0 0 ${width} ${height}`, preserveAspectRatio: "xMidYMid meet", width: "100%", height: "100%", focusable: "false", "aria-hidden": "true", children: [_jsx("line", { className: "st-marimekkoChart__axis", x1: MARGIN.left, x2: width - MARGIN.right, y1: height - MARGIN.bottom, y2: height - MARGIN.bottom }), cells.map((cell) => (_jsxs(React.Fragment, { children: [_jsx("rect", { className: classNames("st-marimekkoChart__cell", `st-marimekkoChart__cell--${cell.tone}`, hoveredKey !== null && hoveredKey !== cell.key
|
|
76
|
+
? "st-marimekkoChart__cell--dim"
|
|
77
|
+
: undefined), x: cell.x, y: cell.y, width: cell.w, height: cell.h, "data-chart-key": cell.key }), cell.w > 28 && cell.h > 14 ? (_jsxs("text", { className: "st-marimekkoChart__cellLabel", x: cell.cx, y: cell.cy, textAnchor: "middle", dominantBaseline: "middle", style: { fill: contrastTextForTone(cell.tone) }, pointerEvents: "none", children: [Math.round(cell.pct * 100), "%"] })) : null] }, cell.key))), data.map((datum) => {
|
|
78
|
+
if (!Number.isFinite(datum.width) || datum.width <= 0)
|
|
79
|
+
return null;
|
|
80
|
+
const colW = (datum.width / totalWidth) * plotWidth;
|
|
81
|
+
const startX = cells.find((c) => c.catLabel === datum.label)?.x ?? MARGIN.left;
|
|
82
|
+
return (_jsx("text", { className: "st-marimekkoChart__catLabel", x: startX + colW / 2, y: height - MARGIN.bottom + 16, textAnchor: "middle", children: datum.label }, datum.label));
|
|
83
|
+
})] }) }), _jsx(ChartDataList, { label: label, items: dataValueItems }), hoveredCell !== null ? (_jsxs("div", { className: "st-marimekkoChart__tooltip", role: "presentation", style: {
|
|
84
|
+
left: `${(hoveredCell.cx / width) * 100}%`,
|
|
85
|
+
top: `${(hoveredCell.cy / height) * 100}%`,
|
|
86
|
+
}, children: [_jsxs("span", { className: "st-marimekkoChart__tooltipLabel", children: [hoveredCell.catLabel, " / ", hoveredCell.segLabel] }), _jsxs("span", { className: "st-marimekkoChart__tooltipValue", children: [Math.round(hoveredCell.pct * 100), "%"] })] })) : null] }));
|
|
87
|
+
}
|
|
88
|
+
//# sourceMappingURL=MarimekkoChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MarimekkoChart.js","sourceRoot":"","sources":["../src/MarimekkoChart.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export type ParallelCoordinatesChartTone = "category1" | "category2" | "category3" | "category4" | "category5" | "category6" | "category7" | "category8";
|
|
3
|
+
export type ParallelAxis = {
|
|
4
|
+
key: string;
|
|
5
|
+
label: string;
|
|
6
|
+
min?: number;
|
|
7
|
+
max?: number;
|
|
8
|
+
};
|
|
9
|
+
export type ParallelCoordinatesChartProps = Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {
|
|
10
|
+
axes: ParallelAxis[];
|
|
11
|
+
data: Record<string, unknown>[];
|
|
12
|
+
label: string;
|
|
13
|
+
tones?: ParallelCoordinatesChartTone[];
|
|
14
|
+
width?: number;
|
|
15
|
+
height?: number;
|
|
16
|
+
className?: string;
|
|
17
|
+
};
|
|
18
|
+
export declare function ParallelCoordinatesChart({ axes, data, label, tones, width, height, className, ...rest }: ParallelCoordinatesChartProps): import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
//# sourceMappingURL=ParallelCoordinatesChart.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ParallelCoordinatesChart.d.ts","sourceRoot":"","sources":["../src/ParallelCoordinatesChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,MAAM,4BAA4B,GACpC,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AAEhB,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,CAAC,GAAG;IACpG,IAAI,EAAE,YAAY,EAAE,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,4BAA4B,EAAE,CAAC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAqDF,wBAAgB,wBAAwB,CAAC,EACvC,IAAS,EACT,IAAS,EACT,KAAK,EACL,KAAK,EACL,KAAW,EACX,MAAY,EACZ,SAAS,EACT,GAAG,IAAI,EACR,EAAE,6BAA6B,2CAsJ/B"}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { classNames } from "./classNames.js";
|
|
4
|
+
import { ChartDataList } from "./chartScale.js";
|
|
5
|
+
const TONES = [
|
|
6
|
+
"category1", "category2", "category3", "category4",
|
|
7
|
+
"category5", "category6", "category7", "category8",
|
|
8
|
+
];
|
|
9
|
+
const MARGIN = { top: 32, right: 24, bottom: 16, left: 24 };
|
|
10
|
+
function formatTick(v) {
|
|
11
|
+
if (Math.abs(v) >= 1000)
|
|
12
|
+
return `${(v / 1000).toFixed(1)}k`;
|
|
13
|
+
if (Number.isInteger(v))
|
|
14
|
+
return String(v);
|
|
15
|
+
return v.toFixed(1);
|
|
16
|
+
}
|
|
17
|
+
// FIX: strict parse of a row value. Returns null if not finite → GAP in path.
|
|
18
|
+
function parseStrictFinite(raw) {
|
|
19
|
+
if (typeof raw === "number")
|
|
20
|
+
return Number.isFinite(raw) ? raw : null;
|
|
21
|
+
if (typeof raw === "string" && raw !== "") {
|
|
22
|
+
const n = Number(raw);
|
|
23
|
+
return Number.isFinite(n) ? n : null;
|
|
24
|
+
}
|
|
25
|
+
return null;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Builds an SVG path with GAP (M...L... M...) for null points.
|
|
29
|
+
* A segment containing a null point is not drawn.
|
|
30
|
+
*/
|
|
31
|
+
function buildPathWithGaps(points) {
|
|
32
|
+
const parts = [];
|
|
33
|
+
let segment = [];
|
|
34
|
+
for (const pt of points) {
|
|
35
|
+
if (pt === null) {
|
|
36
|
+
if (segment.length > 0) {
|
|
37
|
+
parts.push(segment.map((p, i) => `${i === 0 ? "M" : "L"}${p.x.toFixed(2)},${p.y.toFixed(2)}`).join(" "));
|
|
38
|
+
segment = [];
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
else {
|
|
42
|
+
segment.push(pt);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
if (segment.length > 0) {
|
|
46
|
+
parts.push(segment.map((p, i) => `${i === 0 ? "M" : "L"}${p.x.toFixed(2)},${p.y.toFixed(2)}`).join(" "));
|
|
47
|
+
}
|
|
48
|
+
return parts.join(" ");
|
|
49
|
+
}
|
|
50
|
+
export function ParallelCoordinatesChart({ axes = [], data = [], label, tones, width = 480, height = 300, className, ...rest }) {
|
|
51
|
+
const [hoveredIndex, setHoveredIndex] = React.useState(null);
|
|
52
|
+
const plotWidth = Math.max(width - MARGIN.left - MARGIN.right, 1);
|
|
53
|
+
const plotHeight = Math.max(height - MARGIN.top - MARGIN.bottom, 1);
|
|
54
|
+
// FIX: per-axis domains with strict parse, no silent Number() coercion
|
|
55
|
+
function axisDomain(axis) {
|
|
56
|
+
const vals = data
|
|
57
|
+
.map((d) => {
|
|
58
|
+
const raw = d[axis.key];
|
|
59
|
+
if (typeof raw === "number")
|
|
60
|
+
return Number.isFinite(raw) ? raw : null;
|
|
61
|
+
if (typeof raw === "string" && raw !== "") {
|
|
62
|
+
const n = Number(raw);
|
|
63
|
+
return Number.isFinite(n) ? n : null;
|
|
64
|
+
}
|
|
65
|
+
return null;
|
|
66
|
+
})
|
|
67
|
+
.filter((v) => v !== null);
|
|
68
|
+
const rawMin = vals.length > 0 ? Math.min(...vals) : 0;
|
|
69
|
+
const rawMax = vals.length > 0 ? Math.max(...vals) : 1;
|
|
70
|
+
const safeMax = rawMax === rawMin ? rawMin + 1 : rawMax;
|
|
71
|
+
return {
|
|
72
|
+
min: Number.isFinite(axis.min) ? axis.min : rawMin,
|
|
73
|
+
max: Number.isFinite(axis.max) ? axis.max : safeMax,
|
|
74
|
+
};
|
|
75
|
+
}
|
|
76
|
+
const axisX = axes.map((_, i) => MARGIN.left +
|
|
77
|
+
(axes.length <= 1 ? plotWidth / 2 : (i / (axes.length - 1)) * plotWidth));
|
|
78
|
+
const lines = React.useMemo(() => {
|
|
79
|
+
return data.map((row, ri) => {
|
|
80
|
+
const seriesTones = tones ?? [];
|
|
81
|
+
const rowTone = seriesTones[ri] ?? TONES[ri % TONES.length];
|
|
82
|
+
const points = axes.map((axis, ai) => {
|
|
83
|
+
const domain = axisDomain(axis);
|
|
84
|
+
// FIX: strict parse → null if invalid
|
|
85
|
+
const val = parseStrictFinite(row[axis.key]);
|
|
86
|
+
if (val === null)
|
|
87
|
+
return null; // GAP
|
|
88
|
+
// FIX: clamp to domain bounds
|
|
89
|
+
const clamped = Math.min(Math.max(val, domain.min), domain.max);
|
|
90
|
+
const t = domain.max === domain.min ? 0.5 : (clamped - domain.min) / (domain.max - domain.min);
|
|
91
|
+
return { x: axisX[ai], y: MARGIN.top + (1 - t) * plotHeight };
|
|
92
|
+
});
|
|
93
|
+
return { points, tone: rowTone, index: ri, row, path: buildPathWithGaps(points) };
|
|
94
|
+
});
|
|
95
|
+
}, [data, axes, tones, axisX, plotHeight]);
|
|
96
|
+
const dataValueItems = data.map((row) => axes.map((axis) => `${axis.label}: ${row[axis.key] ?? ""}`).join(", "));
|
|
97
|
+
function handlePointerMove(event) {
|
|
98
|
+
const target = event.target;
|
|
99
|
+
if (!(target instanceof Element)) {
|
|
100
|
+
setHoveredIndex(null);
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
const idx = Number(target.getAttribute("data-chart-index"));
|
|
104
|
+
setHoveredIndex(Number.isInteger(idx) ? idx : null);
|
|
105
|
+
}
|
|
106
|
+
return (_jsxs("div", { ...rest, className: classNames("st-parallelCoordinatesChart", className), children: [_jsx("div", { className: "st-parallelCoordinatesChart__visual", role: "img", "aria-label": label, onPointerMove: handlePointerMove, onPointerLeave: () => setHoveredIndex(null), children: _jsxs("svg", { viewBox: `0 0 ${width} ${height}`, preserveAspectRatio: "xMidYMid meet", width: "100%", height: "100%", focusable: "false", "aria-hidden": "true", children: [lines.map((line) => (_jsx("path", { className: classNames("st-parallelCoordinatesChart__line", `st-parallelCoordinatesChart__line--${line.tone}`, hoveredIndex !== null && hoveredIndex !== line.index
|
|
107
|
+
? "st-parallelCoordinatesChart__line--dim"
|
|
108
|
+
: undefined, hoveredIndex === line.index
|
|
109
|
+
? "st-parallelCoordinatesChart__line--active"
|
|
110
|
+
: undefined), d: line.path, fill: "none", "data-chart-index": line.index }, line.index))), axes.map((axis, ai) => {
|
|
111
|
+
const domain = axisDomain(axis);
|
|
112
|
+
const ax = axisX[ai];
|
|
113
|
+
return (_jsxs(React.Fragment, { children: [_jsx("line", { className: "st-parallelCoordinatesChart__axis", x1: ax, x2: ax, y1: MARGIN.top, y2: MARGIN.top + plotHeight }), _jsx("text", { className: "st-parallelCoordinatesChart__axisLabel", x: ax, y: MARGIN.top - 10, textAnchor: "middle", children: axis.label }), _jsx("text", { className: "st-parallelCoordinatesChart__tickLabel", x: ax + 4, y: MARGIN.top + plotHeight, dominantBaseline: "auto", children: formatTick(domain.min) }), _jsx("text", { className: "st-parallelCoordinatesChart__tickLabel", x: ax + 4, y: MARGIN.top, dominantBaseline: "hanging", children: formatTick(domain.max) })] }, axis.key));
|
|
114
|
+
})] }) }), _jsx(ChartDataList, { label: label, items: dataValueItems })] }));
|
|
115
|
+
}
|
|
116
|
+
//# sourceMappingURL=ParallelCoordinatesChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ParallelCoordinatesChart.js","sourceRoot":"","sources":["../src/ParallelCoordinatesChart.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SelectionChip.d.ts","sourceRoot":"","sources":["../src/SelectionChip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SelectionChip.js","sourceRoot":"","sources":["../src/SelectionChip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC"}
|
package/dist/catalog.d.ts
CHANGED
|
@@ -717,6 +717,49 @@ export type TabsProps = React.HTMLAttributes<HTMLElement> & {
|
|
|
717
717
|
onchange?: (value: string) => void;
|
|
718
718
|
};
|
|
719
719
|
export declare function Tabs({ items, activeValue, activeId, label, onChange, onchange, className, ...rest }: TabsProps): import("react/jsx-runtime").JSX.Element;
|
|
720
|
+
export type FilterPillTone = "neutral" | "success" | "warning" | "error" | "info";
|
|
721
|
+
export type FilterPillProps = {
|
|
722
|
+
/** Nom du champ/dimension affiché à gauche. */
|
|
723
|
+
field: string;
|
|
724
|
+
/** Résumé de la valeur sélectionnée, ex "France, Italie" ou "> 100". */
|
|
725
|
+
value: string;
|
|
726
|
+
/** Opérateur optionnel affiché entre field et value, ex "=", "in", "entre". */
|
|
727
|
+
operator?: string;
|
|
728
|
+
/** Pilule active (aria-pressed). Défaut true. */
|
|
729
|
+
active?: boolean;
|
|
730
|
+
/** Affiche le bouton ✕. Défaut true. */
|
|
731
|
+
removable?: boolean;
|
|
732
|
+
disabled?: boolean;
|
|
733
|
+
tone?: FilterPillTone;
|
|
734
|
+
onClick?: () => void;
|
|
735
|
+
onRemove?: () => void;
|
|
736
|
+
className?: string;
|
|
737
|
+
};
|
|
738
|
+
export declare function FilterPill({ field, value, operator, active, removable, disabled, tone, onClick, onRemove, className, }: FilterPillProps): import("react/jsx-runtime").JSX.Element;
|
|
739
|
+
export type FilterBarProps = {
|
|
740
|
+
/** Aria-label du groupe de filtres, ex "Filtres actifs". */
|
|
741
|
+
label: string;
|
|
742
|
+
/** Callback "tout effacer" — le bouton n'est rendu que si ce callback est fourni. */
|
|
743
|
+
onClearAll?: () => void;
|
|
744
|
+
/** Libellé du bouton "tout effacer". Défaut "Tout effacer". */
|
|
745
|
+
clearAllLabel?: string;
|
|
746
|
+
children?: React.ReactNode;
|
|
747
|
+
className?: string;
|
|
748
|
+
};
|
|
749
|
+
export declare function FilterBar({ label, onClearAll, clearAllLabel, children, className }: FilterBarProps): import("react/jsx-runtime").JSX.Element;
|
|
750
|
+
export type SelectionChipTone = "neutral" | "success" | "warning" | "error" | "info";
|
|
751
|
+
export type SelectionChipProps = {
|
|
752
|
+
/** Libellé de la dimension sélectionnée. */
|
|
753
|
+
label: string;
|
|
754
|
+
/** Nombre d'éléments sélectionnés — affiché "(N)" si fourni et Number.isFinite. */
|
|
755
|
+
count?: number;
|
|
756
|
+
tone?: SelectionChipTone;
|
|
757
|
+
/** Callback effacement — affiche le bouton ✕ si fourni. */
|
|
758
|
+
onClear?: () => void;
|
|
759
|
+
disabled?: boolean;
|
|
760
|
+
className?: string;
|
|
761
|
+
};
|
|
762
|
+
export declare function SelectionChip({ label, count, tone, onClear, disabled, className }: SelectionChipProps): import("react/jsx-runtime").JSX.Element;
|
|
720
763
|
export type TagProps = React.HTMLAttributes<HTMLSpanElement> & {
|
|
721
764
|
tone?: Tone;
|
|
722
765
|
size?: "sm" | "md";
|