@elliemae/ds-dataviz 3.36.0-rc.0 → 3.36.1-next.7
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/cjs/graphs/Chart/SingleStackedBar/SingleStackedBar.js +2 -4
- package/dist/cjs/graphs/Chart/SingleStackedBar/SingleStackedBar.js.map +1 -1
- package/dist/cjs/graphs/Chart/SingleStackedBar/index.js +0 -1
- package/dist/cjs/graphs/Chart/SingleStackedBar/index.js.map +1 -1
- package/dist/cjs/graphs/Chart/SingleStackedBar/styles.js.map +1 -1
- package/dist/cjs/graphs/Chart/config/useChart.js.map +1 -1
- package/dist/cjs/graphs/Chart/config/useGetters.js +15 -30
- package/dist/cjs/graphs/Chart/config/useGetters.js.map +1 -1
- package/dist/cjs/graphs/Chart/config/useKeyboardNavigation.js +17 -34
- package/dist/cjs/graphs/Chart/config/useKeyboardNavigation.js.map +1 -1
- package/dist/cjs/graphs/Chart/config/useScales.js +11 -22
- package/dist/cjs/graphs/Chart/config/useScales.js.map +1 -1
- package/dist/cjs/graphs/Chart/config/useValidateProps.js.map +1 -1
- package/dist/cjs/graphs/Chart/helpers/index.js +5 -10
- package/dist/cjs/graphs/Chart/helpers/index.js.map +1 -1
- package/dist/cjs/graphs/Chart/helpers/useUniqueData.js +3 -6
- package/dist/cjs/graphs/Chart/helpers/useUniqueData.js.map +1 -1
- package/dist/cjs/graphs/Chart/helpers/useVirtualizedSeries.js +2 -4
- package/dist/cjs/graphs/Chart/helpers/useVirtualizedSeries.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/A11yRegion.js +1 -2
- package/dist/cjs/graphs/Chart/parts/A11yRegion.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Axis/Axis.js +1 -2
- package/dist/cjs/graphs/Chart/parts/Axis/Axis.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js +6 -12
- package/dist/cjs/graphs/Chart/parts/Axis/AxisBottom.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Axis/AxisLeft.js +5 -10
- package/dist/cjs/graphs/Chart/parts/Axis/AxisLeft.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Axis/AxisRight.js +5 -10
- package/dist/cjs/graphs/Chart/parts/Axis/AxisRight.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Axis/Tick.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/ChartContainer.js +6 -12
- package/dist/cjs/graphs/Chart/parts/ChartContainer.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/ClipPaths.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Labels/Label.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Legend/BottomLegend.js +1 -2
- package/dist/cjs/graphs/Chart/parts/Legend/BottomLegend.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Legend/LeftLegend.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Legend/Legend.js +4 -8
- package/dist/cjs/graphs/Chart/parts/Legend/Legend.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Legend/LegendItem.js +3 -6
- package/dist/cjs/graphs/Chart/parts/Legend/LegendItem.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Legend/RightLegend.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Legend/TopLegend.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scrapper/Scrapper.js +1 -2
- package/dist/cjs/graphs/Chart/parts/Scrapper/Scrapper.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scrapper/ScrapperLine.js +1 -2
- package/dist/cjs/graphs/Chart/parts/Scrapper/ScrapperLine.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js +1 -2
- package/dist/cjs/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scroller/BlurMask.js +1 -2
- package/dist/cjs/graphs/Chart/parts/Scroller/BlurMask.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scroller/Controllers.js +2 -4
- package/dist/cjs/graphs/Chart/parts/Scroller/Controllers.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scroller/ScrollBarX.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scroller/ScrollBarY.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scroller/ScrollableContainerX.js +7 -14
- package/dist/cjs/graphs/Chart/parts/Scroller/ScrollableContainerX.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/Scroller/ScrollableContainerY.js +2 -4
- package/dist/cjs/graphs/Chart/parts/Scroller/ScrollableContainerY.js.map +1 -1
- package/dist/cjs/graphs/Chart/parts/TrendHighlight.js +1 -2
- package/dist/cjs/graphs/Chart/parts/TrendHighlight.js.map +1 -1
- package/dist/cjs/graphs/Chart/scales/index.js +13 -26
- package/dist/cjs/graphs/Chart/scales/index.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/Area.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/Bars.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/HorizontalBars.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/HorizontalStackedBars.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/Line.js +1 -2
- package/dist/cjs/graphs/Chart/series/Line.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/Point.js +2 -4
- package/dist/cjs/graphs/Chart/series/Point.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/Points.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/Rect.js +5 -10
- package/dist/cjs/graphs/Chart/series/Rect.js.map +1 -1
- package/dist/cjs/graphs/Chart/series/StackedBar.js.map +1 -1
- package/dist/cjs/graphs/Chart/styles.js.map +1 -1
- package/dist/esm/graphs/Chart/SingleStackedBar/SingleStackedBar.js +2 -4
- package/dist/esm/graphs/Chart/SingleStackedBar/SingleStackedBar.js.map +1 -1
- package/dist/esm/graphs/Chart/SingleStackedBar/index.js +0 -1
- package/dist/esm/graphs/Chart/SingleStackedBar/index.js.map +1 -1
- package/dist/esm/graphs/Chart/SingleStackedBar/styles.js.map +1 -1
- package/dist/esm/graphs/Chart/config/useChart.js.map +1 -1
- package/dist/esm/graphs/Chart/config/useGetters.js +15 -30
- package/dist/esm/graphs/Chart/config/useGetters.js.map +1 -1
- package/dist/esm/graphs/Chart/config/useKeyboardNavigation.js +17 -34
- package/dist/esm/graphs/Chart/config/useKeyboardNavigation.js.map +1 -1
- package/dist/esm/graphs/Chart/config/useScales.js +11 -22
- package/dist/esm/graphs/Chart/config/useScales.js.map +1 -1
- package/dist/esm/graphs/Chart/config/useValidateProps.js.map +1 -1
- package/dist/esm/graphs/Chart/helpers/index.js +5 -10
- package/dist/esm/graphs/Chart/helpers/index.js.map +1 -1
- package/dist/esm/graphs/Chart/helpers/useUniqueData.js +3 -6
- package/dist/esm/graphs/Chart/helpers/useUniqueData.js.map +1 -1
- package/dist/esm/graphs/Chart/helpers/useVirtualizedSeries.js +2 -4
- package/dist/esm/graphs/Chart/helpers/useVirtualizedSeries.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/A11yRegion.js +1 -2
- package/dist/esm/graphs/Chart/parts/A11yRegion.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Axis/Axis.js +1 -2
- package/dist/esm/graphs/Chart/parts/Axis/Axis.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js +6 -12
- package/dist/esm/graphs/Chart/parts/Axis/AxisBottom.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Axis/AxisLeft.js +5 -10
- package/dist/esm/graphs/Chart/parts/Axis/AxisLeft.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Axis/AxisRight.js +5 -10
- package/dist/esm/graphs/Chart/parts/Axis/AxisRight.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Axis/Tick.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/ChartContainer.js +6 -12
- package/dist/esm/graphs/Chart/parts/ChartContainer.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/ClipPaths.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Labels/Label.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Legend/BottomLegend.js +1 -2
- package/dist/esm/graphs/Chart/parts/Legend/BottomLegend.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Legend/LeftLegend.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Legend/Legend.js +4 -8
- package/dist/esm/graphs/Chart/parts/Legend/Legend.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Legend/LegendItem.js +3 -6
- package/dist/esm/graphs/Chart/parts/Legend/LegendItem.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Legend/RightLegend.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Legend/TopLegend.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scrapper/Scrapper.js +1 -2
- package/dist/esm/graphs/Chart/parts/Scrapper/Scrapper.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scrapper/ScrapperLine.js +1 -2
- package/dist/esm/graphs/Chart/parts/Scrapper/ScrapperLine.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js +1 -2
- package/dist/esm/graphs/Chart/parts/Scrapper/VerticalScrapperLine.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scroller/BlurMask.js +1 -2
- package/dist/esm/graphs/Chart/parts/Scroller/BlurMask.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scroller/Controllers.js +2 -4
- package/dist/esm/graphs/Chart/parts/Scroller/Controllers.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scroller/ScrollBarX.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scroller/ScrollBarY.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scroller/ScrollableContainerX.js +7 -14
- package/dist/esm/graphs/Chart/parts/Scroller/ScrollableContainerX.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/Scroller/ScrollableContainerY.js +2 -4
- package/dist/esm/graphs/Chart/parts/Scroller/ScrollableContainerY.js.map +1 -1
- package/dist/esm/graphs/Chart/parts/TrendHighlight.js +1 -2
- package/dist/esm/graphs/Chart/parts/TrendHighlight.js.map +1 -1
- package/dist/esm/graphs/Chart/scales/index.js +13 -26
- package/dist/esm/graphs/Chart/scales/index.js.map +1 -1
- package/dist/esm/graphs/Chart/series/Area.js.map +1 -1
- package/dist/esm/graphs/Chart/series/Bars.js.map +1 -1
- package/dist/esm/graphs/Chart/series/HorizontalBars.js.map +1 -1
- package/dist/esm/graphs/Chart/series/HorizontalStackedBars.js.map +1 -1
- package/dist/esm/graphs/Chart/series/Line.js +1 -2
- package/dist/esm/graphs/Chart/series/Line.js.map +1 -1
- package/dist/esm/graphs/Chart/series/Point.js +2 -4
- package/dist/esm/graphs/Chart/series/Point.js.map +1 -1
- package/dist/esm/graphs/Chart/series/Points.js.map +1 -1
- package/dist/esm/graphs/Chart/series/Rect.js +5 -10
- package/dist/esm/graphs/Chart/series/Rect.js.map +1 -1
- package/dist/esm/graphs/Chart/series/StackedBar.js.map +1 -1
- package/dist/esm/graphs/Chart/styles.js.map +1 -1
- package/package.json +7 -7
|
@@ -36,12 +36,10 @@ module.exports = __toCommonJS(helpers_exports);
|
|
|
36
36
|
var React = __toESM(require("react"));
|
|
37
37
|
var import_d3 = require("d3");
|
|
38
38
|
const getStackedIndex = (groups, serie) => {
|
|
39
|
-
if (!groups)
|
|
40
|
-
return -1;
|
|
39
|
+
if (!groups) return -1;
|
|
41
40
|
for (let i = 0; i < groups.length; i += 1) {
|
|
42
41
|
for (let j = 0; j < groups[i].length; j += 1) {
|
|
43
|
-
if (groups[i][j] === serie)
|
|
44
|
-
return i;
|
|
42
|
+
if (groups[i][j] === serie) return i;
|
|
45
43
|
}
|
|
46
44
|
}
|
|
47
45
|
return -1;
|
|
@@ -49,8 +47,7 @@ const getStackedIndex = (groups, serie) => {
|
|
|
49
47
|
const getStackedData = (stackedData, serie) => {
|
|
50
48
|
for (let i = 0; i < stackedData?.length; i += 1) {
|
|
51
49
|
const data = stackedData[i].find((d) => d.key === serie.name);
|
|
52
|
-
if (data)
|
|
53
|
-
return data;
|
|
50
|
+
if (data) return data;
|
|
54
51
|
}
|
|
55
52
|
return false;
|
|
56
53
|
};
|
|
@@ -64,15 +61,13 @@ const checkSharedScale = (series, isHorizontal) => {
|
|
|
64
61
|
const stackData = (groupsStacked, series, hiddenSeries, isHorizontal) => {
|
|
65
62
|
const allSeriesStackedByGroups = [];
|
|
66
63
|
const scalesStackedDataMap = [];
|
|
67
|
-
if (!groupsStacked)
|
|
68
|
-
return { stackedData: allSeriesStackedByGroups, scalesStackedDataMap };
|
|
64
|
+
if (!groupsStacked) return { stackedData: allSeriesStackedByGroups, scalesStackedDataMap };
|
|
69
65
|
groupsStacked?.forEach((g) => {
|
|
70
66
|
const seriesFilteredByStackGroup = series.filter(
|
|
71
67
|
(serie) => g.includes(serie.name) && !hiddenSeries.includes(serie.name)
|
|
72
68
|
);
|
|
73
69
|
const sharedScale = checkSharedScale(seriesFilteredByStackGroup, isHorizontal);
|
|
74
|
-
if (!sharedScale)
|
|
75
|
-
return;
|
|
70
|
+
if (!sharedScale) return;
|
|
76
71
|
scalesStackedDataMap.push(sharedScale);
|
|
77
72
|
const keys = seriesFilteredByStackGroup.map((serie) => serie.name);
|
|
78
73
|
const stackedData = [];
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/helpers/index.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-params */\nimport { stack, stackOffsetDiverging } from 'd3';\nimport type { DSChartT } from '../react-desc-prop-types.js';\n\nexport const getStackedIndex = (groups?: string[][], serie?: string) => {\n if (!groups) return -1;\n for (let i = 0; i < groups.length; i += 1) {\n for (let j = 0; j < groups[i].length; j += 1) {\n if (groups[i][j] === serie) return i;\n }\n }\n return -1;\n};\n\nexport const getStackedData = (stackedData: DSChartT.StackedSeriesByGroupT, serie: DSChartT.InternalSerie) => {\n for (let i = 0; i < stackedData?.length; i += 1) {\n const data = stackedData[i].find((d) => d.key === serie.name);\n if (data) return data;\n }\n return false;\n};\n\n// this function check if the series that are stacked share the same scale.\n// return the scale or false if they dont share it\n//\n// si serie.scale === undefined ... la scala es Y\n\nconst checkSharedScale = (series: DSChartT.SeriesT[], isHorizontal: boolean) => {\n const scales = series\n .map((serie) => serie.scale || (isHorizontal ? 'x' : 'y'))\n .filter((value, index, self) => self.indexOf(value) === index);\n if (scales.length > 1) {\n return false;\n }\n return scales[0];\n};\n\n// transform series grouped in stack into what d3 stack function need to read\nexport const stackData = (\n groupsStacked: string[][] | undefined,\n series: DSChartT.SeriesT[],\n hiddenSeries: string[],\n isHorizontal: boolean,\n) => {\n const allSeriesStackedByGroups: DSChartT.StackedSeriesByGroupT = [];\n const scalesStackedDataMap: string[] = [];\n if (!groupsStacked) return { stackedData: allSeriesStackedByGroups, scalesStackedDataMap };\n\n groupsStacked?.forEach((g) => {\n const seriesFilteredByStackGroup = series.filter(\n (serie) => g.includes(serie.name) && !hiddenSeries.includes(serie.name),\n );\n const sharedScale = checkSharedScale(seriesFilteredByStackGroup, isHorizontal);\n if (!sharedScale) return;\n scalesStackedDataMap.push(sharedScale);\n const keys = seriesFilteredByStackGroup.map((serie) => serie.name);\n const stackedData: Array<{ [serieName: string]: number }> = [];\n seriesFilteredByStackGroup.forEach((serie) => {\n serie.data.forEach((d, i) => {\n stackedData[i] = {\n ...stackedData[i],\n [serie.name]: typeof d === 'number' ? d : d?.y || 0,\n };\n });\n });\n\n allSeriesStackedByGroups.push(stack().offset(stackOffsetDiverging).keys(keys)(stackedData));\n });\n\n return { stackedData: allSeriesStackedByGroups, scalesStackedDataMap };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,gBAA4C;AAGrC,MAAM,kBAAkB,CAAC,QAAqB,UAAmB;AACtE,MAAI,CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,gBAA4C;AAGrC,MAAM,kBAAkB,CAAC,QAAqB,UAAmB;AACtE,MAAI,CAAC,OAAQ,QAAO;AACpB,WAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK,GAAG;AACzC,aAAS,IAAI,GAAG,IAAI,OAAO,CAAC,EAAE,QAAQ,KAAK,GAAG;AAC5C,UAAI,OAAO,CAAC,EAAE,CAAC,MAAM,MAAO,QAAO;AAAA,IACrC;AAAA,EACF;AACA,SAAO;AACT;AAEO,MAAM,iBAAiB,CAAC,aAA6C,UAAkC;AAC5G,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK,GAAG;AAC/C,UAAM,OAAO,YAAY,CAAC,EAAE,KAAK,CAAC,MAAM,EAAE,QAAQ,MAAM,IAAI;AAC5D,QAAI,KAAM,QAAO;AAAA,EACnB;AACA,SAAO;AACT;AAOA,MAAM,mBAAmB,CAAC,QAA4B,iBAA0B;AAC9E,QAAM,SAAS,OACZ,IAAI,CAAC,UAAU,MAAM,UAAU,eAAe,MAAM,IAAI,EACxD,OAAO,CAAC,OAAO,OAAO,SAAS,KAAK,QAAQ,KAAK,MAAM,KAAK;AAC/D,MAAI,OAAO,SAAS,GAAG;AACrB,WAAO;AAAA,EACT;AACA,SAAO,OAAO,CAAC;AACjB;AAGO,MAAM,YAAY,CACvB,eACA,QACA,cACA,iBACG;AACH,QAAM,2BAA2D,CAAC;AAClE,QAAM,uBAAiC,CAAC;AACxC,MAAI,CAAC,cAAe,QAAO,EAAE,aAAa,0BAA0B,qBAAqB;AAEzF,iBAAe,QAAQ,CAAC,MAAM;AAC5B,UAAM,6BAA6B,OAAO;AAAA,MACxC,CAAC,UAAU,EAAE,SAAS,MAAM,IAAI,KAAK,CAAC,aAAa,SAAS,MAAM,IAAI;AAAA,IACxE;AACA,UAAM,cAAc,iBAAiB,4BAA4B,YAAY;AAC7E,QAAI,CAAC,YAAa;AAClB,yBAAqB,KAAK,WAAW;AACrC,UAAM,OAAO,2BAA2B,IAAI,CAAC,UAAU,MAAM,IAAI;AACjE,UAAM,cAAsD,CAAC;AAC7D,+BAA2B,QAAQ,CAAC,UAAU;AAC5C,YAAM,KAAK,QAAQ,CAAC,GAAG,MAAM;AAC3B,oBAAY,CAAC,IAAI;AAAA,UACf,GAAG,YAAY,CAAC;AAAA,UAChB,CAAC,MAAM,IAAI,GAAG,OAAO,MAAM,WAAW,IAAI,GAAG,KAAK;AAAA,QACpD;AAAA,MACF,CAAC;AAAA,IACH,CAAC;AAED,6BAAyB,SAAK,iBAAM,EAAE,OAAO,8BAAoB,EAAE,KAAK,IAAI,EAAE,WAAW,CAAC;AAAA,EAC5F,CAAC;AAED,SAAO,EAAE,aAAa,0BAA0B,qBAAqB;AACvE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -61,8 +61,7 @@ const useUniqueData = () => {
|
|
|
61
61
|
valueToPositionPerSeries = data.map(
|
|
62
62
|
(serie) => serie.data.filter((datum) => {
|
|
63
63
|
const xScaleValue = getXScaleValue(datum);
|
|
64
|
-
if (xScaleValue === void 0)
|
|
65
|
-
return false;
|
|
64
|
+
if (xScaleValue === void 0) return false;
|
|
66
65
|
return xScaleValue >= xScrollbarPosition * (containerRatio ?? 1) && xScaleValue <= xScrollbarPosition * (containerRatio ?? 1) + innerWidth;
|
|
67
66
|
}).map((datum) => {
|
|
68
67
|
const x = getXValue(datum);
|
|
@@ -83,8 +82,7 @@ const useUniqueData = () => {
|
|
|
83
82
|
valueToPositionPerSeries = data.map(
|
|
84
83
|
(serie) => serie.data.filter((datum) => {
|
|
85
84
|
const xScaleValue = getXScaleValue(datum);
|
|
86
|
-
if (xScaleValue === void 0)
|
|
87
|
-
return false;
|
|
85
|
+
if (xScaleValue === void 0) return false;
|
|
88
86
|
return xScaleValue >= xScrollbarPosition * (containerRatio ?? 1) && xScaleValue <= xScrollbarPosition * (containerRatio ?? 1) + innerWidth;
|
|
89
87
|
}).map((datum) => {
|
|
90
88
|
const xScaleValue = getXScaleValue(datum);
|
|
@@ -103,8 +101,7 @@ const useUniqueData = () => {
|
|
|
103
101
|
}
|
|
104
102
|
const positionUniqueData = {};
|
|
105
103
|
valueToPositionPerSeries.forEach((set) => {
|
|
106
|
-
if (!set.position)
|
|
107
|
-
return;
|
|
104
|
+
if (!set.position) return;
|
|
108
105
|
if (positionUniqueData[set.position]) {
|
|
109
106
|
positionUniqueData[set.position] = [...positionUniqueData[set.position], { ...set }];
|
|
110
107
|
} else {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/helpers/useUniqueData.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext, useMemo } from 'react';\nimport { ChartContext } from '../ChartContext.js';\nimport type { DSChartT } from '../react-desc-prop-types.js';\n\ninterface Aux {\n xPosition: number;\n}\n\nexport const useUniqueData = () => {\n const {\n currentData: data,\n xScale,\n xScrollbarPosition,\n containerRatio,\n innerWidth,\n getXValue,\n getYValue,\n getXScaleValue,\n } = useContext(ChartContext);\n\n const compare = useCallback((a: Aux, b: Aux) => {\n if (a.xPosition < b.xPosition) {\n return -1;\n }\n if (a.xPosition > b.xPosition) {\n return 1;\n }\n return 0;\n }, []);\n\n const isBandAxis = xScale?.type === 'BAND';\n return useMemo(() => {\n let valueToPositionPerSeries: DSChartT.ScrapperDatum[] = [];\n if (isBandAxis) {\n valueToPositionPerSeries = data\n .map((serie) =>\n serie.data\n .filter((datum) => {\n const xScaleValue = getXScaleValue(datum);\n if (xScaleValue === undefined) return false;\n return (\n xScaleValue >= xScrollbarPosition * (containerRatio ?? 1) &&\n xScaleValue <= xScrollbarPosition * (containerRatio ?? 1) + innerWidth\n );\n })\n .map((datum) => {\n const x = getXValue(datum);\n const y = getYValue(datum);\n const xScaleValue = getXScaleValue(datum);\n\n return {\n position: xScaleValue,\n name: serie.name,\n xValue: x,\n yValue: y,\n key: datum.position,\n datum,\n color: serie.color,\n };\n }),\n )\n .flat(1);\n } else {\n valueToPositionPerSeries = data\n .map((serie) =>\n serie.data\n .filter((datum) => {\n const xScaleValue = getXScaleValue(datum);\n if (xScaleValue === undefined) return false;\n return (\n xScaleValue >= xScrollbarPosition * (containerRatio ?? 1) &&\n xScaleValue <= xScrollbarPosition * (containerRatio ?? 1) + innerWidth\n );\n })\n .map((datum) => {\n const xScaleValue = getXScaleValue(datum);\n const x = getXValue(datum);\n\n return {\n position: xScaleValue,\n name: serie.name,\n xValue: x,\n yValue: typeof datum.value === 'number' ? datum.value : datum.value.y,\n key: datum.position,\n datum,\n color: serie.color,\n };\n }),\n )\n .flat(1);\n }\n const positionUniqueData: Record<number, DSChartT.ScrapperDatum[]> = {};\n\n // grouping points by xAxis position\n valueToPositionPerSeries.forEach((set) => {\n if (!set.position) return;\n if (positionUniqueData[set.position]) {\n positionUniqueData[set.position] = [...positionUniqueData[set.position], { ...set }];\n } else {\n positionUniqueData[set.position] = [{ ...set }];\n }\n });\n\n const positionUniqueDataArray: {\n xPosition: number;\n dataPerPosition: DSChartT.ScrapperDatum[];\n xValue: string | number | Date | null;\n rectDetector?: { left: number; right: number };\n }[] = Object.keys(positionUniqueData).map((key) => {\n const xPosition = parseFloat(key);\n const dataPerPosition = positionUniqueData[xPosition];\n // @todo no idea what i am doing\n return { xPosition, dataPerPosition, xValue: dataPerPosition[0].xValue };\n });\n if (isBandAxis) {\n return positionUniqueDataArray;\n }\n return positionUniqueDataArray.sort(compare).map((line, i, array) => {\n const prevPoint = array[i - 1]?.xPosition ?? 0;\n const postPoint = array[i + 1]?.xPosition ?? 0;\n\n const rectDetector = {\n left: (line.xPosition - prevPoint) / 2,\n right: Math.abs((postPoint === 0 ? 0 : postPoint - line.xPosition) / 2),\n };\n\n return { ...line, rectDetector };\n });\n }, [isBandAxis, compare, data, getXScaleValue, xScrollbarPosition, containerRatio, innerWidth, getXValue, getYValue]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAiD;AACjD,0BAA6B;AAOtB,MAAM,gBAAgB,MAAM;AACjC,QAAM;AAAA,IACJ,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,cAAU,0BAAY,CAAC,GAAQ,MAAW;AAC9C,QAAI,EAAE,YAAY,EAAE,WAAW;AAC7B,aAAO;AAAA,IACT;AACA,QAAI,EAAE,YAAY,EAAE,WAAW;AAC7B,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AAEL,QAAM,aAAa,QAAQ,SAAS;AACpC,aAAO,sBAAQ,MAAM;AACnB,QAAI,2BAAqD,CAAC;AAC1D,QAAI,YAAY;AACd,iCAA2B,KACxB;AAAA,QAAI,CAAC,UACJ,MAAM,KACH,OAAO,CAAC,UAAU;AACjB,gBAAM,cAAc,eAAe,KAAK;AACxC,cAAI,gBAAgB
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -52,8 +52,7 @@ const useVirtualizedSeries = () => {
|
|
|
52
52
|
...serie,
|
|
53
53
|
data: serie.data.filter((datum) => {
|
|
54
54
|
const xScaleValue = getXScaleValue(datum);
|
|
55
|
-
if (xScaleValue === void 0)
|
|
56
|
-
return false;
|
|
55
|
+
if (xScaleValue === void 0) return false;
|
|
57
56
|
return xScaleValue >= xScrollbarPosition * (containerRatio ?? 1) - innerWidth && xScaleValue <= xScrollbarPosition * (containerRatio ?? 1) + innerWidth * 2;
|
|
58
57
|
})
|
|
59
58
|
}));
|
|
@@ -63,8 +62,7 @@ const useVirtualizedSeries = () => {
|
|
|
63
62
|
data: serie.data.filter((datum) => {
|
|
64
63
|
const yScaleValue = getYScaleValue(datum);
|
|
65
64
|
const offset = yScale?.getBandwidth() ?? 20;
|
|
66
|
-
if (yScaleValue === void 0)
|
|
67
|
-
return false;
|
|
65
|
+
if (yScaleValue === void 0) return false;
|
|
68
66
|
return yScaleValue > xScrollbarPosition * (containerRatio ?? 1) - offset && yScaleValue < xScrollbarPosition * (containerRatio ?? 1) + innerHeight;
|
|
69
67
|
})
|
|
70
68
|
}));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/helpers/useVirtualizedSeries.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useContext, useMemo } from 'react';\nimport { ChartContext } from '../ChartContext.js';\n\nexport const useVirtualizedSeries = () => {\n const {\n containerRatio,\n innerWidth,\n xScrollbarPosition,\n yScale,\n getXScaleValue,\n getYScaleValue,\n innerHeight,\n currentData: data,\n props: { xScroll, yScroll },\n } = useContext(ChartContext);\n return useMemo(() => {\n if (xScroll) {\n return data.map((serie) => ({\n ...serie,\n data: serie.data.filter((datum) => {\n const xScaleValue = getXScaleValue(datum);\n if (xScaleValue === undefined) return false;\n return (\n xScaleValue >= xScrollbarPosition * (containerRatio ?? 1) - innerWidth &&\n xScaleValue <= xScrollbarPosition * (containerRatio ?? 1) + innerWidth * 2\n );\n }),\n }));\n } else if (yScroll) {\n return data.map((serie) => ({\n ...serie,\n data: serie.data.filter((datum) => {\n const yScaleValue = getYScaleValue(datum);\n const offset = yScale?.getBandwidth() ?? 20;\n if (yScaleValue === undefined) return false;\n return (\n yScaleValue > xScrollbarPosition * (containerRatio ?? 1) - offset &&\n yScaleValue < xScrollbarPosition * (containerRatio ?? 1) + innerHeight\n );\n }),\n }));\n }\n return data;\n }, [\n containerRatio,\n data,\n getXScaleValue,\n getYScaleValue,\n innerHeight,\n innerWidth,\n xScroll,\n xScrollbarPosition,\n yScale,\n yScroll,\n ]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAoC;AACpC,0BAA6B;AAEtB,MAAM,uBAAuB,MAAM;AACxC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,OAAO,EAAE,SAAS,QAAQ;AAAA,EAC5B,QAAI,yBAAW,gCAAY;AAC3B,aAAO,sBAAQ,MAAM;AACnB,QAAI,SAAS;AACX,aAAO,KAAK,IAAI,CAAC,WAAW;AAAA,QAC1B,GAAG;AAAA,QACH,MAAM,MAAM,KAAK,OAAO,CAAC,UAAU;AACjC,gBAAM,cAAc,eAAe,KAAK;AACxC,cAAI,gBAAgB
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAoC;AACpC,0BAA6B;AAEtB,MAAM,uBAAuB,MAAM;AACxC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,OAAO,EAAE,SAAS,QAAQ;AAAA,EAC5B,QAAI,yBAAW,gCAAY;AAC3B,aAAO,sBAAQ,MAAM;AACnB,QAAI,SAAS;AACX,aAAO,KAAK,IAAI,CAAC,WAAW;AAAA,QAC1B,GAAG;AAAA,QACH,MAAM,MAAM,KAAK,OAAO,CAAC,UAAU;AACjC,gBAAM,cAAc,eAAe,KAAK;AACxC,cAAI,gBAAgB,OAAW,QAAO;AACtC,iBACE,eAAe,sBAAsB,kBAAkB,KAAK,cAC5D,eAAe,sBAAsB,kBAAkB,KAAK,aAAa;AAAA,QAE7E,CAAC;AAAA,MACH,EAAE;AAAA,IACJ,WAAW,SAAS;AAClB,aAAO,KAAK,IAAI,CAAC,WAAW;AAAA,QAC1B,GAAG;AAAA,QACH,MAAM,MAAM,KAAK,OAAO,CAAC,UAAU;AACjC,gBAAM,cAAc,eAAe,KAAK;AACxC,gBAAM,SAAS,QAAQ,aAAa,KAAK;AACzC,cAAI,gBAAgB,OAAW,QAAO;AACtC,iBACE,cAAc,sBAAsB,kBAAkB,KAAK,UAC3D,cAAc,sBAAsB,kBAAkB,KAAK;AAAA,QAE/D,CAAC;AAAA,MACH,EAAE;AAAA,IACJ;AACA,WAAO;AAAA,EACT,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -46,8 +46,7 @@ const A11yRegion = ({ serieName, children, ...rest }) => {
|
|
|
46
46
|
const ariaLabel = (0, import_react.useMemo)(() => {
|
|
47
47
|
const serieIndex = currentData.findIndex((serie) => serie.name === serieName);
|
|
48
48
|
const serieData = currentData[serieIndex];
|
|
49
|
-
if (!serieData)
|
|
50
|
-
return "";
|
|
49
|
+
if (!serieData) return "";
|
|
51
50
|
return `${serieName}, ${serieData.type} series ${serieIndex + 1} of ${currentData.length} with ${serieData.data.length} ${PLURAL_DEFINITION_MAP[serieData.type]}.`;
|
|
52
51
|
}, [currentData, serieName]);
|
|
53
52
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("g", { role: "region", "aria-label": ariaLabel, ...rest, children });
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/parts/A11yRegion.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useMemo, useContext } from 'react';\nimport { ChartContext } from '../ChartContext.js';\n\ninterface A11yRegionProps {\n children: React.ReactNode;\n serieName: string;\n clipPath?: string;\n fill?: string;\n transform?: string;\n}\n\nconst PLURAL_DEFINITION_MAP = {\n line: 'data points',\n bar: 'bars',\n area: 'areas',\n point: 'data points',\n} as const;\n\nexport const A11yRegion: React.ComponentType<A11yRegionProps> = ({ serieName, children, ...rest }) => {\n const { currentData } = useContext(ChartContext);\n const ariaLabel = useMemo(() => {\n const serieIndex = currentData.findIndex((serie) => serie.name === serieName);\n const serieData = currentData[serieIndex];\n if (!serieData) return '';\n return `${serieName}, ${serieData.type} series ${serieIndex + 1} of ${currentData.length} with ${\n serieData.data.length\n } ${PLURAL_DEFINITION_MAP[serieData.type]}.`;\n }, [currentData, serieName]);\n\n return (\n <g role=\"region\" aria-label={ariaLabel} {...rest}>\n {children}\n </g>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8BnB;AA9BJ,mBAA2C;AAC3C,0BAA6B;AAU7B,MAAM,wBAAwB;AAAA,EAC5B,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AACT;AAEO,MAAM,aAAmD,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,MAAM;AACpG,QAAM,EAAE,YAAY,QAAI,yBAAW,gCAAY;AAC/C,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,UAAM,aAAa,YAAY,UAAU,CAAC,UAAU,MAAM,SAAS,SAAS;AAC5E,UAAM,YAAY,YAAY,UAAU;AACxC,QAAI,CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8BnB;AA9BJ,mBAA2C;AAC3C,0BAA6B;AAU7B,MAAM,wBAAwB;AAAA,EAC5B,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AACT;AAEO,MAAM,aAAmD,CAAC,EAAE,WAAW,UAAU,GAAG,KAAK,MAAM;AACpG,QAAM,EAAE,YAAY,QAAI,yBAAW,gCAAY;AAC/C,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,UAAM,aAAa,YAAY,UAAU,CAAC,UAAU,MAAM,SAAS,SAAS;AAC5E,UAAM,YAAY,YAAY,UAAU;AACxC,QAAI,CAAC,UAAW,QAAO;AACvB,WAAO,GAAG,SAAS,KAAK,UAAU,IAAI,WAAW,aAAa,CAAC,OAAO,YAAY,MAAM,SACtF,UAAU,KAAK,MACjB,IAAI,sBAAsB,UAAU,IAAI,CAAC;AAAA,EAC3C,GAAG,CAAC,aAAa,SAAS,CAAC;AAE3B,SACE,4CAAC,OAAE,MAAK,UAAS,cAAY,WAAY,GAAG,MACzC,UACH;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -39,8 +39,7 @@ const Axis = import_react.default.memo((props) => {
|
|
|
39
39
|
const { dimension, intervalType, color, GridRenderer, TickRenderer, lineCoords, scale, innerRef } = props;
|
|
40
40
|
const ticks = scale?.getTicks(dimension, intervalType);
|
|
41
41
|
const ticksScaled = scale?.getTicksScaled(dimension, intervalType);
|
|
42
|
-
if (!ticks || !ticksScaled)
|
|
43
|
-
return null;
|
|
42
|
+
if (!ticks || !ticksScaled) return null;
|
|
44
43
|
const { x1, x2, y1, y2 } = lineCoords;
|
|
45
44
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { className: "axis", children: [
|
|
46
45
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { ref: innerRef, children: [
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Axis/Axis.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport type { ScaleT } from '../../scales/index.js';\nimport { StyledAxis } from '../../styles.js';\nimport { type DSChartT } from '../../react-desc-prop-types.js';\nexport interface TickRenderPropsT {\n position: number;\n tickValue: string | number | Date;\n}\nexport interface GridRenderPropsT {\n position: number;\n tickValue: string | number | Date;\n}\n\ninterface AxisT<S extends ScaleT> {\n lineCoords: {\n x1: number;\n x2: number;\n y1: number;\n y2: number;\n };\n innerRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n scale: S | null;\n dimension: number;\n intervalType?: DSChartT.IntervalT;\n TickRenderer: (props: TickRenderPropsT) => JSX.Element | null;\n GridRenderer: (props: GridRenderPropsT) => JSX.Element | null;\n color: string;\n}\n\nexport const Axis = React.memo(<S extends ScaleT>(props: AxisT<S>) => {\n const { dimension, intervalType, color, GridRenderer, TickRenderer, lineCoords, scale, innerRef } = props;\n\n const ticks = scale?.getTicks(dimension, intervalType);\n const ticksScaled = scale?.getTicksScaled(dimension, intervalType);\n if (!ticks || !ticksScaled) return null;\n\n const { x1, x2, y1, y2 } = lineCoords;\n return (\n <g className=\"axis\">\n <g ref={innerRef}>\n <StyledAxis className=\"domain\" x1={x1} x2={x2} y1={y1} y2={y2} axisColor={color} />\n <g className=\"ticks\">\n {ticks.map((t, i) => (\n <TickRenderer key={ticksScaled[i]} position={ticksScaled[i]} tickValue={t} />\n ))}\n </g>\n </g>\n <g className=\"grid\">\n {ticks.map((t, i) => (\n <GridRenderer key={ticksScaled[i]} position={ticksScaled[i]} tickValue={t} />\n ))}\n </g>\n </g>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuCjB;AAvCN,mBAAkB;AAElB,oBAA2B;AA2BpB,MAAM,OAAO,aAAAA,QAAM,KAAK,CAAmB,UAAoB;AACpE,QAAM,EAAE,WAAW,cAAc,OAAO,cAAc,cAAc,YAAY,OAAO,SAAS,IAAI;AAEpG,QAAM,QAAQ,OAAO,SAAS,WAAW,YAAY;AACrD,QAAM,cAAc,OAAO,eAAe,WAAW,YAAY;AACjE,MAAI,CAAC,SAAS,CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuCjB;AAvCN,mBAAkB;AAElB,oBAA2B;AA2BpB,MAAM,OAAO,aAAAA,QAAM,KAAK,CAAmB,UAAoB;AACpE,QAAM,EAAE,WAAW,cAAc,OAAO,cAAc,cAAc,YAAY,OAAO,SAAS,IAAI;AAEpG,QAAM,QAAQ,OAAO,SAAS,WAAW,YAAY;AACrD,QAAM,cAAc,OAAO,eAAe,WAAW,YAAY;AACjE,MAAI,CAAC,SAAS,CAAC,YAAa,QAAO;AAEnC,QAAM,EAAE,IAAI,IAAI,IAAI,GAAG,IAAI;AAC3B,SACE,6CAAC,OAAE,WAAU,QACX;AAAA,iDAAC,OAAE,KAAK,UACN;AAAA,kDAAC,4BAAW,WAAU,UAAS,IAAQ,IAAQ,IAAQ,IAAQ,WAAW,OAAO;AAAA,MACjF,4CAAC,OAAE,WAAU,SACV,gBAAM,IAAI,CAAC,GAAG,MACb,4CAAC,gBAAkC,UAAU,YAAY,CAAC,GAAG,WAAW,KAArD,YAAY,CAAC,CAA2C,CAC5E,GACH;AAAA,OACF;AAAA,IACA,4CAAC,OAAE,WAAU,QACV,gBAAM,IAAI,CAAC,GAAG,MACb,4CAAC,gBAAkC,UAAU,YAAY,CAAC,GAAG,WAAW,KAArD,YAAY,CAAC,CAA2C,CAC5E,GACH;AAAA,KACF;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -56,8 +56,7 @@ const AxisBottom = import_react.default.memo(() => {
|
|
|
56
56
|
const { showGrid, intervalType } = xAxis;
|
|
57
57
|
const textProps = (0, import_react.useMemo)(() => {
|
|
58
58
|
const commomProps = { fill: import_colorPallet.COLOR_PALLET[xAxis?.tick?.color] || xAxis?.tick?.color };
|
|
59
|
-
if (!tickRotation)
|
|
60
|
-
return { ...commomProps, y: 17 };
|
|
59
|
+
if (!tickRotation) return { ...commomProps, y: 17 };
|
|
61
60
|
return {
|
|
62
61
|
...commomProps,
|
|
63
62
|
dx: 8 * Math.sin(Math.PI * (tickRotation / 180)),
|
|
@@ -67,14 +66,12 @@ const AxisBottom = import_react.default.memo(() => {
|
|
|
67
66
|
};
|
|
68
67
|
}, [tickRotation, xAxis?.tick?.color]);
|
|
69
68
|
const style = (0, import_react.useMemo)(() => {
|
|
70
|
-
if (!tickRotation)
|
|
71
|
-
return { textAnchor: "middle" };
|
|
69
|
+
if (!tickRotation) return { textAnchor: "middle" };
|
|
72
70
|
return { textAnchor: tickRotation > 0 ? "start" : "end" };
|
|
73
71
|
}, [tickRotation]);
|
|
74
72
|
const GridRenderer = (0, import_react.useCallback)(
|
|
75
73
|
(props) => {
|
|
76
|
-
if (!showGrid)
|
|
77
|
-
return null;
|
|
74
|
+
if (!showGrid) return null;
|
|
78
75
|
const { position, tickValue, ...rest } = props;
|
|
79
76
|
const gridLineCoords = {
|
|
80
77
|
x1: position,
|
|
@@ -83,8 +80,7 @@ const AxisBottom = import_react.default.memo(() => {
|
|
|
83
80
|
y2: innerHeight
|
|
84
81
|
};
|
|
85
82
|
const tickFormatted = xScale?.getTickFormatted(tickValue);
|
|
86
|
-
if (tickFormatted === "")
|
|
87
|
-
return null;
|
|
83
|
+
if (tickFormatted === "") return null;
|
|
88
84
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_GridLine.GridLine, { ...gridLineCoords, ...rest });
|
|
89
85
|
},
|
|
90
86
|
[innerHeight, showGrid, xScale]
|
|
@@ -97,8 +93,7 @@ const AxisBottom = import_react.default.memo(() => {
|
|
|
97
93
|
stroke: import_colorPallet.COLOR_PALLET[xAxis?.tick?.color] || xAxis?.tick?.color
|
|
98
94
|
};
|
|
99
95
|
const tickFormatted = xScale?.getTickFormatted(tickValue);
|
|
100
|
-
if (tickFormatted === "")
|
|
101
|
-
return null;
|
|
96
|
+
if (tickFormatted === "") return null;
|
|
102
97
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
103
98
|
import_Tick.Tick,
|
|
104
99
|
{
|
|
@@ -116,8 +111,7 @@ const AxisBottom = import_react.default.memo(() => {
|
|
|
116
111
|
);
|
|
117
112
|
const axisColor = (0, import_react.useMemo)(() => import_colorPallet.COLOR_PALLET[xAxis.color] || xAxis.color, [xAxis.color]);
|
|
118
113
|
return (0, import_react.useMemo)(() => {
|
|
119
|
-
if (xAxis.hideAxis)
|
|
120
|
-
return null;
|
|
114
|
+
if (xAxis.hideAxis) return null;
|
|
121
115
|
const lineCoords = {
|
|
122
116
|
x1: 0,
|
|
123
117
|
x2: realInnerWidth,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Axis/AxisBottom.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useContext, useMemo, useCallback } from 'react';\nimport type { CSSProperties } from 'react';\nimport { ChartContext } from '../../ChartContext.js';\nimport { Axis, type GridRenderPropsT, type TickRenderPropsT } from './Axis.js';\nimport { Tick } from './Tick.js';\nimport { GridLine } from './GridLine.js';\nimport { COLOR_PALLET } from '../../helpers/colorPallet.js';\n\nexport const AxisBottom = React.memo(() => {\n const {\n props: { xAxis, xScroll },\n innerHeight,\n xScale,\n innerWidth,\n containerRatio,\n setAxisBottomRef,\n } = useContext(ChartContext);\n\n const realInnerWidth = useMemo(\n () => innerWidth * (xScroll ? containerRatio : 1),\n [containerRatio, innerWidth, xScroll],\n );\n\n const { tickRotation } = xAxis.tick || {};\n const { showGrid, intervalType } = xAxis;\n\n const textProps = useMemo(() => {\n const commomProps = { fill: COLOR_PALLET[xAxis?.tick?.color as keyof typeof COLOR_PALLET] || xAxis?.tick?.color };\n if (!tickRotation) return { ...commomProps, y: 17 };\n return {\n ...commomProps,\n dx: 8 * Math.sin(Math.PI * (tickRotation / 180)),\n dy: '.71em',\n y: Math.ceil(11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1)),\n transform: `rotate(${tickRotation})`,\n };\n }, [tickRotation, xAxis?.tick?.color]);\n\n const style: CSSProperties = useMemo(() => {\n if (!tickRotation) return { textAnchor: 'middle' };\n return { textAnchor: tickRotation > 0 ? 'start' : 'end' };\n }, [tickRotation]);\n\n const GridRenderer = useCallback(\n (props: GridRenderPropsT) => {\n if (!showGrid) return null;\n\n const { position, tickValue, ...rest } = props;\n const gridLineCoords = {\n x1: position,\n x2: position,\n y1: 0,\n y2: innerHeight,\n };\n const tickFormatted = xScale?.getTickFormatted(tickValue);\n if (tickFormatted === '') return null;\n return <GridLine {...gridLineCoords} {...rest} />;\n },\n [innerHeight, showGrid, xScale],\n );\n\n const TickRenderer = useCallback(\n (props: TickRenderPropsT) => {\n const { position, tickValue, ...rest } = props;\n const tickLineCoords = {\n y2: 5,\n stroke: COLOR_PALLET[xAxis?.tick?.color as keyof typeof COLOR_PALLET] || xAxis?.tick?.color,\n };\n const tickFormatted = xScale?.getTickFormatted(tickValue);\n if (tickFormatted === '') return null;\n return (\n <Tick\n {...tickLineCoords}\n tickValue={tickFormatted}\n xTranslate={position}\n yTranslate={innerHeight}\n textProps={textProps}\n textStyle={style}\n {...rest}\n />\n );\n },\n [xAxis?.tick?.color, xScale, innerHeight, textProps, style],\n );\n\n const axisColor = useMemo(() => COLOR_PALLET[xAxis.color as keyof typeof COLOR_PALLET] || xAxis.color, [xAxis.color]);\n\n return useMemo(() => {\n if (xAxis.hideAxis) return null;\n const lineCoords = {\n x1: 0,\n x2: realInnerWidth,\n y1: innerHeight,\n y2: innerHeight,\n };\n\n return (\n <Axis\n lineCoords={lineCoords}\n scale={xScale}\n innerRef={setAxisBottomRef}\n dimension={realInnerWidth}\n TickRenderer={TickRenderer}\n GridRenderer={GridRenderer}\n color={axisColor}\n intervalType={intervalType}\n />\n );\n }, [\n GridRenderer,\n TickRenderer,\n intervalType,\n axisColor,\n innerHeight,\n realInnerWidth,\n setAxisBottomRef,\n xAxis.hideAxis,\n xScale,\n ]);\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0DV;AAxDb,mBAAwD;AAExD,0BAA6B;AAC7B,kBAAmE;AACnE,kBAAqB;AACrB,sBAAyB;AACzB,yBAA6B;AAEtB,MAAM,aAAa,aAAAA,QAAM,KAAK,MAAM;AACzC,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,QAAQ;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,qBAAiB;AAAA,IACrB,MAAM,cAAc,UAAU,iBAAiB;AAAA,IAC/C,CAAC,gBAAgB,YAAY,OAAO;AAAA,EACtC;AAEA,QAAM,EAAE,aAAa,IAAI,MAAM,QAAQ,CAAC;AACxC,QAAM,EAAE,UAAU,aAAa,IAAI;AAEnC,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,UAAM,cAAc,EAAE,MAAM,gCAAa,OAAO,MAAM,KAAkC,KAAK,OAAO,MAAM,MAAM;AAChH,QAAI,CAAC
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -57,8 +57,7 @@ const AxisLeft = import_react.default.memo(() => {
|
|
|
57
57
|
);
|
|
58
58
|
const textProps = (0, import_react.useMemo)(() => {
|
|
59
59
|
const commomProps = { fill: import_colorPallet.COLOR_PALLET[yAxis?.tick?.color] || yAxis?.tick?.color };
|
|
60
|
-
if (!tickRotation)
|
|
61
|
-
return { ...commomProps, x: -10, dy: "0.32em" };
|
|
60
|
+
if (!tickRotation) return { ...commomProps, x: -10, dy: "0.32em" };
|
|
62
61
|
return {
|
|
63
62
|
...commomProps,
|
|
64
63
|
dy: ".30em",
|
|
@@ -75,8 +74,7 @@ const AxisLeft = import_react.default.memo(() => {
|
|
|
75
74
|
);
|
|
76
75
|
const GridRenderer = (0, import_react.useCallback)(
|
|
77
76
|
(props) => {
|
|
78
|
-
if (!showGrid)
|
|
79
|
-
return null;
|
|
77
|
+
if (!showGrid) return null;
|
|
80
78
|
const { position, tickValue, ...rest } = props;
|
|
81
79
|
const gridLineCoords = {
|
|
82
80
|
x1: 0,
|
|
@@ -85,8 +83,7 @@ const AxisLeft = import_react.default.memo(() => {
|
|
|
85
83
|
y2: position
|
|
86
84
|
};
|
|
87
85
|
const tickFormatted = yScale?.getTickFormatted(tickValue);
|
|
88
|
-
if (tickFormatted === "")
|
|
89
|
-
return null;
|
|
86
|
+
if (tickFormatted === "") return null;
|
|
90
87
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_GridLine.GridLine, { ...gridLineCoords, ...rest });
|
|
91
88
|
},
|
|
92
89
|
[showGrid, innerWidth, yScale]
|
|
@@ -99,8 +96,7 @@ const AxisLeft = import_react.default.memo(() => {
|
|
|
99
96
|
stroke: import_colorPallet.COLOR_PALLET[yAxis?.tick?.color] || yAxis?.tick?.color
|
|
100
97
|
};
|
|
101
98
|
const tickFormatted = yScale?.getTickFormatted(tickValue);
|
|
102
|
-
if (tickFormatted === "")
|
|
103
|
-
return null;
|
|
99
|
+
if (tickFormatted === "") return null;
|
|
104
100
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
105
101
|
import_Tick.Tick,
|
|
106
102
|
{
|
|
@@ -118,8 +114,7 @@ const AxisLeft = import_react.default.memo(() => {
|
|
|
118
114
|
);
|
|
119
115
|
const axisColor = (0, import_react.useMemo)(() => import_colorPallet.COLOR_PALLET[yAxis.color] || yAxis.color, [yAxis.color]);
|
|
120
116
|
return (0, import_react.useMemo)(() => {
|
|
121
|
-
if (yAxis.hideAxis)
|
|
122
|
-
return null;
|
|
117
|
+
if (yAxis.hideAxis) return null;
|
|
123
118
|
const lineCoords = {
|
|
124
119
|
x1: 0,
|
|
125
120
|
x2: 0,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Axis/AxisLeft.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { type CSSProperties, useCallback, useContext, useMemo } from 'react';\nimport { ChartContext } from '../../ChartContext.js';\nimport { Axis, type TickRenderPropsT, type GridRenderPropsT } from './Axis.js';\nimport { Tick } from './Tick.js';\nimport { GridLine } from './GridLine.js';\nimport { COLOR_PALLET } from '../../helpers/colorPallet.js';\n\nexport const AxisLeft = React.memo(() => {\n const {\n props: { yAxis, yScroll },\n innerHeight,\n height,\n yScale,\n innerWidth,\n containerRatio,\n setAxisLeftRef,\n } = useContext(ChartContext);\n\n const { tickRotation } = yAxis.tick || {};\n const { showGrid, intervalType } = yAxis;\n\n const realInnerHeight = useMemo(\n () => innerHeight * (yScroll ? containerRatio : 1),\n [containerRatio, innerHeight, yScroll],\n );\n\n const textProps = useMemo(() => {\n const commomProps = { fill: COLOR_PALLET[yAxis?.tick?.color as keyof typeof COLOR_PALLET] || yAxis?.tick?.color };\n if (!tickRotation) return { ...commomProps, x: -10, dy: '0.32em' };\n return {\n ...commomProps,\n dy: '.30em',\n dx: '-.10em',\n x: Math.trunc(-(11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1))),\n transform: `rotate(${tickRotation})`,\n };\n }, [tickRotation, yAxis?.tick?.color]);\n\n const style: CSSProperties = useMemo(\n () => ({\n textAnchor: 'end',\n }),\n [],\n );\n\n const GridRenderer = useCallback(\n (props: GridRenderPropsT) => {\n if (!showGrid) return null;\n const { position, tickValue, ...rest } = props;\n const gridLineCoords = {\n x1: 0,\n x2: innerWidth,\n y1: position,\n y2: position,\n };\n const tickFormatted = yScale?.getTickFormatted(tickValue);\n if (tickFormatted === '') return null;\n return <GridLine {...gridLineCoords} {...rest} />;\n },\n [showGrid, innerWidth, yScale],\n );\n\n const TickRenderer = useCallback(\n (props: TickRenderPropsT) => {\n const { position, tickValue, ...rest } = props;\n const tickLineCoords = {\n x2: -5,\n stroke: COLOR_PALLET[yAxis?.tick?.color as keyof typeof COLOR_PALLET] || yAxis?.tick?.color,\n };\n const tickFormatted = yScale?.getTickFormatted(tickValue) as string;\n if (tickFormatted === '') return null;\n return (\n <Tick\n {...tickLineCoords}\n xTranslate={0}\n yTranslate={position}\n textProps={textProps}\n textStyle={style}\n tickValue={tickFormatted}\n {...rest}\n />\n );\n },\n [style, textProps, yAxis?.tick?.color, yScale],\n );\n\n const axisColor = useMemo(() => COLOR_PALLET[yAxis.color as keyof typeof COLOR_PALLET] || yAxis.color, [yAxis.color]);\n\n return useMemo(() => {\n if (yAxis.hideAxis) return null;\n const lineCoords = {\n x1: 0,\n x2: 0,\n y1: 0,\n y2: realInnerHeight,\n };\n\n return (\n <Axis\n lineCoords={lineCoords}\n scale={yScale}\n innerRef={setAxisLeftRef}\n dimension={height}\n GridRenderer={GridRenderer}\n TickRenderer={TickRenderer}\n color={axisColor}\n intervalType={intervalType}\n />\n );\n }, [\n GridRenderer,\n intervalType,\n TickRenderer,\n axisColor,\n height,\n realInnerHeight,\n setAxisLeftRef,\n yAxis.hideAxis,\n yScale,\n ]);\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2DV;AAzDb,mBAA4E;AAC5E,0BAA6B;AAC7B,kBAAmE;AACnE,kBAAqB;AACrB,sBAAyB;AACzB,yBAA6B;AAEtB,MAAM,WAAW,aAAAA,QAAM,KAAK,MAAM;AACvC,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO,QAAQ;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,EAAE,aAAa,IAAI,MAAM,QAAQ,CAAC;AACxC,QAAM,EAAE,UAAU,aAAa,IAAI;AAEnC,QAAM,sBAAkB;AAAA,IACtB,MAAM,eAAe,UAAU,iBAAiB;AAAA,IAChD,CAAC,gBAAgB,aAAa,OAAO;AAAA,EACvC;AAEA,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,UAAM,cAAc,EAAE,MAAM,gCAAa,OAAO,MAAM,KAAkC,KAAK,OAAO,MAAM,MAAM;AAChH,QAAI,CAAC
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -51,8 +51,7 @@ const AxisRight = import_react.default.memo(() => {
|
|
|
51
51
|
const { showGrid, intervalType } = y2Axis || {};
|
|
52
52
|
const textProps = (0, import_react.useMemo)(() => {
|
|
53
53
|
const commomProps = { fill: import_colorPallet.COLOR_PALLET[y2Axis?.tick?.color] || y2Axis?.tick?.color };
|
|
54
|
-
if (!tickRotation)
|
|
55
|
-
return { ...commomProps, x: 10, dy: "0.32em" };
|
|
54
|
+
if (!tickRotation) return { ...commomProps, x: 10, dy: "0.32em" };
|
|
56
55
|
return {
|
|
57
56
|
...commomProps,
|
|
58
57
|
dx: 8 * Math.sin(Math.PI * (tickRotation / 180)),
|
|
@@ -70,8 +69,7 @@ const AxisRight = import_react.default.memo(() => {
|
|
|
70
69
|
}, [tickRotation]);
|
|
71
70
|
const GridRenderer = (0, import_react.useCallback)(
|
|
72
71
|
(props) => {
|
|
73
|
-
if (!showGrid)
|
|
74
|
-
return null;
|
|
72
|
+
if (!showGrid) return null;
|
|
75
73
|
const { position, tickValue, ...rest } = props;
|
|
76
74
|
const gridLineCoords = {
|
|
77
75
|
x1: 0,
|
|
@@ -80,8 +78,7 @@ const AxisRight = import_react.default.memo(() => {
|
|
|
80
78
|
y2: position
|
|
81
79
|
};
|
|
82
80
|
const tickFormatted = y2Scale?.getTickFormatted(tickValue);
|
|
83
|
-
if (tickFormatted === "")
|
|
84
|
-
return null;
|
|
81
|
+
if (tickFormatted === "") return null;
|
|
85
82
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_GridLine.GridLine, { ...gridLineCoords, ...rest });
|
|
86
83
|
},
|
|
87
84
|
[innerWidth, showGrid, y2Scale]
|
|
@@ -94,8 +91,7 @@ const AxisRight = import_react.default.memo(() => {
|
|
|
94
91
|
stroke: import_colorPallet.COLOR_PALLET[y2Axis?.tick?.color] || y2Axis?.tick?.color
|
|
95
92
|
};
|
|
96
93
|
const tickFormatted = y2Scale?.getTickFormatted(tickValue);
|
|
97
|
-
if (tickFormatted === "")
|
|
98
|
-
return null;
|
|
94
|
+
if (tickFormatted === "") return null;
|
|
99
95
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
100
96
|
import_Tick.Tick,
|
|
101
97
|
{
|
|
@@ -116,8 +112,7 @@ const AxisRight = import_react.default.memo(() => {
|
|
|
116
112
|
[y2Axis?.color]
|
|
117
113
|
);
|
|
118
114
|
return (0, import_react.useMemo)(() => {
|
|
119
|
-
if (y2Axis?.hideAxis)
|
|
120
|
-
return null;
|
|
115
|
+
if (y2Axis?.hideAxis) return null;
|
|
121
116
|
const lineCoords = {
|
|
122
117
|
x1: innerWidth,
|
|
123
118
|
x2: innerWidth,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Axis/AxisRight.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { type CSSProperties, useCallback, useContext, useMemo } from 'react';\nimport { ChartContext } from '../../ChartContext.js';\nimport { Axis, type TickRenderPropsT, type GridRenderPropsT } from './Axis.js';\nimport { Tick } from './Tick.js';\nimport { GridLine } from './GridLine.js';\nimport { COLOR_PALLET } from '../../helpers/colorPallet.js';\n\nexport const AxisRight = React.memo(() => {\n const {\n props: { y2Axis },\n innerHeight,\n y2Scale,\n innerWidth,\n setAxisRightRef,\n } = useContext(ChartContext);\n\n const { tickRotation } = y2Axis?.tick || {};\n const { showGrid, intervalType } = y2Axis || {};\n const textProps = useMemo(() => {\n const commomProps = { fill: COLOR_PALLET[y2Axis?.tick?.color as keyof typeof COLOR_PALLET] || y2Axis?.tick?.color };\n\n if (!tickRotation) return { ...commomProps, x: 10, dy: '0.32em' };\n return {\n ...commomProps,\n dx: 8 * Math.sin(Math.PI * (tickRotation / 180)),\n dy: '.71em',\n y: 11.5 - 2.5 * (tickRotation / 15) * (tickRotation > 0 ? 1 : -1),\n transform: `rotate(${tickRotation})`,\n };\n }, [tickRotation, y2Axis?.tick?.color]);\n\n const style: CSSProperties = useMemo(() => {\n if (!tickRotation)\n return {\n textAnchor: 'start',\n };\n return { textAnchor: tickRotation > 0 ? 'start' : 'end' };\n }, [tickRotation]);\n\n const GridRenderer = useCallback(\n (props: GridRenderPropsT) => {\n if (!showGrid) return null;\n const { position, tickValue, ...rest } = props;\n const gridLineCoords = {\n x1: 0,\n x2: innerWidth,\n y1: position,\n y2: position,\n };\n const tickFormatted = y2Scale?.getTickFormatted(tickValue);\n if (tickFormatted === '') return null;\n return <GridLine {...gridLineCoords} {...rest} />;\n },\n [innerWidth, showGrid, y2Scale],\n );\n\n const TickRenderer = useCallback(\n (props: TickRenderPropsT) => {\n const { position, tickValue, ...rest } = props;\n const tickLineCoords = {\n x2: 5,\n stroke: COLOR_PALLET[y2Axis?.tick?.color as keyof typeof COLOR_PALLET] || y2Axis?.tick?.color,\n };\n const tickFormatted = y2Scale?.getTickFormatted(tickValue) as string;\n if (tickFormatted === '') return null;\n return (\n <Tick\n {...tickLineCoords}\n yTranslate={position}\n xTranslate={innerWidth}\n textProps={textProps}\n textStyle={style}\n tickValue={tickFormatted}\n {...rest}\n />\n );\n },\n [innerWidth, style, textProps, y2Axis?.tick?.color, y2Scale],\n );\n\n const axisColor = useMemo(\n () => COLOR_PALLET[y2Axis?.color as keyof typeof COLOR_PALLET] || y2Axis?.color,\n [y2Axis?.color],\n );\n\n return useMemo(() => {\n if (y2Axis?.hideAxis) return null;\n const lineCoords = {\n x1: innerWidth,\n x2: innerWidth,\n y1: 0,\n y2: innerHeight,\n };\n\n return (\n <Axis\n lineCoords={lineCoords}\n scale={y2Scale}\n innerRef={setAxisRightRef}\n dimension={innerHeight}\n GridRenderer={GridRenderer}\n TickRenderer={TickRenderer}\n color={axisColor}\n intervalType={intervalType}\n />\n );\n }, [\n GridRenderer,\n intervalType,\n TickRenderer,\n axisColor,\n innerHeight,\n innerWidth,\n setAxisRightRef,\n y2Axis?.hideAxis,\n y2Scale,\n ]);\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqDV;AAnDb,mBAA4E;AAC5E,0BAA6B;AAC7B,kBAAmE;AACnE,kBAAqB;AACrB,sBAAyB;AACzB,yBAA6B;AAEtB,MAAM,YAAY,aAAAA,QAAM,KAAK,MAAM;AACxC,QAAM;AAAA,IACJ,OAAO,EAAE,OAAO;AAAA,IAChB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,EAAE,aAAa,IAAI,QAAQ,QAAQ,CAAC;AAC1C,QAAM,EAAE,UAAU,aAAa,IAAI,UAAU,CAAC;AAC9C,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,UAAM,cAAc,EAAE,MAAM,gCAAa,QAAQ,MAAM,KAAkC,KAAK,QAAQ,MAAM,MAAM;AAElH,QAAI,CAAC
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Axis/Tick.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { type SVGAttributes, type CSSProperties } from 'react';\n\nexport interface TickT {\n xTranslate?: number;\n yTranslate?: number;\n x1?: number;\n y1?: number;\n x2?: number;\n y2?: number;\n size?: number;\n stroke?: string;\n tickValue?: string | number | Date;\n textProps: Partial<SVGAttributes<SVGTextElement>>;\n textStyle: CSSProperties;\n}\nexport const Tick: React.ComponentType<TickT> = React.memo(\n ({ tickValue, stroke, textProps, xTranslate = 0, yTranslate = 0, textStyle, ...rest }) => (\n <g transform={`translate(${xTranslate},${yTranslate})`}>\n <line {...rest} stroke={stroke || 'black'} />\n <text fill=\"black\" {...textProps} style={textStyle}>\n {tickValue?.toString()}\n </text>\n </g>\n ),\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiBnB;AAjBJ,mBAA8D;AAevD,MAAM,OAAmC,aAAAA,QAAM;AAAA,EACpD,CAAC,EAAE,WAAW,QAAQ,WAAW,aAAa,GAAG,aAAa,GAAG,WAAW,GAAG,KAAK,MAClF,6CAAC,OAAE,WAAW,aAAa,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiBnB;AAjBJ,mBAA8D;AAevD,MAAM,OAAmC,aAAAA,QAAM;AAAA,EACpD,CAAC,EAAE,WAAW,QAAQ,WAAW,aAAa,GAAG,aAAa,GAAG,WAAW,GAAG,KAAK,MAClF,6CAAC,OAAE,WAAW,aAAa,UAAU,IAAI,UAAU,KACjD;AAAA,gDAAC,UAAM,GAAG,MAAM,QAAQ,UAAU,SAAS;AAAA,IAC3C,4CAAC,UAAK,MAAK,SAAS,GAAG,WAAW,OAAO,WACtC,qBAAW,SAAS,GACvB;AAAA,KACF;AAEJ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -86,29 +86,24 @@ const ChartContainer = () => {
|
|
|
86
86
|
}, [setIsGrabbed, setIsScrollbarVisible, setScrapperPosX, setScrapperPosY]);
|
|
87
87
|
const handleMouseMove = (0, import_react.useCallback)(
|
|
88
88
|
(e) => {
|
|
89
|
-
if (!isGrabbed)
|
|
90
|
-
return;
|
|
89
|
+
if (!isGrabbed) return;
|
|
91
90
|
e.preventDefault();
|
|
92
91
|
const clientX = e.clientX;
|
|
93
92
|
const clientY = e.clientY;
|
|
94
93
|
setActivePoint(null);
|
|
95
94
|
if (xScroll) {
|
|
96
95
|
const newPosition = lastScrollbarPosition?.current + clientX - startPosition;
|
|
97
|
-
if (newPosition < 0)
|
|
98
|
-
setXScrollbarPosition(0);
|
|
96
|
+
if (newPosition < 0) setXScrollbarPosition(0);
|
|
99
97
|
else if (newPosition > innerWidth - innerWidth / containerRatio)
|
|
100
98
|
setXScrollbarPosition(innerWidth - innerWidth / containerRatio);
|
|
101
|
-
else
|
|
102
|
-
setXScrollbarPosition(newPosition);
|
|
99
|
+
else setXScrollbarPosition(newPosition);
|
|
103
100
|
}
|
|
104
101
|
if (yScroll) {
|
|
105
102
|
const newPosition = lastScrollbarPosition?.current + clientY - startPosition;
|
|
106
|
-
if (newPosition < 0)
|
|
107
|
-
setXScrollbarPosition(0);
|
|
103
|
+
if (newPosition < 0) setXScrollbarPosition(0);
|
|
108
104
|
else if (newPosition > innerHeight - innerHeight / containerRatio)
|
|
109
105
|
setXScrollbarPosition(innerHeight - innerHeight / containerRatio);
|
|
110
|
-
else
|
|
111
|
-
setXScrollbarPosition(newPosition);
|
|
106
|
+
else setXScrollbarPosition(newPosition);
|
|
112
107
|
}
|
|
113
108
|
},
|
|
114
109
|
[
|
|
@@ -129,8 +124,7 @@ const ChartContainer = () => {
|
|
|
129
124
|
setIsGrabbed(false);
|
|
130
125
|
}, [lastScrollbarPosition, setIsGrabbed, xScrollbarPosition]);
|
|
131
126
|
const render = (0, import_react.useMemo)(() => {
|
|
132
|
-
if (currentData.length === 0)
|
|
133
|
-
return null;
|
|
127
|
+
if (currentData.length === 0) return null;
|
|
134
128
|
if (xScroll) {
|
|
135
129
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
136
130
|
y2Axis ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_AxisRight.AxisRight, {}) : null,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/parts/ChartContainer.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext, useMemo, useCallback } from 'react';\nimport { StyledSVGWrapper } from '../styles.js';\nimport { ChartContext } from '../ChartContext.js';\nimport { useKeyboardNavigation } from '../config/useKeyboardNavigation.js';\nimport { Legend } from './Legend/Legend.js';\nimport { Labels } from './Labels/index.js';\nimport { BlurMask } from './Scroller/BlurMask.js';\nimport { ClipPaths } from './ClipPaths.js';\nimport { ScrollableContainerX } from './Scroller/ScrollableContainerX.js';\nimport { ScrollableContainerY } from './Scroller/ScrollableContainerY.js';\nimport { AxisBottom } from './Axis/AxisBottom.js';\nimport { AxisRight } from './Axis/AxisRight.js';\nimport { AxisLeft } from './Axis/AxisLeft.js';\nimport { SeriesFactory } from './SeriesFactory.js';\nimport { Scrapper } from './Scrapper/Scrapper.js';\nimport { VerticalScrapper } from './Scrapper/VerticalScrapper.js';\nimport { Controllers } from './Scroller/Controllers.js';\nexport const ChartContainer = () => {\n const {\n props: { y2Axis, yScroll, xScroll, scrapper, xAxis, width: userWidth },\n activePoint,\n internalMargin,\n setScrapperPosY,\n setScrapperPosX,\n setContainerRef,\n isGrabbed,\n setIsGrabbed,\n startPosition,\n innerWidth,\n innerHeight,\n setActivePoint,\n setXScrollbarPosition,\n xScrollbarPosition,\n containerRatio,\n lastScrollbarPosition,\n setIsScrollbarVisible,\n currentData,\n width,\n height,\n } = useContext(ChartContext);\n\n const { onInputKeyDown, handleOnKeyUp, handleOnBlur, handleOnFocus } = useKeyboardNavigation();\n\n const onMouseEnterHandler = useCallback(() => {\n setIsScrollbarVisible(true);\n setActivePoint(null);\n }, [setActivePoint, setIsScrollbarVisible]);\n const onMouseLeaveHandler = useCallback(() => {\n setScrapperPosY(-1);\n setScrapperPosX(-1);\n setIsScrollbarVisible(false);\n setIsGrabbed(false);\n }, [setIsGrabbed, setIsScrollbarVisible, setScrapperPosX, setScrapperPosY]);\n\n const handleMouseMove: React.MouseEventHandler = useCallback(\n (e) => {\n if (!isGrabbed) return;\n e.preventDefault();\n const clientX = e.clientX;\n const clientY = e.clientY;\n\n setActivePoint(null);\n if (xScroll) {\n const newPosition = lastScrollbarPosition?.current + clientX - startPosition;\n if (newPosition < 0) setXScrollbarPosition(0);\n else if (newPosition > innerWidth - innerWidth / containerRatio)\n setXScrollbarPosition(innerWidth - innerWidth / containerRatio);\n else setXScrollbarPosition(newPosition);\n }\n if (yScroll) {\n const newPosition = lastScrollbarPosition?.current + clientY - startPosition;\n\n if (newPosition < 0) setXScrollbarPosition(0);\n else if (newPosition > innerHeight - innerHeight / containerRatio)\n setXScrollbarPosition(innerHeight - innerHeight / containerRatio);\n else setXScrollbarPosition(newPosition);\n }\n },\n [\n isGrabbed,\n setActivePoint,\n xScroll,\n yScroll,\n lastScrollbarPosition,\n startPosition,\n setXScrollbarPosition,\n innerWidth,\n containerRatio,\n innerHeight,\n ],\n );\n const handleMouseUp = useCallback(() => {\n lastScrollbarPosition.current = xScrollbarPosition;\n setIsGrabbed(false);\n }, [lastScrollbarPosition, setIsGrabbed, xScrollbarPosition]);\n\n const render = useMemo(() => {\n if (currentData.length === 0) return null;\n if (xScroll) {\n return (\n <>\n {y2Axis ? <AxisRight /> : null}\n <AxisLeft />\n <ScrollableContainerX />\n </>\n );\n } else if (yScroll) {\n return (\n <>\n {y2Axis ? <AxisRight /> : null}\n <AxisBottom />\n <ScrollableContainerY />\n </>\n );\n }\n return (\n <>\n {y2Axis ? <AxisRight /> : null}\n <AxisLeft />\n <AxisBottom />\n <SeriesFactory />\n {scrapper?.type === 'horizontal' ? <Scrapper /> : null}\n {scrapper?.type === 'vertical' ? <VerticalScrapper /> : null}\n </>\n );\n }, [currentData.length, scrapper?.type, xAxis.advanced?.pointSpacing?.value, xScroll, y2Axis, yScroll]);\n return (\n <StyledSVGWrapper\n innerRef={setContainerRef}\n onKeyDown={onInputKeyDown}\n onKeyUp={handleOnKeyUp}\n tabIndex={activePoint ? -1 : 0}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n onMouseMove={handleMouseMove}\n onMouseUp={handleMouseUp}\n onMouseDown={(e) => e.preventDefault()}\n isGrabbed={isGrabbed}\n style={{ width: userWidth, height }}\n >\n {width !== 0 ? (\n <svg width={width} height={height}>\n {/* this clipaths for animations and focus ring.. need to give a deeper look */}\n <ClipPaths />\n <BlurMask />\n <g>\n <g>\n <Controllers />\n <Legend />\n <Labels />\n </g>\n <g className=\"container\" transform={`translate(${internalMargin.left},${internalMargin.top})`}>\n {render}\n {/* <ActivePoint/> @todo */}\n </g>\n </g>\n </svg>\n ) : null}\n </StyledSVGWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoGf;AApGR,mBAAwD;AACxD,oBAAiC;AACjC,0BAA6B;AAC7B,mCAAsC;AACtC,oBAAuB;AACvB,oBAAuB;AACvB,sBAAyB;AACzB,uBAA0B;AAC1B,kCAAqC;AACrC,kCAAqC;AACrC,wBAA2B;AAC3B,uBAA0B;AAC1B,sBAAyB;AACzB,2BAA8B;AAC9B,sBAAyB;AACzB,8BAAiC;AACjC,yBAA4B;AACrB,MAAM,iBAAiB,MAAM;AAClC,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ,SAAS,SAAS,UAAU,OAAO,OAAO,UAAU;AAAA,IACrE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,EAAE,gBAAgB,eAAe,cAAc,cAAc,QAAI,oDAAsB;AAE7F,QAAM,0BAAsB,0BAAY,MAAM;AAC5C,0BAAsB,IAAI;AAC1B,mBAAe,IAAI;AAAA,EACrB,GAAG,CAAC,gBAAgB,qBAAqB,CAAC;AAC1C,QAAM,0BAAsB,0BAAY,MAAM;AAC5C,oBAAgB,EAAE;AAClB,oBAAgB,EAAE;AAClB,0BAAsB,KAAK;AAC3B,iBAAa,KAAK;AAAA,EACpB,GAAG,CAAC,cAAc,uBAAuB,iBAAiB,eAAe,CAAC;AAE1E,QAAM,sBAA2C;AAAA,IAC/C,CAAC,MAAM;AACL,UAAI,CAAC;
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/parts/ClipPaths.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable arrow-body-style */\n/* eslint-disable indent */\nimport React, { useContext, useMemo } from 'react';\nimport { ChartContext } from '../ChartContext.js';\n\nexport const ClipPaths = () => {\n const { innerWidth, containerRatio, innerHeight, chartId, yScale } = useContext(ChartContext);\n\n return useMemo(() => {\n if (yScale?.type === 'BAND') {\n return (\n <defs>\n <clipPath id={`rect-focus-ring-${chartId}`}>\n <rect width={innerWidth + 4} height={innerHeight * containerRatio} x={1} />\n </clipPath>\n </defs>\n );\n }\n // if yScale is not band type we applied the clipPath to the xAxis to avoid the focus ring to be cut\n return (\n <defs>\n <clipPath id={`rect-focus-ring-${chartId}`}>\n <rect width={innerWidth * containerRatio + 4} height={innerHeight + 4} x={-4} y={-5} />\n </clipPath>\n </defs>\n );\n }, [chartId, containerRatio, innerHeight, innerWidth, yScale?.type]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADaX;AAXZ,mBAA2C;AAC3C,0BAA6B;AAEtB,MAAM,YAAY,MAAM;AAC7B,QAAM,EAAE,YAAY,gBAAgB,aAAa,SAAS,OAAO,QAAI,yBAAW,gCAAY;AAE5F,aAAO,sBAAQ,MAAM;AACnB,QAAI,QAAQ,SAAS,QAAQ;AAC3B,aACE,4CAAC,UACC,sDAAC,cAAS,IAAI,mBAAmB,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADaX;AAXZ,mBAA2C;AAC3C,0BAA6B;AAEtB,MAAM,YAAY,MAAM;AAC7B,QAAM,EAAE,YAAY,gBAAgB,aAAa,SAAS,OAAO,QAAI,yBAAW,gCAAY;AAE5F,aAAO,sBAAQ,MAAM;AACnB,QAAI,QAAQ,SAAS,QAAQ;AAC3B,aACE,4CAAC,UACC,sDAAC,cAAS,IAAI,mBAAmB,OAAO,IACtC,sDAAC,UAAK,OAAO,aAAa,GAAG,QAAQ,cAAc,gBAAgB,GAAG,GAAG,GAC3E,GACF;AAAA,IAEJ;AAEA,WACE,4CAAC,UACC,sDAAC,cAAS,IAAI,mBAAmB,OAAO,IACtC,sDAAC,UAAK,OAAO,aAAa,iBAAiB,GAAG,QAAQ,cAAc,GAAG,GAAG,IAAI,GAAG,IAAI,GACvF,GACF;AAAA,EAEJ,GAAG,CAAC,SAAS,gBAAgB,aAAa,YAAY,QAAQ,IAAI,CAAC;AACrE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Labels/Label.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport type { SetStateAction, Dispatch } from 'react';\nimport { StyledAxisLabel } from '../../styles.js';\n\nexport interface LabelT {\n x: number;\n y: number;\n rotateDegrees?: number;\n label: string;\n innerRef: Dispatch<SetStateAction<SVGGElement | null>>;\n}\n\nexport const Label: React.ComponentType<LabelT> = React.memo(({ innerRef, x, y, label, rotateDegrees = 0 }) => (\n <g ref={innerRef}>\n <g transform={`translate(${x},${y}) rotate(${rotateDegrees})`}>\n <StyledAxisLabel className=\"axis-label\" textAnchor=\"middle\">\n {label}\n </StyledAxisLabel>\n </g>\n </g>\n));\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADejB;AAfN,mBAAkB;AAElB,oBAAgC;AAUzB,MAAM,QAAqC,aAAAA,QAAM,KAAK,CAAC,EAAE,UAAU,GAAG,GAAG,OAAO,gBAAgB,EAAE,MACvG,4CAAC,OAAE,KAAK,UACN,sDAAC,OAAE,WAAW,aAAa,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADejB;AAfN,mBAAkB;AAElB,oBAAgC;AAUzB,MAAM,QAAqC,aAAAA,QAAM,KAAK,CAAC,EAAE,UAAU,GAAG,GAAG,OAAO,gBAAgB,EAAE,MACvG,4CAAC,OAAE,KAAK,UACN,sDAAC,OAAE,WAAW,aAAa,CAAC,IAAI,CAAC,YAAY,aAAa,KACxD,sDAAC,iCAAgB,WAAU,cAAa,YAAW,UAChD,iBACH,GACF,GACF,CACD;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -54,8 +54,7 @@ const BottomLegend = () => {
|
|
|
54
54
|
} = (0, import_react.useContext)(import_ChartContext.ChartContext);
|
|
55
55
|
const [xTransform, setXTransform] = (0, import_react.useState)(0);
|
|
56
56
|
(0, import_react.useEffect)(() => {
|
|
57
|
-
if (!bottomLegend)
|
|
58
|
-
return;
|
|
57
|
+
if (!bottomLegend) return;
|
|
59
58
|
const cells = (0, import_d3.select)(bottomLegend).selectAll(".cell");
|
|
60
59
|
const padding = 25;
|
|
61
60
|
let offset = 0;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/graphs/Chart/parts/Legend/BottomLegend.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext, useMemo, useEffect, useState } from 'react';\nimport { select } from 'd3';\nimport { ChartContext } from '../../ChartContext.js';\nimport { LegendItem } from './LegendItem.js';\n\nexport const BottomLegend = () => {\n const {\n colorScale,\n bottomLegendWidth,\n bottomLegend,\n axisBottomHeight,\n axisLeftWidth,\n innerWidth,\n innerHeight,\n bottomLabelHeight,\n internalMargin,\n currentData,\n width: graphWidth,\n setBottomLegend,\n } = useContext(ChartContext);\n\n const [xTransform, setXTransform] = useState(0);\n\n useEffect(() => {\n if (!bottomLegend) return;\n const cells = select(bottomLegend).selectAll('.cell');\n const padding = 25;\n let offset = 0;\n let verticalOffset = 0;\n\n currentData.forEach((_, i) => {\n if (cells.nodes()[i - 1]) {\n const lastCell = select(cells.nodes()[i - 1] as SVGGElement);\n const d3sel = select(cells.nodes()[i] as SVGGElement);\n const { width: currentCellWidth } = d3sel.node()?.getBBox() ?? { width: 0 };\n\n const lastCellWidth = lastCell.node()?.getBBox()?.width || 0;\n\n if (offset + lastCellWidth + padding + currentCellWidth + 10 > graphWidth) {\n offset = 0;\n verticalOffset += 20;\n } else {\n offset += lastCellWidth + padding;\n }\n\n d3sel.attr('transform', `translate(${offset}, ${verticalOffset})`);\n }\n });\n\n setXTransform(innerWidth / 2 + internalMargin.left - bottomLegendWidth / 2);\n }, [bottomLegend, currentData, bottomLegendWidth, axisLeftWidth, innerWidth, internalMargin.left, graphWidth]);\n\n return useMemo(\n () => (\n <g\n ref={setBottomLegend}\n transform={`translate(${xTransform}, ${\n innerHeight + bottomLabelHeight + axisBottomHeight + internalMargin.top\n })`}\n className=\"bottom-legend\"\n >\n {colorScale.domain().map((domainValue) => (\n <LegendItem domainValue={domainValue} key={domainValue} />\n ))}\n </g>\n ),\n\n [axisBottomHeight, bottomLabelHeight, colorScale, innerHeight, internalMargin.top, setBottomLegend, xTransform],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8Db;AA9DV,mBAAgE;AAChE,gBAAuB;AACvB,0BAA6B;AAC7B,wBAA2B;AAEpB,MAAM,eAAe,MAAM;AAChC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,CAAC;AAE9C,8BAAU,MAAM;AACd,QAAI,CAAC;
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8Db;AA9DV,mBAAgE;AAChE,gBAAuB;AACvB,0BAA6B;AAC7B,wBAA2B;AAEpB,MAAM,eAAe,MAAM;AAChC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,EACF,QAAI,yBAAW,gCAAY;AAE3B,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,CAAC;AAE9C,8BAAU,MAAM;AACd,QAAI,CAAC,aAAc;AACnB,UAAM,YAAQ,kBAAO,YAAY,EAAE,UAAU,OAAO;AACpD,UAAM,UAAU;AAChB,QAAI,SAAS;AACb,QAAI,iBAAiB;AAErB,gBAAY,QAAQ,CAAC,GAAG,MAAM;AAC5B,UAAI,MAAM,MAAM,EAAE,IAAI,CAAC,GAAG;AACxB,cAAM,eAAW,kBAAO,MAAM,MAAM,EAAE,IAAI,CAAC,CAAgB;AAC3D,cAAM,YAAQ,kBAAO,MAAM,MAAM,EAAE,CAAC,CAAgB;AACpD,cAAM,EAAE,OAAO,iBAAiB,IAAI,MAAM,KAAK,GAAG,QAAQ,KAAK,EAAE,OAAO,EAAE;AAE1E,cAAM,gBAAgB,SAAS,KAAK,GAAG,QAAQ,GAAG,SAAS;AAE3D,YAAI,SAAS,gBAAgB,UAAU,mBAAmB,KAAK,YAAY;AACzE,mBAAS;AACT,4BAAkB;AAAA,QACpB,OAAO;AACL,oBAAU,gBAAgB;AAAA,QAC5B;AAEA,cAAM,KAAK,aAAa,aAAa,MAAM,KAAK,cAAc,GAAG;AAAA,MACnE;AAAA,IACF,CAAC;AAED,kBAAc,aAAa,IAAI,eAAe,OAAO,oBAAoB,CAAC;AAAA,EAC5E,GAAG,CAAC,cAAc,aAAa,mBAAmB,eAAe,YAAY,eAAe,MAAM,UAAU,CAAC;AAE7G,aAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,WAAW,aAAa,UAAU,KAChC,cAAc,oBAAoB,mBAAmB,eAAe,GACtE;AAAA,QACA,WAAU;AAAA,QAET,qBAAW,OAAO,EAAE,IAAI,CAAC,gBACxB,4CAAC,gCAAW,eAA+B,WAAa,CACzD;AAAA;AAAA,IACH;AAAA,IAGF,CAAC,kBAAkB,mBAAmB,YAAY,aAAa,eAAe,KAAK,iBAAiB,UAAU;AAAA,EAChH;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|