@elliemae/ds-dataviz 3.26.1-rc.0 → 3.27.0-next.1
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/ChartContext.js.map +2 -2
- package/dist/cjs/graphs/Chart/config/useChart.js +14 -9
- package/dist/cjs/graphs/Chart/config/useChart.js.map +2 -2
- package/dist/cjs/graphs/Chart/config/useKeyboardNavigation.js +15 -16
- package/dist/cjs/graphs/Chart/config/useKeyboardNavigation.js.map +2 -2
- package/dist/esm/graphs/Chart/ChartContext.js.map +2 -2
- package/dist/esm/graphs/Chart/config/useChart.js +14 -9
- package/dist/esm/graphs/Chart/config/useChart.js.map +2 -2
- package/dist/esm/graphs/Chart/config/useKeyboardNavigation.js +15 -16
- package/dist/esm/graphs/Chart/config/useKeyboardNavigation.js.map +2 -2
- package/dist/types/graphs/Chart/ChartContext.d.ts +1 -0
- package/dist/types/graphs/Chart/SingleStackedBar/react-desc-prop-types.d.ts +1 -0
- package/dist/types/graphs/Chart/config/useChart.d.ts +11 -1
- package/dist/types/graphs/Chart/config/useKeyboardNavigation.d.ts +1 -1
- package/dist/types/graphs/Chart/react-desc-prop-types.d.ts +1 -0
- package/package.json +7 -7
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/graphs/Chart/ChartContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type React from 'react';\nimport { createContext, createRef } from 'react';\nimport type { ScaleBand, ScaleOrdinal } from 'd3';\nimport { scaleLinear, scaleBand, scaleOrdinal } from 'd3';\nimport type { DSChartT } from './react-desc-prop-types.js';\nimport { defaultProps } from './react-desc-prop-types.js';\nimport type { ScaleT } from './scales/index.js';\ninterface ContextT {\n props: DSChartT.Props;\n originalSeries: DSChartT.SeriesT;\n currentData: DSChartT.InternalData;\n xScale: ScaleT;\n yScale: ScaleT;\n y2Scale: ScaleT;\n innerHeight: number;\n innerWidth: number;\n activePoint: DSChartT.InternalDatum | null;\n containerRef: HTMLDivElement | null;\n setContainerRef: React.Dispatch<React.SetStateAction<SVGElement | null>>;\n groups: string[];\n subGroupScale?: ScaleBand<string> | null;\n colorScale: ScaleOrdinal<string, unknown, string>;\n axisLeftRef: SVGGElement | null;\n scrapperPosY: string;\n scrapperPosX: string;\n xScrollbarPosition: number;\n isGrabbed: boolean;\n startPosition: number;\n isScrollbarVisible: boolean;\n lastScrollbarPosition: React.MutableRefObject<number>;\n containerRatio: number;\n internalMargin: {\n bottom: number;\n top: number;\n right: number;\n left: number;\n };\n toolbarHeight: number;\n leftLegendHeight: number;\n rightLegendHeight: number;\n leftLabelHeight: number;\n leftLegendWidth: number;\n leftLabelWidth: number;\n leftLegend: SVGGElement;\n bottomLegend: SVGGElement;\n rightLegend: SVGGElement;\n axisBottomHeight: number;\n bottomLabelHeight: number;\n rightLabelWidth: number;\n axisRightWidth: number;\n isHorizontal: boolean;\n leftLabel: SVGGElement;\n chartId: string;\n hiddenSeries: string[];\n stackedData: DSChartT.StackedSeriesByGroupT;\n width: number;\n height: number;\n isZooming: boolean;\n zoomStartingPosition: number;\n movingPosition: number;\n setActivePoint: React.Dispatch<React.SetStateAction<DSChartT.InternalDatum | null>>;\n setLeftAxisRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getBandwidth: () => number;\n setScrapperPosY: React.Dispatch<React.SetStateAction<string>>;\n setScrapperPosX: React.Dispatch<React.SetStateAction<string>>;\n setXScrollbarPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsGrabbed: React.Dispatch<React.SetStateAction<boolean>>;\n setStartPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsScrollbarVisible: React.Dispatch<React.SetStateAction<boolean>>;\n setAxisLeftRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setTopLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisBottomRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisRightRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getXValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getYValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getXValueFormatted: (datum: DSChartT.InternalDatum) => string;\n getYValueFormatted: (datum: DSChartT.InternalDatum) => string;\n setHiddenSeries: React.Dispatch<React.SetStateAction<string[]>>;\n getXScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n getYScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n setContainerRatio: React.Dispatch<React.SetStateAction<number>>;\n setToolbarRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setMovingPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsZooming: React.Dispatch<React.SetStateAction<boolean>>;\n setZoomStartingPosition: React.Dispatch<React.SetStateAction<number>>;\n}\nconst defaultContext: ContextT = {\n props: defaultProps,\n xScale: scaleBand(),\n yScale: scaleLinear(),\n innerHeight: 0,\n innerWidth: 0,\n activePoint: null,\n setActivePoint: () => {},\n scrapperPosY: '',\n setScrapperPosY: () => {},\n containerRef: createRef<HTMLDivElement>(),\n groups: [],\n colorScale: scaleOrdinal(),\n setLeftAxisRef: () => {},\n};\nexport const ChartContext = createContext(defaultContext);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAyC;AAEzC,gBAAqD;AAErD,mCAA6B;
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport { createContext, createRef } from 'react';\nimport type { ScaleBand, ScaleOrdinal } from 'd3';\nimport { scaleLinear, scaleBand, scaleOrdinal } from 'd3';\nimport type { DSChartT } from './react-desc-prop-types.js';\nimport { defaultProps } from './react-desc-prop-types.js';\nimport type { ScaleT } from './scales/index.js';\ninterface ContextT {\n props: DSChartT.Props;\n originalSeries: DSChartT.SeriesT;\n currentData: DSChartT.InternalData;\n currentDataWithNullValues: DSChartT.InternalData;\n xScale: ScaleT;\n yScale: ScaleT;\n y2Scale: ScaleT;\n innerHeight: number;\n innerWidth: number;\n activePoint: DSChartT.InternalDatum | null;\n containerRef: HTMLDivElement | null;\n setContainerRef: React.Dispatch<React.SetStateAction<SVGElement | null>>;\n groups: string[];\n subGroupScale?: ScaleBand<string> | null;\n colorScale: ScaleOrdinal<string, unknown, string>;\n axisLeftRef: SVGGElement | null;\n scrapperPosY: string;\n scrapperPosX: string;\n xScrollbarPosition: number;\n isGrabbed: boolean;\n startPosition: number;\n isScrollbarVisible: boolean;\n lastScrollbarPosition: React.MutableRefObject<number>;\n containerRatio: number;\n internalMargin: {\n bottom: number;\n top: number;\n right: number;\n left: number;\n };\n toolbarHeight: number;\n leftLegendHeight: number;\n rightLegendHeight: number;\n leftLabelHeight: number;\n leftLegendWidth: number;\n leftLabelWidth: number;\n leftLegend: SVGGElement;\n bottomLegend: SVGGElement;\n rightLegend: SVGGElement;\n axisBottomHeight: number;\n bottomLabelHeight: number;\n rightLabelWidth: number;\n axisRightWidth: number;\n isHorizontal: boolean;\n leftLabel: SVGGElement;\n chartId: string;\n hiddenSeries: string[];\n stackedData: DSChartT.StackedSeriesByGroupT;\n width: number;\n height: number;\n isZooming: boolean;\n zoomStartingPosition: number;\n movingPosition: number;\n setActivePoint: React.Dispatch<React.SetStateAction<DSChartT.InternalDatum | null>>;\n setLeftAxisRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getBandwidth: () => number;\n setScrapperPosY: React.Dispatch<React.SetStateAction<string>>;\n setScrapperPosX: React.Dispatch<React.SetStateAction<string>>;\n setXScrollbarPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsGrabbed: React.Dispatch<React.SetStateAction<boolean>>;\n setStartPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsScrollbarVisible: React.Dispatch<React.SetStateAction<boolean>>;\n setAxisLeftRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setTopLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisBottomRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisRightRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getXValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getYValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getXValueFormatted: (datum: DSChartT.InternalDatum) => string;\n getYValueFormatted: (datum: DSChartT.InternalDatum) => string;\n setHiddenSeries: React.Dispatch<React.SetStateAction<string[]>>;\n getXScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n getYScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n setContainerRatio: React.Dispatch<React.SetStateAction<number>>;\n setToolbarRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setMovingPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsZooming: React.Dispatch<React.SetStateAction<boolean>>;\n setZoomStartingPosition: React.Dispatch<React.SetStateAction<number>>;\n}\nconst defaultContext: ContextT = {\n props: defaultProps,\n xScale: scaleBand(),\n yScale: scaleLinear(),\n innerHeight: 0,\n innerWidth: 0,\n activePoint: null,\n setActivePoint: () => {},\n scrapperPosY: '',\n setScrapperPosY: () => {},\n containerRef: createRef<HTMLDivElement>(),\n groups: [],\n colorScale: scaleOrdinal(),\n setLeftAxisRef: () => {},\n};\nexport const ChartContext = createContext(defaultContext);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAyC;AAEzC,gBAAqD;AAErD,mCAA6B;AAwF7B,MAAM,iBAA2B;AAAA,EAC/B,OAAO;AAAA,EACP,YAAQ,qBAAU;AAAA,EAClB,YAAQ,uBAAY;AAAA,EACpB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,cAAc;AAAA,EACd,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,kBAAc,wBAA0B;AAAA,EACxC,QAAQ,CAAC;AAAA,EACT,gBAAY,wBAAa;AAAA,EACzB,gBAAgB,MAAM;AAAA,EAAC;AACzB;AACO,MAAM,mBAAe,4BAAc,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -154,8 +154,8 @@ const useChart = (props) => {
|
|
|
154
154
|
}
|
|
155
155
|
return "y";
|
|
156
156
|
}, [xAxis.type, yAxis.type]);
|
|
157
|
-
const currentData = (0, import_react.useMemo)(
|
|
158
|
-
|
|
157
|
+
const [currentDataWithNullValues, currentData] = (0, import_react.useMemo)(() => {
|
|
158
|
+
const baseData = originalSeries.filter((serie) => !hiddenSeries.includes(serie.name)).map((d, i) => ({
|
|
159
159
|
...d,
|
|
160
160
|
// we set a default on the scale if the user do not pass it
|
|
161
161
|
scale: d.scale || defaultScale,
|
|
@@ -166,11 +166,14 @@ const useChart = (props) => {
|
|
|
166
166
|
position: index,
|
|
167
167
|
serie: d.name,
|
|
168
168
|
scale: d.scale
|
|
169
|
-
}))
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
169
|
+
}))
|
|
170
|
+
}));
|
|
171
|
+
const currentDataWithoutNulls = baseData.map((data) => ({
|
|
172
|
+
...data,
|
|
173
|
+
data: data.data.filter((datum) => datum.value !== null && datum.value !== void 0)
|
|
174
|
+
}));
|
|
175
|
+
return [baseData, currentDataWithoutNulls];
|
|
176
|
+
}, [defaultScale, hiddenSeries, originalSeries]);
|
|
174
177
|
const isHorizontal = (0, import_react.useMemo)(() => yAxis?.type === "band", [yAxis]);
|
|
175
178
|
const stackedData = (0, import_react.useMemo)(
|
|
176
179
|
() => (0, import_helpers.stackData)(groupsStacked, originalSeries, hiddenSeries, isHorizontal),
|
|
@@ -280,7 +283,8 @@ const useChart = (props) => {
|
|
|
280
283
|
leftLabelWidth,
|
|
281
284
|
axisLeftWidth,
|
|
282
285
|
topLegendHeight,
|
|
283
|
-
leftLegendHeight
|
|
286
|
+
leftLegendHeight,
|
|
287
|
+
currentDataWithNullValues
|
|
284
288
|
}),
|
|
285
289
|
[
|
|
286
290
|
props,
|
|
@@ -338,7 +342,8 @@ const useChart = (props) => {
|
|
|
338
342
|
leftLabelWidth,
|
|
339
343
|
axisLeftWidth,
|
|
340
344
|
topLegendHeight,
|
|
341
|
-
leftLegendHeight
|
|
345
|
+
leftLegendHeight,
|
|
346
|
+
currentDataWithNullValues
|
|
342
347
|
]
|
|
343
348
|
);
|
|
344
349
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/config/useChart.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-nested-callbacks */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useState, useEffect, useRef } from 'react';\nimport { uid } from 'uid';\nimport { debounce } from 'lodash';\nimport type { DSChartT } from '../react-desc-prop-types.js';\nimport { defaultProps, propTypes } from '../react-desc-prop-types.js';\nimport { useScales } from './useScales.js';\nimport { stackData } from '../helpers/index.js';\nimport { useInternalMargins } from './useInternalMargins.js';\nimport { useGetters } from './useGetters.js';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { useValidateProps } from './useValidateProps.js';\ntype ResizeObserverConstructorEntries = Parameters<ConstructorParameters<typeof ResizeObserver>[0]>[0];\n\nconst useResizeObserver = (ref: HTMLElement | null | undefined) => {\n const [dimensions, setDimensions] = useState<number>(0);\n\n useEffect(() => {\n if (ref) {\n const observeTarget = ref;\n const resizeObserver = new ResizeObserver(\n debounce((entries: ResizeObserverConstructorEntries) => {\n entries.forEach((entry) => {\n setDimensions(Math.ceil(entry.contentRect.width));\n });\n }, 200),\n );\n resizeObserver.observe(observeTarget);\n\n return () => {\n resizeObserver.unobserve(observeTarget);\n };\n }\n }, [ref]);\n return dimensions;\n};\n\nexport const useChart = (props: DSChartT.Props) => {\n useValidateProps(props, propTypes);\n\n // const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n const { series, yAxis, xAxis, width: userWidth, height: userHeight, groups: groupsStacked } = props;\n const userRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n const originalSeries = useMemo(() => {\n if (series.length === 0) {\n return defaultProps.series;\n }\n return series;\n }, [series]);\n const [containerRef, setContainerRef] = useState<HTMLDivElement | null>(null);\n const svgRef = useRef(null);\n\n const dimensionWidth = useResizeObserver(containerRef);\n\n const width = useMemo(() => userWidth ?? dimensionWidth ?? 0, [dimensionWidth, userWidth]);\n\n const height = useMemo(() => userHeight ?? 500, [userHeight]);\n\n const [isGrabbed, setIsGrabbed] = useState(false);\n const [startPosition, setStartPosition] = useState(0);\n\n // zoom\n\n const [isZooming, setIsZooming] = useState(false);\n const [zoomStartingPosition, setZoomStartingPosition] = useState(0);\n const [movingPosition, setMovingPosition] = useState(0);\n\n //\n\n const [activePoint, setActivePoint] = useState(null);\n const [activeSerie, setActiveSerie] = useState('');\n const [scrapperPosY, setScrapperPosY] = useState('');\n const [scrapperPosX, setScrapperPosX] = useState('');\n const [xScrollbarPosition, setXScrollbarPosition] = useState(0);\n const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);\n const [containerRatio, setContainerRatio] = useState(userRatio);\n\n const lastScrollbarPosition = useRef(0);\n\n const [axisLeftRef, setAxisLeftRef] = useState<SVGGElement | null>(null);\n const [axisBottomRef, setAxisBottomRef] = useState<SVGGElement | null>(null);\n const [axisRightRef, setAxisRightRef] = useState<SVGGElement | null>(null);\n\n const [leftLegend, setLeftLegend] = useState<SVGGElement | null>(null);\n const [rightLegend, setRightLegend] = useState<SVGGElement | null>(null);\n const [topLegend, setTopLegend] = useState<SVGGElement | null>(null);\n const [bottomLegend, setBottomLegend] = useState<SVGGElement | null>(null);\n\n const [rightLabel, setRightLabel] = useState<SVGGElement | null>(null);\n const [leftLabel, setLeftLabel] = useState<SVGGElement | null>(null);\n const [bottomLabel, setBottomLabel] = useState<SVGGElement | null>(null);\n\n const [toolbarRef, setToolbarRef] = useState<SVGGElement | null>(null);\n\n // we reset the scrollbar position when the chart resize\n useEffect(() => {\n lastScrollbarPosition.current = 0;\n setXScrollbarPosition(0);\n }, [dimensionWidth]);\n\n useEffect(() => {\n setContainerRatio(userRatio);\n }, [userRatio]);\n\n const {\n toolbarHeight,\n axisBottomHeight,\n axisRightWidth,\n bottomLabelHeight,\n internalMargin,\n leftLegendWidth,\n rightLabelWidth,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n } = useInternalMargins({\n axisLeftRef,\n axisBottomRef,\n axisRightRef,\n leftLabel,\n leftLegend,\n rightLegend,\n topLegend,\n bottomLegend,\n rightLabel,\n bottomLabel,\n toolbarRef,\n });\n\n const innerWidth = useMemo(\n () => width - internalMargin.left - internalMargin.right,\n [internalMargin.left, internalMargin.right, width],\n );\n const innerHeight = useMemo(\n () => height - internalMargin.top - internalMargin.bottom,\n [internalMargin.top, internalMargin.bottom, height],\n );\n\n const [hiddenSeries, setHiddenSeries] = useState<string[]>([]);\n\n const defaultScale = useMemo(() => {\n if (yAxis.type === 'band') {\n return 'x';\n }\n\n if ([undefined, 'band'].includes(xAxis.type)) {\n return 'y';\n }\n\n return 'y';\n }, [xAxis.type, yAxis.type]);\n const currentData = useMemo(\n () =>\n originalSeries\n .filter((serie) => !hiddenSeries.includes(serie.name))\n .map((d, i) => ({\n ...d,\n // we set a default on the scale if the user do not pass it\n scale: d.scale || defaultScale,\n key: `${d.name}-${i}`,\n data: d.data\n .map((value, index) => ({\n key: `${d.name}-${i}-${index}`,\n value,\n position: index,\n serie: d.name,\n scale: d.scale,\n }))\n .filter((datum) => datum.value !== null && datum.value !== undefined), // basically converting from DSChartT.SeriesT to DSChartT.InternalData...\n })) as DSChartT.InternalData,\n [defaultScale, hiddenSeries, originalSeries],\n );\n\n const isHorizontal = useMemo(() => yAxis?.type === 'band', [yAxis]);\n\n const stackedData = useMemo(\n () => stackData(groupsStacked, originalSeries, hiddenSeries, isHorizontal),\n [groupsStacked, originalSeries, hiddenSeries, isHorizontal],\n );\n\n // @TODO we need to create a logic to get this from both axis\n // const containerRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n\n const groups = useMemo(() => currentData.map((serie) => serie.name), [currentData]);\n\n const { xScale, yScale, y2Scale, subGroupScale, colorScale, getBandwidth } = useScales({\n props,\n originalSeries,\n innerHeight,\n innerWidth,\n groups,\n stackedData,\n currentData,\n containerRatio,\n });\n\n const { getXValue, getYValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted } = useGetters({\n xAxis,\n yAxis,\n isHorizontal,\n xScale,\n yScale,\n y2Scale,\n });\n const chartId = useMemo(() => uid(6), []);\n\n return useMemo(\n () => ({\n props,\n originalSeries,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n svgRef,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n setScrapperPosY,\n scrapperPosX,\n setScrapperPosX,\n activePoint,\n setActivePoint,\n activeSerie,\n setActiveSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n setContainerRef,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n lastScrollbarPosition,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n setAxisLeftRef,\n setLeftLegend,\n setRightLegend,\n rightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomRef,\n axisBottomHeight,\n setAxisRightRef,\n setRightLabel,\n setBottomLabel,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n setLeftLabel,\n leftLabel,\n chartId,\n hiddenSeries,\n setHiddenSeries,\n height,\n width,\n setContainerRatio,\n toolbarHeight,\n setToolbarRef,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n }),\n [\n props,\n originalSeries,\n isZooming,\n zoomStartingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n scrapperPosX,\n activePoint,\n activeSerie,\n xScrollbarPosition,\n isGrabbed,\n startPosition,\n isScrollbarVisible,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n rightLegend,\n axisBottomHeight,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n leftLabel,\n chartId,\n hiddenSeries,\n height,\n width,\n toolbarHeight,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable max-nested-callbacks */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useState, useEffect, useRef } from 'react';\nimport { uid } from 'uid';\nimport { debounce } from 'lodash';\nimport type { DSChartT } from '../react-desc-prop-types.js';\nimport { defaultProps, propTypes } from '../react-desc-prop-types.js';\nimport { useScales } from './useScales.js';\nimport { stackData } from '../helpers/index.js';\nimport { useInternalMargins } from './useInternalMargins.js';\nimport { useGetters } from './useGetters.js';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { useValidateProps } from './useValidateProps.js';\ntype ResizeObserverConstructorEntries = Parameters<ConstructorParameters<typeof ResizeObserver>[0]>[0];\n\nconst useResizeObserver = (ref: HTMLElement | null | undefined) => {\n const [dimensions, setDimensions] = useState<number>(0);\n\n useEffect(() => {\n if (ref) {\n const observeTarget = ref;\n const resizeObserver = new ResizeObserver(\n debounce((entries: ResizeObserverConstructorEntries) => {\n entries.forEach((entry) => {\n setDimensions(Math.ceil(entry.contentRect.width));\n });\n }, 200),\n );\n resizeObserver.observe(observeTarget);\n\n return () => {\n resizeObserver.unobserve(observeTarget);\n };\n }\n }, [ref]);\n return dimensions;\n};\n\nexport const useChart = (props: DSChartT.Props) => {\n useValidateProps(props, propTypes);\n\n // const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n const { series, yAxis, xAxis, width: userWidth, height: userHeight, groups: groupsStacked } = props;\n const userRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n const originalSeries = useMemo(() => {\n if (series.length === 0) {\n return defaultProps.series;\n }\n return series;\n }, [series]);\n const [containerRef, setContainerRef] = useState<HTMLDivElement | null>(null);\n const svgRef = useRef(null);\n\n const dimensionWidth = useResizeObserver(containerRef);\n\n const width = useMemo(() => userWidth ?? dimensionWidth ?? 0, [dimensionWidth, userWidth]);\n\n const height = useMemo(() => userHeight ?? 500, [userHeight]);\n\n const [isGrabbed, setIsGrabbed] = useState(false);\n const [startPosition, setStartPosition] = useState(0);\n\n // zoom\n\n const [isZooming, setIsZooming] = useState(false);\n const [zoomStartingPosition, setZoomStartingPosition] = useState(0);\n const [movingPosition, setMovingPosition] = useState(0);\n\n //\n\n const [activePoint, setActivePoint] = useState(null);\n const [activeSerie, setActiveSerie] = useState('');\n const [scrapperPosY, setScrapperPosY] = useState('');\n const [scrapperPosX, setScrapperPosX] = useState('');\n const [xScrollbarPosition, setXScrollbarPosition] = useState(0);\n const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);\n const [containerRatio, setContainerRatio] = useState(userRatio);\n\n const lastScrollbarPosition = useRef(0);\n\n const [axisLeftRef, setAxisLeftRef] = useState<SVGGElement | null>(null);\n const [axisBottomRef, setAxisBottomRef] = useState<SVGGElement | null>(null);\n const [axisRightRef, setAxisRightRef] = useState<SVGGElement | null>(null);\n\n const [leftLegend, setLeftLegend] = useState<SVGGElement | null>(null);\n const [rightLegend, setRightLegend] = useState<SVGGElement | null>(null);\n const [topLegend, setTopLegend] = useState<SVGGElement | null>(null);\n const [bottomLegend, setBottomLegend] = useState<SVGGElement | null>(null);\n\n const [rightLabel, setRightLabel] = useState<SVGGElement | null>(null);\n const [leftLabel, setLeftLabel] = useState<SVGGElement | null>(null);\n const [bottomLabel, setBottomLabel] = useState<SVGGElement | null>(null);\n\n const [toolbarRef, setToolbarRef] = useState<SVGGElement | null>(null);\n\n // we reset the scrollbar position when the chart resize\n useEffect(() => {\n lastScrollbarPosition.current = 0;\n setXScrollbarPosition(0);\n }, [dimensionWidth]);\n\n useEffect(() => {\n setContainerRatio(userRatio);\n }, [userRatio]);\n\n const {\n toolbarHeight,\n axisBottomHeight,\n axisRightWidth,\n bottomLabelHeight,\n internalMargin,\n leftLegendWidth,\n rightLabelWidth,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n } = useInternalMargins({\n axisLeftRef,\n axisBottomRef,\n axisRightRef,\n leftLabel,\n leftLegend,\n rightLegend,\n topLegend,\n bottomLegend,\n rightLabel,\n bottomLabel,\n toolbarRef,\n });\n\n const innerWidth = useMemo(\n () => width - internalMargin.left - internalMargin.right,\n [internalMargin.left, internalMargin.right, width],\n );\n const innerHeight = useMemo(\n () => height - internalMargin.top - internalMargin.bottom,\n [internalMargin.top, internalMargin.bottom, height],\n );\n\n const [hiddenSeries, setHiddenSeries] = useState<string[]>([]);\n\n const defaultScale = useMemo(() => {\n if (yAxis.type === 'band') {\n return 'x';\n }\n\n if ([undefined, 'band'].includes(xAxis.type)) {\n return 'y';\n }\n\n return 'y';\n }, [xAxis.type, yAxis.type]);\n\n const [currentDataWithNullValues, currentData] = useMemo(() => {\n const baseData = originalSeries\n .filter((serie) => !hiddenSeries.includes(serie.name))\n .map((d, i) => ({\n ...d,\n // we set a default on the scale if the user do not pass it\n scale: d.scale || defaultScale,\n key: `${d.name}-${i}`,\n data: d.data.map((value, index) => ({\n key: `${d.name}-${i}-${index}`,\n value,\n position: index,\n serie: d.name,\n scale: d.scale,\n })),\n })) as DSChartT.InternalData;\n\n const currentDataWithoutNulls = baseData.map((data) => ({\n ...data,\n data: data.data.filter((datum) => datum.value !== null && datum.value !== undefined),\n }));\n\n return [baseData, currentDataWithoutNulls];\n }, [defaultScale, hiddenSeries, originalSeries]);\n\n const isHorizontal = useMemo(() => yAxis?.type === 'band', [yAxis]);\n\n const stackedData = useMemo(\n () => stackData(groupsStacked, originalSeries, hiddenSeries, isHorizontal),\n [groupsStacked, originalSeries, hiddenSeries, isHorizontal],\n );\n\n // @TODO we need to create a logic to get this from both axis\n // const containerRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n\n const groups = useMemo(() => currentData.map((serie) => serie.name), [currentData]);\n\n const { xScale, yScale, y2Scale, subGroupScale, colorScale, getBandwidth } = useScales({\n props,\n originalSeries,\n innerHeight,\n innerWidth,\n groups,\n stackedData,\n currentData,\n containerRatio,\n });\n\n const { getXValue, getYValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted } = useGetters({\n xAxis,\n yAxis,\n isHorizontal,\n xScale,\n yScale,\n y2Scale,\n });\n const chartId = useMemo(() => uid(6), []);\n\n return useMemo(\n () => ({\n props,\n originalSeries,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n svgRef,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n setScrapperPosY,\n scrapperPosX,\n setScrapperPosX,\n activePoint,\n setActivePoint,\n activeSerie,\n setActiveSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n setContainerRef,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n lastScrollbarPosition,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n setAxisLeftRef,\n setLeftLegend,\n setRightLegend,\n rightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomRef,\n axisBottomHeight,\n setAxisRightRef,\n setRightLabel,\n setBottomLabel,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n setLeftLabel,\n leftLabel,\n chartId,\n hiddenSeries,\n setHiddenSeries,\n height,\n width,\n setContainerRatio,\n toolbarHeight,\n setToolbarRef,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n currentDataWithNullValues,\n }),\n [\n props,\n originalSeries,\n isZooming,\n zoomStartingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n scrapperPosX,\n activePoint,\n activeSerie,\n xScrollbarPosition,\n isGrabbed,\n startPosition,\n isScrollbarVisible,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n rightLegend,\n axisBottomHeight,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n leftLabel,\n chartId,\n hiddenSeries,\n height,\n width,\n toolbarHeight,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n currentDataWithNullValues,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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AA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["ResizeObserver"]
|
|
7
7
|
}
|
|
@@ -35,10 +35,11 @@ module.exports = __toCommonJS(useKeyboardNavigation_exports);
|
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_react = require("react");
|
|
37
37
|
var import_ChartContext = require("../ChartContext.js");
|
|
38
|
-
const findInCircularList = (list, from, step = 1) => {
|
|
38
|
+
const findInCircularList = (list, from, step = 1, criteria = (item) => item !== void 0) => {
|
|
39
39
|
for (let i = (from + step + list.length) % list.length; i !== from && from > -1; i = (i + step + list.length) % list.length) {
|
|
40
|
-
if (list[i])
|
|
40
|
+
if (list[i] && criteria(i)) {
|
|
41
41
|
return i;
|
|
42
|
+
}
|
|
42
43
|
}
|
|
43
44
|
return from;
|
|
44
45
|
};
|
|
@@ -64,14 +65,14 @@ const useKeyboardNavigation = () => {
|
|
|
64
65
|
setZoomStartingPosition,
|
|
65
66
|
setMovingPosition,
|
|
66
67
|
setContainerRatio,
|
|
67
|
-
|
|
68
|
+
currentDataWithNullValues,
|
|
68
69
|
props: { xAxis, yAxis, xScroll, yScroll }
|
|
69
70
|
} = (0, import_react.useContext)(import_ChartContext.ChartContext);
|
|
70
71
|
const xScrollable = xAxis.advanced?.pointSpacing?.value > 1 || xScroll;
|
|
71
72
|
const yScrollable = yAxis.advanced?.pointSpacing?.value > 1 || yScroll;
|
|
72
73
|
const currentSerie = (0, import_react.useMemo)(
|
|
73
|
-
() =>
|
|
74
|
-
[activePoint?.serie,
|
|
74
|
+
() => currentDataWithNullValues.find((d) => d.name === activePoint?.serie) ?? currentDataWithNullValues[0],
|
|
75
|
+
[activePoint?.serie, currentDataWithNullValues]
|
|
75
76
|
);
|
|
76
77
|
const currentActiveItemIndex = (0, import_react.useMemo)(
|
|
77
78
|
() => currentSerie?.data.findIndex((opt) => opt.key === activePoint?.key),
|
|
@@ -96,7 +97,7 @@ const useKeyboardNavigation = () => {
|
|
|
96
97
|
const navigateSerie = (0, import_react.useCallback)(
|
|
97
98
|
(step) => {
|
|
98
99
|
const newValue = findInCircularList(
|
|
99
|
-
currentSerie?.data.map((d) => d.value
|
|
100
|
+
currentSerie?.data.map((d) => d.value?.toString()),
|
|
100
101
|
currentActiveItemIndex,
|
|
101
102
|
step
|
|
102
103
|
);
|
|
@@ -155,17 +156,15 @@ const useKeyboardNavigation = () => {
|
|
|
155
156
|
);
|
|
156
157
|
const changeSerie = (0, import_react.useCallback)(
|
|
157
158
|
(step) => {
|
|
158
|
-
const
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
});
|
|
166
|
-
setActivePoint(nextSerie?.data[currentActiveItemIndex] || nextSerie?.data?.[0] || null);
|
|
159
|
+
const nextSerieIndex = findInCircularList(
|
|
160
|
+
groups,
|
|
161
|
+
groups.findIndex((item) => item === currentSerie.name),
|
|
162
|
+
step,
|
|
163
|
+
(idx) => currentDataWithNullValues[idx].data[currentActiveItemIndex].value !== null
|
|
164
|
+
);
|
|
165
|
+
setActivePoint(currentDataWithNullValues[nextSerieIndex].data[currentActiveItemIndex]);
|
|
167
166
|
},
|
|
168
|
-
[
|
|
167
|
+
[groups, setActivePoint, currentActiveItemIndex, currentSerie.name, currentDataWithNullValues]
|
|
169
168
|
);
|
|
170
169
|
const onInputKeyDown = (0, import_react.useCallback)(
|
|
171
170
|
(e) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/graphs/Chart/config/useKeyboardNavigation.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
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';\n\nexport const findInCircularList = (\n list: string[],\n from: number,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i]) return i;\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const {\n activePoint,\n setActivePoint,\n containerRef,\n xScale,\n yScale,\n lastScrollbarPosition,\n setXScrollbarPosition,\n containerRatio,\n xScrollbarPosition,\n innerWidth,\n innerHeight,\n getXScaleValue,\n getYScaleValue,\n groups,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n setContainerRatio,\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAiD;AACjD,0BAA6B;AAEtB,MAAM,qBAAqB,CAChC,MACA,MACA,OAAO,
|
|
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';\n\nexport const findInCircularList = (\n list: string[],\n from: number,\n step = 1,\n criteria = (item: number) => item !== undefined,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i] && criteria(i)) {\n return i;\n }\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const {\n activePoint,\n setActivePoint,\n containerRef,\n xScale,\n yScale,\n lastScrollbarPosition,\n setXScrollbarPosition,\n containerRatio,\n xScrollbarPosition,\n innerWidth,\n innerHeight,\n getXScaleValue,\n getYScaleValue,\n groups,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n setContainerRatio,\n currentDataWithNullValues,\n props: { xAxis, yAxis, xScroll, yScroll },\n } = useContext(ChartContext);\n\n const xScrollable = xAxis.advanced?.pointSpacing?.value > 1 || xScroll;\n const yScrollable = yAxis.advanced?.pointSpacing?.value > 1 || yScroll;\n\n const currentSerie = useMemo(\n () => currentDataWithNullValues.find((d) => d.name === activePoint?.serie) ?? currentDataWithNullValues[0],\n [activePoint?.serie, currentDataWithNullValues],\n );\n\n const currentActiveItemIndex = useMemo(\n () => currentSerie?.data.findIndex((opt) => opt.key === activePoint?.key),\n [activePoint, currentSerie],\n );\n\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (containerRef === e.target && activePoint === null) {\n setActivePoint(currentSerie?.data[0]);\n setXScrollbarPosition(0);\n }\n },\n [activePoint, containerRef, currentSerie?.data, setActivePoint, setXScrollbarPosition],\n );\n\n const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = useCallback(() => {\n setTimeout(() => {\n if (!containerRef?.contains(document.activeElement)) {\n setActivePoint(null);\n }\n });\n }, [setActivePoint, containerRef]);\n\n const navigateSerie = useCallback(\n (step: number) => {\n const newValue = findInCircularList(\n currentSerie?.data.map((d) => d.value?.toString()),\n currentActiveItemIndex,\n step,\n );\n setActivePoint(currentSerie?.data[newValue]);\n\n if (xScrollable) {\n const xValue = getXScaleValue(currentSerie?.data[newValue]);\n if (xValue === undefined) return;\n const barWidth = innerWidth / containerRatio;\n const total = innerWidth * containerRatio;\n if (total <= xValue) {\n // to go from the first to last\n setXScrollbarPosition((total - innerWidth) / containerRatio);\n } else if (xValue > xScrollbarPosition * containerRatio + innerWidth)\n // if is not visible we move the scroll to the next best position\n setXScrollbarPosition((prev) => {\n const nextPosition = prev + (xValue / containerRatio - prev);\n if (nextPosition + barWidth > innerWidth) return innerWidth - barWidth;\n return nextPosition;\n });\n // move backwards - 2 because focus ring in bars\n else if (xValue < xScrollbarPosition * containerRatio) setXScrollbarPosition(xValue / containerRatio);\n }\n if (yScrollable) {\n const yValue = getYScaleValue(currentSerie?.data[newValue]);\n if (yValue === undefined) return;\n const barWidth = innerHeight / containerRatio;\n const total = innerHeight * containerRatio;\n if (total <= yValue) {\n // to go from the first to last\n setXScrollbarPosition((total - innerHeight) / containerRatio);\n } else if (yValue > xScrollbarPosition * containerRatio + innerHeight)\n // if is not visible we move the scroll to the next best position\n setXScrollbarPosition((prev) => {\n const nextPosition = prev + (yValue / containerRatio - prev);\n if (nextPosition + barWidth > innerHeight) return innerHeight - barWidth;\n return nextPosition;\n });\n // move backwards - 2 because focus ring in bars\n else if (yValue < xScrollbarPosition * containerRatio) setXScrollbarPosition(yValue / containerRatio);\n }\n },\n [\n currentSerie?.data,\n currentActiveItemIndex,\n setActivePoint,\n xScrollable,\n yScrollable,\n getXScaleValue,\n innerWidth,\n containerRatio,\n xScrollbarPosition,\n setXScrollbarPosition,\n getYScaleValue,\n innerHeight,\n ],\n );\n\n const changeSerie = useCallback(\n (step: number) => {\n const nextSerieIndex = findInCircularList(\n groups,\n groups.findIndex((item) => item === currentSerie.name),\n step,\n (idx: number) => currentDataWithNullValues[idx].data[currentActiveItemIndex].value !== null,\n );\n setActivePoint(currentDataWithNullValues[nextSerieIndex].data[currentActiveItemIndex]);\n },\n [groups, setActivePoint, currentActiveItemIndex, currentSerie.name, currentDataWithNullValues],\n );\n\n const onInputKeyDown: React.KeyboardEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (!activePoint) return;\n if (e.code !== 'Tab') {\n e.preventDefault();\n }\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n if (yScale.type === 'BAND') changeSerie(e.code === 'ArrowLeft' ? -1 : 1);\n else navigateSerie(e.code === 'ArrowLeft' ? -1 : 1);\n }\n\n if (['ArrowDown', 'ArrowUp'].includes(e.code)) {\n if (yScale.type === 'BAND') navigateSerie(e.code === 'ArrowDown' ? 1 : -1);\n else changeSerie(e.code === 'ArrowDown' ? -1 : 1);\n }\n\n const { code } = e;\n const isShiftKey = ['ShiftLeft', 'ShiftRight'].includes(code);\n\n if (isShiftKey && !isZooming && !xScale.type === 'BAND') {\n setIsZooming(true);\n setZoomStartingPosition(getXScaleValue(activePoint) - xScrollbarPosition * containerRatio);\n }\n },\n [\n activePoint,\n changeSerie,\n containerRatio,\n getXScaleValue,\n isZooming,\n navigateSerie,\n setIsZooming,\n setZoomStartingPosition,\n xScale.type,\n xScrollbarPosition,\n yScale.type,\n ],\n );\n\n const handleOnKeyUp: React.KeyboardEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (!isZooming && xScale.type === 'BAND') return false;\n const { shiftKey, code } = e;\n const isShiftKey = ['ShiftLeft', 'ShiftRight'].includes(code);\n\n if (shiftKey && ['ArrowRight', 'ArrowLeft'].includes(code)) {\n setMovingPosition(getXScaleValue(activePoint) - xScrollbarPosition * containerRatio);\n }\n if (isShiftKey) {\n setIsZooming(false);\n setZoomStartingPosition(0);\n setMovingPosition(0);\n const endingPosition = getXScaleValue(activePoint) - xScrollbarPosition * containerRatio;\n // isRightDirection is used to know if we are zooming right or left direction\n const isRightDirection = zoomStartingPosition < endingPosition;\n const offsetActivePoint = findInCircularList(\n currentSerie?.data.map((d) => d.value.toString()),\n currentActiveItemIndex,\n isRightDirection ? 1 : -1,\n );\n // we do this so the activePoint does not fall into the blur gradient\n const correctEndingPosition =\n getXScaleValue(currentSerie?.data[offsetActivePoint]) - xScrollbarPosition * containerRatio;\n const diff = Math.abs(zoomStartingPosition - correctEndingPosition);\n if (diff <= 0) return;\n const newRatio =\n innerWidth / ((innerWidth * containerRatio) / diff) < 40\n ? innerWidth / 40\n : (innerWidth * containerRatio) / diff;\n const newPosition =\n lastScrollbarPosition?.current +\n (!isRightDirection ? correctEndingPosition : zoomStartingPosition) / containerRatio;\n\n // if is bigger thant innerwidth possible we force the end\n if (newPosition > innerWidth - innerWidth / newRatio) setXScrollbarPosition(innerWidth - innerWidth / newRatio);\n else setXScrollbarPosition(newPosition);\n setActivePoint(null);\n setTimeout(() => setActivePoint(activePoint));\n setContainerRatio(newRatio);\n lastScrollbarPosition.current = newPosition;\n }\n },\n [\n activePoint,\n containerRatio,\n currentActiveItemIndex,\n currentSerie?.data,\n getXScaleValue,\n innerWidth,\n isZooming,\n lastScrollbarPosition,\n setActivePoint,\n setContainerRatio,\n setIsZooming,\n setMovingPosition,\n setXScrollbarPosition,\n setZoomStartingPosition,\n xScale.type,\n xScrollbarPosition,\n zoomStartingPosition,\n ],\n );\n return useMemo(\n () => ({ handleOnKeyUp, onInputKeyDown, handleOnBlur, handleOnFocus }),\n [handleOnBlur, handleOnFocus, handleOnKeyUp, onInputKeyDown],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/graphs/Chart/ChartContext.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { createContext, createRef } from 'react';\nimport type { ScaleBand, ScaleOrdinal } from 'd3';\nimport { scaleLinear, scaleBand, scaleOrdinal } from 'd3';\nimport type { DSChartT } from './react-desc-prop-types.js';\nimport { defaultProps } from './react-desc-prop-types.js';\nimport type { ScaleT } from './scales/index.js';\ninterface ContextT {\n props: DSChartT.Props;\n originalSeries: DSChartT.SeriesT;\n currentData: DSChartT.InternalData;\n xScale: ScaleT;\n yScale: ScaleT;\n y2Scale: ScaleT;\n innerHeight: number;\n innerWidth: number;\n activePoint: DSChartT.InternalDatum | null;\n containerRef: HTMLDivElement | null;\n setContainerRef: React.Dispatch<React.SetStateAction<SVGElement | null>>;\n groups: string[];\n subGroupScale?: ScaleBand<string> | null;\n colorScale: ScaleOrdinal<string, unknown, string>;\n axisLeftRef: SVGGElement | null;\n scrapperPosY: string;\n scrapperPosX: string;\n xScrollbarPosition: number;\n isGrabbed: boolean;\n startPosition: number;\n isScrollbarVisible: boolean;\n lastScrollbarPosition: React.MutableRefObject<number>;\n containerRatio: number;\n internalMargin: {\n bottom: number;\n top: number;\n right: number;\n left: number;\n };\n toolbarHeight: number;\n leftLegendHeight: number;\n rightLegendHeight: number;\n leftLabelHeight: number;\n leftLegendWidth: number;\n leftLabelWidth: number;\n leftLegend: SVGGElement;\n bottomLegend: SVGGElement;\n rightLegend: SVGGElement;\n axisBottomHeight: number;\n bottomLabelHeight: number;\n rightLabelWidth: number;\n axisRightWidth: number;\n isHorizontal: boolean;\n leftLabel: SVGGElement;\n chartId: string;\n hiddenSeries: string[];\n stackedData: DSChartT.StackedSeriesByGroupT;\n width: number;\n height: number;\n isZooming: boolean;\n zoomStartingPosition: number;\n movingPosition: number;\n setActivePoint: React.Dispatch<React.SetStateAction<DSChartT.InternalDatum | null>>;\n setLeftAxisRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getBandwidth: () => number;\n setScrapperPosY: React.Dispatch<React.SetStateAction<string>>;\n setScrapperPosX: React.Dispatch<React.SetStateAction<string>>;\n setXScrollbarPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsGrabbed: React.Dispatch<React.SetStateAction<boolean>>;\n setStartPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsScrollbarVisible: React.Dispatch<React.SetStateAction<boolean>>;\n setAxisLeftRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setTopLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisBottomRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisRightRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getXValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getYValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getXValueFormatted: (datum: DSChartT.InternalDatum) => string;\n getYValueFormatted: (datum: DSChartT.InternalDatum) => string;\n setHiddenSeries: React.Dispatch<React.SetStateAction<string[]>>;\n getXScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n getYScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n setContainerRatio: React.Dispatch<React.SetStateAction<number>>;\n setToolbarRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setMovingPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsZooming: React.Dispatch<React.SetStateAction<boolean>>;\n setZoomStartingPosition: React.Dispatch<React.SetStateAction<number>>;\n}\nconst defaultContext: ContextT = {\n props: defaultProps,\n xScale: scaleBand(),\n yScale: scaleLinear(),\n innerHeight: 0,\n innerWidth: 0,\n activePoint: null,\n setActivePoint: () => {},\n scrapperPosY: '',\n setScrapperPosY: () => {},\n containerRef: createRef<HTMLDivElement>(),\n groups: [],\n colorScale: scaleOrdinal(),\n setLeftAxisRef: () => {},\n};\nexport const ChartContext = createContext(defaultContext);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,eAAe,iBAAiB;AAEzC,SAAS,aAAa,WAAW,oBAAoB;AAErD,SAAS,oBAAoB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { createContext, createRef } from 'react';\nimport type { ScaleBand, ScaleOrdinal } from 'd3';\nimport { scaleLinear, scaleBand, scaleOrdinal } from 'd3';\nimport type { DSChartT } from './react-desc-prop-types.js';\nimport { defaultProps } from './react-desc-prop-types.js';\nimport type { ScaleT } from './scales/index.js';\ninterface ContextT {\n props: DSChartT.Props;\n originalSeries: DSChartT.SeriesT;\n currentData: DSChartT.InternalData;\n currentDataWithNullValues: DSChartT.InternalData;\n xScale: ScaleT;\n yScale: ScaleT;\n y2Scale: ScaleT;\n innerHeight: number;\n innerWidth: number;\n activePoint: DSChartT.InternalDatum | null;\n containerRef: HTMLDivElement | null;\n setContainerRef: React.Dispatch<React.SetStateAction<SVGElement | null>>;\n groups: string[];\n subGroupScale?: ScaleBand<string> | null;\n colorScale: ScaleOrdinal<string, unknown, string>;\n axisLeftRef: SVGGElement | null;\n scrapperPosY: string;\n scrapperPosX: string;\n xScrollbarPosition: number;\n isGrabbed: boolean;\n startPosition: number;\n isScrollbarVisible: boolean;\n lastScrollbarPosition: React.MutableRefObject<number>;\n containerRatio: number;\n internalMargin: {\n bottom: number;\n top: number;\n right: number;\n left: number;\n };\n toolbarHeight: number;\n leftLegendHeight: number;\n rightLegendHeight: number;\n leftLabelHeight: number;\n leftLegendWidth: number;\n leftLabelWidth: number;\n leftLegend: SVGGElement;\n bottomLegend: SVGGElement;\n rightLegend: SVGGElement;\n axisBottomHeight: number;\n bottomLabelHeight: number;\n rightLabelWidth: number;\n axisRightWidth: number;\n isHorizontal: boolean;\n leftLabel: SVGGElement;\n chartId: string;\n hiddenSeries: string[];\n stackedData: DSChartT.StackedSeriesByGroupT;\n width: number;\n height: number;\n isZooming: boolean;\n zoomStartingPosition: number;\n movingPosition: number;\n setActivePoint: React.Dispatch<React.SetStateAction<DSChartT.InternalDatum | null>>;\n setLeftAxisRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getBandwidth: () => number;\n setScrapperPosY: React.Dispatch<React.SetStateAction<string>>;\n setScrapperPosX: React.Dispatch<React.SetStateAction<string>>;\n setXScrollbarPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsGrabbed: React.Dispatch<React.SetStateAction<boolean>>;\n setStartPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsScrollbarVisible: React.Dispatch<React.SetStateAction<boolean>>;\n setAxisLeftRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setTopLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLegend: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisBottomRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setLeftLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setAxisRightRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setRightLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setBottomLabel: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n getXValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getYValue: (datum: DSChartT.InternalDatum) => string | number | Date;\n getXValueFormatted: (datum: DSChartT.InternalDatum) => string;\n getYValueFormatted: (datum: DSChartT.InternalDatum) => string;\n setHiddenSeries: React.Dispatch<React.SetStateAction<string[]>>;\n getXScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n getYScaleValue: (datum: DSChartT.InternalDatum) => number | undefined;\n setContainerRatio: React.Dispatch<React.SetStateAction<number>>;\n setToolbarRef: React.Dispatch<React.SetStateAction<SVGGElement | null>>;\n setMovingPosition: React.Dispatch<React.SetStateAction<number>>;\n setIsZooming: React.Dispatch<React.SetStateAction<boolean>>;\n setZoomStartingPosition: React.Dispatch<React.SetStateAction<number>>;\n}\nconst defaultContext: ContextT = {\n props: defaultProps,\n xScale: scaleBand(),\n yScale: scaleLinear(),\n innerHeight: 0,\n innerWidth: 0,\n activePoint: null,\n setActivePoint: () => {},\n scrapperPosY: '',\n setScrapperPosY: () => {},\n containerRef: createRef<HTMLDivElement>(),\n groups: [],\n colorScale: scaleOrdinal(),\n setLeftAxisRef: () => {},\n};\nexport const ChartContext = createContext(defaultContext);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,eAAe,iBAAiB;AAEzC,SAAS,aAAa,WAAW,oBAAoB;AAErD,SAAS,oBAAoB;AAwF7B,MAAM,iBAA2B;AAAA,EAC/B,OAAO;AAAA,EACP,QAAQ,UAAU;AAAA,EAClB,QAAQ,YAAY;AAAA,EACpB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,cAAc;AAAA,EACd,iBAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,cAAc,UAA0B;AAAA,EACxC,QAAQ,CAAC;AAAA,EACT,YAAY,aAAa;AAAA,EACzB,gBAAgB,MAAM;AAAA,EAAC;AACzB;AACO,MAAM,eAAe,cAAc,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -121,8 +121,8 @@ const useChart = (props) => {
|
|
|
121
121
|
}
|
|
122
122
|
return "y";
|
|
123
123
|
}, [xAxis.type, yAxis.type]);
|
|
124
|
-
const currentData = useMemo(
|
|
125
|
-
|
|
124
|
+
const [currentDataWithNullValues, currentData] = useMemo(() => {
|
|
125
|
+
const baseData = originalSeries.filter((serie) => !hiddenSeries.includes(serie.name)).map((d, i) => ({
|
|
126
126
|
...d,
|
|
127
127
|
// we set a default on the scale if the user do not pass it
|
|
128
128
|
scale: d.scale || defaultScale,
|
|
@@ -133,11 +133,14 @@ const useChart = (props) => {
|
|
|
133
133
|
position: index,
|
|
134
134
|
serie: d.name,
|
|
135
135
|
scale: d.scale
|
|
136
|
-
}))
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
136
|
+
}))
|
|
137
|
+
}));
|
|
138
|
+
const currentDataWithoutNulls = baseData.map((data) => ({
|
|
139
|
+
...data,
|
|
140
|
+
data: data.data.filter((datum) => datum.value !== null && datum.value !== void 0)
|
|
141
|
+
}));
|
|
142
|
+
return [baseData, currentDataWithoutNulls];
|
|
143
|
+
}, [defaultScale, hiddenSeries, originalSeries]);
|
|
141
144
|
const isHorizontal = useMemo(() => yAxis?.type === "band", [yAxis]);
|
|
142
145
|
const stackedData = useMemo(
|
|
143
146
|
() => stackData(groupsStacked, originalSeries, hiddenSeries, isHorizontal),
|
|
@@ -247,7 +250,8 @@ const useChart = (props) => {
|
|
|
247
250
|
leftLabelWidth,
|
|
248
251
|
axisLeftWidth,
|
|
249
252
|
topLegendHeight,
|
|
250
|
-
leftLegendHeight
|
|
253
|
+
leftLegendHeight,
|
|
254
|
+
currentDataWithNullValues
|
|
251
255
|
}),
|
|
252
256
|
[
|
|
253
257
|
props,
|
|
@@ -305,7 +309,8 @@ const useChart = (props) => {
|
|
|
305
309
|
leftLabelWidth,
|
|
306
310
|
axisLeftWidth,
|
|
307
311
|
topLegendHeight,
|
|
308
|
-
leftLegendHeight
|
|
312
|
+
leftLegendHeight,
|
|
313
|
+
currentDataWithNullValues
|
|
309
314
|
]
|
|
310
315
|
);
|
|
311
316
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useChart.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-nested-callbacks */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useState, useEffect, useRef } from 'react';\nimport { uid } from 'uid';\nimport { debounce } from 'lodash';\nimport type { DSChartT } from '../react-desc-prop-types.js';\nimport { defaultProps, propTypes } from '../react-desc-prop-types.js';\nimport { useScales } from './useScales.js';\nimport { stackData } from '../helpers/index.js';\nimport { useInternalMargins } from './useInternalMargins.js';\nimport { useGetters } from './useGetters.js';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { useValidateProps } from './useValidateProps.js';\ntype ResizeObserverConstructorEntries = Parameters<ConstructorParameters<typeof ResizeObserver>[0]>[0];\n\nconst useResizeObserver = (ref: HTMLElement | null | undefined) => {\n const [dimensions, setDimensions] = useState<number>(0);\n\n useEffect(() => {\n if (ref) {\n const observeTarget = ref;\n const resizeObserver = new ResizeObserver(\n debounce((entries: ResizeObserverConstructorEntries) => {\n entries.forEach((entry) => {\n setDimensions(Math.ceil(entry.contentRect.width));\n });\n }, 200),\n );\n resizeObserver.observe(observeTarget);\n\n return () => {\n resizeObserver.unobserve(observeTarget);\n };\n }\n }, [ref]);\n return dimensions;\n};\n\nexport const useChart = (props: DSChartT.Props) => {\n useValidateProps(props, propTypes);\n\n // const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n const { series, yAxis, xAxis, width: userWidth, height: userHeight, groups: groupsStacked } = props;\n const userRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n const originalSeries = useMemo(() => {\n if (series.length === 0) {\n return defaultProps.series;\n }\n return series;\n }, [series]);\n const [containerRef, setContainerRef] = useState<HTMLDivElement | null>(null);\n const svgRef = useRef(null);\n\n const dimensionWidth = useResizeObserver(containerRef);\n\n const width = useMemo(() => userWidth ?? dimensionWidth ?? 0, [dimensionWidth, userWidth]);\n\n const height = useMemo(() => userHeight ?? 500, [userHeight]);\n\n const [isGrabbed, setIsGrabbed] = useState(false);\n const [startPosition, setStartPosition] = useState(0);\n\n // zoom\n\n const [isZooming, setIsZooming] = useState(false);\n const [zoomStartingPosition, setZoomStartingPosition] = useState(0);\n const [movingPosition, setMovingPosition] = useState(0);\n\n //\n\n const [activePoint, setActivePoint] = useState(null);\n const [activeSerie, setActiveSerie] = useState('');\n const [scrapperPosY, setScrapperPosY] = useState('');\n const [scrapperPosX, setScrapperPosX] = useState('');\n const [xScrollbarPosition, setXScrollbarPosition] = useState(0);\n const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);\n const [containerRatio, setContainerRatio] = useState(userRatio);\n\n const lastScrollbarPosition = useRef(0);\n\n const [axisLeftRef, setAxisLeftRef] = useState<SVGGElement | null>(null);\n const [axisBottomRef, setAxisBottomRef] = useState<SVGGElement | null>(null);\n const [axisRightRef, setAxisRightRef] = useState<SVGGElement | null>(null);\n\n const [leftLegend, setLeftLegend] = useState<SVGGElement | null>(null);\n const [rightLegend, setRightLegend] = useState<SVGGElement | null>(null);\n const [topLegend, setTopLegend] = useState<SVGGElement | null>(null);\n const [bottomLegend, setBottomLegend] = useState<SVGGElement | null>(null);\n\n const [rightLabel, setRightLabel] = useState<SVGGElement | null>(null);\n const [leftLabel, setLeftLabel] = useState<SVGGElement | null>(null);\n const [bottomLabel, setBottomLabel] = useState<SVGGElement | null>(null);\n\n const [toolbarRef, setToolbarRef] = useState<SVGGElement | null>(null);\n\n // we reset the scrollbar position when the chart resize\n useEffect(() => {\n lastScrollbarPosition.current = 0;\n setXScrollbarPosition(0);\n }, [dimensionWidth]);\n\n useEffect(() => {\n setContainerRatio(userRatio);\n }, [userRatio]);\n\n const {\n toolbarHeight,\n axisBottomHeight,\n axisRightWidth,\n bottomLabelHeight,\n internalMargin,\n leftLegendWidth,\n rightLabelWidth,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n } = useInternalMargins({\n axisLeftRef,\n axisBottomRef,\n axisRightRef,\n leftLabel,\n leftLegend,\n rightLegend,\n topLegend,\n bottomLegend,\n rightLabel,\n bottomLabel,\n toolbarRef,\n });\n\n const innerWidth = useMemo(\n () => width - internalMargin.left - internalMargin.right,\n [internalMargin.left, internalMargin.right, width],\n );\n const innerHeight = useMemo(\n () => height - internalMargin.top - internalMargin.bottom,\n [internalMargin.top, internalMargin.bottom, height],\n );\n\n const [hiddenSeries, setHiddenSeries] = useState<string[]>([]);\n\n const defaultScale = useMemo(() => {\n if (yAxis.type === 'band') {\n return 'x';\n }\n\n if ([undefined, 'band'].includes(xAxis.type)) {\n return 'y';\n }\n\n return 'y';\n }, [xAxis.type, yAxis.type]);\n const currentData = useMemo(\n () =>\n originalSeries\n .filter((serie) => !hiddenSeries.includes(serie.name))\n .map((d, i) => ({\n ...d,\n // we set a default on the scale if the user do not pass it\n scale: d.scale || defaultScale,\n key: `${d.name}-${i}`,\n data: d.data\n .map((value, index) => ({\n key: `${d.name}-${i}-${index}`,\n value,\n position: index,\n serie: d.name,\n scale: d.scale,\n }))\n .filter((datum) => datum.value !== null && datum.value !== undefined), // basically converting from DSChartT.SeriesT to DSChartT.InternalData...\n })) as DSChartT.InternalData,\n [defaultScale, hiddenSeries, originalSeries],\n );\n\n const isHorizontal = useMemo(() => yAxis?.type === 'band', [yAxis]);\n\n const stackedData = useMemo(\n () => stackData(groupsStacked, originalSeries, hiddenSeries, isHorizontal),\n [groupsStacked, originalSeries, hiddenSeries, isHorizontal],\n );\n\n // @TODO we need to create a logic to get this from both axis\n // const containerRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n\n const groups = useMemo(() => currentData.map((serie) => serie.name), [currentData]);\n\n const { xScale, yScale, y2Scale, subGroupScale, colorScale, getBandwidth } = useScales({\n props,\n originalSeries,\n innerHeight,\n innerWidth,\n groups,\n stackedData,\n currentData,\n containerRatio,\n });\n\n const { getXValue, getYValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted } = useGetters({\n xAxis,\n yAxis,\n isHorizontal,\n xScale,\n yScale,\n y2Scale,\n });\n const chartId = useMemo(() => uid(6), []);\n\n return useMemo(\n () => ({\n props,\n originalSeries,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n svgRef,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n setScrapperPosY,\n scrapperPosX,\n setScrapperPosX,\n activePoint,\n setActivePoint,\n activeSerie,\n setActiveSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n setContainerRef,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n lastScrollbarPosition,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n setAxisLeftRef,\n setLeftLegend,\n setRightLegend,\n rightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomRef,\n axisBottomHeight,\n setAxisRightRef,\n setRightLabel,\n setBottomLabel,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n setLeftLabel,\n leftLabel,\n chartId,\n hiddenSeries,\n setHiddenSeries,\n height,\n width,\n setContainerRatio,\n toolbarHeight,\n setToolbarRef,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n }),\n [\n props,\n originalSeries,\n isZooming,\n zoomStartingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n scrapperPosX,\n activePoint,\n activeSerie,\n xScrollbarPosition,\n isGrabbed,\n startPosition,\n isScrollbarVisible,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n rightLegend,\n axisBottomHeight,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n leftLabel,\n chartId,\n hiddenSeries,\n height,\n width,\n toolbarHeight,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n ],\n );\n};\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-nested-callbacks */\n/* eslint-disable max-statements */\n/* eslint-disable indent */\nimport { useMemo, useState, useEffect, useRef } from 'react';\nimport { uid } from 'uid';\nimport { debounce } from 'lodash';\nimport type { DSChartT } from '../react-desc-prop-types.js';\nimport { defaultProps, propTypes } from '../react-desc-prop-types.js';\nimport { useScales } from './useScales.js';\nimport { stackData } from '../helpers/index.js';\nimport { useInternalMargins } from './useInternalMargins.js';\nimport { useGetters } from './useGetters.js';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { useValidateProps } from './useValidateProps.js';\ntype ResizeObserverConstructorEntries = Parameters<ConstructorParameters<typeof ResizeObserver>[0]>[0];\n\nconst useResizeObserver = (ref: HTMLElement | null | undefined) => {\n const [dimensions, setDimensions] = useState<number>(0);\n\n useEffect(() => {\n if (ref) {\n const observeTarget = ref;\n const resizeObserver = new ResizeObserver(\n debounce((entries: ResizeObserverConstructorEntries) => {\n entries.forEach((entry) => {\n setDimensions(Math.ceil(entry.contentRect.width));\n });\n }, 200),\n );\n resizeObserver.observe(observeTarget);\n\n return () => {\n resizeObserver.unobserve(observeTarget);\n };\n }\n }, [ref]);\n return dimensions;\n};\n\nexport const useChart = (props: DSChartT.Props) => {\n useValidateProps(props, propTypes);\n\n // const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);\n const { series, yAxis, xAxis, width: userWidth, height: userHeight, groups: groupsStacked } = props;\n const userRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n const originalSeries = useMemo(() => {\n if (series.length === 0) {\n return defaultProps.series;\n }\n return series;\n }, [series]);\n const [containerRef, setContainerRef] = useState<HTMLDivElement | null>(null);\n const svgRef = useRef(null);\n\n const dimensionWidth = useResizeObserver(containerRef);\n\n const width = useMemo(() => userWidth ?? dimensionWidth ?? 0, [dimensionWidth, userWidth]);\n\n const height = useMemo(() => userHeight ?? 500, [userHeight]);\n\n const [isGrabbed, setIsGrabbed] = useState(false);\n const [startPosition, setStartPosition] = useState(0);\n\n // zoom\n\n const [isZooming, setIsZooming] = useState(false);\n const [zoomStartingPosition, setZoomStartingPosition] = useState(0);\n const [movingPosition, setMovingPosition] = useState(0);\n\n //\n\n const [activePoint, setActivePoint] = useState(null);\n const [activeSerie, setActiveSerie] = useState('');\n const [scrapperPosY, setScrapperPosY] = useState('');\n const [scrapperPosX, setScrapperPosX] = useState('');\n const [xScrollbarPosition, setXScrollbarPosition] = useState(0);\n const [isScrollbarVisible, setIsScrollbarVisible] = useState(false);\n const [containerRatio, setContainerRatio] = useState(userRatio);\n\n const lastScrollbarPosition = useRef(0);\n\n const [axisLeftRef, setAxisLeftRef] = useState<SVGGElement | null>(null);\n const [axisBottomRef, setAxisBottomRef] = useState<SVGGElement | null>(null);\n const [axisRightRef, setAxisRightRef] = useState<SVGGElement | null>(null);\n\n const [leftLegend, setLeftLegend] = useState<SVGGElement | null>(null);\n const [rightLegend, setRightLegend] = useState<SVGGElement | null>(null);\n const [topLegend, setTopLegend] = useState<SVGGElement | null>(null);\n const [bottomLegend, setBottomLegend] = useState<SVGGElement | null>(null);\n\n const [rightLabel, setRightLabel] = useState<SVGGElement | null>(null);\n const [leftLabel, setLeftLabel] = useState<SVGGElement | null>(null);\n const [bottomLabel, setBottomLabel] = useState<SVGGElement | null>(null);\n\n const [toolbarRef, setToolbarRef] = useState<SVGGElement | null>(null);\n\n // we reset the scrollbar position when the chart resize\n useEffect(() => {\n lastScrollbarPosition.current = 0;\n setXScrollbarPosition(0);\n }, [dimensionWidth]);\n\n useEffect(() => {\n setContainerRatio(userRatio);\n }, [userRatio]);\n\n const {\n toolbarHeight,\n axisBottomHeight,\n axisRightWidth,\n bottomLabelHeight,\n internalMargin,\n leftLegendWidth,\n rightLabelWidth,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n } = useInternalMargins({\n axisLeftRef,\n axisBottomRef,\n axisRightRef,\n leftLabel,\n leftLegend,\n rightLegend,\n topLegend,\n bottomLegend,\n rightLabel,\n bottomLabel,\n toolbarRef,\n });\n\n const innerWidth = useMemo(\n () => width - internalMargin.left - internalMargin.right,\n [internalMargin.left, internalMargin.right, width],\n );\n const innerHeight = useMemo(\n () => height - internalMargin.top - internalMargin.bottom,\n [internalMargin.top, internalMargin.bottom, height],\n );\n\n const [hiddenSeries, setHiddenSeries] = useState<string[]>([]);\n\n const defaultScale = useMemo(() => {\n if (yAxis.type === 'band') {\n return 'x';\n }\n\n if ([undefined, 'band'].includes(xAxis.type)) {\n return 'y';\n }\n\n return 'y';\n }, [xAxis.type, yAxis.type]);\n\n const [currentDataWithNullValues, currentData] = useMemo(() => {\n const baseData = originalSeries\n .filter((serie) => !hiddenSeries.includes(serie.name))\n .map((d, i) => ({\n ...d,\n // we set a default on the scale if the user do not pass it\n scale: d.scale || defaultScale,\n key: `${d.name}-${i}`,\n data: d.data.map((value, index) => ({\n key: `${d.name}-${i}-${index}`,\n value,\n position: index,\n serie: d.name,\n scale: d.scale,\n })),\n })) as DSChartT.InternalData;\n\n const currentDataWithoutNulls = baseData.map((data) => ({\n ...data,\n data: data.data.filter((datum) => datum.value !== null && datum.value !== undefined),\n }));\n\n return [baseData, currentDataWithoutNulls];\n }, [defaultScale, hiddenSeries, originalSeries]);\n\n const isHorizontal = useMemo(() => yAxis?.type === 'band', [yAxis]);\n\n const stackedData = useMemo(\n () => stackData(groupsStacked, originalSeries, hiddenSeries, isHorizontal),\n [groupsStacked, originalSeries, hiddenSeries, isHorizontal],\n );\n\n // @TODO we need to create a logic to get this from both axis\n // const containerRatio = props?.xAxis.advanced?.pointSpacing?.value ?? props?.yAxis.advanced?.pointSpacing?.value ?? 1;\n\n const groups = useMemo(() => currentData.map((serie) => serie.name), [currentData]);\n\n const { xScale, yScale, y2Scale, subGroupScale, colorScale, getBandwidth } = useScales({\n props,\n originalSeries,\n innerHeight,\n innerWidth,\n groups,\n stackedData,\n currentData,\n containerRatio,\n });\n\n const { getXValue, getYValue, getXScaleValue, getYScaleValue, getYValueFormatted, getXValueFormatted } = useGetters({\n xAxis,\n yAxis,\n isHorizontal,\n xScale,\n yScale,\n y2Scale,\n });\n const chartId = useMemo(() => uid(6), []);\n\n return useMemo(\n () => ({\n props,\n originalSeries,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n svgRef,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n setScrapperPosY,\n scrapperPosX,\n setScrapperPosX,\n activePoint,\n setActivePoint,\n activeSerie,\n setActiveSerie,\n xScrollbarPosition,\n setXScrollbarPosition,\n isGrabbed,\n setIsGrabbed,\n setContainerRef,\n startPosition,\n setStartPosition,\n isScrollbarVisible,\n setIsScrollbarVisible,\n lastScrollbarPosition,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n setAxisLeftRef,\n setLeftLegend,\n setRightLegend,\n rightLegend,\n setTopLegend,\n setBottomLegend,\n setAxisBottomRef,\n axisBottomHeight,\n setAxisRightRef,\n setRightLabel,\n setBottomLabel,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n setLeftLabel,\n leftLabel,\n chartId,\n hiddenSeries,\n setHiddenSeries,\n height,\n width,\n setContainerRatio,\n toolbarHeight,\n setToolbarRef,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n currentDataWithNullValues,\n }),\n [\n props,\n originalSeries,\n isZooming,\n zoomStartingPosition,\n movingPosition,\n innerHeight,\n innerWidth,\n groups,\n currentData,\n colorScale,\n stackedData,\n subGroupScale,\n xScale,\n yScale,\n y2Scale,\n containerRef,\n getBandwidth,\n scrapperPosY,\n scrapperPosX,\n activePoint,\n activeSerie,\n xScrollbarPosition,\n isGrabbed,\n startPosition,\n isScrollbarVisible,\n containerRatio,\n internalMargin,\n axisLeftRef,\n leftLegendWidth,\n leftLegend,\n rightLegend,\n axisBottomHeight,\n getXScaleValue,\n getYScaleValue,\n getYValueFormatted,\n getXValueFormatted,\n bottomLabelHeight,\n rightLabelWidth,\n axisRightWidth,\n getXValue,\n getYValue,\n isHorizontal,\n leftLabel,\n chartId,\n hiddenSeries,\n height,\n width,\n toolbarHeight,\n leftLabelHeight,\n rightLegendHeight,\n bottomLegendWidth,\n bottomLegend,\n leftLabelWidth,\n axisLeftWidth,\n topLegendHeight,\n leftLegendHeight,\n currentDataWithNullValues,\n ],\n );\n};\n"],
|
|
5
|
+
"mappings": "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A,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { useCallback, useContext, useMemo } from "react";
|
|
3
3
|
import { ChartContext } from "../ChartContext.js";
|
|
4
|
-
const findInCircularList = (list, from, step = 1) => {
|
|
4
|
+
const findInCircularList = (list, from, step = 1, criteria = (item) => item !== void 0) => {
|
|
5
5
|
for (let i = (from + step + list.length) % list.length; i !== from && from > -1; i = (i + step + list.length) % list.length) {
|
|
6
|
-
if (list[i])
|
|
6
|
+
if (list[i] && criteria(i)) {
|
|
7
7
|
return i;
|
|
8
|
+
}
|
|
8
9
|
}
|
|
9
10
|
return from;
|
|
10
11
|
};
|
|
@@ -30,14 +31,14 @@ const useKeyboardNavigation = () => {
|
|
|
30
31
|
setZoomStartingPosition,
|
|
31
32
|
setMovingPosition,
|
|
32
33
|
setContainerRatio,
|
|
33
|
-
|
|
34
|
+
currentDataWithNullValues,
|
|
34
35
|
props: { xAxis, yAxis, xScroll, yScroll }
|
|
35
36
|
} = useContext(ChartContext);
|
|
36
37
|
const xScrollable = xAxis.advanced?.pointSpacing?.value > 1 || xScroll;
|
|
37
38
|
const yScrollable = yAxis.advanced?.pointSpacing?.value > 1 || yScroll;
|
|
38
39
|
const currentSerie = useMemo(
|
|
39
|
-
() =>
|
|
40
|
-
[activePoint?.serie,
|
|
40
|
+
() => currentDataWithNullValues.find((d) => d.name === activePoint?.serie) ?? currentDataWithNullValues[0],
|
|
41
|
+
[activePoint?.serie, currentDataWithNullValues]
|
|
41
42
|
);
|
|
42
43
|
const currentActiveItemIndex = useMemo(
|
|
43
44
|
() => currentSerie?.data.findIndex((opt) => opt.key === activePoint?.key),
|
|
@@ -62,7 +63,7 @@ const useKeyboardNavigation = () => {
|
|
|
62
63
|
const navigateSerie = useCallback(
|
|
63
64
|
(step) => {
|
|
64
65
|
const newValue = findInCircularList(
|
|
65
|
-
currentSerie?.data.map((d) => d.value
|
|
66
|
+
currentSerie?.data.map((d) => d.value?.toString()),
|
|
66
67
|
currentActiveItemIndex,
|
|
67
68
|
step
|
|
68
69
|
);
|
|
@@ -121,17 +122,15 @@ const useKeyboardNavigation = () => {
|
|
|
121
122
|
);
|
|
122
123
|
const changeSerie = useCallback(
|
|
123
124
|
(step) => {
|
|
124
|
-
const
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
});
|
|
132
|
-
setActivePoint(nextSerie?.data[currentActiveItemIndex] || nextSerie?.data?.[0] || null);
|
|
125
|
+
const nextSerieIndex = findInCircularList(
|
|
126
|
+
groups,
|
|
127
|
+
groups.findIndex((item) => item === currentSerie.name),
|
|
128
|
+
step,
|
|
129
|
+
(idx) => currentDataWithNullValues[idx].data[currentActiveItemIndex].value !== null
|
|
130
|
+
);
|
|
131
|
+
setActivePoint(currentDataWithNullValues[nextSerieIndex].data[currentActiveItemIndex]);
|
|
133
132
|
},
|
|
134
|
-
[
|
|
133
|
+
[groups, setActivePoint, currentActiveItemIndex, currentSerie.name, currentDataWithNullValues]
|
|
135
134
|
);
|
|
136
135
|
const onInputKeyDown = useCallback(
|
|
137
136
|
(e) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/graphs/Chart/config/useKeyboardNavigation.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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';\n\nexport const findInCircularList = (\n list: string[],\n from: number,\n step = 1,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i]) return i;\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const {\n activePoint,\n setActivePoint,\n containerRef,\n xScale,\n yScale,\n lastScrollbarPosition,\n setXScrollbarPosition,\n containerRatio,\n xScrollbarPosition,\n innerWidth,\n innerHeight,\n getXScaleValue,\n getYScaleValue,\n groups,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n setContainerRatio,\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,aAAa,YAAY,eAAe;AACjD,SAAS,oBAAoB;AAEtB,MAAM,qBAAqB,CAChC,MACA,MACA,OAAO,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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';\n\nexport const findInCircularList = (\n list: string[],\n from: number,\n step = 1,\n criteria = (item: number) => item !== undefined,\n // eslint-disable-next-line max-params\n): number => {\n for (\n let i = (from + step + list.length) % list.length;\n i !== from && from > -1;\n i = (i + step + list.length) % list.length\n ) {\n if (list[i] && criteria(i)) {\n return i;\n }\n }\n return from; // return same item\n};\n\nexport const useKeyboardNavigation = () => {\n const {\n activePoint,\n setActivePoint,\n containerRef,\n xScale,\n yScale,\n lastScrollbarPosition,\n setXScrollbarPosition,\n containerRatio,\n xScrollbarPosition,\n innerWidth,\n innerHeight,\n getXScaleValue,\n getYScaleValue,\n groups,\n isZooming,\n setIsZooming,\n zoomStartingPosition,\n setZoomStartingPosition,\n setMovingPosition,\n setContainerRatio,\n currentDataWithNullValues,\n props: { xAxis, yAxis, xScroll, yScroll },\n } = useContext(ChartContext);\n\n const xScrollable = xAxis.advanced?.pointSpacing?.value > 1 || xScroll;\n const yScrollable = yAxis.advanced?.pointSpacing?.value > 1 || yScroll;\n\n const currentSerie = useMemo(\n () => currentDataWithNullValues.find((d) => d.name === activePoint?.serie) ?? currentDataWithNullValues[0],\n [activePoint?.serie, currentDataWithNullValues],\n );\n\n const currentActiveItemIndex = useMemo(\n () => currentSerie?.data.findIndex((opt) => opt.key === activePoint?.key),\n [activePoint, currentSerie],\n );\n\n const handleOnFocus: React.FocusEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (containerRef === e.target && activePoint === null) {\n setActivePoint(currentSerie?.data[0]);\n setXScrollbarPosition(0);\n }\n },\n [activePoint, containerRef, currentSerie?.data, setActivePoint, setXScrollbarPosition],\n );\n\n const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = useCallback(() => {\n setTimeout(() => {\n if (!containerRef?.contains(document.activeElement)) {\n setActivePoint(null);\n }\n });\n }, [setActivePoint, containerRef]);\n\n const navigateSerie = useCallback(\n (step: number) => {\n const newValue = findInCircularList(\n currentSerie?.data.map((d) => d.value?.toString()),\n currentActiveItemIndex,\n step,\n );\n setActivePoint(currentSerie?.data[newValue]);\n\n if (xScrollable) {\n const xValue = getXScaleValue(currentSerie?.data[newValue]);\n if (xValue === undefined) return;\n const barWidth = innerWidth / containerRatio;\n const total = innerWidth * containerRatio;\n if (total <= xValue) {\n // to go from the first to last\n setXScrollbarPosition((total - innerWidth) / containerRatio);\n } else if (xValue > xScrollbarPosition * containerRatio + innerWidth)\n // if is not visible we move the scroll to the next best position\n setXScrollbarPosition((prev) => {\n const nextPosition = prev + (xValue / containerRatio - prev);\n if (nextPosition + barWidth > innerWidth) return innerWidth - barWidth;\n return nextPosition;\n });\n // move backwards - 2 because focus ring in bars\n else if (xValue < xScrollbarPosition * containerRatio) setXScrollbarPosition(xValue / containerRatio);\n }\n if (yScrollable) {\n const yValue = getYScaleValue(currentSerie?.data[newValue]);\n if (yValue === undefined) return;\n const barWidth = innerHeight / containerRatio;\n const total = innerHeight * containerRatio;\n if (total <= yValue) {\n // to go from the first to last\n setXScrollbarPosition((total - innerHeight) / containerRatio);\n } else if (yValue > xScrollbarPosition * containerRatio + innerHeight)\n // if is not visible we move the scroll to the next best position\n setXScrollbarPosition((prev) => {\n const nextPosition = prev + (yValue / containerRatio - prev);\n if (nextPosition + barWidth > innerHeight) return innerHeight - barWidth;\n return nextPosition;\n });\n // move backwards - 2 because focus ring in bars\n else if (yValue < xScrollbarPosition * containerRatio) setXScrollbarPosition(yValue / containerRatio);\n }\n },\n [\n currentSerie?.data,\n currentActiveItemIndex,\n setActivePoint,\n xScrollable,\n yScrollable,\n getXScaleValue,\n innerWidth,\n containerRatio,\n xScrollbarPosition,\n setXScrollbarPosition,\n getYScaleValue,\n innerHeight,\n ],\n );\n\n const changeSerie = useCallback(\n (step: number) => {\n const nextSerieIndex = findInCircularList(\n groups,\n groups.findIndex((item) => item === currentSerie.name),\n step,\n (idx: number) => currentDataWithNullValues[idx].data[currentActiveItemIndex].value !== null,\n );\n setActivePoint(currentDataWithNullValues[nextSerieIndex].data[currentActiveItemIndex]);\n },\n [groups, setActivePoint, currentActiveItemIndex, currentSerie.name, currentDataWithNullValues],\n );\n\n const onInputKeyDown: React.KeyboardEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (!activePoint) return;\n if (e.code !== 'Tab') {\n e.preventDefault();\n }\n if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {\n if (yScale.type === 'BAND') changeSerie(e.code === 'ArrowLeft' ? -1 : 1);\n else navigateSerie(e.code === 'ArrowLeft' ? -1 : 1);\n }\n\n if (['ArrowDown', 'ArrowUp'].includes(e.code)) {\n if (yScale.type === 'BAND') navigateSerie(e.code === 'ArrowDown' ? 1 : -1);\n else changeSerie(e.code === 'ArrowDown' ? -1 : 1);\n }\n\n const { code } = e;\n const isShiftKey = ['ShiftLeft', 'ShiftRight'].includes(code);\n\n if (isShiftKey && !isZooming && !xScale.type === 'BAND') {\n setIsZooming(true);\n setZoomStartingPosition(getXScaleValue(activePoint) - xScrollbarPosition * containerRatio);\n }\n },\n [\n activePoint,\n changeSerie,\n containerRatio,\n getXScaleValue,\n isZooming,\n navigateSerie,\n setIsZooming,\n setZoomStartingPosition,\n xScale.type,\n xScrollbarPosition,\n yScale.type,\n ],\n );\n\n const handleOnKeyUp: React.KeyboardEventHandler<HTMLDivElement> = useCallback(\n (e) => {\n if (!isZooming && xScale.type === 'BAND') return false;\n const { shiftKey, code } = e;\n const isShiftKey = ['ShiftLeft', 'ShiftRight'].includes(code);\n\n if (shiftKey && ['ArrowRight', 'ArrowLeft'].includes(code)) {\n setMovingPosition(getXScaleValue(activePoint) - xScrollbarPosition * containerRatio);\n }\n if (isShiftKey) {\n setIsZooming(false);\n setZoomStartingPosition(0);\n setMovingPosition(0);\n const endingPosition = getXScaleValue(activePoint) - xScrollbarPosition * containerRatio;\n // isRightDirection is used to know if we are zooming right or left direction\n const isRightDirection = zoomStartingPosition < endingPosition;\n const offsetActivePoint = findInCircularList(\n currentSerie?.data.map((d) => d.value.toString()),\n currentActiveItemIndex,\n isRightDirection ? 1 : -1,\n );\n // we do this so the activePoint does not fall into the blur gradient\n const correctEndingPosition =\n getXScaleValue(currentSerie?.data[offsetActivePoint]) - xScrollbarPosition * containerRatio;\n const diff = Math.abs(zoomStartingPosition - correctEndingPosition);\n if (diff <= 0) return;\n const newRatio =\n innerWidth / ((innerWidth * containerRatio) / diff) < 40\n ? innerWidth / 40\n : (innerWidth * containerRatio) / diff;\n const newPosition =\n lastScrollbarPosition?.current +\n (!isRightDirection ? correctEndingPosition : zoomStartingPosition) / containerRatio;\n\n // if is bigger thant innerwidth possible we force the end\n if (newPosition > innerWidth - innerWidth / newRatio) setXScrollbarPosition(innerWidth - innerWidth / newRatio);\n else setXScrollbarPosition(newPosition);\n setActivePoint(null);\n setTimeout(() => setActivePoint(activePoint));\n setContainerRatio(newRatio);\n lastScrollbarPosition.current = newPosition;\n }\n },\n [\n activePoint,\n containerRatio,\n currentActiveItemIndex,\n currentSerie?.data,\n getXScaleValue,\n innerWidth,\n isZooming,\n lastScrollbarPosition,\n setActivePoint,\n setContainerRatio,\n setIsZooming,\n setMovingPosition,\n setXScrollbarPosition,\n setZoomStartingPosition,\n xScale.type,\n xScrollbarPosition,\n zoomStartingPosition,\n ],\n );\n return useMemo(\n () => ({ handleOnKeyUp, onInputKeyDown, handleOnBlur, handleOnFocus }),\n [handleOnBlur, handleOnFocus, handleOnKeyUp, onInputKeyDown],\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -12,7 +12,16 @@ export declare const useChart: (props: DSChartT.Props) => {
|
|
|
12
12
|
innerHeight: number;
|
|
13
13
|
innerWidth: number;
|
|
14
14
|
groups: string[];
|
|
15
|
-
currentData:
|
|
15
|
+
currentData: {
|
|
16
|
+
data: DSChartT.InternalDatum[];
|
|
17
|
+
key: string;
|
|
18
|
+
name: string;
|
|
19
|
+
type: DSChartT.SerieTypeT;
|
|
20
|
+
scale?: string | undefined;
|
|
21
|
+
color?: string | undefined;
|
|
22
|
+
dashStyle?: string | undefined;
|
|
23
|
+
pointRadius?: number | undefined;
|
|
24
|
+
}[];
|
|
16
25
|
colorScale: import("d3-scale").ScaleOrdinal<string, unknown, string>;
|
|
17
26
|
stackedData: DSChartT.StackedSeriesByGroupT;
|
|
18
27
|
subGroupScale: ([number, number] & import("d3-scale").ScaleBand<string>) | null;
|
|
@@ -89,4 +98,5 @@ export declare const useChart: (props: DSChartT.Props) => {
|
|
|
89
98
|
axisLeftWidth: number;
|
|
90
99
|
topLegendHeight: number;
|
|
91
100
|
leftLegendHeight: number;
|
|
101
|
+
currentDataWithNullValues: DSChartT.InternalData;
|
|
92
102
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const findInCircularList: (list: string[], from: number, step?: number) => number;
|
|
2
|
+
export declare const findInCircularList: (list: string[], from: number, step?: number, criteria?: (item: number) => boolean) => number;
|
|
3
3
|
export declare const useKeyboardNavigation: () => {
|
|
4
4
|
handleOnKeyUp: import("react").KeyboardEventHandler<HTMLDivElement>;
|
|
5
5
|
onInputKeyDown: import("react").KeyboardEventHandler<HTMLDivElement>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-dataviz",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.27.0-next.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - DataViz",
|
|
6
6
|
"files": [
|
|
@@ -41,18 +41,18 @@
|
|
|
41
41
|
"d3-time": "~3.1.0",
|
|
42
42
|
"resize-observer-polyfill": "~1.5.1",
|
|
43
43
|
"uid": "~2.0.2",
|
|
44
|
-
"@elliemae/ds-grid": "3.
|
|
45
|
-
"@elliemae/ds-
|
|
46
|
-
"@elliemae/ds-props-helpers": "3.
|
|
47
|
-
"@elliemae/ds-
|
|
48
|
-
"@elliemae/ds-
|
|
44
|
+
"@elliemae/ds-grid": "3.27.0-next.1",
|
|
45
|
+
"@elliemae/ds-system": "3.27.0-next.1",
|
|
46
|
+
"@elliemae/ds-props-helpers": "3.27.0-next.1",
|
|
47
|
+
"@elliemae/ds-utilities": "3.27.0-next.1",
|
|
48
|
+
"@elliemae/ds-popperjs": "3.27.0-next.1"
|
|
49
49
|
},
|
|
50
50
|
"devDependencies": {
|
|
51
51
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
52
52
|
"@elliemae/pui-theme": "~2.7.0",
|
|
53
53
|
"@types/d3": "~7.4.0",
|
|
54
54
|
"styled-components": "~5.3.9",
|
|
55
|
-
"@elliemae/ds-monorepo-devops": "3.
|
|
55
|
+
"@elliemae/ds-monorepo-devops": "3.27.0-next.1"
|
|
56
56
|
},
|
|
57
57
|
"peerDependencies": {
|
|
58
58
|
"@elliemae/pui-theme": "~2.7.0",
|