npm - @fluentui/react-charting - Versions diffs - 5.24.2 → 5.24.4 - Mend

@fluentui/react-charting 5.24.2 → 5.24.4

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 (192) hide show

package/lib/components/DeclarativeChart/DeclarativeChart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DeclarativeChart.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/DeclarativeChart.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention /\nimport as React from 'react';\nimport { useTheme } from '@fluentui/react';\nimport { IRefObject } from '@fluentui/react/lib/Utilities';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { decodeBase64Fields } from '@fluentui/chart-utilities';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n isArrayOrTypedArray,\n isDateArray,\n isNumberArray,\n isYearArray,\n mapFluentChart,\n sanitizeJson,\n} from '@fluentui/chart-utilities';\n\nimport {\n isMonthArray,\n correctYearMonth,\n transformPlotlyJsonToDonutProps,\n transformPlotlyJsonToVSBCProps,\n transformPlotlyJsonToScatterChartProps,\n transformPlotlyJsonToHorizontalBarWithAxisProps,\n transformPlotlyJsonToHeatmapProps,\n transformPlotlyJsonToSankeyProps,\n transformPlotlyJsonToGaugeProps,\n transformPlotlyJsonToGVBCProps,\n transformPlotlyJsonToVBCProps,\n transformPlotlyJsonToChartTableProps,\n projectPolarToCartesian,\n isStringArray,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { LineChart, ILineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, IAreaChartProps } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { IChart, IImageExportOptions } from '../../types/index';\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ChartTable } from '../ChartTable/index';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\nconst ResponsiveChartTable = withResponsiveContainer(ChartTable);\n\n/*\n DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n /\nexport interface Schema {\n /\n Plotly schema represented as JSON object\n /\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n plotlySchema: any;\n}\n\n/\n DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n /\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n /\n The schema representing the chart data, layout and configuration\n /\n chartSchema: Schema;\n\n /\n Callback when an event occurs\n /\n onSchemaChange?: (eventData: Schema) => void;\n\n /\n Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n /\n componentRef?: IRefObject<IDeclarativeChart>;\n\n /\n Optional prop to specify the colorway type of the chart.\n * - 'default': Use Fluent UI color palette aligning with plotly colorway.\n * - 'builtin': Use Fluent UI colorway.\n * - 'others': Reserved for future colorways.\n * @default 'default'\n /\n colorwayType?: ColorwayType;\n}\n\n/\n {@docCategory DeclarativeChart}\n /\nexport interface IDeclarativeChart {\n exportAsImage: (opts?: IImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n const colorMap = React.useRef(new Map<string, string>());\n return colorMap;\n};\n\n/\n DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n HTMLDivElement,\n DeclarativeChartProps\n>((props, forwardedRef) => {\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n const chart: OutputChartType = mapFluentChart(plotlySchema);\n if (!chart.isValid) {\n throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n }\n let plotlyInput = plotlySchema as PlotlySchema;\n try {\n plotlyInput = decodeBase64Fields(plotlyInput);\n } catch (error) {\n throw new Error(`Failed to decode plotly schema: ${error}`);\n }\n const plotlyInputWithValidData: PlotlySchema = {\n ...plotlyInput,\n data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace[0]]),\n };\n\n let { selectedLegends } = plotlySchema;\n const colorMap = useColorMapping();\n const theme = useTheme();\n const isDarkTheme = theme?.isInverted ?? false;\n const chartRef = React.useRef<IChart>(null);\n\n if (!isArrayOrTypedArray(selectedLegends)) {\n selectedLegends = [];\n }\n\n const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n const onActiveLegendsChange = (keys: string[]) => {\n setActiveLegends(keys);\n if (props.onSchemaChange) {\n props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n }\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { selectedLegends } = plotlySchema;\n setActiveLegends(selectedLegends ?? []);\n }, [props.chartSchema]);\n\n const multiSelectLegendProps = {\n canSelectMultipleLegends: true,\n onChange: onActiveLegendsChange,\n selectedLegends: activeLegends,\n };\n\n const commonProps = {\n legendProps: multiSelectLegendProps,\n componentRef: chartRef,\n calloutProps: { layerProps: { eventBubblingEnabled: true } },\n };\n\n const renderLineArea = (plotlyData: Data[], isAreaChart: boolean): JSX.Element => {\n const isScatterMarkers = [\n 'markers',\n 'text+markers',\n 'markers+text',\n 'lines+markers',\n 'markers+line',\n 'text+lines+markers',\n ].includes((plotlyData[0] as PlotData)?.mode);\n const chartProps: ILineChartProps \| IAreaChartProps = {\n ...transformPlotlyJsonToScatterChartProps(\n { data: plotlyData, layout: plotlyInput.layout },\n isAreaChart,\n isScatterMarkers,\n colorMap,\n props.colorwayType,\n isDarkTheme,\n ),\n ...commonProps,\n };\n if (isAreaChart) {\n return <ResponsiveAreaChart {...chartProps} />;\n }\n return <ResponsiveLineChart {...chartProps} />;\n };\n\n const checkAndRenderChart = (isAreaChart: boolean = false) => {\n let fallbackVSBC = false;\n const xValues = (plotlyInputWithValidData.data[0] as PlotData).x;\n const isXDate = isDateArray(xValues);\n const isXNumber = isNumberArray(xValues);\n const isXMonth = isMonthArray(xValues);\n const isYString = isStringArray((plotlyInputWithValidData.data[0] as Partial<PlotData>).y);\n\n // Consider year as categorical variable not numeric continuous variable\n // Also year is not considered a date variable as it is represented as a point\n // in time and brings additional complexity of handling timezone and locale\n // formatting given the current design of the charting library\n const isXYear = isYearArray(xValues);\n\n if ((isXDate \|\| isXNumber) && !isXYear && !isYString) {\n return renderLineArea(plotlyInputWithValidData.data, isAreaChart);\n } else if (isXMonth) {\n const updatedData = plotlyInputWithValidData.data.map((dataPoint: PlotData) => ({\n ...dataPoint,\n x: correctYearMonth(dataPoint.x),\n }));\n return renderLineArea(updatedData, isAreaChart);\n }\n // Unsupported schema, render as VerticalStackedBarChart\n fallbackVSBC = true;\n if (isAreaChart) {\n throw new Error('Fallback to VerticalStackedBarChart is not allowed for Area Charts.');\n }\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(\n plotlyInputWithValidData,\n colorMap,\n props.colorwayType,\n isDarkTheme,\n fallbackVSBC,\n )}\n {...commonProps}\n />\n );\n };\n\n const exportAsImage = React.useCallback(\n (opts?: IImageExportOptions): Promise<string> => {\n return new Promise((resolve, reject) => {\n if (!chartRef.current \|\| typeof chartRef.current.toImage !== 'function') {\n return reject(Error('Chart cannot be exported as image'));\n }\n\n chartRef.current\n .toImage({\n background: theme.semanticColors.bodyBackground,\n scale: 5,\n ...opts,\n })\n .then(resolve)\n .catch(reject);\n });\n },\n [theme],\n );\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n exportAsImage,\n }),\n [exportAsImage],\n );\n\n switch (chart.type) {\n case 'donut':\n return (\n <ResponsiveDonutChart\n {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'horizontalbar':\n return (\n <ResponsiveHorizontalBarChartWithAxis\n {...transformPlotlyJsonToHorizontalBarWithAxisProps(\n plotlyInputWithValidData,\n colorMap,\n props.colorwayType,\n isDarkTheme,\n )}\n {...commonProps}\n />\n );\n case 'groupedverticalbar':\n return (\n <ResponsiveGroupedVerticalBarChart\n {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalstackedbar':\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'heatmap':\n return (\n <ResponsiveHeatMapChart\n {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n {...commonProps}\n legendProps={{}}\n />\n );\n case 'sankey':\n return (\n <ResponsiveSankeyChart\n {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'gauge':\n return (\n <ResponsiveGaugeChart\n {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalbar':\n return (\n <ResponsiveVerticalBarChart\n {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'table':\n return (\n <ResponsiveChartTable\n {...transformPlotlyJsonToChartTableProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'area':\n case 'line':\n case 'fallback':\n case 'scatterpolar':\n if (chart.type === 'scatterpolar') {\n const cartesianProjection = projectPolarToCartesian(plotlyInputWithValidData);\n plotlyInputWithValidData.data = cartesianProjection.data;\n }\n // Need recheck for area chart as we don't have ability to check for valid months in previous step\n const isAreaChart = plotlyInputWithValidData.data.some(\n (series: PlotData) => series.fill === 'tonexty' \|\| series.fill === 'tozeroy' \|\| !!series.stackgroup,\n );\n return checkAndRenderChart(isAreaChart);\n default:\n throw new Error(`Unsupported chart type :${plotlyInputWithValidData.data[0]?.type}`);\n }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\nDeclarativeChart.defaultProps = {\n colorwayType: 'default',\n};\n"]}
1	+ {"version":3,"file":"DeclarativeChart.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/DeclarativeChart.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention /\nimport as React from 'react';\nimport { useTheme } from '@fluentui/react';\nimport { IRefObject } from '@fluentui/react/lib/Utilities';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { decodeBase64Fields } from '@fluentui/chart-utilities';\nimport type { PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray, isMonthArray, mapFluentChart, sanitizeJson } from '@fluentui/chart-utilities';\n\nimport type { GridProperties } from './PlotlySchemaAdapter';\nimport {\n correctYearMonth,\n getGridProperties,\n transformPlotlyJsonToDonutProps,\n transformPlotlyJsonToVSBCProps,\n transformPlotlyJsonToAreaChartProps,\n transformPlotlyJsonToLineChartProps,\n transformPlotlyJsonToHorizontalBarWithAxisProps,\n transformPlotlyJsonToHeatmapProps,\n transformPlotlyJsonToSankeyProps,\n transformPlotlyJsonToGaugeProps,\n transformPlotlyJsonToGVBCProps,\n transformPlotlyJsonToVBCProps,\n transformPlotlyJsonToChartTableProps,\n transformPlotlyJsonToScatterChartProps,\n projectPolarToCartesian,\n getAllupLegendsProps,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { LineChart } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { IChart, IImageExportOptions } from '../../types/index';\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ScatterChart } from '../ScatterChart/index';\nimport { ChartTable } from '../ChartTable/index';\nimport { ILegendsProps, Legends } from '../Legends/index';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\nconst ResponsiveScatterChart = withResponsiveContainer(ScatterChart);\nconst ResponsiveChartTable = withResponsiveContainer(ChartTable);\n\n// Default x-axis key for grouping traces. Also applicable for PieData and SankeyData where x-axis is not defined.\nconst DEFAULT_XAXIS = 'x';\nconst FALLBACK_TYPE = 'fallback';\n\n/*\n DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n /\nexport interface Schema {\n /\n Plotly schema represented as JSON object\n /\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n plotlySchema: any;\n}\n\n/\n DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n /\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n /\n The schema representing the chart data, layout and configuration\n /\n chartSchema: Schema;\n\n /\n Callback when an event occurs\n /\n onSchemaChange?: (eventData: Schema) => void;\n\n /\n Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n /\n componentRef?: IRefObject<IDeclarativeChart>;\n\n /\n Optional prop to specify the colorway type of the chart.\n * - 'default': Use Fluent UI color palette aligning with plotly colorway.\n * - 'builtin': Use Fluent UI colorway.\n * - 'others': Reserved for future colorways.\n * @default 'default'\n /\n colorwayType?: ColorwayType;\n}\n\n/\n {@docCategory DeclarativeChart}\n /\nexport interface IDeclarativeChart {\n exportAsImage: (opts?: IImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n const colorMap = React.useRef(new Map<string, string>());\n return colorMap;\n};\n\nfunction renderChart<TProps>(\n Renderer: React.ComponentType<TProps>,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n transformer: (...args: any[]) => TProps,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n transformerArgs: any[],\n commonProps: Partial<TProps>,\n cellRow: number,\n cellColumn: number,\n): JSX.Element {\n const chartProps = transformer(...transformerArgs);\n return (\n <div\n key={`${cellRow}_${cellColumn}`}\n style={{\n gridRowStart: cellRow,\n gridRowEnd: cellRow + 1,\n gridColumnStart: cellColumn,\n gridColumnEnd: cellColumn + 1,\n }}\n >\n <Renderer {...chartProps} {...commonProps} />\n </div>\n );\n}\n\ntype PreTransformHooks = {\n preTransformCondition?: (plotlySchema: PlotlySchema) => boolean;\n preTransformOperation?: (plotlySchema: PlotlySchema) => PlotlySchema;\n};\n\nconst LineAreaPreTransformOp = (plotlyInput: PlotlySchema) => {\n const xValues = (plotlyInput.data[0] as PlotData).x;\n const isXMonth = isMonthArray(xValues);\n let renderData = plotlyInput.data;\n if (isXMonth) {\n renderData = plotlyInput.data.map((dataPoint: PlotData) => ({\n ...dataPoint,\n x: correctYearMonth(dataPoint.x),\n }));\n }\n return { data: renderData, layout: plotlyInput.layout };\n};\n\ntype ChartTypeMap = {\n donut: {\n transformer: typeof transformPlotlyJsonToDonutProps;\n renderer: typeof ResponsiveDonutChart;\n } & PreTransformHooks;\n sankey: {\n transformer: typeof transformPlotlyJsonToSankeyProps;\n renderer: typeof ResponsiveSankeyChart;\n } & PreTransformHooks;\n table: {\n transformer: typeof transformPlotlyJsonToChartTableProps;\n renderer: typeof ResponsiveChartTable;\n } & PreTransformHooks;\n horizontalbar: {\n transformer: typeof transformPlotlyJsonToHorizontalBarWithAxisProps;\n renderer: typeof ResponsiveHorizontalBarChartWithAxis;\n } & PreTransformHooks;\n groupedverticalbar: {\n transformer: typeof transformPlotlyJsonToGVBCProps;\n renderer: typeof ResponsiveGroupedVerticalBarChart;\n } & PreTransformHooks;\n verticalstackedbar: {\n transformer: typeof transformPlotlyJsonToVSBCProps;\n renderer: typeof ResponsiveVerticalStackedBarChart;\n } & PreTransformHooks;\n heatmap: {\n transformer: typeof transformPlotlyJsonToHeatmapProps;\n renderer: typeof ResponsiveHeatMapChart;\n } & PreTransformHooks;\n gauge: {\n transformer: typeof transformPlotlyJsonToGaugeProps;\n renderer: typeof ResponsiveGaugeChart;\n } & PreTransformHooks;\n verticalbar: {\n transformer: typeof transformPlotlyJsonToVBCProps;\n renderer: typeof ResponsiveVerticalBarChart;\n } & PreTransformHooks;\n area: {\n transformer: typeof transformPlotlyJsonToAreaChartProps;\n renderer: typeof ResponsiveAreaChart;\n } & PreTransformHooks;\n line: {\n transformer: typeof transformPlotlyJsonToLineChartProps;\n renderer: typeof ResponsiveLineChart;\n } & PreTransformHooks;\n scatter: {\n transformer: typeof transformPlotlyJsonToScatterChartProps;\n renderer: typeof ResponsiveScatterChart;\n } & PreTransformHooks;\n fallback: {\n transformer: typeof transformPlotlyJsonToVSBCProps;\n renderer: typeof ResponsiveVerticalStackedBarChart;\n } & PreTransformHooks;\n};\n\nconst chartMap: ChartTypeMap = {\n // PieData category charts\n donut: {\n transformer: transformPlotlyJsonToDonutProps,\n renderer: ResponsiveDonutChart,\n },\n // SankeyData category charts\n sankey: {\n transformer: transformPlotlyJsonToSankeyProps,\n renderer: ResponsiveSankeyChart,\n },\n // TableData category charts\n table: {\n transformer: transformPlotlyJsonToChartTableProps,\n renderer: ResponsiveChartTable,\n },\n // PlotData category charts\n horizontalbar: {\n transformer: transformPlotlyJsonToHorizontalBarWithAxisProps,\n renderer: ResponsiveHorizontalBarChartWithAxis,\n },\n groupedverticalbar: {\n transformer: transformPlotlyJsonToGVBCProps,\n renderer: ResponsiveGroupedVerticalBarChart,\n },\n verticalstackedbar: {\n transformer: transformPlotlyJsonToVSBCProps,\n renderer: ResponsiveVerticalStackedBarChart,\n },\n heatmap: {\n transformer: transformPlotlyJsonToHeatmapProps,\n renderer: ResponsiveHeatMapChart,\n },\n gauge: {\n transformer: transformPlotlyJsonToGaugeProps,\n renderer: ResponsiveGaugeChart,\n },\n verticalbar: {\n transformer: transformPlotlyJsonToVBCProps,\n renderer: ResponsiveVerticalBarChart,\n },\n area: {\n transformer: transformPlotlyJsonToAreaChartProps,\n renderer: ResponsiveAreaChart,\n preTransformOperation: LineAreaPreTransformOp,\n },\n line: {\n transformer: transformPlotlyJsonToLineChartProps,\n renderer: ResponsiveLineChart,\n preTransformOperation: LineAreaPreTransformOp,\n },\n scatter: {\n transformer: transformPlotlyJsonToScatterChartProps,\n renderer: ResponsiveScatterChart,\n preTransformOperation: LineAreaPreTransformOp,\n },\n fallback: {\n transformer: transformPlotlyJsonToVSBCProps,\n renderer: ResponsiveVerticalStackedBarChart,\n },\n};\n\n/\n DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n HTMLDivElement,\n DeclarativeChartProps\n>((props, forwardedRef) => {\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n const chart: OutputChartType = mapFluentChart(plotlySchema);\n if (!chart.isValid) {\n throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n }\n let plotlyInput = plotlySchema as PlotlySchema;\n try {\n plotlyInput = decodeBase64Fields(plotlyInput);\n } catch (error) {\n throw new Error(`Failed to decode plotly schema: ${error}`);\n }\n const plotlyInputWithValidData: PlotlySchema = {\n ...plotlyInput,\n data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace[0]]),\n };\n\n const validTracesFilteredIndex: [number, string][] = chart.validTracesInfo!.map((trace, index) => [index, trace[1]]);\n\n let { selectedLegends } = plotlySchema;\n const colorMap = useColorMapping();\n const theme = useTheme();\n const isDarkTheme = theme?.isInverted ?? false;\n const chartRef = React.useRef<IChart>(null);\n const isMultiPlot = React.useRef(false);\n\n if (!isArrayOrTypedArray(selectedLegends)) {\n selectedLegends = [];\n }\n\n const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n const onActiveLegendsChange = (keys: string[]) => {\n setActiveLegends(keys);\n if (props.onSchemaChange) {\n props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n }\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { selectedLegends } = plotlySchema;\n setActiveLegends(selectedLegends ?? []);\n }, [props.chartSchema]);\n\n const multiSelectLegendProps = {\n canSelectMultipleLegends: true,\n onChange: onActiveLegendsChange,\n selectedLegends: activeLegends,\n };\n\n const commonProps = {\n legendProps: multiSelectLegendProps,\n componentRef: chartRef,\n calloutProps: { layerProps: { eventBubblingEnabled: true } },\n };\n\n function createLegends(legendProps: ILegendsProps): JSX.Element {\n // eslint-disable-next-line react/jsx-no-bind\n return <Legends {...legendProps} selectedLegends={activeLegends} onChange={onActiveLegendsChange} />;\n }\n\n const exportAsImage = React.useCallback(\n (opts?: IImageExportOptions): Promise<string> => {\n return new Promise((resolve, reject) => {\n if (isMultiPlot.current) {\n return reject(Error('Exporting multi plot charts as image is not supported'));\n }\n if (!chartRef.current \|\| typeof chartRef.current.toImage !== 'function') {\n return reject(Error('Chart cannot be exported as image'));\n }\n\n chartRef.current\n .toImage({\n background: theme.semanticColors.bodyBackground,\n scale: 5,\n ...opts,\n })\n .then(resolve)\n .catch(reject);\n });\n },\n [theme],\n );\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n exportAsImage,\n }),\n [exportAsImage],\n );\n\n if (chart.type === 'scatterpolar') {\n const cartesianProjection = projectPolarToCartesian(plotlyInputWithValidData);\n plotlyInputWithValidData.data = cartesianProjection.data;\n validTracesFilteredIndex.forEach((trace, index) => {\n if (trace[1] === 'scatterpolar') {\n validTracesFilteredIndex[index][1] = 'line'; // Change type to line for rendering\n }\n });\n }\n\n const groupedTraces: Record<string, number[]> = {};\n plotlyInputWithValidData.data.forEach((trace: Partial<PlotData>, index) => {\n const xAxisKey = trace.xaxis ?? DEFAULT_XAXIS;\n if (!groupedTraces[xAxisKey]) {\n groupedTraces[xAxisKey] = [];\n }\n groupedTraces[xAxisKey].push(index);\n });\n\n isMultiPlot.current = Object.keys(groupedTraces).length > 1;\n const gridProperties: GridProperties = getGridProperties(plotlyInputWithValidData.layout, isMultiPlot.current);\n\n const allupLegendsProps = getAllupLegendsProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme);\n\n type ChartType = keyof ChartTypeMap;\n // map through the grouped traces and render the appropriate chart\n return (\n <>\n <div\n style={{\n display: 'grid',\n gridTemplateRows: gridProperties.templateRows,\n gridTemplateColumns: gridProperties.templateColumns,\n }}\n >\n {Object.entries(groupedTraces).map(([xAxisKey, index]) => {\n const plotlyInputForGroup: PlotlySchema = {\n ...plotlyInputWithValidData,\n data: index.map(idx => plotlyInputWithValidData.data[idx]),\n };\n\n const filteredTracesInfo = validTracesFilteredIndex.filter(trace => index.includes(trace[0]));\n let chartType =\n validTracesFilteredIndex.some(trace => trace[1] === FALLBACK_TYPE) \|\| chart.type === FALLBACK_TYPE\n ? FALLBACK_TYPE\n : filteredTracesInfo[0][1];\n\n if (\n validTracesFilteredIndex.some(trace => trace[1] === 'line') &&\n validTracesFilteredIndex.some(trace => trace[1] === 'scatter')\n ) {\n chartType = 'line';\n }\n\n const chartEntry = chartMap[chartType as ChartType];\n if (chartEntry) {\n const { transformer, renderer, preTransformCondition, preTransformOperation } = chartEntry;\n if (preTransformCondition === undefined \|\| preTransformCondition(plotlyInputForGroup)) {\n const transformedInput = preTransformOperation\n ? preTransformOperation(plotlyInputForGroup)\n : plotlyInputForGroup;\n const cellProperties = gridProperties.layout[xAxisKey];\n\n return renderChart<ReturnType<typeof transformer>>(\n renderer,\n transformer,\n [transformedInput, isMultiPlot.current, colorMap, props.colorwayType, isDarkTheme],\n {\n ...commonProps,\n xAxisAnnotation: cellProperties?.xAnnotation,\n yAxisAnnotation: cellProperties?.yAnnotation,\n },\n cellProperties?.row ?? 1,\n cellProperties?.column ?? 1,\n );\n }\n return <></>;\n } else {\n throw new Error(`Unsupported chart type :${plotlyInputForGroup.data[0]?.type}`);\n }\n })}\n </div>\n {isMultiPlot.current && createLegends(allupLegendsProps)}\n </>\n );\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\nDeclarativeChart.defaultProps = {\n colorwayType: 'default',\n};\n"]}

package/lib/components/DeclarativeChart/PlotlyColorAdapter.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
 import * as React from 'react';
-import type { PieColors, Color } from '@fluentui/chart-utilities';
+import type { PieColors, Color, PlotData } from '@fluentui/chart-utilities';
 export type ColorwayType = 'default' | 'builtin' | 'others' | undefined;
 export declare const getColor: (legendLabel: string, colorMap: React.MutableRefObject<Map<string, string>>, isDarkTheme?: boolean) => string;
 export declare const getSchemaColors: (colorway: string[] | undefined, colors: PieColors | Color | Color[] | string | null | undefined, colorMap: React.MutableRefObject<Map<string, string>>, isDarkTheme?: boolean) => string[] | string | undefined;
 export declare const extractColor: (colorway: string[] | undefined, colorwayType: ColorwayType, colors: PieColors | Color | Color[] | string | null | undefined, colorMap: React.MutableRefObject<Map<string, string>>, isDarkTheme?: boolean) => string | string[] | undefined;
 export declare const resolveColor: (extractedColors: string[] | string | null | undefined, index: number, legend: string, colorMap: React.MutableRefObject<Map<string, string>>, isDarkTheme?: boolean) => string;
+export declare const getOpacity: (series: Partial<PlotData>, index: number) => number;

package/lib/components/DeclarativeChart/PlotlyColorAdapter.js CHANGED Viewed

@@ -89,7 +89,7 @@ export var extractColor = function (colorway, colorwayType, colors, colorMap, is
 };
 export var resolveColor = function (extractedColors, index, legend, colorMap, isDarkTheme) {
     var color = '';
-    if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors[index]) {
+    if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors.length > 0) {
         color = extractedColors[index % extractedColors.length];
     }
     else if (typeof extractedColors === 'string') {
@@ -100,4 +100,12 @@ export var resolveColor = function (extractedColors, index, legend, colorMap, is
     }
     return color;
 };
+export var getOpacity = function (series, index) {
+    var _a, _b, _c, _d, _e, _f;
+    return ((_a = series.marker) === null || _a === void 0 ? void 0 : _a.opacity)
+        ? isArrayOrTypedArray((_b = series.marker) === null || _b === void 0 ? void 0 : _b.opacity)
+            ? ((_c = series.marker) === null || _c === void 0 ? void 0 : _c.opacity)[index % ((_d = series.marker) === null || _d === void 0 ? void 0 : _d.opacity).length]
+            : (_e = series.marker) === null || _e === void 0 ? void 0 : _e.opacity
+        : (_f = series.opacity) !== null && _f !== void 0 ? _f : 1;
+};
 //# sourceMappingURL=PlotlyColorAdapter.js.map

package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlotlyColorAdapter.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/PlotlyColorAdapter.ts"],"names":[],"mappings":"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~~KAAK~~,CAAC,EAAE,CAAC;~~QACtF~~,KAAK,GAAG,eAAe,CAAC,KAAK,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;IAC1D,CAAC;SAAM,IAAI,OAAO,eAAe,KAAK,QAAQ,EAAE,CAAC;QAC/C,KAAK,GAAG,eAAe,CAAC;IAC1B,CAAC;SAAM,CAAC;QACN,KAAK,GAAG,QAAQ,CAAC,MAAM,EAAE,QAAQ,EAAE,WAAW,CAAC,CAAC;IAClD,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { color as d3Color } from 'd3-color';\nimport type { PieColors, Color } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray } from '@fluentui/chart-utilities';\nimport { areArraysEqual } from '../../utilities/utilities';\nimport { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';\n\ntype PlotlyColorway = 'plotly' \| 'others';\n\n// The color sequences in plotly express are defined here:\n// https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport type ColorwayType = 'default' \| 'builtin' \| 'others' \| undefined;\n\nconst DEFAULT_PLOTLY_COLORWAY = [\n '#636efa', //1\n '#ef553b', //2\n '#00cc96', //3\n '#ab63fa', //4\n '#ffa15a', //5\n '#19d3f3', //6\n '#ff6692', //7\n '#b6e880', //8\n '#ff97ff', //9\n '#fecb52', //10\n];\n\nconst PLOTLY_FLUENTVIZ_COLORWAY_MAPPING = [\n DataVizPalette.color1, //1\n DataVizPalette.warning, //2\n DataVizPalette.color8, //3\n DataVizPalette.color4, //4\n DataVizPalette.color7, //5\n DataVizPalette.color6, //6\n DataVizPalette.color2, //7\n DataVizPalette.color5, //8\n DataVizPalette.color9, //9\n DataVizPalette.color10, //10\n];\n\nfunction getPlotlyColorway(colorway: string[] \| undefined): PlotlyColorway {\n const isPlotlyColorway =\n isArrayOrTypedArray(colorway) &&\n areArraysEqual(\n colorway?.map(c => c.toLowerCase()),\n DEFAULT_PLOTLY_COLORWAY,\n );\n\n return isPlotlyColorway ? 'plotly' : 'others';\n}\n\nfunction tryMapFluentDataViz(hexColor: string, templateColorway: PlotlyColorway, isDarkTheme?: boolean): string {\n if (templateColorway !== 'plotly') {\n return hexColor;\n }\n const index = DEFAULT_PLOTLY_COLORWAY.indexOf(hexColor.toLowerCase());\n if (index !== -1) {\n return getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[index], isDarkTheme);\n }\n return hexColor;\n}\n\nexport const getColor = (\n legendLabel: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n if (!colorMap.current.has(legendLabel)) {\n let nextColor: string;\n if (colorMap.current.size < PLOTLY_FLUENTVIZ_COLORWAY_MAPPING.length) {\n // Get first 10 colors from plotly-fluentviz colorway mapping\n nextColor = getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[colorMap.current.size], isDarkTheme);\n } else {\n nextColor = getNextColor(colorMap.current.size, 0, isDarkTheme);\n }\n colorMap.current.set(legendLabel, nextColor);\n return nextColor;\n }\n\n return colorMap.current.get(legendLabel) as string;\n};\n\nexport const getSchemaColors = (\n colorway: string[] \| undefined,\n colors: PieColors \| Color \| Color[] \| string \| null \| undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string[] \| string \| undefined => {\n const hexColors: string[] = [];\n if (!colors) {\n return undefined;\n }\n const templateColorway = getPlotlyColorway(colorway);\n if (isArrayOrTypedArray(colors)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (colors as any[]).forEach((element, index) => {\n const colorString = element?.toString().trim();\n const nextFluentColor = getColor(`Label_${index}`, colorMap, isDarkTheme);\n if (colorString) {\n const parsedColor = d3Color(colorString);\n hexColors.push(\n parsedColor ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme) : nextFluentColor,\n );\n } else {\n hexColors.push(nextFluentColor);\n }\n });\n } else if (typeof colors === 'string') {\n const parsedColor = d3Color(colors);\n return parsedColor\n ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme)\n : getColor('Label_0', colorMap, isDarkTheme);\n }\n return hexColors;\n};\n\nexport const extractColor = (\n colorway: string[] \| undefined,\n colorwayType: ColorwayType,\n colors: PieColors \| Color \| Color[] \| string \| null \| undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string \| string[] \| undefined => {\n return colorwayType === 'default' && colors ? getSchemaColors(colorway, colors, colorMap, isDarkTheme) : undefined;\n};\n\nexport const resolveColor = (\n extractedColors: string[] \| string \| null \| undefined,\n index: number,\n legend: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n let color = '';\n if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors~~[index]~~) {\n color = extractedColors[index % extractedColors.length];\n } else if (typeof extractedColors === 'string') {\n color = extractedColors;\n } else {\n color = getColor(legend, colorMap, isDarkTheme);\n }\n return color;\n};\n"]}
1	+ {"version":3,"file":"PlotlyColorAdapter.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/PlotlyColorAdapter.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { color as d3Color } from 'd3-color';\nimport type { PieColors, Color, PlotData } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray } from '@fluentui/chart-utilities';\nimport { areArraysEqual } from '../../utilities/utilities';\nimport { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';\n\ntype PlotlyColorway = 'plotly' \| 'others';\n\n// The color sequences in plotly express are defined here:\n// https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport type ColorwayType = 'default' \| 'builtin' \| 'others' \| undefined;\n\nconst DEFAULT_PLOTLY_COLORWAY = [\n '#636efa', //1\n '#ef553b', //2\n '#00cc96', //3\n '#ab63fa', //4\n '#ffa15a', //5\n '#19d3f3', //6\n '#ff6692', //7\n '#b6e880', //8\n '#ff97ff', //9\n '#fecb52', //10\n];\n\nconst PLOTLY_FLUENTVIZ_COLORWAY_MAPPING = [\n DataVizPalette.color1, //1\n DataVizPalette.warning, //2\n DataVizPalette.color8, //3\n DataVizPalette.color4, //4\n DataVizPalette.color7, //5\n DataVizPalette.color6, //6\n DataVizPalette.color2, //7\n DataVizPalette.color5, //8\n DataVizPalette.color9, //9\n DataVizPalette.color10, //10\n];\n\nfunction getPlotlyColorway(colorway: string[] \| undefined): PlotlyColorway {\n const isPlotlyColorway =\n isArrayOrTypedArray(colorway) &&\n areArraysEqual(\n colorway?.map(c => c.toLowerCase()),\n DEFAULT_PLOTLY_COLORWAY,\n );\n\n return isPlotlyColorway ? 'plotly' : 'others';\n}\n\nfunction tryMapFluentDataViz(hexColor: string, templateColorway: PlotlyColorway, isDarkTheme?: boolean): string {\n if (templateColorway !== 'plotly') {\n return hexColor;\n }\n const index = DEFAULT_PLOTLY_COLORWAY.indexOf(hexColor.toLowerCase());\n if (index !== -1) {\n return getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[index], isDarkTheme);\n }\n return hexColor;\n}\n\nexport const getColor = (\n legendLabel: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n if (!colorMap.current.has(legendLabel)) {\n let nextColor: string;\n if (colorMap.current.size < PLOTLY_FLUENTVIZ_COLORWAY_MAPPING.length) {\n // Get first 10 colors from plotly-fluentviz colorway mapping\n nextColor = getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[colorMap.current.size], isDarkTheme);\n } else {\n nextColor = getNextColor(colorMap.current.size, 0, isDarkTheme);\n }\n colorMap.current.set(legendLabel, nextColor);\n return nextColor;\n }\n\n return colorMap.current.get(legendLabel) as string;\n};\n\nexport const getSchemaColors = (\n colorway: string[] \| undefined,\n colors: PieColors \| Color \| Color[] \| string \| null \| undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string[] \| string \| undefined => {\n const hexColors: string[] = [];\n if (!colors) {\n return undefined;\n }\n const templateColorway = getPlotlyColorway(colorway);\n if (isArrayOrTypedArray(colors)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (colors as any[]).forEach((element, index) => {\n const colorString = element?.toString().trim();\n const nextFluentColor = getColor(`Label_${index}`, colorMap, isDarkTheme);\n if (colorString) {\n const parsedColor = d3Color(colorString);\n hexColors.push(\n parsedColor ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme) : nextFluentColor,\n );\n } else {\n hexColors.push(nextFluentColor);\n }\n });\n } else if (typeof colors === 'string') {\n const parsedColor = d3Color(colors);\n return parsedColor\n ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme)\n : getColor('Label_0', colorMap, isDarkTheme);\n }\n return hexColors;\n};\n\nexport const extractColor = (\n colorway: string[] \| undefined,\n colorwayType: ColorwayType,\n colors: PieColors \| Color \| Color[] \| string \| null \| undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string \| string[] \| undefined => {\n return colorwayType === 'default' && colors ? getSchemaColors(colorway, colors, colorMap, isDarkTheme) : undefined;\n};\n\nexport const resolveColor = (\n extractedColors: string[] \| string \| null \| undefined,\n index: number,\n legend: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n let color = '';\n if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors.length > 0) {\n color = extractedColors[index % extractedColors.length];\n } else if (typeof extractedColors === 'string') {\n color = extractedColors;\n } else {\n color = getColor(legend, colorMap, isDarkTheme);\n }\n return color;\n};\n\nexport const getOpacity = (series: Partial<PlotData>, index: number): number => {\n return series.marker?.opacity\n ? isArrayOrTypedArray(series.marker?.opacity)\n ? (series.marker?.opacity as number[])[index % (series.marker?.opacity as number[]).length]\n : (series.marker?.opacity as number)\n : series.opacity ?? 1;\n};\n"]}

package/lib/components/DeclarativeChart/PlotlySchemaAdapter.d.ts CHANGED Viewed

@@ -10,22 +10,36 @@ import { IGaugeChartProps } from '../GaugeChart/index';
 import { IGroupedVerticalBarChartProps } from '../GroupedVerticalBarChart/index';
 import { IVerticalBarChartProps } from '../VerticalBarChart/index';
 import { IChartTableProps } from '../ChartTable/index';
-import type { Datum, PlotlySchema, PlotData, TypedArray, Color } from '@fluentui/chart-utilities';
+import type { Datum, Layout, PlotlySchema, PlotData, TypedArray, Color } from '@fluentui/chart-utilities';
 import type { ColorwayType } from './PlotlyColorAdapter';
-export declare const isMonthArray: (data: Datum[] | Datum[][] | TypedArray) => boolean;
+import { ILegendsProps } from '../Legends/index';
+export type AxisProperties = {
+    xAnnotation?: string;
+    yAnnotation?: string;
+    row: number;
+    column: number;
+};
+export type GridAxisProperties = Record<string, AxisProperties>;
+export type GridProperties = {
+    templateRows: string;
+    templateColumns: string;
+    layout: GridAxisProperties;
+};
 export declare const correctYearMonth: (xValues: Datum[] | Datum[][] | TypedArray) => any[];
 export declare const _getGaugeAxisColor: (colorway: string[] | undefined, colorwayType: ColorwayType, color: Color | undefined, colorMap: React.MutableRefObject<Map<string, string>>, isDarkTheme?: boolean) => string;
 export declare const resolveXAxisPoint: (x: Datum, isXYearCategory: boolean, isXString: boolean, isXDate: boolean, isXNumber: boolean) => string | Date | number;
-export declare const transformPlotlyJsonToDonutProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IDonutChartProps;
-export declare const transformPlotlyJsonToVSBCProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean, fallbackVSBC?: boolean) => IVerticalStackedBarChartProps;
-export declare const transformPlotlyJsonToGVBCProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IGroupedVerticalBarChartProps;
-export declare const transformPlotlyJsonToVBCProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IVerticalBarChartProps;
-export declare const transformPlotlyJsonToScatterChartProps: (input: PlotlySchema, isAreaChart: boolean, isScatterMarkers: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => ILineChartProps | IAreaChartProps;
-export declare const transformPlotlyJsonToHorizontalBarWithAxisProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IHorizontalBarChartWithAxisProps;
-export declare const transformPlotlyJsonToHeatmapProps: (input: PlotlySchema) => IHeatMapChartProps;
-export declare const transformPlotlyJsonToSankeyProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => ISankeyChartProps;
-export declare const transformPlotlyJsonToGaugeProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IGaugeChartProps;
-export declare const transformPlotlyJsonToChartTableProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, isDarkTheme?: boolean) => IChartTableProps;
+export declare const transformPlotlyJsonToDonutProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IDonutChartProps;
+export declare const transformPlotlyJsonToVSBCProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean, fallbackVSBC?: boolean) => IVerticalStackedBarChartProps;
+export declare const transformPlotlyJsonToGVBCProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IGroupedVerticalBarChartProps;
+export declare const transformPlotlyJsonToVBCProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IVerticalBarChartProps;
+export declare const transformPlotlyJsonToAreaChartProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IAreaChartProps;
+export declare const transformPlotlyJsonToLineChartProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => ILineChartProps;
+export declare const transformPlotlyJsonToScatterChartProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => ILineChartProps;
+export declare const transformPlotlyJsonToHorizontalBarWithAxisProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IHorizontalBarChartWithAxisProps;
+export declare const transformPlotlyJsonToHeatmapProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IHeatMapChartProps;
+export declare const transformPlotlyJsonToSankeyProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => ISankeyChartProps;
+export declare const transformPlotlyJsonToGaugeProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IGaugeChartProps;
+export declare const transformPlotlyJsonToChartTableProps: (input: PlotlySchema, isMultiPlot: boolean, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => IChartTableProps;
 export declare const projectPolarToCartesian: (input: PlotlySchema) => PlotlySchema;
 /**
  * Interate iteratively through the trace object and find all the array attributes.
@@ -33,6 +47,7 @@ export declare const projectPolarToCartesian: (input: PlotlySchema) => PlotlySch
  * @param trace
  */
 export declare function findArrayAttributes(trace: any): void;
-export declare const isStringArray: (arr: any) => boolean;
+export declare const getAllupLegendsProps: (input: PlotlySchema, colorMap: React.MutableRefObject<Map<string, string>>, colorwayType: ColorwayType, isDarkTheme?: boolean) => ILegendsProps;
 export declare const getNumberAtIndexOrDefault: (data: PlotData['z'] | undefined, index: number) => number | undefined;
 export declare const getValidXYRanges: (series: Partial<PlotData>) => [number, number][];
+export declare const getGridProperties: (layout: Partial<Layout> | undefined, isMultiPlot: boolean) => GridProperties;