@react-magma/charts 1.0.0 → 1.0.2-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"charts.modern.js","sources":["../src/components/LineChart/magma-charts.ts","../src/components/LineChart/GraphTooltip.tsx","../src/components/LineChart/CustomPointComponent.tsx","../src/components/LineChart/CustomAxisComponent.tsx","../src/components/LineChart/LegendButton.tsx","../src/components/LineChart/LineChart.tsx","../src/components/LineChart/ChartDataTable.tsx","../src/components/LineChart/Chart.tsx"],"sourcesContent":["// *\n// * Colors\n// *\n// const yellow200 = '#FFF59D';\n// const deepOrange600 = '#F4511E';\n// const lime300 = '#DCE775';\n// const lightGreen500 = '#8BC34A';\n// const teal700 = '#00796B';\n// const cyan900 = '#006064';\n\n// const colors = [\n// '#0085CC',\n// '#E0004D',\n// '#FA6600',\n// '#48A200',\n// '#B12FAD',\n// '#00A393',\n// ];\n\nconst colors = [\n '#00507A',\n '#8F0033',\n '#B84900',\n '#255200',\n '#711E6E',\n '#005249',\n];\n\nconst blueGrey50 = '#DFDFDF';\nconst blueGrey300 = '#8F8F8F';\nconst blueGrey700 = '#3F3F3F';\nconst grey900 = 'pink';\n\n// *\n// * Typography\n// *\nconst sansSerif = '\"Work Sans\",Helvetica,sans-serif';\nconst letterSpacing = 'normal';\nconst fontSize = 12;\n\n// *\n// * Layout\n// *\nconst padding = 8;\nconst baseProps = {\n width: 350,\n height: 350,\n padding: 50,\n};\n\n// *\n// * Labels\n// *\nconst baseLabelStyles = {\n fontFamily: sansSerif,\n fontSize,\n letterSpacing,\n padding,\n fill: blueGrey700,\n stroke: 'transparent',\n strokeWidth: 0,\n};\n\nconst centeredLabelStyles = { textAnchor: 'middle', ...baseLabelStyles };\n// *\n// * Strokes\n// *\n// const strokeDasharray = '10, 5';\nconst strokeLinecap = 'round';\nconst strokeLinejoin = 'round';\n\nexport const magmaTheme: any = {\n area: {\n style: {\n data: {\n fill: grey900,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n axis: {\n style: {\n axis: {\n fill: 'transparent',\n stroke: blueGrey300,\n strokeWidth: 1,\n strokeLinecap,\n strokeLinejoin,\n },\n axisLabel: {\n ...centeredLabelStyles,\n padding,\n stroke: 'transparent',\n },\n grid: {\n fill: 'none',\n stroke: '#dfdfdf',\n //strokeDasharray,\n strokeLinecap,\n strokeLinejoin,\n pointerEvents: 'painted',\n },\n ticks: {\n fill: 'transparent',\n size: 0,\n stroke: blueGrey300,\n strokeWidth: 0,\n strokeLinecap,\n strokeLinejoin,\n },\n tickLabels: {\n ...baseLabelStyles,\n fill: blueGrey700,\n },\n },\n ...baseProps,\n },\n polarDependentAxis: {\n style: {\n ticks: {\n fill: 'transparent',\n size: 1,\n stroke: 'transparent',\n },\n },\n },\n bar: {\n style: {\n data: {\n fill: blueGrey700,\n padding,\n strokeWidth: 0,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n boxplot: {\n style: {\n max: { padding, stroke: blueGrey700, strokeWidth: 1 },\n maxLabels: { ...baseLabelStyles, padding: 3 },\n median: { padding, stroke: blueGrey700, strokeWidth: 1 },\n medianLabels: { ...baseLabelStyles, padding: 3 },\n min: { padding, stroke: blueGrey700, strokeWidth: 1 },\n minLabels: { ...baseLabelStyles, padding: 3 },\n q1: { padding, fill: blueGrey700 },\n q1Labels: { ...baseLabelStyles, padding: 3 },\n q3: { padding, fill: blueGrey700 },\n q3Labels: { ...baseLabelStyles, padding: 3 },\n },\n boxWidth: 20,\n ...baseProps,\n },\n candlestick: {\n style: {\n data: {\n stroke: blueGrey700,\n },\n labels: { ...baseLabelStyles, padding: 5 },\n },\n candleColors: {\n positive: '#ffffff',\n negative: blueGrey700,\n },\n ...baseProps,\n },\n chart: baseProps,\n errorbar: {\n borderWidth: 8,\n style: {\n data: {\n fill: 'transparent',\n opacity: 1,\n stroke: blueGrey700,\n strokeWidth: 2,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n group: {\n colorScale: colors,\n ...baseProps,\n },\n histogram: {\n style: {\n data: {\n fill: blueGrey700,\n stroke: grey900,\n strokeWidth: 2,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n legend: {\n colorScale: colors,\n gutter: 10,\n orientation: 'vertical',\n titleOrientation: 'top',\n style: {\n data: {\n type: 'circle',\n },\n labels: baseLabelStyles,\n title: { ...baseLabelStyles, padding: 5 },\n },\n },\n line: {\n style: {\n data: {\n fill: 'transparent',\n opacity: 1,\n stroke: blueGrey700,\n strokeWidth: 2,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n pie: {\n colorScale: colors,\n style: {\n data: {\n padding,\n stroke: blueGrey50,\n strokeWidth: 1,\n },\n labels: { ...baseLabelStyles, padding: 20 },\n },\n ...baseProps,\n },\n scatter: {\n style: {\n data: {\n fill: blueGrey700,\n opacity: 1,\n stroke: 'transparent',\n strokeWidth: 0,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n stack: {\n colorScale: colors,\n ...baseProps,\n },\n tooltip: {\n style: { ...baseLabelStyles, padding: 0, pointerEvents: 'none' },\n flyoutStyle: {\n stroke: grey900,\n strokeWidth: 1,\n fill: '#f0f0f0',\n pointerEvents: 'none',\n },\n flyoutPadding: 5,\n cornerRadius: 5,\n pointerLength: 10,\n },\n voronoi: {\n style: {\n data: {\n fill: 'transparent',\n stroke: 'transparent',\n strokeWidth: 0,\n },\n labels: { ...baseLabelStyles, padding: 5, pointerEvents: 'none' },\n flyout: {\n stroke: grey900,\n strokeWidth: 1,\n fill: '#f0f0f0',\n pointerEvents: 'none',\n },\n },\n ...baseProps,\n },\n};\n","import * as React from 'react';\nimport {\n StyledTooltip,\n ThemeContext,\n TooltipArrow,\n TooltipPosition,\n ThemeInterface,\n styled,\n} from 'react-magma-dom';\n\nconst StyledGraphTooltip = styled(StyledTooltip)`\n background: ${(props: any) => props.theme.colors.neutral08};\n border: 1px solid ${(props: any) => props.theme.colors.neutral06};\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);\n box-sizing: border-box;\n color: ${(props: any) => props.theme.colors.neutral};\n font-size: ${(props: any) => props.theme.typeScale.size02.fontSize};\n font-weight: normal;\n line-height: ${(props: any) => props.theme.typeScale.size02.lineHeight};\n margin: 0;\n padding: 8px;\n width: fit-content;\n div {\n margin-bottom: 8px;\n display: flex;\n align-items: flex-start;\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n`;\n\nconst TooltipColorSwatch = styled.span`\n background: ${(props: any) => props.color};\n border: ${(props: any) => (props.color ? 'none' : '3px solid black')};\n border-radius: 4px;\n height: 20px;\n width: 20px;\n margin-right: 8px;\n`;\n\nexport const GraphTooltip = (props: any) => {\n const { datum, index, showTooltip, x, y } = props;\n\n const theme: ThemeInterface = React.useContext(ThemeContext);\n const linePointIndex = `${index}-${datum.index}`;\n\n return showTooltip === linePointIndex ? (\n <g style={{ pointerEvents: 'none' }}>\n <foreignObject x={x} y={y} width=\"275\" height=\"100%\">\n <StyledGraphTooltip\n position={TooltipPosition.top}\n role=\"tooltip\"\n theme={theme}\n >\n <div>\n <TooltipColorSwatch color={theme.iterableColors[index]} />\n <span>{datum.label}</span>\n </div>\n <TooltipArrow theme={theme} />\n </StyledGraphTooltip>\n </foreignObject>\n </g>\n ) : null;\n};\n\nexport const AxisTooltip = (props: any) => {\n const { x, y, activePoints, hiddenData, dataLength } = props;\n\n const pointsIndexes = Array.from(\n Array(dataLength - 0),\n (_, i) => i + 0\n ).filter(i => !hiddenData.includes(i));\n\n const theme: ThemeInterface = React.useContext(ThemeContext);\n\n return (\n <g style={{ pointerEvents: 'none' }}>\n <foreignObject x={x} y={y} width=\"275\" height=\"100%\">\n <StyledGraphTooltip\n data-testid=\"axis-tooltip\"\n position={TooltipPosition.top}\n role=\"tooltip\"\n theme={theme}\n >\n {activePoints.map((point: any, i: number) => (\n <div key={i}>\n <TooltipColorSwatch\n color={theme.iterableColors[pointsIndexes[i]]}\n />\n <span>{point.label}</span>\n </div>\n ))}\n <TooltipArrow theme={theme} />\n </StyledGraphTooltip>\n </foreignObject>\n </g>\n );\n};\n","import * as React from 'react';\nimport { Point, PointProps } from 'victory';\nimport { useForceUpdate } from 'react-magma-dom';\n\nexport interface CustomScatterDataComponentInterface extends PointProps {\n lineIndex: number;\n pointRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;\n registerPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n unregisterPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n}\n\nexport interface CustomPointComponentInterface {\n lineIndex: number;\n pointIndex: PointProps['index'];\n pointRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;\n registerPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n unregisterPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n}\n\nexport const CustomScatterDataComponent = (\n props: CustomScatterDataComponentInterface\n) => {\n const {\n datum,\n index: pointIndex,\n lineIndex,\n pointRefArray,\n registerPoint,\n unregisterPoint,\n ...other\n } = props;\n return (\n <Point\n {...other}\n ariaLabel={datum.label}\n pathComponent={\n <CustomPointComponent\n lineIndex={lineIndex}\n pointIndex={pointIndex}\n pointRefArray={pointRefArray}\n registerPoint={registerPoint}\n unregisterPoint={unregisterPoint}\n />\n }\n role=\"button\"\n tabIndex={0}\n />\n );\n};\n\nexport const CustomPointComponent = (props: CustomPointComponentInterface) => {\n const {\n lineIndex,\n pointRefArray,\n pointIndex,\n registerPoint,\n unregisterPoint,\n ...other\n } = props;\n const forceUpdate = useForceUpdate();\n const ref = React.useRef<SVGPathElement | null>(null);\n\n React.useEffect(() => {\n registerPoint(pointRefArray, ref as React.MutableRefObject<Element>);\n\n forceUpdate();\n\n return () =>\n unregisterPoint(pointRefArray, ref as React.MutableRefObject<Element>);\n }, []);\n\n return (\n <path\n ref={ref}\n data-line-index={lineIndex}\n data-point-index={pointIndex}\n {...other}\n />\n );\n};\n","import * as React from 'react';\nimport { LineSegment, LineSegmentProps } from 'victory';\n\nexport const CustomAxisComponent: React.FunctionComponent<LineSegmentProps> = ({\n events,\n ...props\n}: any) => {\n return (\n <g>\n <LineSegment\n {...props}\n events={events}\n style={{\n strokeWidth: '50px',\n stroke: 'transparent',\n }}\n />\n <LineSegment\n {...props}\n events={events}\n style={{\n strokeWidth: '1px',\n stroke: 'black',\n strokeOpacity: '0.2',\n }}\n />\n </g>\n );\n};\n","import * as React from 'react';\nimport { ThemeContext, Checkbox } from 'react-magma-dom';\n\nexport interface DataTableProps {\n name?: string;\n color?: string;\n}\n\nexport const LegendButton = React.forwardRef<HTMLButtonElement, any>(\n (props, ref) => {\n const {\n children,\n color,\n dataIndex,\n isHidden,\n onClick,\n name,\n focusCurrentLine,\n resetLineFocus,\n ...other\n } = props;\n\n function handleClick() {\n onClick && typeof onClick === 'function' && onClick(dataIndex);\n\n if (!isHidden) {\n resetLineFocus &&\n typeof resetLineFocus === 'function' &&\n resetLineFocus();\n }\n }\n\n function handleOnMouseEnterOrFocus() {\n if (!isHidden) {\n focusCurrentLine &&\n typeof focusCurrentLine === 'function' &&\n focusCurrentLine(dataIndex);\n }\n }\n\n const theme = React.useContext(ThemeContext);\n\n return (\n <div\n style={{ display: 'inline-flex' }}\n onMouseEnter={handleOnMouseEnterOrFocus}\n onMouseLeave={resetLineFocus}\n >\n <Checkbox\n checked={!isHidden}\n color={color}\n containerStyle={{\n alignItems: 'center',\n border: '0',\n boxShadow: '0 0 0',\n color: theme.colors.neutral,\n display: 'inline-flex',\n margin: '0 36px 20px 0',\n padding: '0',\n }}\n inputStyle={{\n border: color ? `none` : `2px solid ${theme.colors.neutral02}`,\n borderRadius: '4px',\n }}\n labelText={name}\n onBlur={resetLineFocus}\n onClick={handleClick}\n onFocus={handleOnMouseEnterOrFocus}\n ref={ref}\n theme={theme}\n {...other}\n />\n </div>\n );\n }\n);\n","import * as React from 'react';\nimport {\n VictoryAxis,\n VictoryAxisProps,\n VictoryChart,\n VictoryChartProps,\n VictoryLine,\n VictoryLineProps,\n VictoryScatter,\n VictoryScatterProps,\n VictoryTooltip,\n VictoryVoronoiContainer,\n} from 'victory';\n\nimport {\n I18nContext,\n ThemeContext,\n styled,\n ThemeInterface,\n I18nInterface,\n} from 'react-magma-dom';\n\nimport { magmaTheme } from './magma-charts';\nimport { AxisTooltip, GraphTooltip } from './GraphTooltip';\nimport { CustomScatterDataComponent } from './CustomPointComponent';\nimport { CustomAxisComponent } from './CustomAxisComponent';\nimport { LegendButton } from './LegendButton';\n\nexport type LineChartAxisStyle = VictoryAxisProps['style'];\nexport type DataGetterPropType = VictoryLineProps['x'];\n\nexport type ChartDataOptions =\n | {\n label: string;\n x: string | number;\n y: string | number;\n [key: string]: any;\n }\n | { label: string; [key: string]: any }\n | any;\n\nexport interface LineChartData<T> {\n name: string;\n data: T[];\n}\n\nexport interface LineChartComponentProps {\n chart?: VictoryChartProps;\n line?: VictoryLineProps;\n scatter?: VictoryScatterProps;\n xAxis?: VictoryAxisProps;\n yAxis?: VictoryAxisProps;\n}\n\nexport interface LineChartProps<T extends ChartDataOptions> {\n /**\n * Props passed to each component that makes up the line chart. See `victory` for accepted props.\n */\n componentProps?: LineChartComponentProps;\n /**\n * Data used to build the chart\n */\n data?: LineChartData<T>[];\n isMulti?: boolean;\n /**\n * @internal\n */\n lastFocusedScatterPoint: React.MutableRefObject<SVGPathElement | null>;\n /**\n * @internal\n */\n pointRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;\n /**\n * @internal\n */\n registerPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n /**\n * @internal\n */\n tabRef: React.MutableRefObject<HTMLButtonElement | null>;\n /**\n * @internal\n */\n unregisterPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n /**\n * Value of x key in chart data\n */\n x?: keyof T;\n /**\n * Value of y key in chart data\n */\n y?: keyof T;\n}\n\nconst LineChartContainer = styled.div`\n max-height: 600px;\n max-width: 800px;\n svg {\n overflow: visible;\n }\n`;\n\nconst VictoryChartContainer = styled.div``;\n\nconst DataLegendsContainer = styled.div`\n padding-bottom: 24px;\n`;\n\nconst DataLegendsDescription = styled.p`\n color: ${(props: any) => props.theme.colors.neutral03};\n font-size: ${(props: any) => props.theme.typeScale.size02.fontSize};\n`;\n\nexport function LineChart<T>(props: LineChartProps<T>) {\n const {\n componentProps: {\n chart = {},\n line = {},\n scatter = {},\n xAxis: {\n style: {\n axisLabel: xAxisLabel = undefined,\n tickLabels: xTickLabels = undefined,\n ...xRest\n } = {},\n ...xAxisOther\n } = { style: {} },\n yAxis: {\n style: {\n axisLabel: yAxisLabel = undefined,\n tickLabels: yTickLabels = undefined,\n ...yRest\n } = {},\n ...yAxisOther\n } = { style: {} },\n } = {},\n data = [],\n lastFocusedScatterPoint,\n pointRefArray,\n registerPoint,\n unregisterPoint,\n tabRef,\n x,\n y,\n } = props;\n\n const theme: ThemeInterface = React.useContext(ThemeContext);\n const i18n: I18nInterface = React.useContext(I18nContext);\n\n const [hiddenData, setHiddenData] = React.useState<number[]>([]);\n const [width, setWidth] = React.useState<number>(800);\n const [focusedLine, setFocusedLine] = React.useState<number | null>(null);\n const [showTooltip, setShowTooltip] = React.useState<string | null>(null);\n const [showXAxisLabel, setShowXAxisLabel] = React.useState<boolean>(true);\n const [hoveringOnXAxisLine, setHoveringOnXAxisLine] =\n React.useState<boolean>(false);\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const firstLegendButtonRef = React.useRef<HTMLButtonElement>(null);\n\n React.useEffect(() => {\n updateWidth();\n\n window.addEventListener('resize', updateWidth);\n window.addEventListener('keydown', handleEsc);\n\n return () => {\n window.removeEventListener('resize', updateWidth);\n window.removeEventListener('keydown', handleEsc);\n };\n }, []);\n\n React.useEffect(() => {\n window.addEventListener('mousemove', handleMouseMove);\n\n return () => {\n window.removeEventListener('mousemove', handleMouseMove);\n };\n }, [showTooltip]);\n\n const scatterNames: string[] = data.map((_, i) => `scatter-${i}`);\n\n const xAxisStyles = {\n tickLabels: {\n color: '#3f3f3f',\n fontSize: 12,\n ...xTickLabels,\n },\n axisLabel: {\n color: '#3f3f3f',\n padding: 44,\n fontSize: 14,\n fontWeight: 'bold',\n ...xAxisLabel,\n },\n ...xRest,\n };\n\n const yAxisStyles = {\n tickLabels: {\n fontSize: 12,\n ...yTickLabels,\n },\n axisLabel: {\n color: '#3f3f3f',\n padding: 64,\n fontSize: 14,\n fontWeight: 'bold',\n ...yAxisLabel,\n },\n ...yRest,\n };\n\n function updateWidth() {\n containerRef.current && setWidth(containerRef.current.clientWidth);\n }\n\n function handleEsc(event: KeyboardEvent): any {\n if (event.key === 'Escape') {\n setShowTooltip(null);\n setShowXAxisLabel(false);\n }\n }\n\n function handleMouseMove() {\n !showTooltip && setShowXAxisLabel(true);\n }\n\n function setLineOpacity(index: number) {\n return focusedLine === null ? 1 : focusedLine === index ? 1 : 0.1;\n }\n\n function handleLegendClick(dataIndex: number) {\n if (hiddenData.includes(dataIndex)) {\n setHiddenData(hiddenData.filter(item => item !== dataIndex));\n } else {\n setHiddenData(hiddenData.concat([dataIndex]));\n }\n }\n\n function focusCurrentLine(dataIndex: number) {\n setFocusedLine(dataIndex);\n }\n\n function resetLineFocus() {\n setFocusedLine(null);\n }\n\n const buildLineIndexes = (\n acc: number[],\n point: React.MutableRefObject<Element>\n ) => {\n if (point.current) {\n const currentLineIndex = parseInt(\n point.current.getAttribute('data-line-index') as string,\n 10\n );\n !acc.includes(currentLineIndex) &&\n acc.push(\n parseInt(point.current.getAttribute('data-line-index') as string, 10)\n );\n }\n return acc;\n };\n\n const buildLineIndexData = (point: React.MutableRefObject<Element>) => {\n const currentLineIndex = parseInt(\n point.current.getAttribute('data-line-index') as string,\n 10\n );\n const currentPointIndex = parseInt(\n point.current.getAttribute('data-point-index') as string,\n 10\n );\n const lineIndexes = pointRefArray.current.reduce(buildLineIndexes, []);\n\n const lowestLineIndex = lineIndexes[0];\n const highestLineIndex = lineIndexes[lineIndexes.length - 1];\n\n return {\n currentLineIndex,\n currentPointIndex,\n lineIndexes,\n lowestLineIndex,\n highestLineIndex,\n };\n };\n\n const findPointToFocus =\n (lineIndex: number, pointIndex: number) =>\n (point: React.MutableRefObject<Element>) =>\n point.current &&\n parseInt(point.current.getAttribute('data-line-index') as string, 10) ===\n lineIndex &&\n parseInt(point.current.getAttribute('data-point-index') as string, 10) ===\n pointIndex;\n\n // eslint-disable-next-line complexity\n function handleChartContainerKeyDown(event: React.KeyboardEvent) {\n const { key, shiftKey } = event;\n switch (key) {\n case 'Tab': {\n event.preventDefault();\n lastFocusedScatterPoint.current = (\n pointRefArray.current.find(\n point => point.current === document.activeElement\n ) as React.MutableRefObject<Element>\n ).current as SVGPathElement;\n shiftKey\n ? tabRef.current && tabRef.current.focus()\n : firstLegendButtonRef.current &&\n firstLegendButtonRef.current.focus();\n break;\n }\n case 'ArrowRight': {\n const focusedPointIndex = pointRefArray.current.findIndex(\n point => point.current === document.activeElement\n );\n\n if (focusedPointIndex !== undefined) {\n focusedPointIndex === pointRefArray.current.length - 1\n ? (pointRefArray.current[0].current as HTMLButtonElement).focus()\n : (\n pointRefArray.current[focusedPointIndex + 1]\n .current as HTMLButtonElement\n ).focus();\n }\n break;\n }\n case 'ArrowLeft': {\n const focusedPointIndex = pointRefArray.current.findIndex(\n point => point.current === document.activeElement\n );\n\n if (focusedPointIndex !== undefined) {\n focusedPointIndex === 0\n ? (\n pointRefArray.current[pointRefArray.current.length - 1]\n .current as HTMLButtonElement\n ).focus()\n : (\n pointRefArray.current[focusedPointIndex - 1]\n .current as HTMLButtonElement\n ).focus();\n }\n break;\n }\n case 'ArrowUp': {\n event.preventDefault();\n const focusedPoint = pointRefArray.current.find(\n point => point.current === document.activeElement\n );\n\n if (focusedPoint && focusedPoint.current) {\n const {\n currentLineIndex,\n currentPointIndex,\n lineIndexes,\n lowestLineIndex,\n highestLineIndex,\n } = buildLineIndexData(focusedPoint);\n\n switch (currentLineIndex) {\n case lowestLineIndex: {\n (\n (\n pointRefArray.current.find(\n findPointToFocus(highestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n break;\n }\n default: {\n const nextLowestLineIndex =\n lineIndexes[lineIndexes.indexOf(currentLineIndex) - 1];\n (\n (\n pointRefArray.current.find(\n findPointToFocus(nextLowestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n }\n }\n }\n break;\n }\n case 'ArrowDown': {\n event.preventDefault();\n const focusedPoint = pointRefArray.current.find(\n point => point.current === document.activeElement\n );\n\n if (focusedPoint && focusedPoint.current) {\n const {\n currentLineIndex,\n currentPointIndex,\n lineIndexes,\n lowestLineIndex,\n highestLineIndex,\n } = buildLineIndexData(focusedPoint);\n\n switch (currentLineIndex) {\n case highestLineIndex: {\n (\n (\n pointRefArray.current.find(\n findPointToFocus(lowestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n break;\n }\n default: {\n const nextHighestLineIndex =\n lineIndexes[lineIndexes.indexOf(currentLineIndex) + 1];\n (\n (\n pointRefArray.current.find(\n findPointToFocus(nextHighestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n }\n }\n }\n break;\n }\n }\n }\n\n function handleFirstLegendButtonKeydown(event: React.KeyboardEvent) {\n const { key, shiftKey } = event;\n switch (key) {\n case 'Tab': {\n if (\n shiftKey &&\n lastFocusedScatterPoint &&\n lastFocusedScatterPoint.current &&\n pointRefArray.current.find(\n point => point.current === lastFocusedScatterPoint.current\n )\n ) {\n event.preventDefault();\n lastFocusedScatterPoint.current.focus();\n }\n break;\n }\n }\n }\n\n return (\n <LineChartContainer ref={containerRef}>\n <VictoryChartContainer onKeyDown={handleChartContainerKeyDown}>\n <VictoryChart\n domainPadding={32}\n height={400}\n padding={{ top: 0, left: 80, right: 0, bottom: 62 }}\n theme={magmaTheme}\n width={width}\n containerComponent={\n <VictoryVoronoiContainer\n name=\"xAxisGroupLabel\"\n voronoiBlacklist={scatterNames}\n voronoiDimension=\"x\"\n labels={\n hoveringOnXAxisLine && showXAxisLabel ? () => ` ` : undefined\n }\n labelComponent={\n showXAxisLabel ? (\n <VictoryTooltip\n flyoutComponent={\n <AxisTooltip\n dataLength={data.length}\n hiddenData={hiddenData}\n />\n }\n />\n ) : undefined\n }\n role=\"presentation\"\n voronoiPadding={32}\n />\n }\n {...chart}\n >\n <VictoryAxis {...yAxisOther} dependentAxis style={yAxisStyles} />\n {data.map(\n ({ data: dataset }, i) =>\n !hiddenData.includes(i) && (\n <VictoryLine\n style={{\n data: {\n opacity: setLineOpacity(i),\n stroke: theme.iterableColors[i],\n strokeWidth: '3',\n },\n parent: { border: theme.colors.neutral04 },\n }}\n key={`line${i}`}\n data={dataset as unknown as any[]}\n labelComponent={<></>}\n x={x as DataGetterPropType}\n y={y as DataGetterPropType}\n {...line}\n />\n )\n )}\n <VictoryAxis\n {...xAxisOther}\n style={xAxisStyles}\n gridComponent={\n <CustomAxisComponent\n events={{\n onMouseEnter: () => setHoveringOnXAxisLine(true),\n onMouseLeave: () => setHoveringOnXAxisLine(false),\n }}\n />\n }\n />\n {data.map(\n ({ data: dataset }, i) =>\n !hiddenData.includes(i) && (\n <VictoryScatter\n name={`scatter-${i}`}\n events={[\n {\n target: 'data',\n eventHandlers: {\n onBlur: () => {\n setShowXAxisLabel(true);\n setShowTooltip(null);\n return [\n {\n target: 'labels',\n mutation: () => ({ active: undefined }),\n },\n ];\n },\n onClick: () => {\n return [\n {\n target: 'labels',\n mutation: props => {\n setShowTooltip(\n `${props.datum.lineIndex}-${props.datum.index}`\n );\n return { active: true };\n },\n },\n ];\n },\n onFocus: () => {\n setShowXAxisLabel(false);\n return [\n {\n target: 'labels',\n mutation: props => {\n setShowTooltip(\n `${props.datum.lineIndex}-${props.datum.index}`\n );\n return { active: true };\n },\n },\n ];\n },\n onMouseEnter: () => {\n setShowXAxisLabel(false);\n return [\n {\n target: 'labels',\n mutation: props => {\n setShowTooltip(\n `${props.datum.lineIndex}-${props.datum.index}`\n );\n return { active: true };\n },\n },\n ];\n },\n onMouseLeave: () => {\n setShowTooltip(null);\n setShowXAxisLabel(true);\n },\n },\n },\n ]}\n style={{\n data: {\n fill: theme.colors.neutral08,\n opacity: setLineOpacity(i),\n stroke: theme.iterableColors[i],\n strokeWidth: 2,\n },\n }}\n size={5}\n data={\n dataset.map((datum, index) => ({\n index,\n lineIndex: i,\n ...datum,\n })) as unknown as any[]\n }\n dataComponent={\n <CustomScatterDataComponent\n lineIndex={i}\n pointRefArray={pointRefArray}\n registerPoint={registerPoint}\n unregisterPoint={unregisterPoint}\n />\n }\n labels={() => ''}\n labelComponent={\n <VictoryTooltip\n text=\"\"\n flyoutComponent={\n <GraphTooltip index={i} showTooltip={showTooltip} />\n }\n />\n }\n key={`scatter${i}`}\n x={x as DataGetterPropType}\n y={y as DataGetterPropType}\n {...scatter}\n />\n )\n )}\n </VictoryChart>\n </VictoryChartContainer>\n\n <DataLegendsContainer>\n <DataLegendsDescription theme={theme}>\n {i18n.charts.line.dataLegendsLabel}\n </DataLegendsDescription>\n {data.map(({ name }, i) => {\n const legendButtonAriaLabel =\n i18n.charts.line.legendButtonAriaLabel.replace(/\\{name\\}/g, name);\n\n return (\n <LegendButton\n aria-label={legendButtonAriaLabel}\n color={theme.iterableColors[i]}\n dataIndex={i}\n isHidden={hiddenData.includes(i)}\n key={i}\n name={name}\n onClick={handleLegendClick}\n onKeyDown={i === 0 ? handleFirstLegendButtonKeydown : undefined}\n focusCurrentLine={focusCurrentLine}\n ref={i === 0 ? firstLegendButtonRef : undefined}\n resetLineFocus={resetLineFocus}\n />\n );\n })}\n </DataLegendsContainer>\n </LineChartContainer>\n );\n}\n","import * as React from 'react';\nimport { VictoryAxisProps } from 'victory';\n\nimport { Card, Datagrid, Spinner } from 'react-magma-dom';\n\nexport function toCamelCase(str: string) {\n return str\n .toLowerCase()\n .replace(/[^a-z 0-9]/gi, '')\n .replace(/(?:^\\w|[A-Z]|\\b\\w)/g, (ltr, index) =>\n index === 0 ? ltr.toLowerCase() : ltr.toUpperCase()\n )\n .replace(/\\s+/g, '');\n}\n\nexport interface DataTableProps {\n data?: any[];\n xData: {\n keyValue?: string | number | symbol;\n label?: VictoryAxisProps['label'];\n tickFormat?: Partial<VictoryAxisProps['tickFormat']>;\n tickValues?: VictoryAxisProps['tickValues'];\n };\n yData: {\n keyValue?: string | number | symbol;\n tickFormat?: Partial<VictoryAxisProps['tickFormat']>;\n };\n}\n\nexport const ChartDataTable = (props: DataTableProps) => {\n const {\n data = [],\n xData: {\n keyValue: xKeyValue,\n label: xAxisLabel,\n tickFormat: xTickFormat,\n tickValues: xTickValues,\n },\n yData: { keyValue: yKeyValue, tickFormat: yTickFormat },\n } = props;\n const [dataForTable, setDataForTable] = React.useState({\n columns: [],\n rows: [],\n });\n\n React.useEffect(() => {\n setDataForTable(convertData());\n }, [data]);\n\n function convertData() {\n const xField = toCamelCase((xKeyValue || xAxisLabel || 'x') as string);\n const xTickValuesArray = data.reduce((valuesArray, { data: dataset }) => {\n dataset.forEach((datum: any) => {\n const value = datum.x || (xKeyValue && datum[xKeyValue]);\n !valuesArray.includes(value) && valuesArray.push(value);\n });\n\n return valuesArray;\n }, []);\n\n let baseTableData = {\n columns:\n xTickValuesArray.length > 0\n ? [\n {\n field: xField,\n header: xAxisLabel || xKeyValue || 'X',\n isRowHeader: true,\n },\n ]\n : [],\n rows: xTickValuesArray.reduce(\n (agg: any[], tick: number, index: number) => {\n const tickValue =\n xTickValues &&\n typeof tick === 'number' &&\n xTickValues.length === xTickValuesArray.length\n ? xTickFormat && typeof xTickFormat === 'function'\n ? xTickFormat(xTickValues[tick - 1])\n : xTickValues[tick - 1]\n : xTickFormat && Array.isArray(xTickFormat)\n ? xTickFormat[tick - 1]\n : xTickFormat && typeof xTickFormat === 'function'\n ? xTickFormat(tick)\n : tick;\n agg.push({\n [xField]: tickValue,\n id: index,\n });\n\n return agg;\n },\n []\n ),\n };\n\n return data.reduce((tableData, datum) => {\n const { name: header, data: dataset } = datum;\n const field = toCamelCase(header);\n\n tableData.columns.push({\n field,\n header,\n });\n\n dataset.forEach((d: any, i: number) => {\n const yValue =\n d.y || d.y === 0 ? d.y : undefined || (yKeyValue && d[yKeyValue]);\n tableData.rows[i] = {\n ...tableData.rows[i],\n id: baseTableData.rows.length > 0 ? i + 1 : i,\n [field]:\n yTickFormat && typeof yTickFormat === 'function'\n ? yTickFormat(yValue)\n : yValue,\n };\n });\n\n return tableData;\n }, baseTableData);\n }\n\n return (\n <Card>\n {dataForTable.rows.length > 0 ? (\n <Datagrid\n hasPagination={false}\n columns={dataForTable.columns}\n rows={dataForTable.rows}\n />\n ) : (\n <Spinner />\n )}\n </Card>\n );\n};\n","import * as React from 'react';\nimport {\n I18nContext,\n styled,\n ThemeContext,\n useDescendants,\n} from 'react-magma-dom';\nimport { css } from '@emotion/core';\nimport { KeyboardIcon } from 'react-magma-icons';\n\nimport { LineChart, LineChartProps } from './LineChart';\nimport { ChartDataTable } from './ChartDataTable';\nimport {\n Announce,\n ButtonVariant,\n Card,\n IconButton,\n Paragraph,\n TabsContainer,\n Tabs,\n Tab,\n TabPanelsContainer,\n TabPanel,\n Tooltip,\n TypographyVisualStyle,\n} from 'react-magma-dom';\n\ninterface BaseChartProps {\n /**\n * Description of what the line chart data represents placed above the chart\n */\n description?: string;\n testId?: string;\n /**\n * Title of the line chart\n */\n title: string;\n /**\n * Type of chart - for now just 'line' is accepted\n */\n type: string;\n}\nexport interface ChartProps<T extends any>\n extends BaseChartProps,\n Omit<React.HTMLAttributes<HTMLDivElement>, 'title'>,\n LineChartProps<T> {}\n\nconst StyledTitle = styled.span`\n color: ${props => props.theme.colors.neutral};\n font-size: ${props => props.theme.typeScale.size04.fontSize};\n font-weight: 600;\n line-height: ${props => props.theme.typeScale.size04.lineHeight};\n margin: 0 0 12px 0;\n`;\n\nconst StyledParagraph = styled(Paragraph)`\n font-size: ${props => props.theme.typeScale.size02.fontSize};\n margin: 0 0 18px 0;\n`;\n\nconst StyledTabsContainer = styled(TabsContainer)`\n width: 800px;\n ul {\n box-shadow: inset 0 -1px 0 ${props => props.theme.colors.neutral06};\n }\n`;\n\nconst StyledTabPanel = styled(TabPanel)`\n padding: 22px 0;\n`;\n\nconst KeyboardInstructionsCard = styled(Card)<{\n isOpen?: boolean;\n maxHeight?: string;\n width?: string;\n}>`\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n display: ${props => (props.isOpen ? 'block' : 'none')};\n right: ${props => props.theme.spaceScale.spacing02};\n max-height: ${props =>\n props.maxHeight ? props.maxHeight : props.theme.dropdown.content.maxHeight};\n opacity: ${props => (props.isOpen ? '1' : '0')};\n outline: 0;\n overflow-y: auto;\n padding: ${props => props.theme.spaceScale.spacing05}\n ${props => props.theme.spaceScale.spacing05};\n position: absolute;\n transition: opacity 0.3s;\n white-space: nowrap;\n z-index: 2;\n\n ${props =>\n props.width &&\n css`\n white-space: normal;\n width: ${props.width};\n `}\n`;\n\nfunction BaseChart<T>(props: ChartProps<T>, ref: React.Ref<HTMLDivElement>) {\n const { description, title, testId, type, ...other } = props;\n const keyboardInstructionsRef = React.useRef<HTMLButtonElement>(null);\n const lastFocusedScatterPoint = React.useRef<SVGPathElement>(null);\n const theme = React.useContext(ThemeContext);\n const i18n = React.useContext(I18nContext);\n\n const [pointRefArray, registerPoint, unregisterPoint] = useDescendants();\n\n const [isKeyboardInstructionsOpen, setIsKeyboardInstructionsOpen] =\n React.useState<boolean>(false);\n\n function handleKeyboardInstructionsButtonBlur() {\n setIsKeyboardInstructionsOpen(false);\n }\n\n function handleKeyboardInstructionsButtonClick() {\n setIsKeyboardInstructionsOpen(prevOpen => !prevOpen);\n }\n\n function handleKeyboardInstructionsButtonKeydown(event: React.KeyboardEvent) {\n const { key, shiftKey } = event;\n\n switch (key) {\n case 'Escape': {\n setIsKeyboardInstructionsOpen(false);\n break;\n }\n case 'Tab': {\n if (\n !shiftKey &&\n lastFocusedScatterPoint &&\n lastFocusedScatterPoint.current &&\n pointRefArray.current.find(\n point => point.current === lastFocusedScatterPoint.current\n )\n ) {\n event.preventDefault();\n lastFocusedScatterPoint.current.focus();\n }\n break;\n }\n }\n }\n\n return (\n <div ref={ref}>\n <StyledTitle theme={theme}>{title}</StyledTitle>\n {description && (\n <StyledParagraph\n theme={theme}\n visualStyle={TypographyVisualStyle.bodySmall}\n >\n {description}\n </StyledParagraph>\n )}\n <StyledTabsContainer theme={theme}>\n <Tabs>\n <Tab>{i18n.charts.line.chartTabLabel}</Tab>\n <Tab>{i18n.charts.line.dataTabLabel}</Tab>\n <div\n onBlur={handleKeyboardInstructionsButtonBlur}\n style={{\n display: 'inline-block',\n marginLeft: 'auto',\n }}\n >\n <Tooltip\n content={i18n.charts.line.keyboardInstructionsTooltip}\n ref={keyboardInstructionsRef}\n >\n <IconButton\n aria-controls=\"keyboardInstructions\"\n aria-label={i18n.charts.line.keyboardInstructionsTooltip}\n aria-expanded={Boolean(isKeyboardInstructionsOpen)}\n icon={<KeyboardIcon />}\n onClick={handleKeyboardInstructionsButtonClick}\n onKeyDown={handleKeyboardInstructionsButtonKeydown}\n variant={ButtonVariant.link}\n />\n </Tooltip>\n <Announce>\n <KeyboardInstructionsCard\n id=\"keyboardInstructions\"\n isOpen={isKeyboardInstructionsOpen}\n theme={theme}\n width=\"350px\"\n >\n <Paragraph\n visualStyle={TypographyVisualStyle.headingXSmall}\n style={{ margin: '0 0 16px' }}\n >\n {i18n.charts.line.keyboardInstructionsHeader}\n </Paragraph>\n {i18n.charts.line.keyboardInstructions}\n </KeyboardInstructionsCard>\n </Announce>\n </div>\n </Tabs>\n <TabPanelsContainer>\n <StyledTabPanel theme={theme}>\n {type === 'line' && (\n <LineChart<T>\n {...other}\n lastFocusedScatterPoint={lastFocusedScatterPoint}\n pointRefArray={pointRefArray}\n registerPoint={registerPoint}\n tabRef={keyboardInstructionsRef}\n unregisterPoint={unregisterPoint}\n />\n )}\n </StyledTabPanel>\n <StyledTabPanel theme={theme}>\n <ChartDataTable\n data={other.data}\n xData={{\n keyValue: other.x,\n label: other.componentProps?.xAxis?.label,\n tickFormat: other.componentProps?.xAxis?.tickFormat,\n }}\n yData={{\n keyValue: other.y,\n tickFormat: other.componentProps?.yAxis?.tickFormat,\n }}\n />\n </StyledTabPanel>\n </TabPanelsContainer>\n </StyledTabsContainer>\n </div>\n );\n}\n\nexport const Chart = React.forwardRef(BaseChart) as <T>(\n props: ChartProps<T> & { ref?: React.MutableRefObject<HTMLDivElement> }\n) => ReturnType<typeof BaseChart>;\n"],"names":["colors","baseProps","width","height","padding","baseLabelStyles","fontFamily","fontSize","letterSpacing","fill","stroke","strokeWidth","centeredLabelStyles","textAnchor","magmaTheme","area","style","data","labels","axis","strokeLinecap","strokeLinejoin","axisLabel","grid","pointerEvents","ticks","size","tickLabels","polarDependentAxis","bar","boxplot","max","maxLabels","median","medianLabels","min","minLabels","q1","q1Labels","q3","q3Labels","boxWidth","candlestick","candleColors","positive","negative","chart","errorbar","borderWidth","opacity","group","colorScale","histogram","legend","gutter","orientation","titleOrientation","type","title","line","pie","scatter","stack","tooltip","flyoutStyle","flyoutPadding","cornerRadius","pointerLength","voronoi","flyout","StyledGraphTooltip","styled","StyledTooltip","props","theme","neutral08","neutral06","neutral","typeScale","size02","lineHeight","TooltipColorSwatch","span","color","GraphTooltip","datum","index","showTooltip","x","y","React","useContext","ThemeContext","_jsx","_jsxs","position","TooltipPosition","top","role","iterableColors","label","TooltipArrow","AxisTooltip","activePoints","hiddenData","dataLength","pointsIndexes","Array","from","_","i","filter","includes","map","point","CustomScatterDataComponent","pointIndex","lineIndex","pointRefArray","registerPoint","unregisterPoint","other","Point","ariaLabel","pathComponent","CustomPointComponent","tabIndex","forceUpdate","useForceUpdate","ref","useRef","useEffect","CustomAxisComponent","_ref","events","LineSegment","strokeOpacity","LegendButton","forwardRef","dataIndex","isHidden","onClick","name","focusCurrentLine","resetLineFocus","handleOnMouseEnterOrFocus","display","onMouseEnter","onMouseLeave","Checkbox","checked","containerStyle","alignItems","border","boxShadow","margin","inputStyle","neutral02","borderRadius","labelText","onBlur","onFocus","LineChartContainer","div","VictoryChartContainer","DataLegendsContainer","DataLegendsDescription","p","neutral03","LineChart","componentProps","xAxis","xAxisLabel","xTickLabels","yAxis","yAxisLabel","yTickLabels","lastFocusedScatterPoint","tabRef","xRest","xAxisOther","yRest","yAxisOther","i18n","I18nContext","setHiddenData","useState","setWidth","focusedLine","setFocusedLine","setShowTooltip","showXAxisLabel","setShowXAxisLabel","hoveringOnXAxisLine","setHoveringOnXAxisLine","containerRef","firstLegendButtonRef","updateWidth","window","addEventListener","handleEsc","removeEventListener","handleMouseMove","scatterNames","xAxisStyles","fontWeight","yAxisStyles","current","clientWidth","event","key","setLineOpacity","handleLegendClick","item","concat","buildLineIndexes","acc","currentLineIndex","parseInt","getAttribute","push","buildLineIndexData","currentPointIndex","lineIndexes","reduce","lowestLineIndex","highestLineIndex","length","findPointToFocus","handleFirstLegendButtonKeydown","shiftKey","find","preventDefault","focus","onKeyDown","document","activeElement","focusedPointIndex","findIndex","undefined","focusedPoint","nextLowestLineIndex","indexOf","nextHighestLineIndex","VictoryChart","domainPadding","left","right","bottom","containerComponent","VictoryVoronoiContainer","voronoiBlacklist","voronoiDimension","labelComponent","VictoryTooltip","flyoutComponent","voronoiPadding","VictoryAxis","dependentAxis","dataset","VictoryLine","parent","neutral04","gridComponent","VictoryScatter","target","eventHandlers","mutation","active","dataComponent","text","charts","dataLegendsLabel","legendButtonAriaLabel","replace","toCamelCase","str","toLowerCase","ltr","toUpperCase","ChartDataTable","xData","keyValue","xKeyValue","tickFormat","xTickFormat","tickValues","xTickValues","yData","yKeyValue","yTickFormat","dataForTable","setDataForTable","columns","rows","xField","xTickValuesArray","valuesArray","forEach","value","baseTableData","field","header","isRowHeader","agg","tick","tickValue","isArray","id","tableData","d","yValue","convertData","Card","Datagrid","hasPagination","Spinner","StyledTitle","size04","StyledParagraph","Paragraph","StyledTabsContainer","TabsContainer","StyledTabPanel","TabPanel","KeyboardInstructionsCard","isOpen","spaceScale","spacing02","maxHeight","dropdown","content","spacing05","css","BaseChart","description","keyboardInstructionsRef","useDescendants","isKeyboardInstructionsOpen","setIsKeyboardInstructionsOpen","visualStyle","TypographyVisualStyle","bodySmall","Tabs","Tab","chartTabLabel","dataTabLabel","marginLeft","Tooltip","keyboardInstructionsTooltip","IconButton","Boolean","icon","KeyboardIcon","prevOpen","variant","ButtonVariant","link","Announce","headingXSmall","keyboardInstructionsHeader","keyboardInstructions","TabPanelsContainer","_other$componentProps","_other$componentProps2","_other$componentProps3","_other$componentProps4","_other$componentProps5","_other$componentProps6","Chart"],"mappings":"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"}
1
+ {"version":3,"file":"charts.modern.js","sources":["../src/components/LineChart/magma-charts.ts","../src/components/LineChart/GraphTooltip.tsx","../src/components/LineChart/CustomPointComponent.tsx","../src/components/LineChart/CustomAxisComponent.tsx","../src/components/LineChart/LegendButton.tsx","../src/components/LineChart/LineChart.tsx","../src/components/LineChart/ChartDataTable.tsx","../src/components/LineChart/Chart.tsx"],"sourcesContent":["// *\n// * Colors\n// *\n// const yellow200 = '#FFF59D';\n// const deepOrange600 = '#F4511E';\n// const lime300 = '#DCE775';\n// const lightGreen500 = '#8BC34A';\n// const teal700 = '#00796B';\n// const cyan900 = '#006064';\n\n// const colors = [\n// '#0085CC',\n// '#E0004D',\n// '#FA6600',\n// '#48A200',\n// '#B12FAD',\n// '#00A393',\n// ];\n\nconst colors = [\n '#00507A',\n '#8F0033',\n '#B84900',\n '#255200',\n '#711E6E',\n '#005249',\n];\n\nconst blueGrey50 = '#DFDFDF';\nconst blueGrey300 = '#8F8F8F';\nconst blueGrey700 = '#3F3F3F';\nconst grey900 = 'pink';\n\n// *\n// * Typography\n// *\nconst sansSerif = '\"Work Sans\",Helvetica,sans-serif';\nconst letterSpacing = 'normal';\nconst fontSize = 12;\n\n// *\n// * Layout\n// *\nconst padding = 8;\nconst baseProps = {\n width: 350,\n height: 350,\n padding: 50,\n};\n\n// *\n// * Labels\n// *\nconst baseLabelStyles = {\n fontFamily: sansSerif,\n fontSize,\n letterSpacing,\n padding,\n fill: blueGrey700,\n stroke: 'transparent',\n strokeWidth: 0,\n};\n\nconst centeredLabelStyles = { textAnchor: 'middle', ...baseLabelStyles };\n// *\n// * Strokes\n// *\n// const strokeDasharray = '10, 5';\nconst strokeLinecap = 'round';\nconst strokeLinejoin = 'round';\n\nexport const magmaTheme: any = {\n area: {\n style: {\n data: {\n fill: grey900,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n axis: {\n style: {\n axis: {\n fill: 'transparent',\n stroke: blueGrey300,\n strokeWidth: 1,\n strokeLinecap,\n strokeLinejoin,\n },\n axisLabel: {\n ...centeredLabelStyles,\n padding,\n stroke: 'transparent',\n },\n grid: {\n fill: 'none',\n stroke: '#dfdfdf',\n //strokeDasharray,\n strokeLinecap,\n strokeLinejoin,\n pointerEvents: 'painted',\n },\n ticks: {\n fill: 'transparent',\n size: 0,\n stroke: blueGrey300,\n strokeWidth: 0,\n strokeLinecap,\n strokeLinejoin,\n },\n tickLabels: {\n ...baseLabelStyles,\n fill: blueGrey700,\n },\n },\n ...baseProps,\n },\n polarDependentAxis: {\n style: {\n ticks: {\n fill: 'transparent',\n size: 1,\n stroke: 'transparent',\n },\n },\n },\n bar: {\n style: {\n data: {\n fill: blueGrey700,\n padding,\n strokeWidth: 0,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n boxplot: {\n style: {\n max: { padding, stroke: blueGrey700, strokeWidth: 1 },\n maxLabels: { ...baseLabelStyles, padding: 3 },\n median: { padding, stroke: blueGrey700, strokeWidth: 1 },\n medianLabels: { ...baseLabelStyles, padding: 3 },\n min: { padding, stroke: blueGrey700, strokeWidth: 1 },\n minLabels: { ...baseLabelStyles, padding: 3 },\n q1: { padding, fill: blueGrey700 },\n q1Labels: { ...baseLabelStyles, padding: 3 },\n q3: { padding, fill: blueGrey700 },\n q3Labels: { ...baseLabelStyles, padding: 3 },\n },\n boxWidth: 20,\n ...baseProps,\n },\n candlestick: {\n style: {\n data: {\n stroke: blueGrey700,\n },\n labels: { ...baseLabelStyles, padding: 5 },\n },\n candleColors: {\n positive: '#ffffff',\n negative: blueGrey700,\n },\n ...baseProps,\n },\n chart: baseProps,\n errorbar: {\n borderWidth: 8,\n style: {\n data: {\n fill: 'transparent',\n opacity: 1,\n stroke: blueGrey700,\n strokeWidth: 2,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n group: {\n colorScale: colors,\n ...baseProps,\n },\n histogram: {\n style: {\n data: {\n fill: blueGrey700,\n stroke: grey900,\n strokeWidth: 2,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n legend: {\n colorScale: colors,\n gutter: 10,\n orientation: 'vertical',\n titleOrientation: 'top',\n style: {\n data: {\n type: 'circle',\n },\n labels: baseLabelStyles,\n title: { ...baseLabelStyles, padding: 5 },\n },\n },\n line: {\n style: {\n data: {\n fill: 'transparent',\n opacity: 1,\n stroke: blueGrey700,\n strokeWidth: 2,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n pie: {\n colorScale: colors,\n style: {\n data: {\n padding,\n stroke: blueGrey50,\n strokeWidth: 1,\n },\n labels: { ...baseLabelStyles, padding: 20 },\n },\n ...baseProps,\n },\n scatter: {\n style: {\n data: {\n fill: blueGrey700,\n opacity: 1,\n stroke: 'transparent',\n strokeWidth: 0,\n },\n labels: baseLabelStyles,\n },\n ...baseProps,\n },\n stack: {\n colorScale: colors,\n ...baseProps,\n },\n tooltip: {\n style: { ...baseLabelStyles, padding: 0, pointerEvents: 'none' },\n flyoutStyle: {\n stroke: grey900,\n strokeWidth: 1,\n fill: '#f0f0f0',\n pointerEvents: 'none',\n },\n flyoutPadding: 5,\n cornerRadius: 5,\n pointerLength: 10,\n },\n voronoi: {\n style: {\n data: {\n fill: 'transparent',\n stroke: 'transparent',\n strokeWidth: 0,\n },\n labels: { ...baseLabelStyles, padding: 5, pointerEvents: 'none' },\n flyout: {\n stroke: grey900,\n strokeWidth: 1,\n fill: '#f0f0f0',\n pointerEvents: 'none',\n },\n },\n ...baseProps,\n },\n};\n","import * as React from 'react';\nimport {\n StyledTooltip,\n ThemeContext,\n TooltipArrow,\n TooltipPosition,\n ThemeInterface,\n styled,\n} from 'react-magma-dom';\n\nconst StyledGraphTooltip = styled(StyledTooltip)`\n background: ${(props: any) => props.theme.colors.neutral100};\n border: 1px solid ${(props: any) => props.theme.colors.neutral300};\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);\n box-sizing: border-box;\n color: ${(props: any) => props.theme.colors.neutral};\n font-size: ${(props: any) => props.theme.typeScale.size02.fontSize};\n font-weight: normal;\n line-height: ${(props: any) => props.theme.typeScale.size02.lineHeight};\n margin: 0;\n padding: 8px;\n width: fit-content;\n div {\n margin-bottom: 8px;\n display: flex;\n align-items: flex-start;\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n`;\n\nconst TooltipColorSwatch = styled.span`\n background: ${(props: any) => props.color};\n border: ${(props: any) => (props.color ? 'none' : '3px solid black')};\n border-radius: 4px;\n height: 20px;\n width: 20px;\n margin-right: 8px;\n`;\n\nexport const GraphTooltip = (props: any) => {\n const { datum, index, showTooltip, x, y } = props;\n\n const theme: ThemeInterface = React.useContext(ThemeContext);\n const linePointIndex = `${index}-${datum.index}`;\n\n return showTooltip === linePointIndex ? (\n <g style={{ pointerEvents: 'none' }}>\n <foreignObject x={x} y={y} width=\"275\" height=\"100%\">\n <StyledGraphTooltip\n position={TooltipPosition.top}\n role=\"tooltip\"\n theme={theme}\n >\n <div>\n <TooltipColorSwatch color={theme.iterableColors[index]} />\n <span>{datum.label}</span>\n </div>\n <TooltipArrow theme={theme} />\n </StyledGraphTooltip>\n </foreignObject>\n </g>\n ) : null;\n};\n\nexport const AxisTooltip = (props: any) => {\n const { x, y, activePoints, hiddenData, dataLength } = props;\n\n const pointsIndexes = Array.from(\n Array(dataLength - 0),\n (_, i) => i + 0\n ).filter(i => !hiddenData.includes(i));\n\n const theme: ThemeInterface = React.useContext(ThemeContext);\n\n return (\n <g style={{ pointerEvents: 'none' }}>\n <foreignObject x={x} y={y} width=\"275\" height=\"100%\">\n <StyledGraphTooltip\n data-testid=\"axis-tooltip\"\n position={TooltipPosition.top}\n role=\"tooltip\"\n theme={theme}\n >\n {activePoints.map((point: any, i: number) => (\n <div key={i}>\n <TooltipColorSwatch\n color={theme.iterableColors[pointsIndexes[i]]}\n />\n <span>{point.label}</span>\n </div>\n ))}\n <TooltipArrow theme={theme} />\n </StyledGraphTooltip>\n </foreignObject>\n </g>\n );\n};\n","import * as React from 'react';\nimport { Point, PointProps } from 'victory';\nimport { useForceUpdate } from 'react-magma-dom';\n\nexport interface CustomScatterDataComponentInterface extends PointProps {\n lineIndex: number;\n pointRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;\n registerPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n unregisterPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n}\n\nexport interface CustomPointComponentInterface {\n lineIndex: number;\n pointIndex: PointProps['index'];\n pointRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;\n registerPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n unregisterPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n}\n\nexport const CustomScatterDataComponent = (\n props: CustomScatterDataComponentInterface\n) => {\n const {\n datum,\n index: pointIndex,\n lineIndex,\n pointRefArray,\n registerPoint,\n unregisterPoint,\n ...other\n } = props;\n return (\n <Point\n {...other}\n ariaLabel={datum.label}\n pathComponent={\n <CustomPointComponent\n lineIndex={lineIndex}\n pointIndex={pointIndex}\n pointRefArray={pointRefArray}\n registerPoint={registerPoint}\n unregisterPoint={unregisterPoint}\n />\n }\n role=\"button\"\n tabIndex={0}\n />\n );\n};\n\nexport const CustomPointComponent = (props: CustomPointComponentInterface) => {\n const {\n lineIndex,\n pointRefArray,\n pointIndex,\n registerPoint,\n unregisterPoint,\n ...other\n } = props;\n const forceUpdate = useForceUpdate();\n const ref = React.useRef<SVGPathElement | null>(null);\n\n React.useEffect(() => {\n registerPoint(pointRefArray, ref as React.MutableRefObject<Element>);\n\n forceUpdate();\n\n return () =>\n unregisterPoint(pointRefArray, ref as React.MutableRefObject<Element>);\n }, []);\n\n return (\n <path\n ref={ref}\n data-line-index={lineIndex}\n data-point-index={pointIndex}\n {...other}\n />\n );\n};\n","import * as React from 'react';\nimport { LineSegment, LineSegmentProps } from 'victory';\n\nexport const CustomAxisComponent: React.FunctionComponent<LineSegmentProps> = ({\n events,\n ...props\n}: any) => {\n return (\n <g>\n <LineSegment\n {...props}\n events={events}\n style={{\n strokeWidth: '50px',\n stroke: 'transparent',\n }}\n />\n <LineSegment\n {...props}\n events={events}\n style={{\n strokeWidth: '1px',\n stroke: 'black',\n strokeOpacity: '0.2',\n }}\n />\n </g>\n );\n};\n","import * as React from 'react';\nimport { ThemeContext, Checkbox } from 'react-magma-dom';\n\nexport interface DataTableProps {\n name?: string;\n color?: string;\n}\n\nexport const LegendButton = React.forwardRef<HTMLButtonElement, any>(\n (props, ref) => {\n const {\n children,\n color,\n dataIndex,\n isHidden,\n onClick,\n name,\n focusCurrentLine,\n resetLineFocus,\n ...other\n } = props;\n\n function handleClick() {\n onClick && typeof onClick === 'function' && onClick(dataIndex);\n\n if (!isHidden) {\n resetLineFocus &&\n typeof resetLineFocus === 'function' &&\n resetLineFocus();\n }\n }\n\n function handleOnMouseEnterOrFocus() {\n if (!isHidden) {\n focusCurrentLine &&\n typeof focusCurrentLine === 'function' &&\n focusCurrentLine(dataIndex);\n }\n }\n\n const theme = React.useContext(ThemeContext);\n\n return (\n <div\n style={{ display: 'inline-flex' }}\n onMouseEnter={handleOnMouseEnterOrFocus}\n onMouseLeave={resetLineFocus}\n >\n <Checkbox\n checked={!isHidden}\n color={color}\n containerStyle={{\n alignItems: 'center',\n border: '0',\n boxShadow: '0 0 0',\n color: theme.colors.neutral,\n display: 'inline-flex',\n margin: '0 36px 20px 0',\n padding: '0',\n }}\n inputStyle={{\n border: color ? `none` : `2px solid ${theme.colors.neutral800}`,\n borderRadius: '4px',\n }}\n labelText={name}\n onBlur={resetLineFocus}\n onClick={handleClick}\n onFocus={handleOnMouseEnterOrFocus}\n ref={ref}\n theme={theme}\n {...other}\n />\n </div>\n );\n }\n);\n","import * as React from 'react';\nimport {\n VictoryAxis,\n VictoryAxisProps,\n VictoryChart,\n VictoryChartProps,\n VictoryLine,\n VictoryLineProps,\n VictoryScatter,\n VictoryScatterProps,\n VictoryTooltip,\n VictoryVoronoiContainer,\n} from 'victory';\n\nimport {\n I18nContext,\n ThemeContext,\n styled,\n ThemeInterface,\n I18nInterface,\n} from 'react-magma-dom';\n\nimport { magmaTheme } from './magma-charts';\nimport { AxisTooltip, GraphTooltip } from './GraphTooltip';\nimport { CustomScatterDataComponent } from './CustomPointComponent';\nimport { CustomAxisComponent } from './CustomAxisComponent';\nimport { LegendButton } from './LegendButton';\n\nexport type LineChartAxisStyle = VictoryAxisProps['style'];\nexport type DataGetterPropType = VictoryLineProps['x'];\n\nexport type ChartDataOptions =\n | {\n label: string;\n x: string | number;\n y: string | number;\n [key: string]: any;\n }\n | { label: string; [key: string]: any }\n | any;\n\nexport interface LineChartData<T> {\n name: string;\n data: T[];\n}\n\nexport interface LineChartComponentProps {\n chart?: VictoryChartProps;\n line?: VictoryLineProps;\n scatter?: VictoryScatterProps;\n xAxis?: VictoryAxisProps;\n yAxis?: VictoryAxisProps;\n}\n\n// NOTE: These props are manually copied to line-chart.mdx\nexport interface LineChartProps<T extends ChartDataOptions> {\n /**\n * Props passed to each component that makes up the line chart. See `victory` for accepted props.\n */\n componentProps?: LineChartComponentProps;\n /**\n * Data used to build the chart\n */\n data?: LineChartData<T>[];\n isMulti?: boolean;\n /**\n * @internal\n */\n lastFocusedScatterPoint: React.MutableRefObject<SVGPathElement | null>;\n /**\n * @internal\n */\n pointRefArray: React.MutableRefObject<React.MutableRefObject<Element>[]>;\n /**\n * @internal\n */\n registerPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n /**\n * @internal\n */\n tabRef: React.MutableRefObject<HTMLButtonElement | null>;\n /**\n * @internal\n */\n unregisterPoint: (\n refArray: React.MutableRefObject<React.MutableRefObject<Element>[]>,\n ref: React.MutableRefObject<Element>\n ) => void;\n /**\n * Value of x key in chart data\n */\n x?: keyof T;\n /**\n * Value of y key in chart data\n */\n y?: keyof T;\n}\n\nconst LineChartContainer = styled.div`\n max-height: 600px;\n max-width: 800px;\n svg {\n overflow: visible;\n }\n`;\n\nconst VictoryChartContainer = styled.div``;\n\nconst DataLegendsContainer = styled.div`\n padding-bottom: 24px;\n`;\n\nconst DataLegendsDescription = styled.p`\n color: ${(props: any) => props.theme.colors.neutral};\n font-size: ${(props: any) => props.theme.typeScale.size02.fontSize};\n`;\n\nexport function LineChart<T>(props: LineChartProps<T>) {\n const {\n componentProps: {\n chart = {},\n line = {},\n scatter = {},\n xAxis: {\n style: {\n axisLabel: xAxisLabel = undefined,\n tickLabels: xTickLabels = undefined,\n ...xRest\n } = {},\n ...xAxisOther\n } = { style: {} },\n yAxis: {\n style: {\n axisLabel: yAxisLabel = undefined,\n tickLabels: yTickLabels = undefined,\n ...yRest\n } = {},\n ...yAxisOther\n } = { style: {} },\n } = {},\n data = [],\n lastFocusedScatterPoint,\n pointRefArray,\n registerPoint,\n unregisterPoint,\n tabRef,\n x,\n y,\n } = props;\n\n const theme: ThemeInterface = React.useContext(ThemeContext);\n const i18n: I18nInterface = React.useContext(I18nContext);\n\n const [hiddenData, setHiddenData] = React.useState<number[]>([]);\n const [width, setWidth] = React.useState<number>(800);\n const [focusedLine, setFocusedLine] = React.useState<number | null>(null);\n const [showTooltip, setShowTooltip] = React.useState<string | null>(null);\n const [showXAxisLabel, setShowXAxisLabel] = React.useState<boolean>(true);\n const [hoveringOnXAxisLine, setHoveringOnXAxisLine] =\n React.useState<boolean>(false);\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const firstLegendButtonRef = React.useRef<HTMLButtonElement>(null);\n\n React.useEffect(() => {\n updateWidth();\n\n window.addEventListener('resize', updateWidth);\n window.addEventListener('keydown', handleEsc);\n\n return () => {\n window.removeEventListener('resize', updateWidth);\n window.removeEventListener('keydown', handleEsc);\n };\n }, []);\n\n React.useEffect(() => {\n window.addEventListener('mousemove', handleMouseMove);\n\n return () => {\n window.removeEventListener('mousemove', handleMouseMove);\n };\n }, [showTooltip]);\n\n const scatterNames: string[] = data.map((_, i) => `scatter-${i}`);\n\n const xAxisStyles = {\n tickLabels: {\n color: '#3f3f3f',\n fontSize: 12,\n ...xTickLabels,\n },\n axisLabel: {\n color: '#3f3f3f',\n padding: 44,\n fontSize: 14,\n fontWeight: 'bold',\n ...xAxisLabel,\n },\n ...xRest,\n };\n\n const yAxisStyles = {\n tickLabels: {\n fontSize: 12,\n ...yTickLabels,\n },\n axisLabel: {\n color: '#3f3f3f',\n padding: 64,\n fontSize: 14,\n fontWeight: 'bold',\n ...yAxisLabel,\n },\n ...yRest,\n };\n\n function updateWidth() {\n containerRef.current && setWidth(containerRef.current.clientWidth);\n }\n\n function handleEsc(event: KeyboardEvent): any {\n if (event.key === 'Escape') {\n setShowTooltip(null);\n setShowXAxisLabel(false);\n }\n }\n\n function handleMouseMove() {\n !showTooltip && setShowXAxisLabel(true);\n }\n\n function setLineOpacity(index: number) {\n return focusedLine === null ? 1 : focusedLine === index ? 1 : 0.1;\n }\n\n function handleLegendClick(dataIndex: number) {\n if (hiddenData.includes(dataIndex)) {\n setHiddenData(hiddenData.filter(item => item !== dataIndex));\n } else {\n setHiddenData(hiddenData.concat([dataIndex]));\n }\n }\n\n function focusCurrentLine(dataIndex: number) {\n setFocusedLine(dataIndex);\n }\n\n function resetLineFocus() {\n setFocusedLine(null);\n }\n\n const buildLineIndexes = (\n acc: number[],\n point: React.MutableRefObject<Element>\n ) => {\n if (point.current) {\n const currentLineIndex = parseInt(\n point.current.getAttribute('data-line-index') as string,\n 10\n );\n !acc.includes(currentLineIndex) &&\n acc.push(\n parseInt(point.current.getAttribute('data-line-index') as string, 10)\n );\n }\n return acc;\n };\n\n const buildLineIndexData = (point: React.MutableRefObject<Element>) => {\n const currentLineIndex = parseInt(\n point.current.getAttribute('data-line-index') as string,\n 10\n );\n const currentPointIndex = parseInt(\n point.current.getAttribute('data-point-index') as string,\n 10\n );\n const lineIndexes = pointRefArray.current.reduce(buildLineIndexes, []);\n\n const lowestLineIndex = lineIndexes[0];\n const highestLineIndex = lineIndexes[lineIndexes.length - 1];\n\n return {\n currentLineIndex,\n currentPointIndex,\n lineIndexes,\n lowestLineIndex,\n highestLineIndex,\n };\n };\n\n const findPointToFocus =\n (lineIndex: number, pointIndex: number) =>\n (point: React.MutableRefObject<Element>) =>\n point.current &&\n parseInt(point.current.getAttribute('data-line-index') as string, 10) ===\n lineIndex &&\n parseInt(point.current.getAttribute('data-point-index') as string, 10) ===\n pointIndex;\n\n // eslint-disable-next-line complexity\n function handleChartContainerKeyDown(event: React.KeyboardEvent) {\n const { key, shiftKey } = event;\n switch (key) {\n case 'Tab': {\n event.preventDefault();\n lastFocusedScatterPoint.current = (\n pointRefArray.current.find(\n point => point.current === document.activeElement\n ) as React.MutableRefObject<Element>\n ).current as SVGPathElement;\n shiftKey\n ? tabRef.current && tabRef.current.focus()\n : firstLegendButtonRef.current &&\n firstLegendButtonRef.current.focus();\n break;\n }\n case 'ArrowRight': {\n const focusedPointIndex = pointRefArray.current.findIndex(\n point => point.current === document.activeElement\n );\n\n if (focusedPointIndex !== undefined) {\n focusedPointIndex === pointRefArray.current.length - 1\n ? (pointRefArray.current[0].current as HTMLButtonElement).focus()\n : (\n pointRefArray.current[focusedPointIndex + 1]\n .current as HTMLButtonElement\n ).focus();\n }\n break;\n }\n case 'ArrowLeft': {\n const focusedPointIndex = pointRefArray.current.findIndex(\n point => point.current === document.activeElement\n );\n\n if (focusedPointIndex !== undefined) {\n focusedPointIndex === 0\n ? (\n pointRefArray.current[pointRefArray.current.length - 1]\n .current as HTMLButtonElement\n ).focus()\n : (\n pointRefArray.current[focusedPointIndex - 1]\n .current as HTMLButtonElement\n ).focus();\n }\n break;\n }\n case 'ArrowUp': {\n event.preventDefault();\n const focusedPoint = pointRefArray.current.find(\n point => point.current === document.activeElement\n );\n\n if (focusedPoint && focusedPoint.current) {\n const {\n currentLineIndex,\n currentPointIndex,\n lineIndexes,\n lowestLineIndex,\n highestLineIndex,\n } = buildLineIndexData(focusedPoint);\n\n switch (currentLineIndex) {\n case lowestLineIndex: {\n (\n (\n pointRefArray.current.find(\n findPointToFocus(highestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n break;\n }\n default: {\n const nextLowestLineIndex =\n lineIndexes[lineIndexes.indexOf(currentLineIndex) - 1];\n (\n (\n pointRefArray.current.find(\n findPointToFocus(nextLowestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n }\n }\n }\n break;\n }\n case 'ArrowDown': {\n event.preventDefault();\n const focusedPoint = pointRefArray.current.find(\n point => point.current === document.activeElement\n );\n\n if (focusedPoint && focusedPoint.current) {\n const {\n currentLineIndex,\n currentPointIndex,\n lineIndexes,\n lowestLineIndex,\n highestLineIndex,\n } = buildLineIndexData(focusedPoint);\n\n switch (currentLineIndex) {\n case highestLineIndex: {\n (\n (\n pointRefArray.current.find(\n findPointToFocus(lowestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n break;\n }\n default: {\n const nextHighestLineIndex =\n lineIndexes[lineIndexes.indexOf(currentLineIndex) + 1];\n (\n (\n pointRefArray.current.find(\n findPointToFocus(nextHighestLineIndex, currentPointIndex)\n ) as React.MutableRefObject<Element>\n ).current as HTMLButtonElement\n ).focus();\n }\n }\n }\n break;\n }\n }\n }\n\n function handleFirstLegendButtonKeydown(event: React.KeyboardEvent) {\n const { key, shiftKey } = event;\n switch (key) {\n case 'Tab': {\n if (\n shiftKey &&\n lastFocusedScatterPoint &&\n lastFocusedScatterPoint.current &&\n pointRefArray.current.find(\n point => point.current === lastFocusedScatterPoint.current\n )\n ) {\n event.preventDefault();\n lastFocusedScatterPoint.current.focus();\n }\n break;\n }\n }\n }\n\n return (\n <LineChartContainer ref={containerRef}>\n <VictoryChartContainer onKeyDown={handleChartContainerKeyDown}>\n <VictoryChart\n domainPadding={32}\n height={400}\n padding={{ top: 0, left: 80, right: 0, bottom: 62 }}\n theme={magmaTheme}\n width={width}\n containerComponent={\n <VictoryVoronoiContainer\n name=\"xAxisGroupLabel\"\n voronoiBlacklist={scatterNames}\n voronoiDimension=\"x\"\n labels={\n hoveringOnXAxisLine && showXAxisLabel ? () => ` ` : undefined\n }\n labelComponent={\n showXAxisLabel ? (\n <VictoryTooltip\n flyoutComponent={\n <AxisTooltip\n dataLength={data.length}\n hiddenData={hiddenData}\n />\n }\n />\n ) : undefined\n }\n role=\"presentation\"\n voronoiPadding={32}\n />\n }\n {...chart}\n >\n <VictoryAxis {...yAxisOther} dependentAxis style={yAxisStyles} />\n {data.map(\n ({ data: dataset }, i) =>\n !hiddenData.includes(i) && (\n <VictoryLine\n style={{\n data: {\n opacity: setLineOpacity(i),\n stroke: theme.iterableColors[i],\n strokeWidth: '3',\n },\n parent: { border: theme.colors.neutral400 },\n }}\n key={`line${i}`}\n data={dataset as unknown as any[]}\n labelComponent={<></>}\n x={x as DataGetterPropType}\n y={y as DataGetterPropType}\n {...line}\n />\n )\n )}\n <VictoryAxis\n {...xAxisOther}\n style={xAxisStyles}\n gridComponent={\n <CustomAxisComponent\n events={{\n onMouseEnter: () => setHoveringOnXAxisLine(true),\n onMouseLeave: () => setHoveringOnXAxisLine(false),\n }}\n />\n }\n />\n {data.map(\n ({ data: dataset }, i) =>\n !hiddenData.includes(i) && (\n <VictoryScatter\n name={`scatter-${i}`}\n events={[\n {\n target: 'data',\n eventHandlers: {\n onBlur: () => {\n setShowXAxisLabel(true);\n setShowTooltip(null);\n return [\n {\n target: 'labels',\n mutation: () => ({ active: undefined }),\n },\n ];\n },\n onClick: () => {\n return [\n {\n target: 'labels',\n mutation: props => {\n setShowTooltip(\n `${props.datum.lineIndex}-${props.datum.index}`\n );\n return { active: true };\n },\n },\n ];\n },\n onFocus: () => {\n setShowXAxisLabel(false);\n return [\n {\n target: 'labels',\n mutation: props => {\n setShowTooltip(\n `${props.datum.lineIndex}-${props.datum.index}`\n );\n return { active: true };\n },\n },\n ];\n },\n onMouseEnter: () => {\n setShowXAxisLabel(false);\n return [\n {\n target: 'labels',\n mutation: props => {\n setShowTooltip(\n `${props.datum.lineIndex}-${props.datum.index}`\n );\n return { active: true };\n },\n },\n ];\n },\n onMouseLeave: () => {\n setShowTooltip(null);\n setShowXAxisLabel(true);\n },\n },\n },\n ]}\n style={{\n data: {\n fill: theme.colors.neutral100,\n opacity: setLineOpacity(i),\n stroke: theme.iterableColors[i],\n strokeWidth: 2,\n },\n }}\n size={5}\n data={\n dataset.map((datum, index) => ({\n index,\n lineIndex: i,\n ...datum,\n })) as unknown as any[]\n }\n dataComponent={\n <CustomScatterDataComponent\n lineIndex={i}\n pointRefArray={pointRefArray}\n registerPoint={registerPoint}\n unregisterPoint={unregisterPoint}\n />\n }\n labels={() => ''}\n labelComponent={\n <VictoryTooltip\n text=\"\"\n flyoutComponent={\n <GraphTooltip index={i} showTooltip={showTooltip} />\n }\n />\n }\n key={`scatter${i}`}\n x={x as DataGetterPropType}\n y={y as DataGetterPropType}\n {...scatter}\n />\n )\n )}\n </VictoryChart>\n </VictoryChartContainer>\n\n <DataLegendsContainer>\n <DataLegendsDescription theme={theme}>\n {i18n.charts.line.dataLegendsLabel}\n </DataLegendsDescription>\n {data.map(({ name }, i) => {\n const legendButtonAriaLabel =\n i18n.charts.line.legendButtonAriaLabel.replace(/\\{name\\}/g, name);\n\n return (\n <LegendButton\n aria-label={legendButtonAriaLabel}\n color={theme.iterableColors[i]}\n dataIndex={i}\n isHidden={hiddenData.includes(i)}\n key={i}\n name={name}\n onClick={handleLegendClick}\n onKeyDown={i === 0 ? handleFirstLegendButtonKeydown : undefined}\n focusCurrentLine={focusCurrentLine}\n ref={i === 0 ? firstLegendButtonRef : undefined}\n resetLineFocus={resetLineFocus}\n />\n );\n })}\n </DataLegendsContainer>\n </LineChartContainer>\n );\n}\n","import * as React from 'react';\nimport { VictoryAxisProps } from 'victory';\n\nimport { Card, Datagrid, Spinner } from 'react-magma-dom';\n\nexport function toCamelCase(str: string) {\n return str\n .toLowerCase()\n .replace(/[^a-z 0-9]/gi, '')\n .replace(/(?:^\\w|[A-Z]|\\b\\w)/g, (ltr, index) =>\n index === 0 ? ltr.toLowerCase() : ltr.toUpperCase()\n )\n .replace(/\\s+/g, '');\n}\n\nexport interface DataTableProps {\n data?: any[];\n xData: {\n keyValue?: string | number | symbol;\n label?: VictoryAxisProps['label'];\n tickFormat?: Partial<VictoryAxisProps['tickFormat']>;\n tickValues?: VictoryAxisProps['tickValues'];\n };\n yData: {\n keyValue?: string | number | symbol;\n tickFormat?: Partial<VictoryAxisProps['tickFormat']>;\n };\n}\n\nexport const ChartDataTable = (props: DataTableProps) => {\n const {\n data = [],\n xData: {\n keyValue: xKeyValue,\n label: xAxisLabel,\n tickFormat: xTickFormat,\n tickValues: xTickValues,\n },\n yData: { keyValue: yKeyValue, tickFormat: yTickFormat },\n } = props;\n const [dataForTable, setDataForTable] = React.useState({\n columns: [],\n rows: [],\n });\n\n React.useEffect(() => {\n setDataForTable(convertData());\n }, [data]);\n\n function convertData() {\n const xField = toCamelCase((xKeyValue || xAxisLabel || 'x') as string);\n const xTickValuesArray = data.reduce((valuesArray, { data: dataset }) => {\n dataset.forEach((datum: any) => {\n const value = datum.x || (xKeyValue && datum[xKeyValue]);\n !valuesArray.includes(value) && valuesArray.push(value);\n });\n\n return valuesArray;\n }, []);\n\n let baseTableData = {\n columns:\n xTickValuesArray.length > 0\n ? [\n {\n field: xField,\n header: xAxisLabel || xKeyValue || 'X',\n isRowHeader: true,\n },\n ]\n : [],\n rows: xTickValuesArray.reduce(\n (agg: any[], tick: number, index: number) => {\n const tickValue =\n xTickValues &&\n typeof tick === 'number' &&\n xTickValues.length === xTickValuesArray.length\n ? xTickFormat && typeof xTickFormat === 'function'\n ? xTickFormat(xTickValues[tick - 1])\n : xTickValues[tick - 1]\n : xTickFormat && Array.isArray(xTickFormat)\n ? xTickFormat[tick - 1]\n : xTickFormat && typeof xTickFormat === 'function'\n ? xTickFormat(tick)\n : tick;\n agg.push({\n [xField]: tickValue,\n id: index,\n });\n\n return agg;\n },\n []\n ),\n };\n\n return data.reduce((tableData, datum) => {\n const { name: header, data: dataset } = datum;\n const field = toCamelCase(header);\n\n tableData.columns.push({\n field,\n header,\n });\n\n dataset.forEach((d: any, i: number) => {\n const yValue =\n d.y || d.y === 0 ? d.y : undefined || (yKeyValue && d[yKeyValue]);\n tableData.rows[i] = {\n ...tableData.rows[i],\n id: baseTableData.rows.length > 0 ? i + 1 : i,\n [field]:\n yTickFormat && typeof yTickFormat === 'function'\n ? yTickFormat(yValue)\n : yValue,\n };\n });\n\n return tableData;\n }, baseTableData);\n }\n\n return (\n <Card>\n {dataForTable.rows.length > 0 ? (\n <Datagrid\n hasPagination={false}\n columns={dataForTable.columns}\n rows={dataForTable.rows}\n />\n ) : (\n <Spinner />\n )}\n </Card>\n );\n};\n","import * as React from 'react';\nimport {\n I18nContext,\n styled,\n ThemeContext,\n useDescendants,\n} from 'react-magma-dom';\nimport { css } from '@emotion/core';\nimport { KeyboardIcon } from 'react-magma-icons';\n\nimport { LineChart, LineChartProps } from './LineChart';\nimport { ChartDataTable } from './ChartDataTable';\nimport {\n Announce,\n ButtonVariant,\n Card,\n IconButton,\n Paragraph,\n TabsContainer,\n Tabs,\n Tab,\n TabPanelsContainer,\n TabPanel,\n Tooltip,\n TypographyVisualStyle,\n} from 'react-magma-dom';\n\ninterface BaseChartProps {\n /**\n * Description of what the line chart data represents placed above the chart\n */\n description?: string;\n /**\n * @internal\n */\n testId?: string;\n /**\n * Title of the line chart\n */\n title: string;\n /**\n * Type of chart - for now just 'line' is accepted\n */\n type: string;\n}\nexport interface ChartProps<T extends any>\n extends BaseChartProps,\n Omit<React.HTMLAttributes<HTMLDivElement>, 'title'>,\n LineChartProps<T> {}\n\nconst StyledTitle = styled.span`\n color: ${props => props.theme.colors.neutral};\n font-size: ${props => props.theme.typeScale.size04.fontSize};\n font-weight: 600;\n line-height: ${props => props.theme.typeScale.size04.lineHeight};\n margin: 0 0 12px 0;\n`;\n\nconst StyledParagraph = styled(Paragraph)`\n font-size: ${props => props.theme.typeScale.size02.fontSize};\n margin: 0 0 18px 0;\n`;\n\nconst StyledTabsContainer = styled(TabsContainer)`\n width: 800px;\n ul {\n box-shadow: inset 0 -1px 0 ${props => props.theme.colors.neutral300};\n }\n`;\n\nconst StyledTabPanel = styled(TabPanel)`\n padding: 22px 0;\n`;\n\nconst KeyboardInstructionsCard = styled(Card)<{\n isOpen?: boolean;\n maxHeight?: string;\n width?: string;\n}>`\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n display: ${props => (props.isOpen ? 'block' : 'none')};\n right: ${props => props.theme.spaceScale.spacing02};\n max-height: ${props =>\n props.maxHeight ? props.maxHeight : props.theme.dropdown.content.maxHeight};\n opacity: ${props => (props.isOpen ? '1' : '0')};\n outline: 0;\n overflow-y: auto;\n padding: ${props => props.theme.spaceScale.spacing05}\n ${props => props.theme.spaceScale.spacing05};\n position: absolute;\n transition: opacity 0.3s;\n white-space: nowrap;\n z-index: 2;\n\n ${props =>\n props.width &&\n css`\n white-space: normal;\n width: ${props.width};\n `}\n`;\n\nfunction BaseChart<T>(props: ChartProps<T>, ref: React.Ref<HTMLDivElement>) {\n const { description, title, testId, type, ...other } = props;\n const keyboardInstructionsRef = React.useRef<HTMLButtonElement>(null);\n const lastFocusedScatterPoint = React.useRef<SVGPathElement>(null);\n const theme = React.useContext(ThemeContext);\n const i18n = React.useContext(I18nContext);\n\n const [pointRefArray, registerPoint, unregisterPoint] = useDescendants();\n\n const [isKeyboardInstructionsOpen, setIsKeyboardInstructionsOpen] =\n React.useState<boolean>(false);\n\n function handleKeyboardInstructionsButtonBlur() {\n setIsKeyboardInstructionsOpen(false);\n }\n\n function handleKeyboardInstructionsButtonClick() {\n setIsKeyboardInstructionsOpen(prevOpen => !prevOpen);\n }\n\n function handleKeyboardInstructionsButtonKeydown(event: React.KeyboardEvent) {\n const { key, shiftKey } = event;\n\n switch (key) {\n case 'Escape': {\n setIsKeyboardInstructionsOpen(false);\n break;\n }\n case 'Tab': {\n if (\n !shiftKey &&\n lastFocusedScatterPoint &&\n lastFocusedScatterPoint.current &&\n pointRefArray.current.find(\n point => point.current === lastFocusedScatterPoint.current\n )\n ) {\n event.preventDefault();\n lastFocusedScatterPoint.current.focus();\n }\n break;\n }\n }\n }\n\n return (\n <div ref={ref}>\n <StyledTitle theme={theme}>{title}</StyledTitle>\n {description && (\n <StyledParagraph\n theme={theme}\n visualStyle={TypographyVisualStyle.bodySmall}\n >\n {description}\n </StyledParagraph>\n )}\n <StyledTabsContainer theme={theme}>\n <Tabs>\n <Tab>{i18n.charts.line.chartTabLabel}</Tab>\n <Tab>{i18n.charts.line.dataTabLabel}</Tab>\n <div\n onBlur={handleKeyboardInstructionsButtonBlur}\n style={{\n display: 'inline-block',\n marginLeft: 'auto',\n }}\n >\n <Tooltip\n content={i18n.charts.line.keyboardInstructionsTooltip}\n ref={keyboardInstructionsRef}\n >\n <IconButton\n aria-controls=\"keyboardInstructions\"\n aria-label={i18n.charts.line.keyboardInstructionsTooltip}\n aria-expanded={Boolean(isKeyboardInstructionsOpen)}\n icon={<KeyboardIcon />}\n onClick={handleKeyboardInstructionsButtonClick}\n onKeyDown={handleKeyboardInstructionsButtonKeydown}\n variant={ButtonVariant.link}\n />\n </Tooltip>\n <Announce>\n <KeyboardInstructionsCard\n id=\"keyboardInstructions\"\n isOpen={isKeyboardInstructionsOpen}\n theme={theme}\n width=\"350px\"\n >\n <Paragraph\n visualStyle={TypographyVisualStyle.headingXSmall}\n style={{ margin: '0 0 16px' }}\n >\n {i18n.charts.line.keyboardInstructionsHeader}\n </Paragraph>\n {i18n.charts.line.keyboardInstructions}\n </KeyboardInstructionsCard>\n </Announce>\n </div>\n </Tabs>\n <TabPanelsContainer>\n <StyledTabPanel theme={theme}>\n {type === 'line' && (\n <LineChart<T>\n {...other}\n lastFocusedScatterPoint={lastFocusedScatterPoint}\n pointRefArray={pointRefArray}\n registerPoint={registerPoint}\n tabRef={keyboardInstructionsRef}\n unregisterPoint={unregisterPoint}\n />\n )}\n </StyledTabPanel>\n <StyledTabPanel theme={theme}>\n <ChartDataTable\n data={other.data}\n xData={{\n keyValue: other.x,\n label: other.componentProps?.xAxis?.label,\n tickFormat: other.componentProps?.xAxis?.tickFormat,\n }}\n yData={{\n keyValue: other.y,\n tickFormat: other.componentProps?.yAxis?.tickFormat,\n }}\n />\n </StyledTabPanel>\n </TabPanelsContainer>\n </StyledTabsContainer>\n </div>\n );\n}\n\nexport const Chart = React.forwardRef(BaseChart) as <T>(\n props: ChartProps<T> & { ref?: React.MutableRefObject<HTMLDivElement> }\n) => ReturnType<typeof BaseChart>;\n"],"names":["colors","baseProps","width","height","padding","baseLabelStyles","fontFamily","fontSize","letterSpacing","fill","stroke","strokeWidth","centeredLabelStyles","textAnchor","magmaTheme","area","style","data","labels","axis","strokeLinecap","strokeLinejoin","axisLabel","grid","pointerEvents","ticks","size","tickLabels","polarDependentAxis","bar","boxplot","max","maxLabels","median","medianLabels","min","minLabels","q1","q1Labels","q3","q3Labels","boxWidth","candlestick","candleColors","positive","negative","chart","errorbar","borderWidth","opacity","group","colorScale","histogram","legend","gutter","orientation","titleOrientation","type","title","line","pie","scatter","stack","tooltip","flyoutStyle","flyoutPadding","cornerRadius","pointerLength","voronoi","flyout","StyledGraphTooltip","styled","StyledTooltip","props","theme","neutral100","neutral300","neutral","typeScale","size02","lineHeight","TooltipColorSwatch","span","color","GraphTooltip","datum","index","showTooltip","x","y","React","useContext","ThemeContext","_jsx","_jsxs","position","TooltipPosition","top","role","iterableColors","label","TooltipArrow","AxisTooltip","activePoints","hiddenData","dataLength","pointsIndexes","Array","from","_","i","filter","includes","map","point","CustomScatterDataComponent","pointIndex","lineIndex","pointRefArray","registerPoint","unregisterPoint","other","Point","ariaLabel","pathComponent","CustomPointComponent","tabIndex","forceUpdate","useForceUpdate","ref","useRef","useEffect","CustomAxisComponent","_ref","events","LineSegment","strokeOpacity","LegendButton","forwardRef","dataIndex","isHidden","onClick","name","focusCurrentLine","resetLineFocus","handleOnMouseEnterOrFocus","display","onMouseEnter","onMouseLeave","Checkbox","checked","containerStyle","alignItems","border","boxShadow","margin","inputStyle","neutral800","borderRadius","labelText","onBlur","onFocus","LineChartContainer","div","VictoryChartContainer","DataLegendsContainer","DataLegendsDescription","p","LineChart","componentProps","xAxis","xAxisLabel","xTickLabels","yAxis","yAxisLabel","yTickLabels","lastFocusedScatterPoint","tabRef","xRest","xAxisOther","yRest","yAxisOther","i18n","I18nContext","setHiddenData","useState","setWidth","focusedLine","setFocusedLine","setShowTooltip","showXAxisLabel","setShowXAxisLabel","hoveringOnXAxisLine","setHoveringOnXAxisLine","containerRef","firstLegendButtonRef","updateWidth","window","addEventListener","handleEsc","removeEventListener","handleMouseMove","scatterNames","xAxisStyles","fontWeight","yAxisStyles","current","clientWidth","event","key","setLineOpacity","handleLegendClick","item","concat","buildLineIndexes","acc","currentLineIndex","parseInt","getAttribute","push","buildLineIndexData","currentPointIndex","lineIndexes","reduce","lowestLineIndex","highestLineIndex","length","findPointToFocus","handleFirstLegendButtonKeydown","shiftKey","find","preventDefault","focus","onKeyDown","document","activeElement","focusedPointIndex","findIndex","undefined","focusedPoint","nextLowestLineIndex","indexOf","nextHighestLineIndex","VictoryChart","domainPadding","left","right","bottom","containerComponent","VictoryVoronoiContainer","voronoiBlacklist","voronoiDimension","labelComponent","VictoryTooltip","flyoutComponent","voronoiPadding","VictoryAxis","dependentAxis","dataset","VictoryLine","parent","neutral400","gridComponent","VictoryScatter","target","eventHandlers","mutation","active","dataComponent","text","charts","dataLegendsLabel","legendButtonAriaLabel","replace","toCamelCase","str","toLowerCase","ltr","toUpperCase","ChartDataTable","xData","keyValue","xKeyValue","tickFormat","xTickFormat","tickValues","xTickValues","yData","yKeyValue","yTickFormat","dataForTable","setDataForTable","columns","rows","xField","xTickValuesArray","valuesArray","forEach","value","baseTableData","field","header","isRowHeader","agg","tick","tickValue","isArray","id","tableData","d","yValue","convertData","Card","Datagrid","hasPagination","Spinner","StyledTitle","size04","StyledParagraph","Paragraph","StyledTabsContainer","TabsContainer","StyledTabPanel","TabPanel","KeyboardInstructionsCard","isOpen","spaceScale","spacing02","maxHeight","dropdown","content","spacing05","css","BaseChart","description","keyboardInstructionsRef","useDescendants","isKeyboardInstructionsOpen","setIsKeyboardInstructionsOpen","visualStyle","TypographyVisualStyle","bodySmall","Tabs","Tab","chartTabLabel","dataTabLabel","marginLeft","Tooltip","keyboardInstructionsTooltip","IconButton","Boolean","icon","KeyboardIcon","prevOpen","variant","ButtonVariant","link","Announce","headingXSmall","keyboardInstructionsHeader","keyboardInstructions","TabPanelsContainer","_other$componentProps","_other$componentProps2","_other$componentProps3","_other$componentProps4","_other$componentProps5","_other$componentProps6","Chart"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import*as e from"react";import{styled as n,StyledTooltip as t,ThemeContext as r,TooltipPosition as i,TooltipArrow as o,useForceUpdate as a,Checkbox as l,I18nContext as s,Card as u,Datagrid as c,Spinner as d,Paragraph as f,TabsContainer as p,TabPanel as h,useDescendants as m,TypographyVisualStyle as x,Tabs as g,Tab as v,Tooltip as y,IconButton as b,ButtonVariant as k,Announce as w,TabPanelsContainer as F}from"react-magma-dom";import{css as L}from"@emotion/core";import{KeyboardIcon as I}from"react-magma-icons";import{Point as S,LineSegment as A,VictoryChart as C,VictoryVoronoiContainer as E,VictoryTooltip as P,VictoryAxis as z,VictoryLine as W,VictoryScatter as R}from"victory";import{jsx as D,jsxs as O,Fragment as H}from"react/jsx-runtime";function T(){return T=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},T.apply(this,arguments)}function j(e,n){if(null==e)return{};var t,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n.indexOf(t=o[r])>=0||(i[t]=e[t]);return i}function B(e,n){return n||(n=e.slice(0)),e.raw=n,e}var K,M,V,q,U,X,G=["#00507A","#8F0033","#B84900","#255200","#711E6E","#005249"],Z={width:350,height:350,padding:50},J={fontFamily:'"Work Sans",Helvetica,sans-serif',fontSize:12,letterSpacing:"normal",padding:8,fill:"#3F3F3F",stroke:"transparent",strokeWidth:0},N=T({textAnchor:"middle"},J),Q={area:T({style:{data:{fill:"pink"},labels:J}},Z),axis:T({style:{axis:{fill:"transparent",stroke:"#8F8F8F",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"},axisLabel:T({},N,{padding:8,stroke:"transparent"}),grid:{fill:"none",stroke:"#dfdfdf",strokeLinecap:"round",strokeLinejoin:"round",pointerEvents:"painted"},ticks:{fill:"transparent",size:0,stroke:"#8F8F8F",strokeWidth:0,strokeLinecap:"round",strokeLinejoin:"round"},tickLabels:T({},J,{fill:"#3F3F3F"})}},Z),polarDependentAxis:{style:{ticks:{fill:"transparent",size:1,stroke:"transparent"}}},bar:T({style:{data:{fill:"#3F3F3F",padding:8,strokeWidth:0},labels:J}},Z),boxplot:T({style:{max:{padding:8,stroke:"#3F3F3F",strokeWidth:1},maxLabels:T({},J,{padding:3}),median:{padding:8,stroke:"#3F3F3F",strokeWidth:1},medianLabels:T({},J,{padding:3}),min:{padding:8,stroke:"#3F3F3F",strokeWidth:1},minLabels:T({},J,{padding:3}),q1:{padding:8,fill:"#3F3F3F"},q1Labels:T({},J,{padding:3}),q3:{padding:8,fill:"#3F3F3F"},q3Labels:T({},J,{padding:3})},boxWidth:20},Z),candlestick:T({style:{data:{stroke:"#3F3F3F"},labels:T({},J,{padding:5})},candleColors:{positive:"#ffffff",negative:"#3F3F3F"}},Z),chart:Z,errorbar:T({borderWidth:8,style:{data:{fill:"transparent",opacity:1,stroke:"#3F3F3F",strokeWidth:2},labels:J}},Z),group:T({colorScale:G},Z),histogram:T({style:{data:{fill:"#3F3F3F",stroke:"pink",strokeWidth:2},labels:J}},Z),legend:{colorScale:G,gutter:10,orientation:"vertical",titleOrientation:"top",style:{data:{type:"circle"},labels:J,title:T({},J,{padding:5})}},line:T({style:{data:{fill:"transparent",opacity:1,stroke:"#3F3F3F",strokeWidth:2},labels:J}},Z),pie:T({colorScale:G,style:{data:{padding:8,stroke:"#DFDFDF",strokeWidth:1},labels:T({},J,{padding:20})}},Z),scatter:T({style:{data:{fill:"#3F3F3F",opacity:1,stroke:"transparent",strokeWidth:0},labels:J}},Z),stack:T({colorScale:G},Z),tooltip:{style:T({},J,{padding:0,pointerEvents:"none"}),flyoutStyle:{stroke:"pink",strokeWidth:1,fill:"#f0f0f0",pointerEvents:"none"},flyoutPadding:5,cornerRadius:5,pointerLength:10},voronoi:T({style:{data:{fill:"transparent",stroke:"transparent",strokeWidth:0},labels:T({},J,{padding:5,pointerEvents:"none"}),flyout:{stroke:"pink",strokeWidth:1,fill:"#f0f0f0",pointerEvents:"none"}}},Z)},Y=n(t)(K||(K=B(["\n background: ",";\n border: 1px solid ",";\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);\n box-sizing: border-box;\n color: ",";\n font-size: ",";\n font-weight: normal;\n line-height: ",";\n margin: 0;\n padding: 8px;\n width: fit-content;\n div {\n margin-bottom: 8px;\n display: flex;\n align-items: flex-start;\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n"])),function(e){return e.theme.colors.neutral08},function(e){return e.theme.colors.neutral06},function(e){return e.theme.colors.neutral},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),$=n.span(M||(M=B(["\n background: ",";\n border: ",";\n border-radius: 4px;\n height: 20px;\n width: 20px;\n margin-right: 8px;\n"])),function(e){return e.color},function(e){return e.color?"none":"3px solid black"}),_=function(n){var t=n.datum,a=n.index,l=n.showTooltip,s=n.x,u=n.y,c=e.useContext(r);return l===a+"-"+t.index?D("g",{style:{pointerEvents:"none"},children:D("foreignObject",{x:s,y:u,width:"275",height:"100%",children:O(Y,{position:i.top,role:"tooltip",theme:c,children:[O("div",{children:[D($,{color:c.iterableColors[a]}),D("span",{children:t.label})]}),D(o,{theme:c})]})})}):null},ee=function(n){var t=n.x,a=n.y,l=n.activePoints,s=n.hiddenData,u=Array.from(Array(n.dataLength-0),function(e,n){return n+0}).filter(function(e){return!s.includes(e)}),c=e.useContext(r);return D("g",{style:{pointerEvents:"none"},children:D("foreignObject",{x:t,y:a,width:"275",height:"100%",children:O(Y,{"data-testid":"axis-tooltip",position:i.top,role:"tooltip",theme:c,children:[l.map(function(e,n){return O("div",{children:[D($,{color:c.iterableColors[u[n]]}),D("span",{children:e.label})]},n)}),D(o,{theme:c})]})})})},ne=["datum","index","lineIndex","pointRefArray","registerPoint","unregisterPoint"],te=["lineIndex","pointRefArray","pointIndex","registerPoint","unregisterPoint"],re=function(e){var n=e.datum,t=e.index,r=e.lineIndex,i=e.pointRefArray,o=e.registerPoint,a=e.unregisterPoint,l=j(e,ne);return D(S,T({},l,{ariaLabel:n.label,pathComponent:D(ie,{lineIndex:r,pointIndex:t,pointRefArray:i,registerPoint:o,unregisterPoint:a}),role:"button",tabIndex:0}))},ie=function(n){var t=n.lineIndex,r=n.pointRefArray,i=n.pointIndex,o=n.registerPoint,l=n.unregisterPoint,s=j(n,te),u=a(),c=e.useRef(null);return e.useEffect(function(){return o(r,c),u(),function(){return l(r,c)}},[]),D("path",T({ref:c,"data-line-index":t,"data-point-index":i},s))},oe=["events"],ae=function(e){var n=e.events,t=j(e,oe);return O("g",{children:[D(A,T({},t,{events:n,style:{strokeWidth:"50px",stroke:"transparent"}})),D(A,T({},t,{events:n,style:{strokeWidth:"1px",stroke:"black",strokeOpacity:"0.2"}}))]})},le=["children","color","dataIndex","isHidden","onClick","name","focusCurrentLine","resetLineFocus"],se=e.forwardRef(function(n,t){var i=n.color,o=n.dataIndex,a=n.isHidden,s=n.onClick,u=n.name,c=n.focusCurrentLine,d=n.resetLineFocus,f=j(n,le);function p(){a||c&&"function"==typeof c&&c(o)}var h=e.useContext(r);return D("div",{style:{display:"inline-flex"},onMouseEnter:p,onMouseLeave:d,children:D(l,T({checked:!a,color:i,containerStyle:{alignItems:"center",border:"0",boxShadow:"0 0 0",color:h.colors.neutral,display:"inline-flex",margin:"0 36px 20px 0",padding:"0"},inputStyle:{border:i?"none":"2px solid "+h.colors.neutral02,borderRadius:"4px"},labelText:u,onBlur:d,onClick:function(){s&&"function"==typeof s&&s(o),a||d&&"function"==typeof d&&d()},onFocus:p,ref:t,theme:h},f))})}),ue=["axisLabel","tickLabels"],ce=["style"],de=["axisLabel","tickLabels"],fe=["style"],pe=n.div(V||(V=B(["\n max-height: 600px;\n max-width: 800px;\n svg {\n overflow: visible;\n }\n"]))),he=n.div(q||(q=B([""]))),me=n.div(U||(U=B(["\n padding-bottom: 24px;\n"]))),xe=n.p(X||(X=B(["\n color: ",";\n font-size: ",";\n"])),function(e){return e.theme.colors.neutral03},function(e){return e.theme.typeScale.size02.fontSize});function ge(n){var t=n.componentProps,i=(t=void 0===t?{}:t).chart,o=void 0===i?{}:i,a=t.line,l=void 0===a?{}:a,u=t.scatter,c=void 0===u?{}:u,d=t.xAxis,f=(d=void 0===d?{style:{}}:d).style,p=(f=void 0===f?{}:f).axisLabel,h=void 0===p?void 0:p,m=f.tickLabels,x=void 0===m?void 0:m,g=j(f,ue),v=j(d,ce),y=t.yAxis,b=(y=void 0===y?{style:{}}:y).style,k=(b=void 0===b?{}:b).axisLabel,w=void 0===k?void 0:k,F=b.tickLabels,L=void 0===F?void 0:F,I=j(b,de),S=j(y,fe),A=n.data,B=void 0===A?[]:A,K=n.lastFocusedScatterPoint,M=n.pointRefArray,V=n.registerPoint,q=n.unregisterPoint,U=n.tabRef,X=n.x,G=n.y,Z=e.useContext(r),J=e.useContext(s),N=e.useState([]),Y=N[0],$=N[1],ne=e.useState(800),te=ne[0],ie=ne[1],oe=e.useState(null),le=oe[0],ge=oe[1],ve=e.useState(null),ye=ve[0],be=ve[1],ke=e.useState(!0),we=ke[0],Fe=ke[1],Le=e.useState(!1),Ie=Le[0],Se=Le[1],Ae=e.useRef(null),Ce=e.useRef(null);e.useEffect(function(){return We(),window.addEventListener("resize",We),window.addEventListener("keydown",Re),function(){window.removeEventListener("resize",We),window.removeEventListener("keydown",Re)}},[]),e.useEffect(function(){return window.addEventListener("mousemove",De),function(){window.removeEventListener("mousemove",De)}},[ye]);var Ee=B.map(function(e,n){return"scatter-"+n}),Pe=T({tickLabels:T({color:"#3f3f3f",fontSize:12},x),axisLabel:T({color:"#3f3f3f",padding:44,fontSize:14,fontWeight:"bold"},h)},g),ze=T({tickLabels:T({fontSize:12},L),axisLabel:T({color:"#3f3f3f",padding:64,fontSize:14,fontWeight:"bold"},w)},I);function We(){Ae.current&&ie(Ae.current.clientWidth)}function Re(e){"Escape"===e.key&&(be(null),Fe(!1))}function De(){!ye&&Fe(!0)}function Oe(e){return null===le||le===e?1:.1}function He(e){Y.includes(e)?$(Y.filter(function(n){return n!==e})):$(Y.concat([e]))}function Te(e){ge(e)}function je(){ge(null)}var Be=function(e,n){if(n.current){var t=parseInt(n.current.getAttribute("data-line-index"),10);!e.includes(t)&&e.push(parseInt(n.current.getAttribute("data-line-index"),10))}return e},Ke=function(e){var n=parseInt(e.current.getAttribute("data-line-index"),10),t=parseInt(e.current.getAttribute("data-point-index"),10),r=M.current.reduce(Be,[]);return{currentLineIndex:n,currentPointIndex:t,lineIndexes:r,lowestLineIndex:r[0],highestLineIndex:r[r.length-1]}},Me=function(e,n){return function(t){return t.current&&parseInt(t.current.getAttribute("data-line-index"),10)===e&&parseInt(t.current.getAttribute("data-point-index"),10)===n}};function Ve(e){"Tab"===e.key&&e.shiftKey&&K&&K.current&&M.current.find(function(e){return e.current===K.current})&&(e.preventDefault(),K.current.focus())}return O(pe,{ref:Ae,children:[D(he,{onKeyDown:function(e){var n=e.shiftKey;switch(e.key){case"Tab":e.preventDefault(),K.current=M.current.find(function(e){return e.current===document.activeElement}).current,n?U.current&&U.current.focus():Ce.current&&Ce.current.focus();break;case"ArrowRight":var t=M.current.findIndex(function(e){return e.current===document.activeElement});void 0!==t&&(t===M.current.length-1?M.current[0].current.focus():M.current[t+1].current.focus());break;case"ArrowLeft":var r=M.current.findIndex(function(e){return e.current===document.activeElement});void 0!==r&&(0===r?M.current[M.current.length-1].current.focus():M.current[r-1].current.focus());break;case"ArrowUp":e.preventDefault();var i=M.current.find(function(e){return e.current===document.activeElement});if(i&&i.current){var o=Ke(i),a=o.currentLineIndex,l=o.currentPointIndex,s=o.lineIndexes;if(a===o.lowestLineIndex)M.current.find(Me(o.highestLineIndex,l)).current.focus();else{var u=s[s.indexOf(a)-1];M.current.find(Me(u,l)).current.focus()}}break;case"ArrowDown":e.preventDefault();var c=M.current.find(function(e){return e.current===document.activeElement});if(c&&c.current){var d=Ke(c),f=d.currentLineIndex,p=d.currentPointIndex,h=d.lineIndexes;if(f===d.highestLineIndex)M.current.find(Me(d.lowestLineIndex,p)).current.focus();else{var m=h[h.indexOf(f)+1];M.current.find(Me(m,p)).current.focus()}}}},children:O(C,T({domainPadding:32,height:400,padding:{top:0,left:80,right:0,bottom:62},theme:Q,width:te,containerComponent:D(E,{name:"xAxisGroupLabel",voronoiBlacklist:Ee,voronoiDimension:"x",labels:Ie&&we?function(){return" "}:void 0,labelComponent:we?D(P,{flyoutComponent:D(ee,{dataLength:B.length,hiddenData:Y})}):void 0,role:"presentation",voronoiPadding:32})},o,{children:[D(z,T({},S,{dependentAxis:!0,style:ze})),B.map(function(e,n){var t=e.data;return!Y.includes(n)&&D(W,T({style:{data:{opacity:Oe(n),stroke:Z.iterableColors[n],strokeWidth:"3"},parent:{border:Z.colors.neutral04}},data:t,labelComponent:D(H,{}),x:X,y:G},l),"line"+n)}),D(z,T({},v,{style:Pe,gridComponent:D(ae,{events:{onMouseEnter:function(){return Se(!0)},onMouseLeave:function(){return Se(!1)}}})})),B.map(function(e,n){var t=e.data;return!Y.includes(n)&&D(R,T({name:"scatter-"+n,events:[{target:"data",eventHandlers:{onBlur:function(){return Fe(!0),be(null),[{target:"labels",mutation:function(){return{active:void 0}}}]},onClick:function(){return[{target:"labels",mutation:function(e){return be(e.datum.lineIndex+"-"+e.datum.index),{active:!0}}}]},onFocus:function(){return Fe(!1),[{target:"labels",mutation:function(e){return be(e.datum.lineIndex+"-"+e.datum.index),{active:!0}}}]},onMouseEnter:function(){return Fe(!1),[{target:"labels",mutation:function(e){return be(e.datum.lineIndex+"-"+e.datum.index),{active:!0}}}]},onMouseLeave:function(){be(null),Fe(!0)}}}],style:{data:{fill:Z.colors.neutral08,opacity:Oe(n),stroke:Z.iterableColors[n],strokeWidth:2}},size:5,data:t.map(function(e,t){return T({index:t,lineIndex:n},e)}),dataComponent:D(re,{lineIndex:n,pointRefArray:M,registerPoint:V,unregisterPoint:q}),labels:function(){return""},labelComponent:D(P,{text:"",flyoutComponent:D(_,{index:n,showTooltip:ye})}),x:X,y:G},c),"scatter"+n)})]}))}),O(me,{children:[D(xe,{theme:Z,children:J.charts.line.dataLegendsLabel}),B.map(function(e,n){var t=e.name,r=J.charts.line.legendButtonAriaLabel.replace(/\{name\}/g,t);return D(se,{"aria-label":r,color:Z.iterableColors[n],dataIndex:n,isHidden:Y.includes(n),name:t,onClick:He,onKeyDown:0===n?Ve:void 0,focusCurrentLine:Te,ref:0===n?Ce:void 0,resetLineFocus:je},n)})]})]})}function ve(e){return e.toLowerCase().replace(/[^a-z 0-9]/gi,"").replace(/(?:^\w|[A-Z]|\b\w)/g,function(e,n){return 0===n?e.toLowerCase():e.toUpperCase()}).replace(/\s+/g,"")}var ye,be,ke,we,Fe,Le,Ie=function(n){var t=n.data,r=void 0===t?[]:t,i=n.xData,o=i.keyValue,a=i.label,l=i.tickFormat,s=i.tickValues,f=n.yData,p=f.keyValue,h=f.tickFormat,m=e.useState({columns:[],rows:[]}),x=m[0],g=m[1];return e.useEffect(function(){var e,n,t;g((e=ve(o||a||"x"),n=r.reduce(function(e,n){return n.data.forEach(function(n){var t=n.x||o&&n[o];!e.includes(t)&&e.push(t)}),e},[]),t={columns:n.length>0?[{field:e,header:a||o||"X",isRowHeader:!0}]:[],rows:n.reduce(function(t,r,i){var o,a=s&&"number"==typeof r&&s.length===n.length?l&&"function"==typeof l?l(s[r-1]):s[r-1]:l&&Array.isArray(l)?l[r-1]:l&&"function"==typeof l?l(r):r;return t.push(((o={})[e]=a,o.id=i,o)),t},[])},r.reduce(function(e,n){var r=n.name,i=n.data,o=ve(r);return e.columns.push({field:o,header:r}),i.forEach(function(n,r){var i,a=n.y||0===n.y?n.y:p&&n[p];e.rows[r]=T({},e.rows[r],((i={id:t.rows.length>0?r+1:r})[o]=h&&"function"==typeof h?h(a):a,i))}),e},t)))},[r]),D(u,{children:x.rows.length>0?D(c,{hasPagination:!1,columns:x.columns,rows:x.rows}):D(d,{})})},Se=["description","title","testId","type"],Ae=n.span(ye||(ye=B(["\n color: ",";\n font-size: ",";\n font-weight: 600;\n line-height: ",";\n margin: 0 0 12px 0;\n"])),function(e){return e.theme.colors.neutral},function(e){return e.theme.typeScale.size04.fontSize},function(e){return e.theme.typeScale.size04.lineHeight}),Ce=n(f)(be||(be=B(["\n font-size: ",";\n margin: 0 0 18px 0;\n"])),function(e){return e.theme.typeScale.size02.fontSize}),Ee=n(p)(ke||(ke=B(["\n width: 800px;\n ul {\n box-shadow: inset 0 -1px 0 ",";\n }\n"])),function(e){return e.theme.colors.neutral06}),Pe=n(h)(we||(we=B(["\n padding: 22px 0;\n"]))),ze=n(u)(Fe||(Fe=B(["\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n display: ",";\n right: ",";\n max-height: ",";\n opacity: ",";\n outline: 0;\n overflow-y: auto;\n padding: ","\n ",";\n position: absolute;\n transition: opacity 0.3s;\n white-space: nowrap;\n z-index: 2;\n\n ","\n"])),function(e){return e.isOpen?"block":"none"},function(e){return e.theme.spaceScale.spacing02},function(e){return e.maxHeight?e.maxHeight:e.theme.dropdown.content.maxHeight},function(e){return e.isOpen?"1":"0"},function(e){return e.theme.spaceScale.spacing05},function(e){return e.theme.spaceScale.spacing05},function(e){return e.width&&L(Le||(Le=B(["\n white-space: normal;\n width: ",";\n "])),e.width)});function We(n,t){var i,o,a,l,u,c,d=n.description,p=n.title,h=n.type,L=j(n,Se),S=e.useRef(null),A=e.useRef(null),C=e.useContext(r),E=e.useContext(s),P=m(),z=P[0],W=P[1],R=P[2],H=e.useState(!1),B=H[0],K=H[1];return O("div",{ref:t,children:[D(Ae,{theme:C,children:p}),d&&D(Ce,{theme:C,visualStyle:x.bodySmall,children:d}),O(Ee,{theme:C,children:[O(g,{children:[D(v,{children:E.charts.line.chartTabLabel}),D(v,{children:E.charts.line.dataTabLabel}),O("div",{onBlur:function(){K(!1)},style:{display:"inline-block",marginLeft:"auto"},children:[D(y,{content:E.charts.line.keyboardInstructionsTooltip,ref:S,children:D(b,{"aria-controls":"keyboardInstructions","aria-label":E.charts.line.keyboardInstructionsTooltip,"aria-expanded":Boolean(B),icon:D(I,{}),onClick:function(){K(function(e){return!e})},onKeyDown:function(e){var n=e.shiftKey;switch(e.key){case"Escape":K(!1);break;case"Tab":!n&&A&&A.current&&z.current.find(function(e){return e.current===A.current})&&(e.preventDefault(),A.current.focus())}},variant:k.link})}),D(w,{children:O(ze,{id:"keyboardInstructions",isOpen:B,theme:C,width:"350px",children:[D(f,{visualStyle:x.headingXSmall,style:{margin:"0 0 16px"},children:E.charts.line.keyboardInstructionsHeader}),E.charts.line.keyboardInstructions]})})]})]}),O(F,{children:[D(Pe,{theme:C,children:"line"===h&&D(ge,T({},L,{lastFocusedScatterPoint:A,pointRefArray:z,registerPoint:W,tabRef:S,unregisterPoint:R}))}),D(Pe,{theme:C,children:D(Ie,{data:L.data,xData:{keyValue:L.x,label:null==(i=L.componentProps)||null==(o=i.xAxis)?void 0:o.label,tickFormat:null==(a=L.componentProps)||null==(l=a.xAxis)?void 0:l.tickFormat},yData:{keyValue:L.y,tickFormat:null==(u=L.componentProps)||null==(c=u.yAxis)?void 0:c.tickFormat}})})]})]})]})}var Re=e.forwardRef(We);export{Re as Chart};
1
+ import*as e from"react";import{styled as n,StyledTooltip as t,ThemeContext as r,TooltipPosition as i,TooltipArrow as o,useForceUpdate as a,Checkbox as l,I18nContext as s,Card as u,Datagrid as c,Spinner as d,Paragraph as f,TabsContainer as p,TabPanel as h,useDescendants as m,TypographyVisualStyle as x,Tabs as g,Tab as v,Tooltip as y,IconButton as b,ButtonVariant as k,Announce as w,TabPanelsContainer as F}from"react-magma-dom";import{css as L}from"@emotion/core";import{KeyboardIcon as I}from"react-magma-icons";import{Point as S,LineSegment as A,VictoryChart as C,VictoryVoronoiContainer as E,VictoryTooltip as P,VictoryAxis as z,VictoryLine as W,VictoryScatter as R}from"victory";import{jsx as D,jsxs as O,Fragment as H}from"react/jsx-runtime";function T(){return T=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},T.apply(this,arguments)}function j(e,n){if(null==e)return{};var t,r,i={},o=Object.keys(e);for(r=0;r<o.length;r++)n.indexOf(t=o[r])>=0||(i[t]=e[t]);return i}function B(e,n){return n||(n=e.slice(0)),e.raw=n,e}var K,M,V,q,U,X,G=["#00507A","#8F0033","#B84900","#255200","#711E6E","#005249"],Z={width:350,height:350,padding:50},J={fontFamily:'"Work Sans",Helvetica,sans-serif',fontSize:12,letterSpacing:"normal",padding:8,fill:"#3F3F3F",stroke:"transparent",strokeWidth:0},N=T({textAnchor:"middle"},J),Q={area:T({style:{data:{fill:"pink"},labels:J}},Z),axis:T({style:{axis:{fill:"transparent",stroke:"#8F8F8F",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"},axisLabel:T({},N,{padding:8,stroke:"transparent"}),grid:{fill:"none",stroke:"#dfdfdf",strokeLinecap:"round",strokeLinejoin:"round",pointerEvents:"painted"},ticks:{fill:"transparent",size:0,stroke:"#8F8F8F",strokeWidth:0,strokeLinecap:"round",strokeLinejoin:"round"},tickLabels:T({},J,{fill:"#3F3F3F"})}},Z),polarDependentAxis:{style:{ticks:{fill:"transparent",size:1,stroke:"transparent"}}},bar:T({style:{data:{fill:"#3F3F3F",padding:8,strokeWidth:0},labels:J}},Z),boxplot:T({style:{max:{padding:8,stroke:"#3F3F3F",strokeWidth:1},maxLabels:T({},J,{padding:3}),median:{padding:8,stroke:"#3F3F3F",strokeWidth:1},medianLabels:T({},J,{padding:3}),min:{padding:8,stroke:"#3F3F3F",strokeWidth:1},minLabels:T({},J,{padding:3}),q1:{padding:8,fill:"#3F3F3F"},q1Labels:T({},J,{padding:3}),q3:{padding:8,fill:"#3F3F3F"},q3Labels:T({},J,{padding:3})},boxWidth:20},Z),candlestick:T({style:{data:{stroke:"#3F3F3F"},labels:T({},J,{padding:5})},candleColors:{positive:"#ffffff",negative:"#3F3F3F"}},Z),chart:Z,errorbar:T({borderWidth:8,style:{data:{fill:"transparent",opacity:1,stroke:"#3F3F3F",strokeWidth:2},labels:J}},Z),group:T({colorScale:G},Z),histogram:T({style:{data:{fill:"#3F3F3F",stroke:"pink",strokeWidth:2},labels:J}},Z),legend:{colorScale:G,gutter:10,orientation:"vertical",titleOrientation:"top",style:{data:{type:"circle"},labels:J,title:T({},J,{padding:5})}},line:T({style:{data:{fill:"transparent",opacity:1,stroke:"#3F3F3F",strokeWidth:2},labels:J}},Z),pie:T({colorScale:G,style:{data:{padding:8,stroke:"#DFDFDF",strokeWidth:1},labels:T({},J,{padding:20})}},Z),scatter:T({style:{data:{fill:"#3F3F3F",opacity:1,stroke:"transparent",strokeWidth:0},labels:J}},Z),stack:T({colorScale:G},Z),tooltip:{style:T({},J,{padding:0,pointerEvents:"none"}),flyoutStyle:{stroke:"pink",strokeWidth:1,fill:"#f0f0f0",pointerEvents:"none"},flyoutPadding:5,cornerRadius:5,pointerLength:10},voronoi:T({style:{data:{fill:"transparent",stroke:"transparent",strokeWidth:0},labels:T({},J,{padding:5,pointerEvents:"none"}),flyout:{stroke:"pink",strokeWidth:1,fill:"#f0f0f0",pointerEvents:"none"}}},Z)},Y=n(t)(K||(K=B(["\n background: ",";\n border: 1px solid ",";\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);\n box-sizing: border-box;\n color: ",";\n font-size: ",";\n font-weight: normal;\n line-height: ",";\n margin: 0;\n padding: 8px;\n width: fit-content;\n div {\n margin-bottom: 8px;\n display: flex;\n align-items: flex-start;\n &:last-of-type {\n margin-bottom: 0;\n }\n }\n"])),function(e){return e.theme.colors.neutral100},function(e){return e.theme.colors.neutral300},function(e){return e.theme.colors.neutral},function(e){return e.theme.typeScale.size02.fontSize},function(e){return e.theme.typeScale.size02.lineHeight}),$=n.span(M||(M=B(["\n background: ",";\n border: ",";\n border-radius: 4px;\n height: 20px;\n width: 20px;\n margin-right: 8px;\n"])),function(e){return e.color},function(e){return e.color?"none":"3px solid black"}),_=function(n){var t=n.datum,a=n.index,l=n.showTooltip,s=n.x,u=n.y,c=e.useContext(r);return l===a+"-"+t.index?D("g",{style:{pointerEvents:"none"},children:D("foreignObject",{x:s,y:u,width:"275",height:"100%",children:O(Y,{position:i.top,role:"tooltip",theme:c,children:[O("div",{children:[D($,{color:c.iterableColors[a]}),D("span",{children:t.label})]}),D(o,{theme:c})]})})}):null},ee=function(n){var t=n.x,a=n.y,l=n.activePoints,s=n.hiddenData,u=Array.from(Array(n.dataLength-0),function(e,n){return n+0}).filter(function(e){return!s.includes(e)}),c=e.useContext(r);return D("g",{style:{pointerEvents:"none"},children:D("foreignObject",{x:t,y:a,width:"275",height:"100%",children:O(Y,{"data-testid":"axis-tooltip",position:i.top,role:"tooltip",theme:c,children:[l.map(function(e,n){return O("div",{children:[D($,{color:c.iterableColors[u[n]]}),D("span",{children:e.label})]},n)}),D(o,{theme:c})]})})})},ne=["datum","index","lineIndex","pointRefArray","registerPoint","unregisterPoint"],te=["lineIndex","pointRefArray","pointIndex","registerPoint","unregisterPoint"],re=function(e){var n=e.datum,t=e.index,r=e.lineIndex,i=e.pointRefArray,o=e.registerPoint,a=e.unregisterPoint,l=j(e,ne);return D(S,T({},l,{ariaLabel:n.label,pathComponent:D(ie,{lineIndex:r,pointIndex:t,pointRefArray:i,registerPoint:o,unregisterPoint:a}),role:"button",tabIndex:0}))},ie=function(n){var t=n.lineIndex,r=n.pointRefArray,i=n.pointIndex,o=n.registerPoint,l=n.unregisterPoint,s=j(n,te),u=a(),c=e.useRef(null);return e.useEffect(function(){return o(r,c),u(),function(){return l(r,c)}},[]),D("path",T({ref:c,"data-line-index":t,"data-point-index":i},s))},oe=["events"],ae=function(e){var n=e.events,t=j(e,oe);return O("g",{children:[D(A,T({},t,{events:n,style:{strokeWidth:"50px",stroke:"transparent"}})),D(A,T({},t,{events:n,style:{strokeWidth:"1px",stroke:"black",strokeOpacity:"0.2"}}))]})},le=["children","color","dataIndex","isHidden","onClick","name","focusCurrentLine","resetLineFocus"],se=e.forwardRef(function(n,t){var i=n.color,o=n.dataIndex,a=n.isHidden,s=n.onClick,u=n.name,c=n.focusCurrentLine,d=n.resetLineFocus,f=j(n,le);function p(){a||c&&"function"==typeof c&&c(o)}var h=e.useContext(r);return D("div",{style:{display:"inline-flex"},onMouseEnter:p,onMouseLeave:d,children:D(l,T({checked:!a,color:i,containerStyle:{alignItems:"center",border:"0",boxShadow:"0 0 0",color:h.colors.neutral,display:"inline-flex",margin:"0 36px 20px 0",padding:"0"},inputStyle:{border:i?"none":"2px solid "+h.colors.neutral800,borderRadius:"4px"},labelText:u,onBlur:d,onClick:function(){s&&"function"==typeof s&&s(o),a||d&&"function"==typeof d&&d()},onFocus:p,ref:t,theme:h},f))})}),ue=["axisLabel","tickLabels"],ce=["style"],de=["axisLabel","tickLabels"],fe=["style"],pe=n.div(V||(V=B(["\n max-height: 600px;\n max-width: 800px;\n svg {\n overflow: visible;\n }\n"]))),he=n.div(q||(q=B([""]))),me=n.div(U||(U=B(["\n padding-bottom: 24px;\n"]))),xe=n.p(X||(X=B(["\n color: ",";\n font-size: ",";\n"])),function(e){return e.theme.colors.neutral},function(e){return e.theme.typeScale.size02.fontSize});function ge(n){var t=n.componentProps,i=(t=void 0===t?{}:t).chart,o=void 0===i?{}:i,a=t.line,l=void 0===a?{}:a,u=t.scatter,c=void 0===u?{}:u,d=t.xAxis,f=(d=void 0===d?{style:{}}:d).style,p=(f=void 0===f?{}:f).axisLabel,h=void 0===p?void 0:p,m=f.tickLabels,x=void 0===m?void 0:m,g=j(f,ue),v=j(d,ce),y=t.yAxis,b=(y=void 0===y?{style:{}}:y).style,k=(b=void 0===b?{}:b).axisLabel,w=void 0===k?void 0:k,F=b.tickLabels,L=void 0===F?void 0:F,I=j(b,de),S=j(y,fe),A=n.data,B=void 0===A?[]:A,K=n.lastFocusedScatterPoint,M=n.pointRefArray,V=n.registerPoint,q=n.unregisterPoint,U=n.tabRef,X=n.x,G=n.y,Z=e.useContext(r),J=e.useContext(s),N=e.useState([]),Y=N[0],$=N[1],ne=e.useState(800),te=ne[0],ie=ne[1],oe=e.useState(null),le=oe[0],ge=oe[1],ve=e.useState(null),ye=ve[0],be=ve[1],ke=e.useState(!0),we=ke[0],Fe=ke[1],Le=e.useState(!1),Ie=Le[0],Se=Le[1],Ae=e.useRef(null),Ce=e.useRef(null);e.useEffect(function(){return We(),window.addEventListener("resize",We),window.addEventListener("keydown",Re),function(){window.removeEventListener("resize",We),window.removeEventListener("keydown",Re)}},[]),e.useEffect(function(){return window.addEventListener("mousemove",De),function(){window.removeEventListener("mousemove",De)}},[ye]);var Ee=B.map(function(e,n){return"scatter-"+n}),Pe=T({tickLabels:T({color:"#3f3f3f",fontSize:12},x),axisLabel:T({color:"#3f3f3f",padding:44,fontSize:14,fontWeight:"bold"},h)},g),ze=T({tickLabels:T({fontSize:12},L),axisLabel:T({color:"#3f3f3f",padding:64,fontSize:14,fontWeight:"bold"},w)},I);function We(){Ae.current&&ie(Ae.current.clientWidth)}function Re(e){"Escape"===e.key&&(be(null),Fe(!1))}function De(){!ye&&Fe(!0)}function Oe(e){return null===le||le===e?1:.1}function He(e){Y.includes(e)?$(Y.filter(function(n){return n!==e})):$(Y.concat([e]))}function Te(e){ge(e)}function je(){ge(null)}var Be=function(e,n){if(n.current){var t=parseInt(n.current.getAttribute("data-line-index"),10);!e.includes(t)&&e.push(parseInt(n.current.getAttribute("data-line-index"),10))}return e},Ke=function(e){var n=parseInt(e.current.getAttribute("data-line-index"),10),t=parseInt(e.current.getAttribute("data-point-index"),10),r=M.current.reduce(Be,[]);return{currentLineIndex:n,currentPointIndex:t,lineIndexes:r,lowestLineIndex:r[0],highestLineIndex:r[r.length-1]}},Me=function(e,n){return function(t){return t.current&&parseInt(t.current.getAttribute("data-line-index"),10)===e&&parseInt(t.current.getAttribute("data-point-index"),10)===n}};function Ve(e){"Tab"===e.key&&e.shiftKey&&K&&K.current&&M.current.find(function(e){return e.current===K.current})&&(e.preventDefault(),K.current.focus())}return O(pe,{ref:Ae,children:[D(he,{onKeyDown:function(e){var n=e.shiftKey;switch(e.key){case"Tab":e.preventDefault(),K.current=M.current.find(function(e){return e.current===document.activeElement}).current,n?U.current&&U.current.focus():Ce.current&&Ce.current.focus();break;case"ArrowRight":var t=M.current.findIndex(function(e){return e.current===document.activeElement});void 0!==t&&(t===M.current.length-1?M.current[0].current.focus():M.current[t+1].current.focus());break;case"ArrowLeft":var r=M.current.findIndex(function(e){return e.current===document.activeElement});void 0!==r&&(0===r?M.current[M.current.length-1].current.focus():M.current[r-1].current.focus());break;case"ArrowUp":e.preventDefault();var i=M.current.find(function(e){return e.current===document.activeElement});if(i&&i.current){var o=Ke(i),a=o.currentLineIndex,l=o.currentPointIndex,s=o.lineIndexes;if(a===o.lowestLineIndex)M.current.find(Me(o.highestLineIndex,l)).current.focus();else{var u=s[s.indexOf(a)-1];M.current.find(Me(u,l)).current.focus()}}break;case"ArrowDown":e.preventDefault();var c=M.current.find(function(e){return e.current===document.activeElement});if(c&&c.current){var d=Ke(c),f=d.currentLineIndex,p=d.currentPointIndex,h=d.lineIndexes;if(f===d.highestLineIndex)M.current.find(Me(d.lowestLineIndex,p)).current.focus();else{var m=h[h.indexOf(f)+1];M.current.find(Me(m,p)).current.focus()}}}},children:O(C,T({domainPadding:32,height:400,padding:{top:0,left:80,right:0,bottom:62},theme:Q,width:te,containerComponent:D(E,{name:"xAxisGroupLabel",voronoiBlacklist:Ee,voronoiDimension:"x",labels:Ie&&we?function(){return" "}:void 0,labelComponent:we?D(P,{flyoutComponent:D(ee,{dataLength:B.length,hiddenData:Y})}):void 0,role:"presentation",voronoiPadding:32})},o,{children:[D(z,T({},S,{dependentAxis:!0,style:ze})),B.map(function(e,n){var t=e.data;return!Y.includes(n)&&D(W,T({style:{data:{opacity:Oe(n),stroke:Z.iterableColors[n],strokeWidth:"3"},parent:{border:Z.colors.neutral400}},data:t,labelComponent:D(H,{}),x:X,y:G},l),"line"+n)}),D(z,T({},v,{style:Pe,gridComponent:D(ae,{events:{onMouseEnter:function(){return Se(!0)},onMouseLeave:function(){return Se(!1)}}})})),B.map(function(e,n){var t=e.data;return!Y.includes(n)&&D(R,T({name:"scatter-"+n,events:[{target:"data",eventHandlers:{onBlur:function(){return Fe(!0),be(null),[{target:"labels",mutation:function(){return{active:void 0}}}]},onClick:function(){return[{target:"labels",mutation:function(e){return be(e.datum.lineIndex+"-"+e.datum.index),{active:!0}}}]},onFocus:function(){return Fe(!1),[{target:"labels",mutation:function(e){return be(e.datum.lineIndex+"-"+e.datum.index),{active:!0}}}]},onMouseEnter:function(){return Fe(!1),[{target:"labels",mutation:function(e){return be(e.datum.lineIndex+"-"+e.datum.index),{active:!0}}}]},onMouseLeave:function(){be(null),Fe(!0)}}}],style:{data:{fill:Z.colors.neutral100,opacity:Oe(n),stroke:Z.iterableColors[n],strokeWidth:2}},size:5,data:t.map(function(e,t){return T({index:t,lineIndex:n},e)}),dataComponent:D(re,{lineIndex:n,pointRefArray:M,registerPoint:V,unregisterPoint:q}),labels:function(){return""},labelComponent:D(P,{text:"",flyoutComponent:D(_,{index:n,showTooltip:ye})}),x:X,y:G},c),"scatter"+n)})]}))}),O(me,{children:[D(xe,{theme:Z,children:J.charts.line.dataLegendsLabel}),B.map(function(e,n){var t=e.name,r=J.charts.line.legendButtonAriaLabel.replace(/\{name\}/g,t);return D(se,{"aria-label":r,color:Z.iterableColors[n],dataIndex:n,isHidden:Y.includes(n),name:t,onClick:He,onKeyDown:0===n?Ve:void 0,focusCurrentLine:Te,ref:0===n?Ce:void 0,resetLineFocus:je},n)})]})]})}function ve(e){return e.toLowerCase().replace(/[^a-z 0-9]/gi,"").replace(/(?:^\w|[A-Z]|\b\w)/g,function(e,n){return 0===n?e.toLowerCase():e.toUpperCase()}).replace(/\s+/g,"")}var ye,be,ke,we,Fe,Le,Ie=function(n){var t=n.data,r=void 0===t?[]:t,i=n.xData,o=i.keyValue,a=i.label,l=i.tickFormat,s=i.tickValues,f=n.yData,p=f.keyValue,h=f.tickFormat,m=e.useState({columns:[],rows:[]}),x=m[0],g=m[1];return e.useEffect(function(){var e,n,t;g((e=ve(o||a||"x"),n=r.reduce(function(e,n){return n.data.forEach(function(n){var t=n.x||o&&n[o];!e.includes(t)&&e.push(t)}),e},[]),t={columns:n.length>0?[{field:e,header:a||o||"X",isRowHeader:!0}]:[],rows:n.reduce(function(t,r,i){var o,a=s&&"number"==typeof r&&s.length===n.length?l&&"function"==typeof l?l(s[r-1]):s[r-1]:l&&Array.isArray(l)?l[r-1]:l&&"function"==typeof l?l(r):r;return t.push(((o={})[e]=a,o.id=i,o)),t},[])},r.reduce(function(e,n){var r=n.name,i=n.data,o=ve(r);return e.columns.push({field:o,header:r}),i.forEach(function(n,r){var i,a=n.y||0===n.y?n.y:p&&n[p];e.rows[r]=T({},e.rows[r],((i={id:t.rows.length>0?r+1:r})[o]=h&&"function"==typeof h?h(a):a,i))}),e},t)))},[r]),D(u,{children:x.rows.length>0?D(c,{hasPagination:!1,columns:x.columns,rows:x.rows}):D(d,{})})},Se=["description","title","testId","type"],Ae=n.span(ye||(ye=B(["\n color: ",";\n font-size: ",";\n font-weight: 600;\n line-height: ",";\n margin: 0 0 12px 0;\n"])),function(e){return e.theme.colors.neutral},function(e){return e.theme.typeScale.size04.fontSize},function(e){return e.theme.typeScale.size04.lineHeight}),Ce=n(f)(be||(be=B(["\n font-size: ",";\n margin: 0 0 18px 0;\n"])),function(e){return e.theme.typeScale.size02.fontSize}),Ee=n(p)(ke||(ke=B(["\n width: 800px;\n ul {\n box-shadow: inset 0 -1px 0 ",";\n }\n"])),function(e){return e.theme.colors.neutral300}),Pe=n(h)(we||(we=B(["\n padding: 22px 0;\n"]))),ze=n(u)(Fe||(Fe=B(["\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n display: ",";\n right: ",";\n max-height: ",";\n opacity: ",";\n outline: 0;\n overflow-y: auto;\n padding: ","\n ",";\n position: absolute;\n transition: opacity 0.3s;\n white-space: nowrap;\n z-index: 2;\n\n ","\n"])),function(e){return e.isOpen?"block":"none"},function(e){return e.theme.spaceScale.spacing02},function(e){return e.maxHeight?e.maxHeight:e.theme.dropdown.content.maxHeight},function(e){return e.isOpen?"1":"0"},function(e){return e.theme.spaceScale.spacing05},function(e){return e.theme.spaceScale.spacing05},function(e){return e.width&&L(Le||(Le=B(["\n white-space: normal;\n width: ",";\n "])),e.width)});function We(n,t){var i,o,a,l,u,c,d=n.description,p=n.title,h=n.type,L=j(n,Se),S=e.useRef(null),A=e.useRef(null),C=e.useContext(r),E=e.useContext(s),P=m(),z=P[0],W=P[1],R=P[2],H=e.useState(!1),B=H[0],K=H[1];return O("div",{ref:t,children:[D(Ae,{theme:C,children:p}),d&&D(Ce,{theme:C,visualStyle:x.bodySmall,children:d}),O(Ee,{theme:C,children:[O(g,{children:[D(v,{children:E.charts.line.chartTabLabel}),D(v,{children:E.charts.line.dataTabLabel}),O("div",{onBlur:function(){K(!1)},style:{display:"inline-block",marginLeft:"auto"},children:[D(y,{content:E.charts.line.keyboardInstructionsTooltip,ref:S,children:D(b,{"aria-controls":"keyboardInstructions","aria-label":E.charts.line.keyboardInstructionsTooltip,"aria-expanded":Boolean(B),icon:D(I,{}),onClick:function(){K(function(e){return!e})},onKeyDown:function(e){var n=e.shiftKey;switch(e.key){case"Escape":K(!1);break;case"Tab":!n&&A&&A.current&&z.current.find(function(e){return e.current===A.current})&&(e.preventDefault(),A.current.focus())}},variant:k.link})}),D(w,{children:O(ze,{id:"keyboardInstructions",isOpen:B,theme:C,width:"350px",children:[D(f,{visualStyle:x.headingXSmall,style:{margin:"0 0 16px"},children:E.charts.line.keyboardInstructionsHeader}),E.charts.line.keyboardInstructions]})})]})]}),O(F,{children:[D(Pe,{theme:C,children:"line"===h&&D(ge,T({},L,{lastFocusedScatterPoint:A,pointRefArray:z,registerPoint:W,tabRef:S,unregisterPoint:R}))}),D(Pe,{theme:C,children:D(Ie,{data:L.data,xData:{keyValue:L.x,label:null==(i=L.componentProps)||null==(o=i.xAxis)?void 0:o.label,tickFormat:null==(a=L.componentProps)||null==(l=a.xAxis)?void 0:l.tickFormat},yData:{keyValue:L.y,tickFormat:null==(u=L.componentProps)||null==(c=u.yAxis)?void 0:c.tickFormat}})})]})]})]})}var Re=e.forwardRef(We);export{Re as Chart};
2
2
  //# sourceMappingURL=charts.modern.module.js.map