@fluentui/react-charts 9.0.2 → 9.0.3

package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DeclarativeChart.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport { DonutChart } from '../DonutChart/index';\nimport { PlotData, PlotlySchema } from './PlotlySchema';\nimport {\n  isArrayOrTypedArray,\n  isDateArray,\n  isNumberArray,\n  isMonthArray,\n  sanitizeJson,\n  updateXValues,\n  transformPlotlyJsonToDonutProps,\n  transformPlotlyJsonToScatterChartProps,\n  transformPlotlyJsonToVBCProps,\n} from './PlotlySchemaAdapter';\nimport { LineChart, LineChartProps } from '../LineChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { ImageExportOptions, toImage } from './imageExporter';\nimport { Chart } from '../../types/index';\nimport { tokens } from '@fluentui/react-theme';\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?: React.RefObject<IDeclarativeChart>;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n  exportAsImage: (opts?: ImageExportOptions) => 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 plotlyInput = plotlySchema as PlotlySchema;\n  let { selectedLegends } = plotlySchema;\n  const colorMap = useColorMapping();\n  const isDarkTheme = false;\n  const chartRef = React.useRef<Chart>(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  };\n\n  const checkAndRenderChart = (\n    renderChartJsx: (chartProps: LineChartProps) => JSX.Element,\n    isAreaChart: boolean = false,\n  ) => {\n    const xValues = (plotlyInput.data[0] as PlotData).x;\n    const isXDate = isDateArray(xValues);\n    const isXNumber = isNumberArray(xValues);\n    const isXMonth = isMonthArray(xValues);\n    if (isXDate || isXNumber) {\n      const chartProps: LineChartProps = {\n        ...transformPlotlyJsonToScatterChartProps(\n          { data: plotlyInput.data, layout: plotlyInput.layout },\n          isAreaChart,\n          colorMap,\n          isDarkTheme,\n        ),\n        ...commonProps,\n      };\n      return renderChartJsx(chartProps);\n    } else if (isXMonth) {\n      const updatedData = plotlyInput.data.map((dataPoint: PlotData) => ({\n        ...dataPoint,\n        x: updateXValues(dataPoint.x),\n      }));\n      const chartProps: LineChartProps = {\n        ...transformPlotlyJsonToScatterChartProps(\n          { data: updatedData, layout: plotlyInput.layout },\n          isAreaChart,\n          colorMap,\n          isDarkTheme,\n        ),\n        ...commonProps,\n      };\n      return renderChartJsx(chartProps);\n    }\n    throw new Error(`Unsupported chart type :${plotlyInput.data[0]?.type}`);\n  };\n\n  const exportAsImage = React.useCallback((opts?: ImageExportOptions) => {\n    return toImage(chartRef.current?.chartContainer, {\n      background: tokens.colorNeutralBackground1,\n      scale: 5,\n      ...opts,\n    });\n  }, []);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      exportAsImage,\n    }),\n    [exportAsImage],\n  );\n\n  switch (plotlyInput.data[0].type) {\n    case 'pie':\n      return <DonutChart {...transformPlotlyJsonToDonutProps(plotlySchema, colorMap, isDarkTheme)} {...commonProps} />;\n    case 'bar':\n      throw new Error(`Unsupported chart type :${plotlyInput.data[0]?.type}`);\n    case 'scatter':\n      if (plotlyInput.data[0].mode === 'markers') {\n        throw new Error(`Unsupported chart - type :${plotlyInput.data[0]?.type}, mode: ${plotlyInput.data[0]?.mode}`);\n      }\n      const isAreaChart = plotlyInput.data.some(\n        (series: PlotData) => series.fill === 'tonexty' || series.fill === 'tozeroy',\n      );\n      const renderChartJsx = (chartProps: LineChartProps) => {\n        if (isAreaChart) {\n          throw new Error(\n            `Unsupported chart type :${plotlyInput.data[0]?.type}, fill: ${\n              (plotlyInput.data[0] as Partial<PlotData>)?.fill\n            }`,\n          );\n        }\n        return <LineChart {...chartProps} />;\n      };\n      return checkAndRenderChart(renderChartJsx, isAreaChart);\n    case 'heatmap':\n      throw new Error(`Unsupported chart type :${plotlyInput.data[0]?.type}`);\n    case 'sankey':\n      throw new Error(`Unsupported chart type :${plotlyInput.data[0]?.type}`);\n    case 'indicator':\n    case 'gauge':\n      throw new Error(`Unsupported chart - type: ${plotlyInput.data[0]?.type}, mode: ${plotlyInput.data[0]?.mode}`);\n    case 'histogram':\n      return (\n        <VerticalBarChart {...transformPlotlyJsonToVBCProps(plotlySchema, colorMap, isDarkTheme)} {...commonProps} />\n      );\n    default:\n      const xValues = (plotlyInput.data[0] as PlotData).x;\n      const yValues = (plotlyInput.data[0] as PlotData).y;\n      if (xValues && yValues && xValues.length > 0 && yValues.length > 0) {\n        const renderLineChartJsx = (chartProps: LineChartProps) => {\n          return <LineChart {...chartProps} />;\n        };\n        return checkAndRenderChart(renderLineChartJsx);\n      }\n      throw new Error(`Unsupported chart type :${plotlyInput.data[0]?.type}`);\n  }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\n"],"names":["DeclarativeChart","useColorMapping","colorMap","React","useRef","Map","forwardRef","props","forwardedRef","plotlySchema","sanitizeJson","chartSchema","plotlyInput","selectedLegends","isDarkTheme","chartRef","isArrayOrTypedArray","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","commonProps","legendProps","componentRef","checkAndRenderChart","renderChartJsx","isAreaChart","xValues","data","x","isXDate","isDateArray","isXNumber","isNumberArray","isXMonth","isMonthArray","chartProps","transformPlotlyJsonToScatterChartProps","layout","updatedData","map","dataPoint","updateXValues","Error","type","exportAsImage","useCallback","opts","toImage","current","chartContainer","background","tokens","colorNeutralBackground1","scale","useImperativeHandle","createElement","DonutChart","transformPlotlyJsonToDonutProps","mode","some","series","fill","_plotlyInput_data_1","LineChart","VerticalBarChart","transformPlotlyJsonToVBCProps","yValues","y","length","renderLineChartJsx","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["DeclarativeChart.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n  decodeBase64Fields,\n  isArrayOrTypedArray,\n  isDateArray,\n  isNumberArray,\n  mapFluentChart,\n  sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { ThemeContext_unstable as V9ThemeContext } from '@fluentui/react-shared-contexts';\nimport { Theme, webLightTheme } from '@fluentui/tokens';\nimport * as d3Color from 'd3-color';\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} from './PlotlySchemaAdapter';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { LineChart, LineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, AreaChartProps } 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 { ImageExportOptions, toImage } from './imageExporter';\nimport { Chart } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\n// TODO\n// import { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\n\n// const ResponsiveDonutChart = withResponsiveContainer(DonutChart);\n// const ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\n// const ResponsiveLineChart = withResponsiveContainer(LineChart);\n// const ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\n// const ResponsiveAreaChart = withResponsiveContainer(AreaChart);\n// const ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\n// const ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\n// const ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\n// const ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\n// const ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\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?: React.RefObject<IDeclarativeChart>;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n  exportAsImage: (opts?: ImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n  const colorMap = React.useRef(new Map<string, string>());\n  return colorMap;\n};\n\nconst useIsDarkTheme = (): boolean => {\n  const parentV9Theme = React.useContext(V9ThemeContext) as Theme;\n  const v9Theme: Theme = parentV9Theme ? parentV9Theme : webLightTheme;\n\n  // Get background and foreground colors\n  const backgroundColor = d3Color.hsl(v9Theme.colorNeutralBackground1);\n  const foregroundColor = d3Color.hsl(v9Theme.colorNeutralForeground1);\n\n  const isDarkTheme = backgroundColor.l < foregroundColor.l;\n\n  return isDarkTheme;\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 isDarkTheme = useIsDarkTheme();\n  const chartRef = React.useRef<Chart>(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  };\n\n  const renderLineAreaScatter = (plotlyData: Data[], isAreaChart: boolean): JSX.Element => {\n    const isScatterMarkers = (plotlyData[0] as PlotData)?.mode === 'markers';\n    const chartProps: LineChartProps | AreaChartProps = {\n      ...transformPlotlyJsonToScatterChartProps(\n        { data: plotlyData, layout: plotlyInput.layout },\n        isAreaChart,\n        colorMap,\n        isDarkTheme,\n      ),\n      ...commonProps,\n    };\n    if (isAreaChart) {\n      return <AreaChart {...chartProps} />;\n    }\n    if (isScatterMarkers) {\n      return <ScatterChart {...chartProps} />;\n    }\n    return <LineChart {...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    if (isXDate || isXNumber) {\n      return renderLineAreaScatter(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 renderLineAreaScatter(updatedData, isAreaChart);\n    }\n    // Unsupported schema, render as VerticalStackedBarChart\n    fallbackVSBC = true;\n    return (\n      <VerticalStackedBarChart\n        {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme, fallbackVSBC)}\n        {...commonProps}\n      />\n    );\n  };\n\n  // TODO\n  const exportAsImage = React.useCallback((opts?: ImageExportOptions) => {\n    return toImage(chartRef.current?.chartContainer, {\n      background: tokens.colorNeutralBackground1,\n      scale: 5,\n      ...opts,\n    });\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        <DonutChart\n          {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'horizontalbar':\n      return (\n        <HorizontalBarChartWithAxis\n          {...transformPlotlyJsonToHorizontalBarWithAxisProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'groupedverticalbar':\n      return (\n        <GroupedVerticalBarChart\n          {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'verticalstackedbar':\n      return (\n        <VerticalStackedBarChart\n          {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'heatmap':\n      return (\n        <HeatMapChart\n          {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n          {...commonProps}\n          legendProps={{}}\n        />\n      );\n    case 'sankey':\n      return (\n        <SankeyChart\n          {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'gauge':\n      return (\n        <GaugeChart\n          {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    case 'verticalbar':\n      return (\n        <VerticalBarChart\n          {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n          {...commonProps}\n        />\n      );\n    // TODO: Add 'scatter' as a separate chart type\n    case 'area':\n    case 'line':\n    case 'fallback':\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';\n"],"names":["DeclarativeChart","useColorMapping","colorMap","React","useRef","Map","useIsDarkTheme","parentV9Theme","useContext","V9ThemeContext","v9Theme","webLightTheme","backgroundColor","d3Color","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","forwardRef","props","forwardedRef","plotlySchema","sanitizeJson","chartSchema","chart","mapFluentChart","isValid","Error","errorMessage","plotlyInput","decodeBase64Fields","error","plotlyInputWithValidData","data","validTracesInfo","map","trace","selectedLegends","chartRef","isArrayOrTypedArray","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","commonProps","legendProps","componentRef","renderLineAreaScatter","plotlyData","isAreaChart","isScatterMarkers","_plotlyData_","mode","chartProps","transformPlotlyJsonToScatterChartProps","layout","createElement","AreaChart","ScatterChart","LineChart","checkAndRenderChart","fallbackVSBC","xValues","x","isXDate","isDateArray","isXNumber","isNumberArray","isXMonth","isMonthArray","updatedData","dataPoint","correctYearMonth","VerticalStackedBarChart","transformPlotlyJsonToVSBCProps","exportAsImage","useCallback","opts","toImage","current","chartContainer","background","tokens","scale","useImperativeHandle","type","DonutChart","transformPlotlyJsonToDonutProps","HorizontalBarChartWithAxis","transformPlotlyJsonToHorizontalBarWithAxisProps","GroupedVerticalBarChart","transformPlotlyJsonToGVBCProps","HeatMapChart","transformPlotlyJsonToHeatmapProps","SankeyChart","transformPlotlyJsonToSankeyProps","GaugeChart","transformPlotlyJsonToGaugeProps","VerticalBarChart","transformPlotlyJsonToVBCProps","some","series","fill","stackgroup","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}