exploreda 0.0.6 → 0.1.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/README.md +144 -0
- package/dist/ExplorEda.cjs +4608 -11288
- package/dist/ExplorEda.cjs.map +1 -1
- package/dist/ExplorEda.css +2282 -1689
- package/dist/ExplorEda.css.map +1 -1
- package/dist/ExplorEda.d.cts +124 -278
- package/dist/ExplorEda.d.ts +124 -278
- package/dist/ExplorEda.js +4479 -11166
- package/dist/ExplorEda.js.map +1 -1
- package/dist/calculations.cjs +18 -0
- package/dist/calculations.cjs.map +1 -0
- package/dist/calculations.d.cts +63 -0
- package/dist/calculations.d.ts +63 -0
- package/dist/calculations.js +3 -0
- package/dist/calculations.js.map +1 -0
- package/dist/charts/bar.cjs +27 -0
- package/dist/charts/bar.cjs.map +1 -0
- package/dist/charts/bar.d.cts +2 -0
- package/dist/charts/bar.d.ts +2 -0
- package/dist/charts/bar.js +18 -0
- package/dist/charts/bar.js.map +1 -0
- package/dist/charts/box-plot.cjs +26 -0
- package/dist/charts/box-plot.cjs.map +1 -0
- package/dist/charts/box-plot.d.cts +2 -0
- package/dist/charts/box-plot.d.ts +2 -0
- package/dist/charts/box-plot.js +17 -0
- package/dist/charts/box-plot.js.map +1 -0
- package/dist/charts/color-legend.cjs +22 -0
- package/dist/charts/color-legend.cjs.map +1 -0
- package/dist/charts/color-legend.d.cts +2 -0
- package/dist/charts/color-legend.d.ts +2 -0
- package/dist/charts/color-legend.js +13 -0
- package/dist/charts/color-legend.js.map +1 -0
- package/dist/charts/data-table.cjs +22 -0
- package/dist/charts/data-table.cjs.map +1 -0
- package/dist/charts/data-table.d.cts +2 -0
- package/dist/charts/data-table.d.ts +2 -0
- package/dist/charts/data-table.js +13 -0
- package/dist/charts/data-table.js.map +1 -0
- package/dist/charts/line.cjs +30 -0
- package/dist/charts/line.cjs.map +1 -0
- package/dist/charts/line.d.cts +2 -0
- package/dist/charts/line.d.ts +2 -0
- package/dist/charts/line.js +17 -0
- package/dist/charts/line.js.map +1 -0
- package/dist/charts/markdown.cjs +16 -0
- package/dist/charts/markdown.cjs.map +1 -0
- package/dist/charts/markdown.css +77 -0
- package/dist/charts/markdown.css.map +1 -0
- package/dist/charts/markdown.d.cts +2 -0
- package/dist/charts/markdown.d.ts +2 -0
- package/dist/charts/markdown.js +7 -0
- package/dist/charts/markdown.js.map +1 -0
- package/dist/charts/pivot-table.cjs +23 -0
- package/dist/charts/pivot-table.cjs.map +1 -0
- package/dist/charts/pivot-table.d.cts +2 -0
- package/dist/charts/pivot-table.d.ts +2 -0
- package/dist/charts/pivot-table.js +14 -0
- package/dist/charts/pivot-table.js.map +1 -0
- package/dist/charts/row.cjs +27 -0
- package/dist/charts/row.cjs.map +1 -0
- package/dist/charts/row.d.cts +6 -0
- package/dist/charts/row.d.ts +6 -0
- package/dist/charts/row.js +18 -0
- package/dist/charts/row.js.map +1 -0
- package/dist/charts/scatter.cjs +24 -0
- package/dist/charts/scatter.cjs.map +1 -0
- package/dist/charts/scatter.d.cts +2 -0
- package/dist/charts/scatter.d.ts +2 -0
- package/dist/charts/scatter.js +15 -0
- package/dist/charts/scatter.js.map +1 -0
- package/dist/charts/summary-table.cjs +19 -0
- package/dist/charts/summary-table.cjs.map +1 -0
- package/dist/charts/summary-table.d.cts +2 -0
- package/dist/charts/summary-table.d.ts +2 -0
- package/dist/charts/summary-table.js +10 -0
- package/dist/charts/summary-table.js.map +1 -0
- package/dist/charts/three-d-scatter.cjs +24 -0
- package/dist/charts/three-d-scatter.cjs.map +1 -0
- package/dist/charts/three-d-scatter.d.cts +6 -0
- package/dist/charts/three-d-scatter.d.ts +6 -0
- package/dist/charts/three-d-scatter.js +15 -0
- package/dist/charts/three-d-scatter.js.map +1 -0
- package/dist/chunk-3PGYFLE3.cjs +499 -0
- package/dist/chunk-3PGYFLE3.cjs.map +1 -0
- package/dist/chunk-4HNDKMWF.js +167 -0
- package/dist/chunk-4HNDKMWF.js.map +1 -0
- package/dist/chunk-4QNENKTV.cjs +1214 -0
- package/dist/chunk-4QNENKTV.cjs.map +1 -0
- package/dist/chunk-54M32JJB.js +132 -0
- package/dist/chunk-54M32JJB.js.map +1 -0
- package/dist/chunk-5B23JVH3.cjs +2238 -0
- package/dist/chunk-5B23JVH3.cjs.map +1 -0
- package/dist/chunk-5LH6NSNL.js +456 -0
- package/dist/chunk-5LH6NSNL.js.map +1 -0
- package/dist/chunk-6DOKKCJ5.cjs +313 -0
- package/dist/chunk-6DOKKCJ5.cjs.map +1 -0
- package/dist/chunk-6HZX5CBT.cjs +1074 -0
- package/dist/chunk-6HZX5CBT.cjs.map +1 -0
- package/dist/chunk-6U5DOIQM.js +1071 -0
- package/dist/chunk-6U5DOIQM.js.map +1 -0
- package/dist/chunk-7GBZIK2R.cjs +80 -0
- package/dist/chunk-7GBZIK2R.cjs.map +1 -0
- package/dist/chunk-7PTJNIOD.js +520 -0
- package/dist/chunk-7PTJNIOD.js.map +1 -0
- package/dist/chunk-AHZYQ7FN.js +319 -0
- package/dist/chunk-AHZYQ7FN.js.map +1 -0
- package/dist/chunk-AOODAOL4.cjs +55 -0
- package/dist/chunk-AOODAOL4.cjs.map +1 -0
- package/dist/chunk-ASKFIRMC.cjs +165 -0
- package/dist/chunk-ASKFIRMC.cjs.map +1 -0
- package/dist/chunk-B7OQUBH4.cjs +171 -0
- package/dist/chunk-B7OQUBH4.cjs.map +1 -0
- package/dist/chunk-BIMEHDLB.js +72 -0
- package/dist/chunk-BIMEHDLB.js.map +1 -0
- package/dist/chunk-C62KHV7S.js +1225 -0
- package/dist/chunk-C62KHV7S.js.map +1 -0
- package/dist/chunk-C7GQT65O.cjs +1119 -0
- package/dist/chunk-C7GQT65O.cjs.map +1 -0
- package/dist/chunk-CGDWDV4Z.js +1211 -0
- package/dist/chunk-CGDWDV4Z.js.map +1 -0
- package/dist/chunk-CJQQFNEY.js +69 -0
- package/dist/chunk-CJQQFNEY.js.map +1 -0
- package/dist/chunk-DHYLSXNR.js +964 -0
- package/dist/chunk-DHYLSXNR.js.map +1 -0
- package/dist/chunk-DKFA4KOJ.cjs +87 -0
- package/dist/chunk-DKFA4KOJ.cjs.map +1 -0
- package/dist/chunk-DS5BS7PP.cjs +357 -0
- package/dist/chunk-DS5BS7PP.cjs.map +1 -0
- package/dist/chunk-EGMFQSGK.js +909 -0
- package/dist/chunk-EGMFQSGK.js.map +1 -0
- package/dist/chunk-EU5EFHO5.cjs +53 -0
- package/dist/chunk-EU5EFHO5.cjs.map +1 -0
- package/dist/chunk-FM46QSDM.js +837 -0
- package/dist/chunk-FM46QSDM.js.map +1 -0
- package/dist/chunk-GV2LRR32.cjs +843 -0
- package/dist/chunk-GV2LRR32.cjs.map +1 -0
- package/dist/chunk-H3XKFSA5.cjs +322 -0
- package/dist/chunk-H3XKFSA5.cjs.map +1 -0
- package/dist/chunk-H5AVMMCE.js +347 -0
- package/dist/chunk-H5AVMMCE.js.map +1 -0
- package/dist/chunk-JDMUN4VK.cjs +986 -0
- package/dist/chunk-JDMUN4VK.cjs.map +1 -0
- package/dist/chunk-JNO7OXCC.js +2171 -0
- package/dist/chunk-JNO7OXCC.js.map +1 -0
- package/dist/chunk-JQMG4ZR7.js +111 -0
- package/dist/chunk-JQMG4ZR7.js.map +1 -0
- package/dist/chunk-L2Q2R43U.cjs +118 -0
- package/dist/chunk-L2Q2R43U.cjs.map +1 -0
- package/dist/chunk-LBTZVERO.js +466 -0
- package/dist/chunk-LBTZVERO.js.map +1 -0
- package/dist/chunk-LUUGGTTK.cjs +1227 -0
- package/dist/chunk-LUUGGTTK.cjs.map +1 -0
- package/dist/chunk-MEEPH7ZC.cjs +911 -0
- package/dist/chunk-MEEPH7ZC.cjs.map +1 -0
- package/dist/chunk-MJPDJ5AS.js +184 -0
- package/dist/chunk-MJPDJ5AS.js.map +1 -0
- package/dist/chunk-MJROUIDZ.cjs +219 -0
- package/dist/chunk-MJROUIDZ.cjs.map +1 -0
- package/dist/chunk-MUWSBYJS.js +528 -0
- package/dist/chunk-MUWSBYJS.js.map +1 -0
- package/dist/chunk-NDF5LCST.js +1088 -0
- package/dist/chunk-NDF5LCST.js.map +1 -0
- package/dist/chunk-NGWTPED4.js +311 -0
- package/dist/chunk-NGWTPED4.js.map +1 -0
- package/dist/chunk-PP4VCONW.js +739 -0
- package/dist/chunk-PP4VCONW.js.map +1 -0
- package/dist/chunk-PRMC2A6P.cjs +488 -0
- package/dist/chunk-PRMC2A6P.cjs.map +1 -0
- package/dist/chunk-PST6UU6S.cjs +742 -0
- package/dist/chunk-PST6UU6S.cjs.map +1 -0
- package/dist/chunk-Q7LK2UWH.js +33 -0
- package/dist/chunk-Q7LK2UWH.js.map +1 -0
- package/dist/chunk-SFV5LZPD.js +162 -0
- package/dist/chunk-SFV5LZPD.js.map +1 -0
- package/dist/chunk-SKXGYJJG.cjs +370 -0
- package/dist/chunk-SKXGYJJG.cjs.map +1 -0
- package/dist/chunk-SWLNKY6R.js +477 -0
- package/dist/chunk-SWLNKY6R.js.map +1 -0
- package/dist/chunk-TGVLNHUB.cjs +483 -0
- package/dist/chunk-TGVLNHUB.cjs.map +1 -0
- package/dist/chunk-TLLRW6S3.js +74 -0
- package/dist/chunk-TLLRW6S3.js.map +1 -0
- package/dist/chunk-TRAIXZ6M.cjs +140 -0
- package/dist/chunk-TRAIXZ6M.cjs.map +1 -0
- package/dist/chunk-U74A5VK5.cjs +74 -0
- package/dist/chunk-U74A5VK5.cjs.map +1 -0
- package/dist/chunk-UAVDLBTA.cjs +74 -0
- package/dist/chunk-UAVDLBTA.cjs.map +1 -0
- package/dist/chunk-UJWS6TRV.js +354 -0
- package/dist/chunk-UJWS6TRV.js.map +1 -0
- package/dist/chunk-UUJMUPB3.cjs +531 -0
- package/dist/chunk-UUJMUPB3.cjs.map +1 -0
- package/dist/chunk-VTKHZIJB.cjs +549 -0
- package/dist/chunk-VTKHZIJB.cjs.map +1 -0
- package/dist/chunk-YXPAWUXO.js +51 -0
- package/dist/chunk-YXPAWUXO.js.map +1 -0
- package/dist/chunk-ZD64SCZB.js +80 -0
- package/dist/chunk-ZD64SCZB.js.map +1 -0
- package/dist/core.cjs +28 -0
- package/dist/core.cjs.map +1 -0
- package/dist/core.d.cts +22 -0
- package/dist/core.d.ts +22 -0
- package/dist/core.js +3 -0
- package/dist/core.js.map +1 -0
- package/dist/dataLayerState-B4XmQjQN.d.cts +258 -0
- package/dist/dataLayerState-B4XmQjQN.d.ts +258 -0
- package/package.json +30 -52
|
@@ -0,0 +1,313 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkB7OQUBH4_cjs = require('./chunk-B7OQUBH4.cjs');
|
|
4
|
+
var chunkU74A5VK5_cjs = require('./chunk-U74A5VK5.cjs');
|
|
5
|
+
var chunkDS5BS7PP_cjs = require('./chunk-DS5BS7PP.cjs');
|
|
6
|
+
var chunkUUJMUPB3_cjs = require('./chunk-UUJMUPB3.cjs');
|
|
7
|
+
var chunkASKFIRMC_cjs = require('./chunk-ASKFIRMC.cjs');
|
|
8
|
+
var chunkUAVDLBTA_cjs = require('./chunk-UAVDLBTA.cjs');
|
|
9
|
+
var chunkAOODAOL4_cjs = require('./chunk-AOODAOL4.cjs');
|
|
10
|
+
var chunkDKFA4KOJ_cjs = require('./chunk-DKFA4KOJ.cjs');
|
|
11
|
+
var chunkEU5EFHO5_cjs = require('./chunk-EU5EFHO5.cjs');
|
|
12
|
+
var chunkMJROUIDZ_cjs = require('./chunk-MJROUIDZ.cjs');
|
|
13
|
+
var chunk5B23JVH3_cjs = require('./chunk-5B23JVH3.cjs');
|
|
14
|
+
var lucideReact = require('lucide-react');
|
|
15
|
+
var d3Scale = require('d3-scale');
|
|
16
|
+
var react = require('react');
|
|
17
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
18
|
+
|
|
19
|
+
function RowChart({ settings, width, height, facetIds }) {
|
|
20
|
+
const allData = chunkDKFA4KOJ_cjs.useGetColumnDataForIds(settings.field);
|
|
21
|
+
const data = chunkDKFA4KOJ_cjs.useGetLiveData(settings, settings.field, facetIds);
|
|
22
|
+
const { getColorForValue } = chunkB7OQUBH4_cjs.useColorScales();
|
|
23
|
+
const updateChart = chunk5B23JVH3_cjs.useDataLayer((s) => s.updateChart);
|
|
24
|
+
const formatFieldValue = chunk5B23JVH3_cjs.useDataLayer((s) => s.formatFieldValue);
|
|
25
|
+
const getFieldLabel = chunk5B23JVH3_cjs.useDataLayer((s) => s.getFieldLabel);
|
|
26
|
+
const fieldSettings = chunk5B23JVH3_cjs.useDataLayer((s) => s.fieldSettings);
|
|
27
|
+
const valueFilter = settings.filters.find(
|
|
28
|
+
(f) => f.type === "value" && f.field === settings.field
|
|
29
|
+
);
|
|
30
|
+
const filterValues = valueFilter?.values ?? [];
|
|
31
|
+
const handleBarClick = (label) => {
|
|
32
|
+
const newValues = chunk5B23JVH3_cjs.categoryIncludes(filterValues, label) ? filterValues.filter((f) => !chunk5B23JVH3_cjs.categoryEqual(f, label)) : [...filterValues, label];
|
|
33
|
+
const newFilters = settings.filters.filter(
|
|
34
|
+
(f) => f.type !== "value" || f.field !== settings.field
|
|
35
|
+
);
|
|
36
|
+
if (newValues.length > 0) {
|
|
37
|
+
newFilters.push({
|
|
38
|
+
type: "value",
|
|
39
|
+
field: settings.field,
|
|
40
|
+
values: newValues
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
updateChart(settings.id, {
|
|
44
|
+
filters: newFilters
|
|
45
|
+
});
|
|
46
|
+
};
|
|
47
|
+
const baseMargin = settings.margin;
|
|
48
|
+
const { displayCounts } = react.useMemo(() => {
|
|
49
|
+
const countMap = /* @__PURE__ */ new Map();
|
|
50
|
+
allData.forEach((value) => {
|
|
51
|
+
const key = chunk5B23JVH3_cjs.categoryValue(value);
|
|
52
|
+
countMap.set(key, (countMap.get(key) || 0) + 1);
|
|
53
|
+
});
|
|
54
|
+
const sortedCounts = Array.from(countMap.entries()).map(([value, count]) => ({
|
|
55
|
+
value,
|
|
56
|
+
key: chunk5B23JVH3_cjs.categoryKey(value),
|
|
57
|
+
label: value != null && chunk5B23JVH3_cjs.hasFieldDisplayFormat(fieldSettings[settings.field]) ? formatFieldValue?.(settings.field, value) ?? chunk5B23JVH3_cjs.categoryLabel(value) : chunk5B23JVH3_cjs.categoryLabel(value),
|
|
58
|
+
count,
|
|
59
|
+
other: false
|
|
60
|
+
})).sort((a, b) => b.count - a.count);
|
|
61
|
+
const availableHeight = height - baseMargin.top - baseMargin.bottom;
|
|
62
|
+
const rowHeight = Math.max(
|
|
63
|
+
settings.minRowHeight,
|
|
64
|
+
Math.min(settings.maxRowHeight, availableHeight / sortedCounts.length)
|
|
65
|
+
);
|
|
66
|
+
const maxRows = Math.max(2, Math.floor(availableHeight / rowHeight));
|
|
67
|
+
const liveCounts = /* @__PURE__ */ new Map();
|
|
68
|
+
data.forEach((value) => {
|
|
69
|
+
const key = chunk5B23JVH3_cjs.categoryValue(value);
|
|
70
|
+
liveCounts.set(key, (liveCounts.get(key) ?? 0) + 1);
|
|
71
|
+
});
|
|
72
|
+
const visible = sortedCounts.map((item) => ({
|
|
73
|
+
...item,
|
|
74
|
+
total: item.count,
|
|
75
|
+
count: liveCounts.get(item.value) ?? 0
|
|
76
|
+
}));
|
|
77
|
+
if (sortedCounts.length > maxRows) {
|
|
78
|
+
const visibleCounts = visible.slice(0, maxRows - 1);
|
|
79
|
+
const otherSum = visible.slice(maxRows - 1).reduce((sum, item) => sum + item.count, 0);
|
|
80
|
+
return {
|
|
81
|
+
displayCounts: [
|
|
82
|
+
...visibleCounts,
|
|
83
|
+
{
|
|
84
|
+
key: "__other",
|
|
85
|
+
label: "Other categories",
|
|
86
|
+
value: void 0,
|
|
87
|
+
other: true,
|
|
88
|
+
count: otherSum,
|
|
89
|
+
total: visible.slice(maxRows - 1).reduce((sum, item) => sum + item.total, 0)
|
|
90
|
+
}
|
|
91
|
+
]
|
|
92
|
+
};
|
|
93
|
+
}
|
|
94
|
+
return {
|
|
95
|
+
displayCounts: visible
|
|
96
|
+
};
|
|
97
|
+
}, [
|
|
98
|
+
data,
|
|
99
|
+
allData,
|
|
100
|
+
height,
|
|
101
|
+
baseMargin.top,
|
|
102
|
+
baseMargin.bottom,
|
|
103
|
+
settings.minRowHeight,
|
|
104
|
+
settings.maxRowHeight,
|
|
105
|
+
formatFieldValue,
|
|
106
|
+
fieldSettings
|
|
107
|
+
]);
|
|
108
|
+
const yLabels = displayCounts.map((d) => d.label);
|
|
109
|
+
const axisFields = chunk5B23JVH3_cjs.getChartAxisFields(settings);
|
|
110
|
+
const xAxisLabel = chunk5B23JVH3_cjs.getChartAxisLabel(
|
|
111
|
+
axisFields.x,
|
|
112
|
+
settings.xAxisLabel,
|
|
113
|
+
getFieldLabel
|
|
114
|
+
);
|
|
115
|
+
const requestedLabelMargin = Math.max(
|
|
116
|
+
baseMargin.left,
|
|
117
|
+
...yLabels.map((label) => label.length * 7 + 24)
|
|
118
|
+
);
|
|
119
|
+
const minPlotWidth = Math.min(
|
|
120
|
+
80,
|
|
121
|
+
Math.max(0, width - baseMargin.left - baseMargin.right)
|
|
122
|
+
);
|
|
123
|
+
const maxLabelMargin = Math.max(0, width - baseMargin.right - minPlotWidth);
|
|
124
|
+
const labelMargin = Math.min(requestedLabelMargin, maxLabelMargin);
|
|
125
|
+
const margin = {
|
|
126
|
+
...baseMargin,
|
|
127
|
+
left: Math.min(labelMargin, width * 0.42),
|
|
128
|
+
right: Math.max(baseMargin.right, 48),
|
|
129
|
+
bottom: Math.max(baseMargin.bottom, xAxisLabel ? 42 : 26)
|
|
130
|
+
};
|
|
131
|
+
const innerWidth = width - margin.left - margin.right;
|
|
132
|
+
const innerHeight = height - margin.top - margin.bottom;
|
|
133
|
+
const chartSettings = { ...settings, margin };
|
|
134
|
+
const xScale = react.useMemo(() => {
|
|
135
|
+
const maxValue = Math.max(1, ...displayCounts.map((d) => d.total));
|
|
136
|
+
return chunkUUJMUPB3_cjs.numericScale(settings.xAxis).domain([0, maxValue]).range([0, innerWidth]).nice();
|
|
137
|
+
}, [displayCounts, innerWidth, settings.xAxis]);
|
|
138
|
+
const yScale = react.useMemo(() => {
|
|
139
|
+
return d3Scale.scaleBand().domain(displayCounts.map((d) => d.key)).range([0, innerHeight]).padding(0.3);
|
|
140
|
+
}, [displayCounts, innerHeight]);
|
|
141
|
+
if (displayCounts.length === 0) {
|
|
142
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width, height }, children: "No data to display" });
|
|
143
|
+
}
|
|
144
|
+
const yLabelsByKey = new Map(
|
|
145
|
+
displayCounts.map((item) => [item.key, item.label])
|
|
146
|
+
);
|
|
147
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width, height }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
148
|
+
chunkDS5BS7PP_cjs.BaseChart,
|
|
149
|
+
{
|
|
150
|
+
width,
|
|
151
|
+
height,
|
|
152
|
+
xScale,
|
|
153
|
+
yScale,
|
|
154
|
+
settings: chartSettings,
|
|
155
|
+
yTickFormatter: (value) => yLabelsByKey.get(String(value)) ?? String(value),
|
|
156
|
+
overlay: /* @__PURE__ */ jsxRuntime.jsxs("g", { pointerEvents: "none", children: [
|
|
157
|
+
" ",
|
|
158
|
+
displayCounts.map(({ key, count }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
159
|
+
"text",
|
|
160
|
+
{
|
|
161
|
+
x: xScale(count) + 5,
|
|
162
|
+
y: yScale(key) + yScale.bandwidth() / 2,
|
|
163
|
+
dominantBaseline: "middle",
|
|
164
|
+
className: "fill-foreground",
|
|
165
|
+
fontSize: 11,
|
|
166
|
+
children: count.toLocaleString()
|
|
167
|
+
},
|
|
168
|
+
key
|
|
169
|
+
))
|
|
170
|
+
] }),
|
|
171
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("g", { className: "select-none", children: displayCounts.map(({ key, label, value, count, other }) => {
|
|
172
|
+
let isFiltered = true;
|
|
173
|
+
if (valueFilter) {
|
|
174
|
+
isFiltered = chunkEU5EFHO5_cjs.applyFilter(value, valueFilter);
|
|
175
|
+
}
|
|
176
|
+
const color = valueFilter && !isFiltered ? "rgb(156 163 175)" : getColorForValue(settings.colorScaleId, value, "#3479a8");
|
|
177
|
+
const barWidth = xScale(count);
|
|
178
|
+
const barHeight = yScale.bandwidth();
|
|
179
|
+
if (barHeight < 1) {
|
|
180
|
+
return null;
|
|
181
|
+
}
|
|
182
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
183
|
+
"rect",
|
|
184
|
+
{
|
|
185
|
+
x: 0,
|
|
186
|
+
y: yScale(key),
|
|
187
|
+
width: Math.max(0, barWidth),
|
|
188
|
+
rx: 2,
|
|
189
|
+
role: other ? void 0 : "button",
|
|
190
|
+
tabIndex: other ? void 0 : 0,
|
|
191
|
+
"aria-label": `${label}: ${count.toLocaleString()} rows`,
|
|
192
|
+
"aria-pressed": chunk5B23JVH3_cjs.categoryIncludes(filterValues, value),
|
|
193
|
+
onKeyDown: (event) => {
|
|
194
|
+
if (event.key === "Enter" || event.key === " ") {
|
|
195
|
+
event.preventDefault();
|
|
196
|
+
if (!other) handleBarClick(value);
|
|
197
|
+
}
|
|
198
|
+
},
|
|
199
|
+
height: barHeight,
|
|
200
|
+
className: `chart-mark ${other ? "fill-muted/80 hover:fill-muted" : "cursor-pointer"}`,
|
|
201
|
+
style: {
|
|
202
|
+
fill: color,
|
|
203
|
+
opacity: valueFilter && !isFiltered ? 0.3 : 1
|
|
204
|
+
},
|
|
205
|
+
onClick: () => {
|
|
206
|
+
if (!other) handleBarClick(value);
|
|
207
|
+
}
|
|
208
|
+
},
|
|
209
|
+
key
|
|
210
|
+
);
|
|
211
|
+
}) })
|
|
212
|
+
}
|
|
213
|
+
) });
|
|
214
|
+
}
|
|
215
|
+
function RowChartSettingsPanel({
|
|
216
|
+
settings,
|
|
217
|
+
onSettingsChange
|
|
218
|
+
}) {
|
|
219
|
+
const { getOrCreateScaleForField } = chunkB7OQUBH4_cjs.useColorScales();
|
|
220
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[120px_1fr] items-center gap-4", children: [
|
|
221
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkMJROUIDZ_cjs.Label, { children: "Data Field" }),
|
|
222
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
223
|
+
chunkASKFIRMC_cjs.FieldSelector,
|
|
224
|
+
{
|
|
225
|
+
label: "",
|
|
226
|
+
value: settings.field ?? "",
|
|
227
|
+
onChange: (value) => onSettingsChange({ ...settings, field: value })
|
|
228
|
+
}
|
|
229
|
+
),
|
|
230
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkMJROUIDZ_cjs.Label, { htmlFor: "minRowHeight", children: "Min Row Height" }),
|
|
231
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
232
|
+
chunkUAVDLBTA_cjs.NumericInputEnter,
|
|
233
|
+
{
|
|
234
|
+
value: settings.minRowHeight || 30,
|
|
235
|
+
onChange: (value) => onSettingsChange({ ...settings, minRowHeight: value }),
|
|
236
|
+
min: 20,
|
|
237
|
+
max: 100,
|
|
238
|
+
stepSmall: 1,
|
|
239
|
+
stepMedium: 5,
|
|
240
|
+
stepLarge: 10,
|
|
241
|
+
placeholder: "Enter minimum row height"
|
|
242
|
+
}
|
|
243
|
+
),
|
|
244
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkMJROUIDZ_cjs.Label, { htmlFor: "maxRowHeight", children: "Max Row Height" }),
|
|
245
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
246
|
+
chunkUAVDLBTA_cjs.NumericInputEnter,
|
|
247
|
+
{
|
|
248
|
+
value: settings.maxRowHeight || 50,
|
|
249
|
+
onChange: (value) => onSettingsChange({ ...settings, maxRowHeight: value }),
|
|
250
|
+
min: 30,
|
|
251
|
+
max: 200,
|
|
252
|
+
stepSmall: 1,
|
|
253
|
+
stepMedium: 10,
|
|
254
|
+
stepLarge: 20,
|
|
255
|
+
placeholder: "Enter maximum row height"
|
|
256
|
+
}
|
|
257
|
+
),
|
|
258
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-start-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
|
|
259
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
260
|
+
chunkAOODAOL4_cjs.Switch,
|
|
261
|
+
{
|
|
262
|
+
id: "colorField",
|
|
263
|
+
checked: settings.field === settings.colorField,
|
|
264
|
+
onCheckedChange: (checked) => {
|
|
265
|
+
onSettingsChange({
|
|
266
|
+
...settings,
|
|
267
|
+
colorField: checked ? settings.field : void 0,
|
|
268
|
+
colorScaleId: checked && settings.field ? getOrCreateScaleForField(settings.field) : void 0
|
|
269
|
+
});
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
),
|
|
273
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkMJROUIDZ_cjs.Label, { htmlFor: "colorField", children: "Use as color field" })
|
|
274
|
+
] }) })
|
|
275
|
+
] }) });
|
|
276
|
+
}
|
|
277
|
+
|
|
278
|
+
// src/components/charts/RowChart/definition.ts
|
|
279
|
+
var rowChartDefinition = {
|
|
280
|
+
type: "row",
|
|
281
|
+
name: "Row Chart",
|
|
282
|
+
description: "A horizontal bar chart showing values by category",
|
|
283
|
+
icon: lucideReact.BarChart,
|
|
284
|
+
component: RowChart,
|
|
285
|
+
settingsPanel: RowChartSettingsPanel,
|
|
286
|
+
createDefaultSettings: (layout, field) => ({
|
|
287
|
+
...chunkU74A5VK5_cjs.DEFAULT_ROW_SETTINGS,
|
|
288
|
+
id: crypto.randomUUID(),
|
|
289
|
+
layout,
|
|
290
|
+
field: field ?? "",
|
|
291
|
+
filters: []
|
|
292
|
+
}),
|
|
293
|
+
validateSettings: (settings) => {
|
|
294
|
+
return Boolean(settings.field);
|
|
295
|
+
},
|
|
296
|
+
getFilterFunction: (settings, fieldGetter) => {
|
|
297
|
+
const dataHash = fieldGetter(settings.field);
|
|
298
|
+
const valueFilter = settings.filters.find(
|
|
299
|
+
(f) => f.type === "value" && f.field === settings.field
|
|
300
|
+
);
|
|
301
|
+
return (d) => {
|
|
302
|
+
if (!valueFilter) {
|
|
303
|
+
return true;
|
|
304
|
+
}
|
|
305
|
+
const value = dataHash[d];
|
|
306
|
+
return chunkEU5EFHO5_cjs.applyFilter(value, valueFilter);
|
|
307
|
+
};
|
|
308
|
+
}
|
|
309
|
+
};
|
|
310
|
+
|
|
311
|
+
exports.rowChartDefinition = rowChartDefinition;
|
|
312
|
+
//# sourceMappingURL=chunk-6DOKKCJ5.cjs.map
|
|
313
|
+
//# sourceMappingURL=chunk-6DOKKCJ5.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/charts/RowChart/RowChart.tsx","../src/components/charts/RowChart/RowChartSettingsPanel.tsx","../src/components/charts/RowChart/definition.ts"],"names":["useGetColumnDataForIds","useGetLiveData","useColorScales","useDataLayer","categoryIncludes","categoryEqual","useMemo","categoryValue","categoryKey","hasFieldDisplayFormat","categoryLabel","getChartAxisFields","getChartAxisLabel","numericScale","scaleBand","jsx","BaseChart","jsxs","applyFilter","Label","FieldSelector","NumericInputEnter","Switch","BarChart","DEFAULT_ROW_SETTINGS"],"mappings":"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","file":"chunk-6DOKKCJ5.cjs","sourcesContent":["import {\n categoryEqual,\n categoryIncludes,\n categoryKey,\n categoryLabel,\n categoryValue,\n} from \"@/lib/categories\";\nimport { numericScale } from \"../Axis/numericScale\";\nimport { BaseChartProps, RowChartSettings } from \"@/types/ChartTypes\";\n\nimport { useColorScales } from \"@/hooks/useColorScales\";\nimport { applyFilter } from \"@/hooks/applyFilter\";\nimport { useDataLayer } from \"@/providers/DataLayerProvider\";\nimport { datum, Filter, ValueFilter } from \"@/types/FilterTypes\";\nimport { scaleBand } from \"d3-scale\";\nimport { useMemo } from \"react\";\nimport { useGetColumnDataForIds } from \"../useGetColumnData\";\nimport { BaseChart } from \"../BaseChart\";\nimport { getChartAxisFields, getChartAxisLabel } from \"../chartAccessibility\";\nimport { useGetLiveData } from \"../useGetLiveData\";\nimport { hasFieldDisplayFormat } from \"@/lib/fieldSettings\";\n\ntype RowChartProps = BaseChartProps<RowChartSettings>;\n\nexport function RowChart({ settings, width, height, facetIds }: RowChartProps) {\n const allData = useGetColumnDataForIds(settings.field);\n const data = useGetLiveData(settings, settings.field, facetIds);\n\n const { getColorForValue } = useColorScales();\n\n const updateChart = useDataLayer((s) => s.updateChart);\n const formatFieldValue = useDataLayer((s) => s.formatFieldValue);\n const getFieldLabel = useDataLayer((s) => s.getFieldLabel);\n const fieldSettings = useDataLayer((s) => s.fieldSettings);\n void fieldSettings;\n\n const valueFilter = settings.filters.find(\n (f: Filter): f is ValueFilter =>\n f.type === \"value\" && f.field === settings.field\n );\n const filterValues = valueFilter?.values ?? [];\n\n const handleBarClick = (label: datum) => {\n const newValues = categoryIncludes(filterValues, label)\n ? filterValues.filter((f) => !categoryEqual(f, label))\n : [...filterValues, label];\n\n // Create new filters array with updated value filter\n const newFilters = settings.filters.filter(\n (f) => f.type !== \"value\" || f.field !== settings.field\n );\n\n if (newValues.length > 0) {\n newFilters.push({\n type: \"value\",\n field: settings.field,\n values: newValues,\n });\n }\n\n updateChart(settings.id, {\n filters: newFilters,\n });\n };\n\n // Chart dimensions\n const baseMargin = settings.margin;\n\n // Calculate counts and handle overflow\n const { displayCounts } = useMemo(() => {\n const countMap = new Map<datum, number>();\n allData.forEach((value) => {\n const key = categoryValue(value);\n countMap.set(key, (countMap.get(key) || 0) + 1);\n });\n\n // Convert to array and sort by count descending\n const sortedCounts = Array.from(countMap.entries())\n .map(([value, count]) => ({\n value,\n key: categoryKey(value),\n label:\n value != null && hasFieldDisplayFormat(fieldSettings[settings.field])\n ? (formatFieldValue?.(settings.field, value) ??\n categoryLabel(value))\n : categoryLabel(value),\n count,\n other: false,\n }))\n .sort((a, b) => b.count - a.count);\n\n // Calculate how many rows we can fit based on min and max row height constraints\n const availableHeight = height - baseMargin.top - baseMargin.bottom;\n const rowHeight = Math.max(\n settings.minRowHeight,\n Math.min(settings.maxRowHeight, availableHeight / sortedCounts.length)\n );\n const maxRows = Math.max(2, Math.floor(availableHeight / rowHeight));\n const liveCounts = new Map<datum, number>();\n data.forEach((value) => {\n const key = categoryValue(value);\n liveCounts.set(key, (liveCounts.get(key) ?? 0) + 1);\n });\n const visible = sortedCounts.map((item) => ({\n ...item,\n total: item.count,\n count: liveCounts.get(item.value) ?? 0,\n }));\n\n // If we have more items than we can display, create an \"Others\" category\n if (sortedCounts.length > maxRows) {\n const visibleCounts = visible.slice(0, maxRows - 1);\n const otherSum = visible\n .slice(maxRows - 1)\n .reduce((sum, item) => sum + item.count, 0);\n\n return {\n displayCounts: [\n ...visibleCounts,\n {\n key: \"__other\",\n label: \"Other categories\",\n value: undefined,\n other: true,\n count: otherSum,\n total: visible\n .slice(maxRows - 1)\n .reduce((sum, item) => sum + item.total, 0),\n },\n ],\n };\n }\n\n return {\n displayCounts: visible,\n };\n }, [\n data,\n allData,\n height,\n baseMargin.top,\n baseMargin.bottom,\n settings.minRowHeight,\n settings.maxRowHeight,\n formatFieldValue,\n fieldSettings,\n ]);\n\n const yLabels = displayCounts.map((d) => d.label);\n const axisFields = getChartAxisFields(settings);\n const xAxisLabel = getChartAxisLabel(\n axisFields.x,\n settings.xAxisLabel,\n getFieldLabel\n );\n const requestedLabelMargin = Math.max(\n baseMargin.left,\n ...yLabels.map((label) => label.length * 7 + 24)\n );\n const minPlotWidth = Math.min(\n 80,\n Math.max(0, width - baseMargin.left - baseMargin.right)\n );\n const maxLabelMargin = Math.max(0, width - baseMargin.right - minPlotWidth);\n const labelMargin = Math.min(requestedLabelMargin, maxLabelMargin);\n const margin = {\n ...baseMargin,\n left: Math.min(labelMargin, width * 0.42),\n right: Math.max(baseMargin.right, 48),\n bottom: Math.max(baseMargin.bottom, xAxisLabel ? 42 : 26),\n };\n const innerWidth = width - margin.left - margin.right;\n const innerHeight = height - margin.top - margin.bottom;\n const chartSettings = { ...settings, margin };\n\n // Create scales with synchronized limits if in a facet\n const xScale = useMemo(() => {\n const maxValue = Math.max(1, ...displayCounts.map((d) => d.total));\n\n return numericScale(settings.xAxis)\n .domain([0, maxValue])\n .range([0, innerWidth])\n .nice();\n }, [displayCounts, innerWidth, settings.xAxis]);\n\n const yScale = useMemo(() => {\n return scaleBand()\n .domain(displayCounts.map((d) => d.key))\n .range([0, innerHeight])\n .padding(0.3);\n }, [displayCounts, innerHeight]);\n\n if (displayCounts.length === 0) {\n return <div style={{ width, height }}>No data to display</div>;\n }\n\n const yLabelsByKey = new Map(\n displayCounts.map((item) => [item.key, item.label])\n );\n\n return (\n <div style={{ width, height }}>\n <BaseChart\n width={width}\n height={height}\n xScale={xScale}\n yScale={yScale}\n settings={chartSettings}\n yTickFormatter={(value) =>\n yLabelsByKey.get(String(value)) ?? String(value)\n }\n overlay={\n <g pointerEvents=\"none\">\n {\" \"}\n {/* Count labels */}\n {displayCounts.map(({ key, count }) => (\n <text\n key={key}\n x={xScale(count) + 5}\n y={yScale(key)! + yScale.bandwidth() / 2}\n dominantBaseline=\"middle\"\n className=\"fill-foreground\"\n fontSize={11}\n >\n {count.toLocaleString()}\n </text>\n ))}\n </g>\n }\n >\n <g className=\"select-none\">\n {/* Bars */}\n {displayCounts.map(({ key, label, value, count, other }) => {\n let isFiltered = true;\n if (valueFilter) {\n isFiltered = applyFilter(value, valueFilter);\n }\n\n const color =\n valueFilter && !isFiltered\n ? \"rgb(156 163 175)\" // gray-400 for filtered out points\n : getColorForValue(settings.colorScaleId, value, \"#3479a8\");\n\n const barWidth = xScale(count);\n const barHeight = yScale.bandwidth();\n\n if (barHeight < 1) {\n return null;\n }\n\n return (\n <rect\n key={key}\n x={0}\n y={yScale(key)}\n width={Math.max(0, barWidth)}\n rx={2}\n role={other ? undefined : \"button\"}\n tabIndex={other ? undefined : 0}\n aria-label={`${label}: ${count.toLocaleString()} rows`}\n aria-pressed={categoryIncludes(filterValues, value)}\n onKeyDown={(event) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n if (!other) handleBarClick(value);\n }\n }}\n height={barHeight}\n className={`chart-mark ${\n other ? \"fill-muted/80 hover:fill-muted\" : \"cursor-pointer\"\n }`}\n style={{\n fill: color,\n opacity: valueFilter && !isFiltered ? 0.3 : 1,\n }}\n onClick={() => {\n if (!other) handleBarClick(value);\n }}\n />\n );\n })}\n </g>\n </BaseChart>\n </div>\n );\n}\n","import { FieldSelector } from \"@/components/FieldSelector\";\nimport { NumericInputEnter } from \"@/components/NumericInputEnter\";\nimport { Label } from \"@/components/ui/label\";\nimport { Switch } from \"@/components/ui/switch\";\nimport { useColorScales } from \"@/hooks/useColorScales\";\nimport { ChartSettingsPanelProps, RowChartSettings } from \"@/types/ChartTypes\";\n\nexport function RowChartSettingsPanel({\n settings,\n onSettingsChange,\n}: ChartSettingsPanelProps<RowChartSettings>) {\n const { getOrCreateScaleForField } = useColorScales();\n\n return (\n <div className=\"space-y-4\">\n <div className=\"grid grid-cols-[120px_1fr] items-center gap-4\">\n <Label>Data Field</Label>\n <FieldSelector\n label=\"\"\n value={settings.field ?? \"\"}\n onChange={(value) => onSettingsChange({ ...settings, field: value })}\n />\n\n <Label htmlFor=\"minRowHeight\">Min Row Height</Label>\n <NumericInputEnter\n value={settings.minRowHeight || 30}\n onChange={(value) =>\n onSettingsChange({ ...settings, minRowHeight: value })\n }\n min={20}\n max={100}\n stepSmall={1}\n stepMedium={5}\n stepLarge={10}\n placeholder=\"Enter minimum row height\"\n />\n\n <Label htmlFor=\"maxRowHeight\">Max Row Height</Label>\n <NumericInputEnter\n value={settings.maxRowHeight || 50}\n onChange={(value) =>\n onSettingsChange({ ...settings, maxRowHeight: value })\n }\n min={30}\n max={200}\n stepSmall={1}\n stepMedium={10}\n stepLarge={20}\n placeholder=\"Enter maximum row height\"\n />\n\n <div className=\"col-start-2\">\n <div className=\"flex items-center space-x-2\">\n <Switch\n id=\"colorField\"\n checked={settings.field === settings.colorField}\n onCheckedChange={(checked) => {\n onSettingsChange({\n ...settings,\n colorField: checked ? settings.field : undefined,\n colorScaleId:\n checked && settings.field\n ? getOrCreateScaleForField(settings.field)\n : undefined,\n });\n }}\n />\n <Label htmlFor=\"colorField\">Use as color field</Label>\n </div>\n </div>\n </div>\n </div>\n );\n}\n","import { BarChart } from \"lucide-react\";\n\nimport { RowChart } from \"@/components/charts/RowChart/RowChart\";\nimport { applyFilter } from \"@/hooks/applyFilter\";\nimport { IdType } from \"@/providers/DataLayerProvider\";\nimport {\n ChartDefinition,\n ChartLayout,\n RowChartSettings,\n datum,\n} from \"@/types/ChartTypes\";\nimport { Filter } from \"@/types/FilterTypes\";\nimport { DEFAULT_ROW_SETTINGS } from \"@/utils/defaultSettings\";\nimport { RowChartSettingsPanel } from \"./RowChartSettingsPanel\";\n\nexport const rowChartDefinition: ChartDefinition<RowChartSettings> = {\n type: \"row\",\n name: \"Row Chart\",\n description: \"A horizontal bar chart showing values by category\",\n icon: BarChart,\n\n component: RowChart,\n settingsPanel: RowChartSettingsPanel,\n\n createDefaultSettings: (layout: ChartLayout, field?: string) => ({\n ...DEFAULT_ROW_SETTINGS,\n id: crypto.randomUUID(),\n layout,\n field: field ?? \"\",\n filters: [],\n }),\n\n validateSettings: (settings) => {\n return Boolean(settings.field);\n },\n\n getFilterFunction: (\n settings: RowChartSettings,\n fieldGetter: (name: string) => Record<IdType, datum>\n ) => {\n const dataHash = fieldGetter(settings.field);\n const valueFilter = settings.filters.find(\n (f): f is Filter => f.type === \"value\" && f.field === settings.field\n );\n\n return (d: IdType) => {\n if (!valueFilter) {\n return true;\n }\n\n const value = dataHash[d];\n return applyFilter(value, valueFilter);\n };\n },\n};\n"]}
|