@react-magma/charts 2.0.1 → 2.0.2

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.
Files changed (10) hide show
  1. package/dist/charts.js +1 -1
  2. package/dist/charts.js.map +1 -1
  3. package/dist/charts.modern.js +9 -8
  4. package/dist/charts.modern.js.map +1 -1
  5. package/dist/charts.modern.module.js +1 -1
  6. package/dist/charts.modern.module.js.map +1 -1
  7. package/dist/charts.umd.js +1 -1
  8. package/dist/charts.umd.js.map +1 -1
  9. package/package.json +1 -1
  10. package/src/components/LineChart/Chart.tsx +2 -1
package/dist/charts.umd.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"charts.umd.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","blueGrey300","blueGrey700","grey900","baseProps","width","height","padding","baseLabelStyles","fontFamily","fontSize","letterSpacing","fill","stroke","strokeWidth","centeredLabelStyles","textAnchor","strokeLinecap","strokeLinejoin","magmaTheme","area","style","data","labels","axis","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","pointsIndexes","Array","from","dataLength","_","i","filter","includes","map","point","CustomScatterDataComponent","pointIndex","lineIndex","pointRefArray","registerPoint","unregisterPoint","other","Point","ariaLabel","pathComponent","CustomPointComponent","tabIndex","forceUpdate","useForceUpdate","ref","useRef","useEffect","CustomAxisComponent","events","LineSegment","strokeOpacity","LegendButton","forwardRef","children","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","undefined","xTickLabels","xRest","xAxisOther","yAxis","yAxisLabel","yTickLabels","yRest","yAxisOther","lastFocusedScatterPoint","tabRef","i18n","I18nContext","useState","setHiddenData","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","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","xKeyValue","keyValue","xTickFormat","tickFormat","xTickValues","tickValues","yData","yKeyValue","yTickFormat","columns","rows","dataForTable","setDataForTable","xField","xTickValuesArray","baseTableData","valuesArray","forEach","value","field","header","isRowHeader","agg","tick","tickValue","isArray","id","tableData","d","yValue","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"],"mappings":"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"}
1
+ {"version":3,"file":"charts.umd.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 font-family: ${props => props.theme.bodyFont};\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: { preventDefault?: any; key?: any; shiftKey?: any; }) {\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","blueGrey300","blueGrey700","grey900","baseProps","width","height","padding","baseLabelStyles","fontFamily","fontSize","letterSpacing","fill","stroke","strokeWidth","centeredLabelStyles","textAnchor","strokeLinecap","strokeLinejoin","magmaTheme","area","style","data","labels","axis","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","pointsIndexes","Array","from","dataLength","_","i","filter","includes","map","point","CustomScatterDataComponent","pointIndex","lineIndex","pointRefArray","registerPoint","unregisterPoint","other","Point","ariaLabel","pathComponent","CustomPointComponent","tabIndex","forceUpdate","useForceUpdate","ref","useRef","useEffect","CustomAxisComponent","events","LineSegment","strokeOpacity","LegendButton","forwardRef","children","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","undefined","xTickLabels","xRest","xAxisOther","yAxis","yAxisLabel","yTickLabels","yRest","yAxisOther","lastFocusedScatterPoint","tabRef","i18n","I18nContext","useState","setHiddenData","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","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","xKeyValue","keyValue","xTickFormat","tickFormat","xTickValues","tickValues","yData","yKeyValue","yTickFormat","columns","rows","dataForTable","setDataForTable","xField","xTickValuesArray","baseTableData","valuesArray","forEach","value","field","header","isRowHeader","agg","tick","tickValue","isArray","id","tableData","d","yValue","Card","Datagrid","hasPagination","Spinner","StyledTitle","size04","bodyFont","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"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-magma/charts",
3
- "version": "2.0.1",
3
+ "version": "2.0.2",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
package/src/components/LineChart/Chart.tsx CHANGED
@@ -52,6 +52,7 @@ const StyledTitle = styled.span`
52
52
  color: ${props => props.theme.colors.neutral};
53
53
  font-size: ${props => props.theme.typeScale.size04.fontSize};
54
54
  font-weight: 600;
55
+ font-family: ${props => props.theme.bodyFont};
55
56
  line-height: ${props => props.theme.typeScale.size04.lineHeight};
56
57
  margin: 0 0 12px 0;
57
58
  `;
@@ -120,7 +121,7 @@ function BaseChart<T>(props: ChartProps<T>, ref: React.Ref<HTMLDivElement>) {
120
121
  setIsKeyboardInstructionsOpen(prevOpen => !prevOpen);
121
122
  }
122
123
 
123
- function handleKeyboardInstructionsButtonKeydown(event: React.KeyboardEvent) {
124
+ function handleKeyboardInstructionsButtonKeydown(event: { preventDefault?: any; key?: any; shiftKey?: any; }) {
124
125
  const { key, shiftKey } = event;
125
126
 
126
127
  switch (key) {