@fluentui/react-charting 5.24.2 → 5.24.4

package/lib-amd/components/DeclarativeChart/PlotlyColorAdapter.js.map

@@ -1 +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 } 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"]}
+{"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-amd/components/DeclarativeChart/PlotlySchemaAdapter.d.ts

@@ -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;