@fluentui/react-charts 0.0.0-nightly-20251113-0407.1 → 0.0.0-nightly-20251114-0406.1

package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { LegendsProps } from '../Legends/index';\nimport {\n  AccessibilityProps,\n  Chart,\n  Margins,\n  DataPoint,\n  ChartAnnotation,\n  HorizontalBarChartWithAxisDataPoint,\n  GroupedVerticalBarChartData,\n  HeatMapChartDataPoint,\n  LineChartPoints,\n  VerticalBarChartDataPoint,\n  VerticalStackedBarDataPoint,\n  ScatterChartPoints,\n  GanttChartDataPoint,\n  AxisCategoryOrder,\n  AxisProps,\n  AxisScaleType,\n} from '../../types/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\nimport { ChartTypes, IAxisData, IDomainNRange, IYAxisParams, XAxisTypes, YAxisType } from '../../utilities/utilities';\nimport { ScaleBand, ScaleLinear } from 'd3-scale';\n/**\n * Cartesian Chart style properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyleProps {\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * Height of the chart.\n   */\n  height?: number;\n\n  /**\n   * Color of the chart.\n   */\n  color?: string;\n\n  /**\n   * Link to redirect if click action for graph\n   */\n  href?: string;\n\n  /**\n   * prop to check if the chart is selected or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check if the Page is in Rtl\n   */\n  useRtl?: boolean;\n\n  /**\n   * color of the line\n   */\n  lineColor?: string;\n\n  /**\n   * boolean flag which determines if shape is drawn in callout\n   */\n  toDrawShape?: boolean;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n}\n\n/**\n * Cartesian Chart styles\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: string;\n\n  /**\n   * Style for the element containing the x-axis.\n   */\n  xAxis?: string;\n\n  /**\n   * Style for the element containing the y-axis.\n   */\n  yAxis?: string;\n\n  /**\n   * Style for legend container\n   */\n  legendContainer?: string;\n\n  /**\n   * line hover box css\n   */\n  hover?: string;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: string;\n\n  /**\n   * styles for tooltip\n   */\n  tooltip?: string;\n\n  /**\n   * styles for axis title\n   */\n  axisTitle?: string;\n\n  /**\n   * styles for axis annotation\n   */\n  axisAnnotation?: string;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: string;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover?: string;\n\n  /**\n   * styles for the shape object in the callout\n   */\n  shapeStyles?: string;\n\n  /**\n   * Styles for the chart wrapper div\n   */\n  chartWrapper?: string;\n\n  /**\n   * Styles for the element wrapping the svg and overlays for annotation\n   */\n  plotContainer?: string;\n\n  /**\n   * Styles for the svg tooltip\n   */\n  svgTooltip?: string;\n\n  /**\n   * Styles applied to the annotation layer root element\n   */\n  annotationLayer?: string;\n\n  /**\n   * Styles for the chart svg element\n   */\n  chart?: string;\n}\n\n/**\n * Cartesian Chart properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartProps {\n  /**\n   * Below height used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  height?: number;\n\n  /**\n   * Below width used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  width?: number;\n\n  /**\n   * this prop takes its parent as a HTML element to define the width and height of the chart\n   */\n  parentRef?: HTMLElement | null;\n\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Margins for the chart\n   * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`\n   * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values\n   */\n  margins?: Margins;\n\n  /** decides wether to show/hide legends\n   * @defaultvalue false\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Do not show tooltips in chart\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * this prop takes values that you want the chart to render on x-axis\n   * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you\n   * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart\n   */\n  tickValues?: number[] | Date[] | string[] | undefined;\n\n  /**\n   * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'\n   * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis\n   * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.\n   */\n  tickFormat?: string;\n\n  /**\n   * Width of line stroke\n   */\n  strokeWidth?: number;\n\n  /**\n   * x Axis labels tick padding. This defines the gap between tick labels and tick lines.\n   * @default 10\n   */\n  xAxisTickPadding?: number;\n\n  /**\n   * the format in for the data on y-axis. For data object this can be specified to your requirement.\n   *  Eg: d3.format(\".0%\")(0.123),d3.format(\"+20\")(42);\n   * Please look at https://github.com/d3/d3-format for all the formats supported\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yAxisTickFormat?: any;\n\n  /**\n   * Secondary y-scale options\n   * By default this is not defined, meaning there will be no secondary y-scale.\n   */\n  secondaryYScaleOptions?: {\n    /** Minimum value (0 by default) */\n    yMinValue?: number;\n    /** Maximum value (100 by default) */\n    yMaxValue?: number;\n  };\n\n  /**\n   * minimum  data value point in y-axis\n   */\n  yMinValue?: number;\n\n  /**\n   * maximum data value point in y-axis\n   */\n  yMaxValue?: number;\n\n  /**\n   * maximum data value point in x-axis\n   */\n  xMaxValue?: number;\n\n  /**\n   * Number of ticks on the y-axis.\n   * Tick count should be factor of difference between (yMinValue, yMaxValue)?\n   * @default 4\n   */\n  yAxisTickCount?: number;\n\n  /**\n   * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.\n   * Does not work for string axis.\n   * @default 6\n   */\n  xAxisTickCount?: number;\n\n  /**\n   * define the size of the tick lines on the x-axis\n   * @default 10\n   */\n  xAxistickSize?: number;\n\n  /**\n   * Text annotations rendered on top of the chart area\n   */\n  annotations?: ChartAnnotation[];\n\n  /**\n   * defines the space between the tick line and the data label\n   * @default 10\n   */\n  tickPadding?: number;\n\n  /**\n   * Url that the data-viz needs to redirect to upon clicking on it\n   */\n  href?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /**\n   * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n   */\n  enabledLegendsWrapLines?: boolean;\n\n  /*\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<LegendsProps>;\n\n  /**\n   *@default false\n   *Used for to elipse x axis labes and show tooltip on x axis labels\n   */\n  showXAxisLablesTooltip?: boolean;\n\n  /**\n   * @default 4\n   * Used for X axis labels\n   * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.\n   */\n  noOfCharsToTruncate?: number;\n\n  /**\n   * @default false\n   * Used to wrap x axis labels values (whole value)\n   */\n  wrapXAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to rotate x axis labels by 45 degrees\n   */\n  rotateXAxisLables?: boolean;\n\n  /**\n   * The prop used to define the date time localization options\n   */\n  dateLocalizeOptions?: Intl.DateTimeFormatOptions;\n\n  /**\n   * The prop used to define a custom locale for the date time format.\n   */\n  timeFormatLocale?: TimeLocaleDefinition;\n\n  /**\n   * The prop used to define a custom datetime formatter for date axis.\n   */\n  customDateTimeFormatter?: (dateTime: Date) => string;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: CartesianChartStyles;\n\n  /**\n   * Callout customization props\n   */\n  calloutProps?: Partial<ChartPopoverProps>;\n\n  /**\n   * props for the svg; use this to include aria-* or other attributes on the tag\n   */\n  svgProps?: React.SVGProps<SVGSVGElement>;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n\n  /**\n   * Props related to reflow behavior of the chart\n   */\n  reflowProps?: {\n    /**\n     * Determines the reflow behavior of the chart.\n     * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.\n     * @default 'none'\n     */\n    mode: 'none' | 'min-width';\n  };\n\n  /**\n   * Prop to set the x axis title\n   * @default undefined\n   * Minimum bottom margin required for x axis title is 55px\n   */\n\n  xAxisTitle?: string;\n\n  /**\n   * Prop to set the y axis title\n   * @default undefined\n   * Minimum left margin required for y axis title is 60px and for RTL is 40px\n   * Minimum right margin required for y axis title is 40px and for RTL is 60px\n   */\n  yAxisTitle?: string;\n\n  /**\n   * Prop to set the secondary y axis title\n   * @default undefined\n   * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px\n   */\n  secondaryYAxistitle?: string;\n\n  /**\n   * Whether to use UTC time for axis scale, ticks, and the time display in callouts.\n   * When set to `true`, time is displayed equally, regardless of the user's timezone settings.\n   * @default true\n   */\n  useUTC?: string | boolean;\n\n  /**\n   * @default false\n   * The prop used to decide rounded ticks on y axis\n   */\n  roundedTicks?: boolean;\n\n  /**\n   * Determines whether overlapping x-axis tick labels should be hidden.\n   * @default true\n   */\n  hideTickOverlap?: boolean;\n\n  /**\n   * Define a custom callout props override\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;\n\n  /**\n   * Optional callback to access the Chart interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<Chart | null>;\n\n  /**\n   * Prop to set the x axis annotation. Used to display additional information on the x-axis.\n   * This is shown on the top of the chart.\n   * @default undefined\n   */\n  xAxisAnnotation?: string;\n\n  /**\n   * Prop to set the y axis annotation. Used to display additional information on the y-axis.\n   * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.\n   * @default undefined\n   */\n  yAxisAnnotation?: string;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the x-axis.\n   * @default 'default'\n   */\n  xAxisCategoryOrder?: AxisCategoryOrder;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the y-axis.\n   * @default 'default'\n   */\n  yAxisCategoryOrder?: AxisCategoryOrder;\n\n  /**\n   * Defines the scale type for the x-axis.\n   * @default 'default'\n   */\n  xScaleType?: AxisScaleType;\n\n  /**\n   * Defines the scale type for the primary y-axis.\n   * @default 'default'\n   */\n  yScaleType?: AxisScaleType;\n\n  /**\n   * Defines the scale type for the secondary y-axis.\n   * @default 'default'\n   */\n  secondaryYScaleType?: AxisScaleType;\n\n  /**\n   * Explicit set of tick values for the y-axis.\n   * If provided, these values override automatic tick generation.\n   */\n  yAxisTickValues?: number[] | Date[] | string[];\n\n  /**\n   * Configuration for the x-axis.\n   * Use this to control `tickStep`, `tick0`, etc.\n   */\n  xAxis?: AxisProps;\n\n  /**\n   * Configuration for the y-axis.\n   * Use this to control `tickStep`, `tick0`, etc.\n   */\n  yAxis?: AxisProps;\n\n  /**\n   *@default false\n   *Used for showing complete y axis lables   */\n  showYAxisLables?: boolean;\n\n  /**\n   *@default false\n   *Used for to elipse y axis labes and show tooltip on x axis labels\n   */\n  showYAxisLablesTooltip?: boolean;\n}\n\nexport interface YValueHover {\n  legend?: string;\n  y?: number | string;\n  color?: string;\n  data?: string | number;\n  shouldDrawBorderBottom?: boolean;\n  yAxisCalloutData?: string | { [id: string]: number };\n  index?: number;\n  callOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface ChildProps {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  xScale?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScalePrimary?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScaleSecondary?: any;\n  containerHeight?: number;\n  containerWidth?: number;\n  optimizeLargeData?: boolean;\n}\n\n// Only used for Cartesian chart base\nexport interface ModifiedCartesianChartProps extends CartesianChartProps {\n  /**\n   * Define the chart title\n   */\n  chartTitle?: string;\n\n  /**\n   * Only used for Area chart\n   * Value used to draw y axis of that chart.\n   */\n  maxOfYVal?: number;\n\n  /**\n   * Data of the chart\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  points: any;\n\n  /**\n   * Define type of the chart\n   */\n  chartType: ChartTypes;\n\n  /** X axis type */\n  xAxisType: XAxisTypes;\n\n  /** Y axis type */\n  yAxisType?: YAxisType;\n\n  /**\n   * Legends of the chart.\n   */\n  legendBars: JSXElement | null;\n\n  /**\n   * Callout props\n   */\n  calloutProps?: ChartPopoverProps;\n\n  /**\n   * Callback method used for to get margins to the chart.\n   */\n  getmargins?: (margins: Margins) => void;\n\n  /**\n   * This is a call back method to the chart from cartesian chart.\n   * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.\n   * It also contians an optional param xAxisElement - defines as x axis scale element.\n   * This param used to enable feature word wrap of Xaxis.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getGraphData?: any;\n\n  /**\n   * Used for bar chart graphs.\n   * To define width of the bar\n   */\n  barwidth?: number;\n\n  /**\n   * Used for tick styles of the x axis of the chart\n   * Tick params are applicable for date axis only.\n   */\n  tickParams?: {\n    tickValues?: number[] | Date[] | string[];\n    tickFormat?: string;\n  };\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  xAxisPadding?: number;\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  yAxisPadding?: number;\n\n  /**\n   * Children elements specific to derived chart types.\n   */\n  children(props: ChildProps): React.ReactNode;\n\n  /**\n   * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.\n   * @default false\n   * @type \\{boolean \\}\n   */\n  isCalloutForStack?: boolean;\n\n  /** dataset values to find out domain of the String axis\n   * Present using for only vertical stacked bar chart and grouped vertical bar chart\n   */\n  datasetForXAxisDomain?: string[];\n\n  /** Own callout design */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  customizedCallout?: any;\n\n  /**\n   * if the data points for the y-axis is of type string, then we need to give this\n   * prop to construct the y-axis\n   */\n  stringDatasetForYAxisDomain?: string[];\n\n  /**\n   * The prop used to define the culture to localize the numbers and date\n   */\n  culture?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getAxisData?: any;\n\n  /**\n   * Callback method used when mouse leaves the chart boundary.\n   */\n  onChartMouseLeave?: () => void;\n\n  /** Callback method to get extra margins for domain */\n  getDomainMargins?: (containerWidth: number) => Margins;\n\n  /** Callback method to get extra margins for Y-axis domain */\n  getYDomainMargins?: (containerHeight: number) => Margins;\n\n  /** Padding between each bar/line-point */\n  xAxisInnerPadding?: number;\n\n  /** Padding before first bar/line-point and after last bar/line-point */\n  xAxisOuterPadding?: number;\n\n  /**\n   *@default false\n   *Used for to elipse y axis labes and show tooltip on x axis labels\n   */\n  showYAxisLablesTooltip?: boolean;\n\n  /**\n   *@default false\n   *Used for showing complete y axis lables   */\n  showYAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to control the first render cycle Performance optimization code.\n   */\n  enableFirstRenderOptimization?: boolean;\n\n  /**\n   * Get the min and max values of the y-axis\n   */\n  getMinMaxOfYAxis: (\n    points:\n      | LineChartPoints[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | VerticalBarChartDataPoint[]\n      | DataPoint[]\n      | ScatterChartPoints[]\n      | GanttChartDataPoint[],\n    yAxisType: YAxisType | undefined,\n    useSecondaryYScale?: boolean,\n  ) => { startValue: number; endValue: number };\n\n  /**\n   * Create the y-axis\n   */\n  createYAxis: (\n    yAxisParams: IYAxisParams,\n    isRtl: boolean,\n    axisData: IAxisData,\n    isIntegralDataset: boolean,\n    chartType: ChartTypes,\n    useSecondaryYScale?: boolean,\n    roundedTicks?: boolean,\n    scaleType?: AxisScaleType,\n    _useRtl?: boolean,\n  ) => ScaleLinear<number, number, never>;\n\n  /**\n   * Get the domain and range values\n   */\n  getDomainNRangeValues: (\n    points:\n      | LineChartPoints[]\n      | VerticalBarChartDataPoint[]\n      | VerticalStackedBarDataPoint[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | GroupedVerticalBarChartData[]\n      | HeatMapChartDataPoint[]\n      | GanttChartDataPoint[],\n    margins: Margins,\n    width: number,\n    chartType: ChartTypes,\n    isRTL: boolean,\n    xAxisType: XAxisTypes,\n    barWidth: number,\n    tickValues: Date[] | number[] | string[] | undefined,\n  ) => IDomainNRange;\n\n  /**\n   * Create the string y-axis\n   */\n  createStringYAxis: (\n    yAxisParams: IYAxisParams,\n    dataPoints: string[],\n    isRtl: boolean,\n    axisData: IAxisData,\n    barWidth: number | undefined,\n    chartType?: ChartTypes,\n  ) => ScaleBand<string>;\n\n  /**\n   * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.\n   * @default true\n   */\n  showRoundOffXTickValues?: boolean;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}
+{"version":3,"sources":["../src/components/CommonComponents/CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { LegendsProps } from '../Legends/index';\nimport {\n  AccessibilityProps,\n  Chart,\n  Margins,\n  DataPoint,\n  ChartAnnotation,\n  HorizontalBarChartWithAxisDataPoint,\n  GroupedVerticalBarChartData,\n  HeatMapChartDataPoint,\n  LineChartPoints,\n  VerticalBarChartDataPoint,\n  VerticalStackedBarDataPoint,\n  ScatterChartPoints,\n  GanttChartDataPoint,\n  AxisCategoryOrder,\n  AxisProps,\n  AxisScaleType,\n} from '../../types/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\nimport { ChartTypes, IAxisData, IDomainNRange, IYAxisParams, XAxisTypes, YAxisType } from '../../utilities/utilities';\nimport { ScaleBand, ScaleLinear } from 'd3-scale';\n/**\n * Cartesian Chart style properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyleProps {\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * Height of the chart.\n   */\n  height?: number;\n\n  /**\n   * Color of the chart.\n   */\n  color?: string;\n\n  /**\n   * Link to redirect if click action for graph\n   */\n  href?: string;\n\n  /**\n   * prop to check if the chart is selected or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check if the Page is in Rtl\n   */\n  useRtl?: boolean;\n\n  /**\n   * color of the line\n   */\n  lineColor?: string;\n\n  /**\n   * boolean flag which determines if shape is drawn in callout\n   */\n  toDrawShape?: boolean;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n}\n\n/**\n * Cartesian Chart styles\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: string;\n\n  /**\n   * Style for the element containing the x-axis.\n   */\n  xAxis?: string;\n\n  /**\n   * Style for the element containing the y-axis.\n   */\n  yAxis?: string;\n\n  /**\n   * Style for legend container\n   */\n  legendContainer?: string;\n\n  /**\n   * line hover box css\n   */\n  hover?: string;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: string;\n\n  /**\n   * styles for tooltip\n   */\n  tooltip?: string;\n\n  /**\n   * styles for axis title\n   */\n  axisTitle?: string;\n\n  /**\n   * styles for axis annotation\n   */\n  axisAnnotation?: string;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: string;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover?: string;\n\n  /**\n   * styles for the shape object in the callout\n   */\n  shapeStyles?: string;\n\n  /**\n   * Styles for the chart wrapper div\n   */\n  chartWrapper?: string;\n\n  /**\n   * Styles for the element wrapping the svg and overlays for annotation\n   */\n  plotContainer?: string;\n\n  /**\n   * Styles for the svg tooltip\n   */\n  svgTooltip?: string;\n\n  /**\n   * Styles applied to the annotation layer root element\n   */\n  annotationLayer?: string;\n\n  /**\n   * Styles for the chart svg element\n   */\n  chart?: string;\n}\n\n/**\n * Cartesian Chart properties\n * {@docCategory CartesianChart}\n */\nexport interface CartesianChartProps {\n  /**\n   * Below height used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  height?: number;\n\n  /**\n   * Below width used for resizing of the chart\n   * Wrap chart in your container and send the updated height and width to these props.\n   * These values decide wheather chart re render or not. Please check examples for reference\n   */\n  width?: number;\n\n  /**\n   * this prop takes its parent as a HTML element to define the width and height of the chart\n   */\n  parentRef?: HTMLElement | null;\n\n  /**\n   * Additional CSS class(es) to apply to the Chart.\n   */\n  className?: string;\n\n  /**\n   * Margins for the chart\n   * @default `{ top: 20, bottom: 35, left: 40, right: 20 }`\n   * To avoid edge cuttings to the chart, we recommend you use default values or greater then default values\n   */\n  margins?: Margins;\n\n  /** decides wether to show/hide legends\n   * @defaultvalue false\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Do not show tooltips in chart\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * this prop takes values that you want the chart to render on x-axis\n   * This is a optional parameter if not specified D3 will decide which values appear on the x-axis for you\n   * Please look at https://github.com/d3/d3-scale for more information on how D3 decides what data to appear on the axis of chart\n   */\n  tickValues?: number[] | Date[] | string[] | undefined;\n\n  /**\n   * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'\n   * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis\n   * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.\n   */\n  tickFormat?: string;\n\n  /**\n   * Width of line stroke\n   */\n  strokeWidth?: number;\n\n  /**\n   * x Axis labels tick padding. This defines the gap between tick labels and tick lines.\n   * @default 10\n   */\n  xAxisTickPadding?: number;\n\n  /**\n   * the format in for the data on y-axis. For data object this can be specified to your requirement.\n   *  Eg: d3.format(\".0%\")(0.123),d3.format(\"+20\")(42);\n   * Please look at https://github.com/d3/d3-format for all the formats supported\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yAxisTickFormat?: any;\n\n  /**\n   * Secondary y-scale options\n   * By default this is not defined, meaning there will be no secondary y-scale.\n   */\n  secondaryYScaleOptions?: {\n    /** Minimum value (0 by default) */\n    yMinValue?: number;\n    /** Maximum value (100 by default) */\n    yMaxValue?: number;\n  };\n\n  /**\n   * minimum  data value point in y-axis\n   */\n  yMinValue?: number;\n\n  /**\n   * maximum data value point in y-axis\n   */\n  yMaxValue?: number;\n\n  /**\n   * maximum data value point in x-axis\n   */\n  xMaxValue?: number;\n\n  /**\n   * Number of ticks on the y-axis.\n   * Tick count should be factor of difference between (yMinValue, yMaxValue)?\n   * @default 4\n   */\n  yAxisTickCount?: number;\n\n  /**\n   * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.\n   * Does not work for string axis.\n   * @default 6\n   */\n  xAxisTickCount?: number;\n\n  /**\n   * define the size of the tick lines on the x-axis\n   * @default 10\n   */\n  xAxistickSize?: number;\n\n  /**\n   * Text annotations rendered on top of the chart area\n   */\n  annotations?: ChartAnnotation[];\n\n  /**\n   * defines the space between the tick line and the data label\n   * @default 10\n   */\n  tickPadding?: number;\n\n  /**\n   * Url that the data-viz needs to redirect to upon clicking on it\n   */\n  href?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /**\n   * Enable the legends to wrap lines if there is not enough space to show all legends on a single line\n   */\n  enabledLegendsWrapLines?: boolean;\n\n  /*\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<LegendsProps>;\n\n  /**\n   *@default false\n   *Used for to elipse x axis labes and show tooltip on x axis labels\n   */\n  showXAxisLablesTooltip?: boolean;\n\n  /**\n   * @default 4\n   * Used for X axis labels\n   * While Giving showXAxisLablesTooltip prop, need to define after how many chars, we need to truncate the word.\n   */\n  noOfCharsToTruncate?: number;\n\n  /**\n   * @default false\n   * Used to wrap x axis labels values (whole value)\n   */\n  wrapXAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to rotate x axis labels by 45 degrees\n   */\n  rotateXAxisLables?: boolean;\n\n  /**\n   * The prop used to define the date time localization options\n   */\n  dateLocalizeOptions?: Intl.DateTimeFormatOptions;\n\n  /**\n   * The prop used to define a custom locale for the date time format.\n   */\n  timeFormatLocale?: TimeLocaleDefinition;\n\n  /**\n   * The prop used to define a custom datetime formatter for date axis.\n   */\n  customDateTimeFormatter?: (dateTime: Date) => string;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: CartesianChartStyles;\n\n  /**\n   * Callout customization props\n   */\n  calloutProps?: Partial<ChartPopoverProps>;\n\n  /**\n   * props for the svg; use this to include aria-* or other attributes on the tag\n   */\n  svgProps?: React.SVGProps<SVGSVGElement>;\n\n  /**\n   * Prop to disable shrinking of the chart beyond a certain limit and enable scrolling when the chart overflows\n   * @deprecated Use `reflowProps` instead.\n   */\n  enableReflow?: boolean;\n\n  /**\n   * Props related to reflow behavior of the chart\n   */\n  reflowProps?: {\n    /**\n     * Determines the reflow behavior of the chart.\n     * When set to `'min-width'`, the chart will not shrink below a certain width and will enable scrolling if it overflows.\n     * @default 'none'\n     */\n    mode: 'none' | 'min-width';\n  };\n\n  /**\n   * Prop to set the x axis title\n   * @default undefined\n   * Minimum bottom margin required for x axis title is 55px\n   */\n\n  xAxisTitle?: string;\n\n  /**\n   * Prop to set the y axis title\n   * @default undefined\n   * Minimum left margin required for y axis title is 60px and for RTL is 40px\n   * Minimum right margin required for y axis title is 40px and for RTL is 60px\n   */\n  yAxisTitle?: string;\n\n  /**\n   * Prop to set the secondary y axis title\n   * @default undefined\n   * If RTL is enabled, minimum left and right margins required for secondary y axis title is 60px\n   */\n  secondaryYAxistitle?: string;\n\n  /**\n   * Whether to use UTC time for axis scale, ticks, and the time display in callouts.\n   * When set to `true`, time is displayed equally, regardless of the user's timezone settings.\n   * @default true\n   */\n  useUTC?: string | boolean;\n\n  /**\n   * @default false\n   * The prop used to decide rounded ticks on y axis\n   */\n  roundedTicks?: boolean;\n\n  /**\n   * Determines whether overlapping x-axis tick labels should be hidden.\n   * @default true\n   */\n  hideTickOverlap?: boolean;\n\n  /**\n   * Define a custom callout props override\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  calloutPropsPerDataPoint?: (dataPointCalloutProps: any) => ChartPopoverProps;\n\n  /**\n   * Optional callback to access the Chart interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.Ref<Chart>;\n\n  /**\n   * Prop to set the x axis annotation. Used to display additional information on the x-axis.\n   * This is shown on the top of the chart.\n   * @default undefined\n   */\n  xAxisAnnotation?: string;\n\n  /**\n   * Prop to set the y axis annotation. Used to display additional information on the y-axis.\n   * This is shown on the right side of the chart. Not shown if secondary y-axis is enabled.\n   * @default undefined\n   */\n  yAxisAnnotation?: string;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the x-axis.\n   * @default 'default'\n   */\n  xAxisCategoryOrder?: AxisCategoryOrder;\n\n  /**\n   * Specifies the ordering logic for categories (or string tick labels) on the y-axis.\n   * @default 'default'\n   */\n  yAxisCategoryOrder?: AxisCategoryOrder;\n\n  /**\n   * Defines the scale type for the x-axis.\n   * @default 'default'\n   */\n  xScaleType?: AxisScaleType;\n\n  /**\n   * Defines the scale type for the primary y-axis.\n   * @default 'default'\n   */\n  yScaleType?: AxisScaleType;\n\n  /**\n   * Defines the scale type for the secondary y-axis.\n   * @default 'default'\n   */\n  secondaryYScaleType?: AxisScaleType;\n\n  /**\n   * Explicit set of tick values for the y-axis.\n   * If provided, these values override automatic tick generation.\n   */\n  yAxisTickValues?: number[] | Date[] | string[];\n\n  /**\n   * Configuration for the x-axis.\n   * Use this to control `tickStep`, `tick0`, etc.\n   */\n  xAxis?: AxisProps;\n\n  /**\n   * Configuration for the y-axis.\n   * Use this to control `tickStep`, `tick0`, etc.\n   */\n  yAxis?: AxisProps;\n\n  /**\n   *@default false\n   *Used for showing complete y axis lables   */\n  showYAxisLables?: boolean;\n\n  /**\n   *@default false\n   *Used for to elipse y axis labes and show tooltip on x axis labels\n   */\n  showYAxisLablesTooltip?: boolean;\n}\n\nexport interface YValueHover {\n  legend?: string;\n  y?: number | string;\n  color?: string;\n  data?: string | number;\n  shouldDrawBorderBottom?: boolean;\n  yAxisCalloutData?: string | { [id: string]: number };\n  index?: number;\n  callOutAccessibilityData?: AccessibilityProps;\n}\n\nexport interface ChildProps {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  xScale?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScalePrimary?: any;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  yScaleSecondary?: any;\n  containerHeight?: number;\n  containerWidth?: number;\n  optimizeLargeData?: boolean;\n}\n\n// Only used for Cartesian chart base\nexport interface ModifiedCartesianChartProps extends CartesianChartProps {\n  /**\n   * Define the chart title\n   */\n  chartTitle?: string;\n\n  /**\n   * Only used for Area chart\n   * Value used to draw y axis of that chart.\n   */\n  maxOfYVal?: number;\n\n  /**\n   * Data of the chart\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  points: any;\n\n  /**\n   * Define type of the chart\n   */\n  chartType: ChartTypes;\n\n  /** X axis type */\n  xAxisType: XAxisTypes;\n\n  /** Y axis type */\n  yAxisType?: YAxisType;\n\n  /**\n   * Legends of the chart.\n   */\n  legendBars: JSXElement | null;\n\n  /**\n   * Callout props\n   */\n  calloutProps?: ChartPopoverProps;\n\n  /**\n   * Callback method used for to get margins to the chart.\n   */\n  getmargins?: (margins: Margins) => void;\n\n  /**\n   * This is a call back method to the chart from cartesian chart.\n   * params are xScale, yScale, containerHeight, containerWidth. These values were used to draw the graph.\n   * It also contians an optional param xAxisElement - defines as x axis scale element.\n   * This param used to enable feature word wrap of Xaxis.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getGraphData?: any;\n\n  /**\n   * Used for bar chart graphs.\n   * To define width of the bar\n   */\n  barwidth?: number;\n\n  /**\n   * Used for tick styles of the x axis of the chart\n   * Tick params are applicable for date axis only.\n   */\n  tickParams?: {\n    tickValues?: number[] | Date[] | string[];\n    tickFormat?: string;\n  };\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  xAxisPadding?: number;\n\n  /**\n   * it's padding between bar's or lines in the graph\n   */\n  yAxisPadding?: number;\n\n  /**\n   * Children elements specific to derived chart types.\n   */\n  children(props: ChildProps): React.ReactNode;\n\n  /**\n   * To enable callout for individual bar or complete stack. Using for only Vertical stacked bar chart.\n   * @default false\n   * @type \\{boolean \\}\n   */\n  isCalloutForStack?: boolean;\n\n  /** dataset values to find out domain of the String axis\n   * Present using for only vertical stacked bar chart and grouped vertical bar chart\n   */\n  datasetForXAxisDomain?: string[];\n\n  /** Own callout design */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  customizedCallout?: any;\n\n  /**\n   * if the data points for the y-axis is of type string, then we need to give this\n   * prop to construct the y-axis\n   */\n  stringDatasetForYAxisDomain?: string[];\n\n  /**\n   * The prop used to define the culture to localize the numbers and date\n   */\n  culture?: string;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  getAxisData?: any;\n\n  /**\n   * Callback method used when mouse leaves the chart boundary.\n   */\n  onChartMouseLeave?: () => void;\n\n  /** Callback method to get extra margins for domain */\n  getDomainMargins?: (containerWidth: number) => Margins;\n\n  /** Callback method to get extra margins for Y-axis domain */\n  getYDomainMargins?: (containerHeight: number) => Margins;\n\n  /** Padding between each bar/line-point */\n  xAxisInnerPadding?: number;\n\n  /** Padding before first bar/line-point and after last bar/line-point */\n  xAxisOuterPadding?: number;\n\n  /**\n   *@default false\n   *Used for to elipse y axis labes and show tooltip on x axis labels\n   */\n  showYAxisLablesTooltip?: boolean;\n\n  /**\n   *@default false\n   *Used for showing complete y axis lables   */\n  showYAxisLables?: boolean;\n\n  /**\n   * @default false\n   * Used to control the first render cycle Performance optimization code.\n   */\n  enableFirstRenderOptimization?: boolean;\n\n  /**\n   * Get the min and max values of the y-axis\n   */\n  getMinMaxOfYAxis: (\n    points:\n      | LineChartPoints[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | VerticalBarChartDataPoint[]\n      | DataPoint[]\n      | ScatterChartPoints[]\n      | GanttChartDataPoint[],\n    yAxisType: YAxisType | undefined,\n    useSecondaryYScale?: boolean,\n  ) => { startValue: number; endValue: number };\n\n  /**\n   * Create the y-axis\n   */\n  createYAxis: (\n    yAxisParams: IYAxisParams,\n    isRtl: boolean,\n    axisData: IAxisData,\n    isIntegralDataset: boolean,\n    chartType: ChartTypes,\n    useSecondaryYScale?: boolean,\n    roundedTicks?: boolean,\n    scaleType?: AxisScaleType,\n    _useRtl?: boolean,\n  ) => ScaleLinear<number, number, never>;\n\n  /**\n   * Get the domain and range values\n   */\n  getDomainNRangeValues: (\n    points:\n      | LineChartPoints[]\n      | VerticalBarChartDataPoint[]\n      | VerticalStackedBarDataPoint[]\n      | HorizontalBarChartWithAxisDataPoint[]\n      | GroupedVerticalBarChartData[]\n      | HeatMapChartDataPoint[]\n      | GanttChartDataPoint[],\n    margins: Margins,\n    width: number,\n    chartType: ChartTypes,\n    isRTL: boolean,\n    xAxisType: XAxisTypes,\n    barWidth: number,\n    tickValues: Date[] | number[] | string[] | undefined,\n  ) => IDomainNRange;\n\n  /**\n   * Create the string y-axis\n   */\n  createStringYAxis: (\n    yAxisParams: IYAxisParams,\n    dataPoints: string[],\n    isRtl: boolean,\n    axisData: IAxisData,\n    barWidth: number | undefined,\n    chartType?: ChartTypes,\n  ) => ScaleBand<string>;\n\n  /**\n   * Controls whether the numeric x-axis domain should be extended to start and end at nice rounded values.\n   * @default true\n   */\n  showRoundOffXTickValues?: boolean;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

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

@@ -34,6 +34,8 @@ const _index10 = require("../GanttChart/index");
 const _withResponsiveContainer = require("../ResponsiveContainer/withResponsiveContainer");
 const _index11 = require("../ChartTable/index");
 const _index12 = require("../Legends/index");
+const _index13 = require("../../utilities/index");
+const _imageexportutils = require("../../utilities/image-export-utils");
 const ResponsiveDonutChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index.DonutChart);
 const ResponsiveVerticalStackedBarChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index1.VerticalStackedBarChart);
 const ResponsiveLineChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index2.LineChart);
@@ -190,8 +192,11 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef(({ colorwayType = 'defa
     let { selectedLegends } = plotlySchema;
     const colorMap = useColorMapping();
     const isDarkTheme = useIsDarkTheme();
-    const chartRef = _react.useRef(null);
+    const chartRefs = _react.useRef([]);
     const isMultiPlot = _react.useRef(false);
+    const legendsRef = _react.useRef(null);
+    const containerRef = _react.useRef(null);
+    const isRTL = (0, _index13.useRtl)();
     if (!(0, _chartutilities.isArrayOrTypedArray)(selectedLegends)) {
         selectedLegends = [];
     }
@@ -221,11 +226,7 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef(({ colorwayType = 'defa
         onChange: onActiveLegendsChange,
         selectedLegends: activeLegends
     };
-    const baseCommonProps = {
-        componentRef: chartRef
-    };
     const interactiveCommonProps = {
-        ...baseCommonProps,
         legendProps: multiSelectLegendProps
     };
     function createLegends(legendProps) {
@@ -233,25 +234,38 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef(({ colorwayType = 'defa
         return /*#__PURE__*/ _react.createElement(_index12.Legends, {
             ...legendProps,
             selectedLegends: activeLegends,
-            onChange: onActiveLegendsChange
+            onChange: onActiveLegendsChange,
+            legendRef: legendsRef
         });
     }
-    // TODO
-    const exportAsImage = _react.useCallback((opts)=>{
-        return new Promise((resolve, reject)=>{
-            if (isMultiPlot.current) {
-                return reject(Error('Exporting multi plot charts as image is not supported'));
-            }
-            if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {
-                return reject(Error('Chart cannot be exported as image'));
+    const exportAsImage = _react.useCallback(async (opts)=>{
+        var _legendsRef_current;
+        if (!containerRef.current) {
+            throw new Error('Container reference is null');
+        }
+        const imgExpOpts = {
+            background: (0, _index13.resolveCSSVariables)(containerRef.current, _reacttheme.tokens.colorNeutralBackground1),
+            scale: 5,
+            ...opts
+        };
+        if (!isMultiPlot.current) {
+            var _chartRefs_current__compRef, _chartRefs_current_;
+            if (!((_chartRefs_current_ = chartRefs.current[0]) === null || _chartRefs_current_ === void 0 ? void 0 : (_chartRefs_current__compRef = _chartRefs_current_.compRef) === null || _chartRefs_current__compRef === void 0 ? void 0 : _chartRefs_current__compRef.toImage)) {
+                throw new Error('Chart cannot be exported as image');
             }
-            chartRef.current.toImage({
-                background: _reacttheme.tokens.colorNeutralBackground1,
-                scale: 5,
-                ...opts
-            }).then(resolve).catch(reject);
-        });
-    }, []);
+            return chartRefs.current[0].compRef.toImage(imgExpOpts);
+        }
+        return (0, _imageexportutils.exportChartsAsImage)(chartRefs.current.map((item)=>{
+            var _item_compRef;
+            return {
+                container: (_item_compRef = item.compRef) === null || _item_compRef === void 0 ? void 0 : _item_compRef.chartContainer,
+                row: item.row,
+                col: item.col
+            };
+        }), (_legendsRef_current = legendsRef.current) === null || _legendsRef_current === void 0 ? void 0 : _legendsRef_current.toSVG, isRTL, imgExpOpts);
+    }, [
+        isRTL
+    ]);
     _react.useImperativeHandle(props.componentRef, ()=>({
             exportAsImage
         }), [
@@ -325,8 +339,9 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef(({ colorwayType = 'defa
             display: 'grid',
             gridTemplateRows: gridProperties.templateRows,
             gridTemplateColumns: gridProperties.templateColumns
-        }
-    }, Object.entries(groupedTraces).map(([xAxisKey, index])=>{
+        },
+        ref: containerRef
+    }, Object.entries(groupedTraces).map(([xAxisKey, index], chartIdx)=>{
         var _filteredTracesInfo_;
         const plotlyInputForGroup = {
             ...plotlyInputWithValidData,
@@ -344,7 +359,7 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef(({ colorwayType = 'defa
             if (preTransformCondition === undefined || preTransformCondition(plotlyInputForGroup)) {
                 const transformedInput = preTransformOperation ? preTransformOperation(plotlyInputForGroup) : plotlyInputForGroup;
                 const cellProperties = gridProperties.layout[xAxisKey];
-                const resolvedCommonProps = chartType === 'annotation' ? baseCommonProps : {
+                const resolvedCommonProps = chartType === 'annotation' ? {} : {
                     ...interactiveCommonProps,
                     xAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.xAnnotation,
                     yAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.yAnnotation
@@ -359,7 +374,15 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef(({ colorwayType = 'defa
                 ], {
                     ...resolvedCommonProps,
                     xAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.xAnnotation,
-                    yAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.yAnnotation
+                    yAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.yAnnotation,
+                    componentRef: (ref)=>{
+                        var _cellProperties_row, _cellProperties_column;
+                        chartRefs.current[chartIdx] = {
+                            compRef: ref,
+                            row: (_cellProperties_row = cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.row) !== null && _cellProperties_row !== void 0 ? _cellProperties_row : 1,
+                            col: (_cellProperties_column = cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.column) !== null && _cellProperties_column !== void 0 ? _cellProperties_column : 1
+                        };
+                    }
                 }, (_cellProperties_row = cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.row) !== null && _cellProperties_row !== void 0 ? _cellProperties_row : 1, (_cellProperties_column = cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.column) !== null && _cellProperties_column !== void 0 ? _cellProperties_column : 1);
             }
             return /*#__PURE__*/ _react.createElement(_react.Fragment, null);

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DeclarativeChart/DeclarativeChart.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { Data, PlotData, PlotlySchema, OutputChartType, TraceInfo } from '@fluentui/chart-utilities';\nimport {\n  decodeBase64Fields,\n  isArrayOrTypedArray,\n  isMonthArray,\n  mapFluentChart,\n  sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport type { GridProperties } from './PlotlySchemaAdapter';\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  correctYearMonth,\n  getGridProperties,\n  isNonPlotType,\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  NON_PLOT_KEY_PREFIX,\n  SINGLE_REPEAT,\n  transformPlotlyJsonToFunnelChartProps,\n  transformPlotlyJsonToGanttChartProps,\n  transformPlotlyJsonToAnnotationChartProps,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { AnnotationOnlyChart } from '../AnnotationOnlyChart/AnnotationOnlyChart';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\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 { Chart, ImageExportOptions } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\nimport { FunnelChart } from '../FunnelChart/FunnelChart';\nimport { GanttChart } from '../GanttChart/index';\n\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ChartTable } from '../ChartTable/index';\nimport { LegendsProps, Legends } from '../Legends/index';\nimport { JSXElement } from '@fluentui/react-utilities/src/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);\nconst ResponsiveGanttChart = withResponsiveContainer(GanttChart);\n// Removing responsive wrapper for FunnelChart as responsive container is not working with FunnelChart\n//const ResponsiveFunnelChart = withResponsiveContainer(FunnelChart);\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';\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 | null>;\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?: ImageExportOptions) => 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): JSXElement {\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  annotation: {\n    transformer: typeof transformPlotlyJsonToAnnotationChartProps;\n    renderer: typeof AnnotationOnlyChart;\n  } & PreTransformHooks;\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  gantt: {\n    transformer: typeof transformPlotlyJsonToGanttChartProps;\n    renderer: typeof ResponsiveGanttChart;\n  } & PreTransformHooks;\n  funnel: {\n    transformer: typeof transformPlotlyJsonToFunnelChartProps;\n    renderer: typeof FunnelChart;\n  } & PreTransformHooks;\n  fallback: {\n    transformer: typeof transformPlotlyJsonToVSBCProps;\n    renderer: typeof ResponsiveVerticalStackedBarChart;\n  } & PreTransformHooks;\n};\n\nconst chartMap: ChartTypeMap = {\n  annotation: {\n    transformer: transformPlotlyJsonToAnnotationChartProps,\n    renderer: AnnotationOnlyChart,\n  },\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  gantt: {\n    transformer: transformPlotlyJsonToGanttChartProps,\n    renderer: ResponsiveGanttChart,\n  },\n  funnel: {\n    transformer: transformPlotlyJsonToFunnelChartProps,\n    renderer: FunnelChart,\n  },\n  fallback: {\n    transformer: transformPlotlyJsonToVSBCProps,\n    renderer: ResponsiveVerticalStackedBarChart,\n  },\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>(({ colorwayType = 'default', ...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.index]),\n  };\n\n  const validTracesFilteredIndex: TraceInfo[] = chart.validTracesInfo!.map((trace, index) => ({\n    index,\n    type: trace.type,\n  }));\n\n  let { selectedLegends } = plotlySchema;\n  const colorMap = useColorMapping();\n  const isDarkTheme = useIsDarkTheme();\n  const chartRef = React.useRef<Chart>(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 baseCommonProps = {\n    componentRef: chartRef,\n  };\n\n  const interactiveCommonProps = {\n    ...baseCommonProps,\n    legendProps: multiSelectLegendProps,\n  };\n\n  function createLegends(legendProps: LegendsProps): JSXElement {\n    // eslint-disable-next-line react/jsx-no-bind\n    return <Legends {...legendProps} selectedLegends={activeLegends} onChange={onActiveLegendsChange} />;\n  }\n\n  // TODO\n  const exportAsImage = React.useCallback((opts?: ImageExportOptions): 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: tokens.colorNeutralBackground1,\n          scale: 5,\n          ...opts,\n        })\n        .then(resolve)\n        .catch(reject);\n    });\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    plotlyInputWithValidData.layout = cartesianProjection.layout;\n    validTracesFilteredIndex.forEach((trace, index) => {\n      if (trace.type === 'scatterpolar') {\n        const mode = (plotlyInputWithValidData.data[index] as PlotData)?.mode ?? '';\n        if (mode.includes('line')) {\n          validTracesFilteredIndex[index].type = 'line';\n        } else if (mode.includes('markers') || mode === 'text') {\n          validTracesFilteredIndex[index].type = 'scatter';\n        } else {\n          validTracesFilteredIndex[index].type = 'line';\n        }\n      }\n    });\n  }\n  const groupedTraces: Record<string, number[]> = {};\n  let nonCartesianTraceCount = 0;\n\n  // For annotation-only charts, create a single group entry\n  if (chart.type === 'annotation') {\n    groupedTraces[DEFAULT_XAXIS] = [];\n  } else {\n    plotlyInputWithValidData.data.forEach((trace: Data, index: number) => {\n      let traceKey = '';\n      if (isNonPlotType(chart.validTracesInfo![index].type)) {\n        traceKey = `${NON_PLOT_KEY_PREFIX}${nonCartesianTraceCount + 1}`;\n        nonCartesianTraceCount++;\n      } else {\n        traceKey = (trace as PlotData).xaxis ?? DEFAULT_XAXIS;\n      }\n      if (!groupedTraces[traceKey]) {\n        groupedTraces[traceKey] = [];\n      }\n      groupedTraces[traceKey].push(index);\n    });\n  }\n\n  isMultiPlot.current = Object.keys(groupedTraces).length > 1;\n  const gridProperties: GridProperties = getGridProperties(\n    plotlyInputWithValidData,\n    isMultiPlot.current,\n    chart.validTracesInfo!,\n  );\n\n  // Render only one plot if the grid properties cannot determine positioning of multiple plots.\n  if (\n    isMultiPlot.current &&\n    gridProperties.templateRows === SINGLE_REPEAT &&\n    gridProperties.templateColumns === SINGLE_REPEAT\n  ) {\n    if (chart.type === 'donut') {\n      // If there are multiple data traces for donut/pie, picking the last one similar to plotly\n      const keys = Object.keys(groupedTraces);\n      keys.forEach((key, index) => {\n        if (index < keys.length - 1) {\n          delete groupedTraces[key];\n        }\n      });\n    } else {\n      Object.keys(groupedTraces).forEach((key, index) => {\n        if (index > 0) {\n          delete groupedTraces[key];\n        }\n      });\n    }\n    isMultiPlot.current = false;\n  }\n\n  const allupLegendsProps = getAllupLegendsProps(\n    plotlyInputWithValidData,\n    colorMap,\n    colorwayType,\n    chart.validTracesInfo!,\n    isDarkTheme,\n  );\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.index));\n          let chartType =\n            chart.type === 'fallback' || chart.type === 'groupedverticalbar'\n              ? chart.type\n              : filteredTracesInfo[0]?.type ?? chart.type;\n\n          if (\n            validTracesFilteredIndex.some(trace => trace.type === 'line') &&\n            validTracesFilteredIndex.some(trace => trace.type === '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              const resolvedCommonProps = (\n                chartType === 'annotation'\n                  ? baseCommonProps\n                  : {\n                      ...interactiveCommonProps,\n                      xAxisAnnotation: cellProperties?.xAnnotation,\n                      yAxisAnnotation: cellProperties?.yAnnotation,\n                    }\n              ) as Partial<ReturnType<typeof transformer>>;\n\n              return renderChart<ReturnType<typeof transformer>>(\n                renderer,\n                transformer,\n                [transformedInput, isMultiPlot.current, colorMap, colorwayType, isDarkTheme],\n                {\n                  ...resolvedCommonProps,\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';\n"],"names":["React","decodeBase64Fields","isArrayOrTypedArray","isMonthArray","mapFluentChart","sanitizeJson","tokens","ThemeContext_unstable","V9ThemeContext","webLightTheme","d3Color","correctYearMonth","getGridProperties","isNonPlotType","transformPlotlyJsonToDonutProps","transformPlotlyJsonToVSBCProps","transformPlotlyJsonToAreaChartProps","transformPlotlyJsonToLineChartProps","transformPlotlyJsonToHorizontalBarWithAxisProps","transformPlotlyJsonToHeatmapProps","transformPlotlyJsonToSankeyProps","transformPlotlyJsonToGaugeProps","transformPlotlyJsonToGVBCProps","transformPlotlyJsonToVBCProps","transformPlotlyJsonToChartTableProps","transformPlotlyJsonToScatterChartProps","projectPolarToCartesian","getAllupLegendsProps","NON_PLOT_KEY_PREFIX","SINGLE_REPEAT","transformPlotlyJsonToFunnelChartProps","transformPlotlyJsonToGanttChartProps","transformPlotlyJsonToAnnotationChartProps","AnnotationOnlyChart","DonutChart","VerticalStackedBarChart","LineChart","HorizontalBarChartWithAxis","AreaChart","HeatMapChart","SankeyChart","GaugeChart","GroupedVerticalBarChart","VerticalBarChart","ScatterChart","FunnelChart","GanttChart","withResponsiveContainer","ChartTable","Legends","ResponsiveDonutChart","ResponsiveVerticalStackedBarChart","ResponsiveLineChart","ResponsiveHorizontalBarChartWithAxis","ResponsiveAreaChart","ResponsiveHeatMapChart","ResponsiveSankeyChart","ResponsiveGaugeChart","ResponsiveGroupedVerticalBarChart","ResponsiveVerticalBarChart","ResponsiveScatterChart","ResponsiveChartTable","ResponsiveGanttChart","DEFAULT_XAXIS","useColorMapping","colorMap","useRef","Map","renderChart","Renderer","transformer","transformerArgs","commonProps","cellRow","cellColumn","chartProps","div","key","style","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","LineAreaPreTransformOp","plotlyInput","xValues","data","x","isXMonth","renderData","map","dataPoint","layout","chartMap","annotation","renderer","donut","sankey","table","horizontalbar","groupedverticalbar","verticalstackedbar","heatmap","gauge","verticalbar","area","preTransformOperation","line","scatter","gantt","funnel","fallback","useIsDarkTheme","parentV9Theme","useContext","v9Theme","backgroundColor","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","DeclarativeChart","forwardRef","colorwayType","props","forwardedRef","plotlySchema","chartSchema","chart","isValid","Error","errorMessage","error","plotlyInputWithValidData","validTracesInfo","trace","index","validTracesFilteredIndex","type","selectedLegends","chartRef","isMultiPlot","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","baseCommonProps","componentRef","interactiveCommonProps","legendProps","createLegends","exportAsImage","useCallback","opts","Promise","resolve","reject","current","toImage","background","scale","then","catch","useImperativeHandle","cartesianProjection","forEach","mode","includes","groupedTraces","nonCartesianTraceCount","traceKey","xaxis","push","Object","length","gridProperties","templateRows","templateColumns","allupLegendsProps","display","gridTemplateRows","gridTemplateColumns","entries","xAxisKey","filteredTracesInfo","plotlyInputForGroup","idx","filter","chartType","some","chartEntry","preTransformCondition","undefined","transformedInput","cellProperties","resolvedCommonProps","xAxisAnnotation","xAnnotation","yAxisAnnotation","yAnnotation","row","column","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/DeclarativeChart/DeclarativeChart.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { Data, PlotData, PlotlySchema, OutputChartType, TraceInfo } from '@fluentui/chart-utilities';\nimport {\n  decodeBase64Fields,\n  isArrayOrTypedArray,\n  isMonthArray,\n  mapFluentChart,\n  sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport type { GridProperties } from './PlotlySchemaAdapter';\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  correctYearMonth,\n  getGridProperties,\n  isNonPlotType,\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  NON_PLOT_KEY_PREFIX,\n  SINGLE_REPEAT,\n  transformPlotlyJsonToFunnelChartProps,\n  transformPlotlyJsonToGanttChartProps,\n  transformPlotlyJsonToAnnotationChartProps,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { AnnotationOnlyChart } from '../AnnotationOnlyChart/AnnotationOnlyChart';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\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 { Chart, ImageExportOptions } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\nimport { FunnelChart } from '../FunnelChart/FunnelChart';\nimport { GanttChart } from '../GanttChart/index';\n\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ChartTable } from '../ChartTable/index';\nimport { LegendsProps, Legends, LegendContainer } from '../Legends/index';\nimport { JSXElement } from '@fluentui/react-utilities/src/index';\nimport { resolveCSSVariables, useRtl } from '../../utilities/index';\nimport { exportChartsAsImage } from '../../utilities/image-export-utils';\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);\nconst ResponsiveGanttChart = withResponsiveContainer(GanttChart);\n// Removing responsive wrapper for FunnelChart as responsive container is not working with FunnelChart\n//const ResponsiveFunnelChart = withResponsiveContainer(FunnelChart);\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';\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.Ref<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?: ImageExportOptions) => 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): JSXElement {\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  annotation: {\n    transformer: typeof transformPlotlyJsonToAnnotationChartProps;\n    renderer: typeof AnnotationOnlyChart;\n  } & PreTransformHooks;\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  gantt: {\n    transformer: typeof transformPlotlyJsonToGanttChartProps;\n    renderer: typeof ResponsiveGanttChart;\n  } & PreTransformHooks;\n  funnel: {\n    transformer: typeof transformPlotlyJsonToFunnelChartProps;\n    renderer: typeof FunnelChart;\n  } & PreTransformHooks;\n  fallback: {\n    transformer: typeof transformPlotlyJsonToVSBCProps;\n    renderer: typeof ResponsiveVerticalStackedBarChart;\n  } & PreTransformHooks;\n};\n\nconst chartMap: ChartTypeMap = {\n  annotation: {\n    transformer: transformPlotlyJsonToAnnotationChartProps,\n    renderer: AnnotationOnlyChart,\n  },\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  gantt: {\n    transformer: transformPlotlyJsonToGanttChartProps,\n    renderer: ResponsiveGanttChart,\n  },\n  funnel: {\n    transformer: transformPlotlyJsonToFunnelChartProps,\n    renderer: FunnelChart,\n  },\n  fallback: {\n    transformer: transformPlotlyJsonToVSBCProps,\n    renderer: ResponsiveVerticalStackedBarChart,\n  },\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>(({ colorwayType = 'default', ...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.index]),\n  };\n\n  const validTracesFilteredIndex: TraceInfo[] = chart.validTracesInfo!.map((trace, index) => ({\n    index,\n    type: trace.type,\n  }));\n\n  let { selectedLegends } = plotlySchema;\n  const colorMap = useColorMapping();\n  const isDarkTheme = useIsDarkTheme();\n  const chartRefs = React.useRef<{ compRef: Chart | null; row: number; col: number }[]>([]);\n  const isMultiPlot = React.useRef(false);\n  const legendsRef = React.useRef<LegendContainer>(null);\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const isRTL = useRtl();\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 interactiveCommonProps = {\n    legendProps: multiSelectLegendProps,\n  };\n\n  function createLegends(legendProps: LegendsProps): JSXElement {\n    // eslint-disable-next-line react/jsx-no-bind\n    return (\n      <Legends\n        {...legendProps}\n        selectedLegends={activeLegends}\n        onChange={onActiveLegendsChange}\n        legendRef={legendsRef}\n      />\n    );\n  }\n\n  const exportAsImage = React.useCallback(\n    async (opts?: ImageExportOptions) => {\n      if (!containerRef.current) {\n        throw new Error('Container reference is null');\n      }\n\n      const imgExpOpts = {\n        background: resolveCSSVariables(containerRef.current, tokens.colorNeutralBackground1),\n        scale: 5,\n        ...opts,\n      };\n\n      if (!isMultiPlot.current) {\n        if (!chartRefs.current[0]?.compRef?.toImage) {\n          throw new Error('Chart cannot be exported as image');\n        }\n\n        return chartRefs.current[0].compRef.toImage(imgExpOpts);\n      }\n\n      return exportChartsAsImage(\n        chartRefs.current.map(item => ({\n          container: item.compRef?.chartContainer,\n          row: item.row,\n          col: item.col,\n        })),\n        legendsRef.current?.toSVG,\n        isRTL,\n        imgExpOpts,\n      );\n    },\n    [isRTL],\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    plotlyInputWithValidData.layout = cartesianProjection.layout;\n    validTracesFilteredIndex.forEach((trace, index) => {\n      if (trace.type === 'scatterpolar') {\n        const mode = (plotlyInputWithValidData.data[index] as PlotData)?.mode ?? '';\n        if (mode.includes('line')) {\n          validTracesFilteredIndex[index].type = 'line';\n        } else if (mode.includes('markers') || mode === 'text') {\n          validTracesFilteredIndex[index].type = 'scatter';\n        } else {\n          validTracesFilteredIndex[index].type = 'line';\n        }\n      }\n    });\n  }\n  const groupedTraces: Record<string, number[]> = {};\n  let nonCartesianTraceCount = 0;\n\n  // For annotation-only charts, create a single group entry\n  if (chart.type === 'annotation') {\n    groupedTraces[DEFAULT_XAXIS] = [];\n  } else {\n    plotlyInputWithValidData.data.forEach((trace: Data, index: number) => {\n      let traceKey = '';\n      if (isNonPlotType(chart.validTracesInfo![index].type)) {\n        traceKey = `${NON_PLOT_KEY_PREFIX}${nonCartesianTraceCount + 1}`;\n        nonCartesianTraceCount++;\n      } else {\n        traceKey = (trace as PlotData).xaxis ?? DEFAULT_XAXIS;\n      }\n      if (!groupedTraces[traceKey]) {\n        groupedTraces[traceKey] = [];\n      }\n      groupedTraces[traceKey].push(index);\n    });\n  }\n\n  isMultiPlot.current = Object.keys(groupedTraces).length > 1;\n  const gridProperties: GridProperties = getGridProperties(\n    plotlyInputWithValidData,\n    isMultiPlot.current,\n    chart.validTracesInfo!,\n  );\n\n  // Render only one plot if the grid properties cannot determine positioning of multiple plots.\n  if (\n    isMultiPlot.current &&\n    gridProperties.templateRows === SINGLE_REPEAT &&\n    gridProperties.templateColumns === SINGLE_REPEAT\n  ) {\n    if (chart.type === 'donut') {\n      // If there are multiple data traces for donut/pie, picking the last one similar to plotly\n      const keys = Object.keys(groupedTraces);\n      keys.forEach((key, index) => {\n        if (index < keys.length - 1) {\n          delete groupedTraces[key];\n        }\n      });\n    } else {\n      Object.keys(groupedTraces).forEach((key, index) => {\n        if (index > 0) {\n          delete groupedTraces[key];\n        }\n      });\n    }\n    isMultiPlot.current = false;\n  }\n\n  const allupLegendsProps = getAllupLegendsProps(\n    plotlyInputWithValidData,\n    colorMap,\n    colorwayType,\n    chart.validTracesInfo!,\n    isDarkTheme,\n  );\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        ref={containerRef}\n      >\n        {Object.entries(groupedTraces).map(([xAxisKey, index], chartIdx) => {\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.index));\n          let chartType =\n            chart.type === 'fallback' || chart.type === 'groupedverticalbar'\n              ? chart.type\n              : filteredTracesInfo[0]?.type ?? chart.type;\n\n          if (\n            validTracesFilteredIndex.some(trace => trace.type === 'line') &&\n            validTracesFilteredIndex.some(trace => trace.type === '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              const resolvedCommonProps = (\n                chartType === 'annotation'\n                  ? {}\n                  : {\n                      ...interactiveCommonProps,\n                      xAxisAnnotation: cellProperties?.xAnnotation,\n                      yAxisAnnotation: cellProperties?.yAnnotation,\n                    }\n              ) as Partial<ReturnType<typeof transformer>>;\n\n              return renderChart<ReturnType<typeof transformer>>(\n                renderer,\n                transformer,\n                [transformedInput, isMultiPlot.current, colorMap, colorwayType, isDarkTheme],\n                {\n                  ...resolvedCommonProps,\n                  xAxisAnnotation: cellProperties?.xAnnotation,\n                  yAxisAnnotation: cellProperties?.yAnnotation,\n                  componentRef: (ref: Chart | null) => {\n                    chartRefs.current[chartIdx] = {\n                      compRef: ref,\n                      row: cellProperties?.row ?? 1,\n                      col: cellProperties?.column ?? 1,\n                    };\n                  },\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';\n"],"names":["React","decodeBase64Fields","isArrayOrTypedArray","isMonthArray","mapFluentChart","sanitizeJson","tokens","ThemeContext_unstable","V9ThemeContext","webLightTheme","d3Color","correctYearMonth","getGridProperties","isNonPlotType","transformPlotlyJsonToDonutProps","transformPlotlyJsonToVSBCProps","transformPlotlyJsonToAreaChartProps","transformPlotlyJsonToLineChartProps","transformPlotlyJsonToHorizontalBarWithAxisProps","transformPlotlyJsonToHeatmapProps","transformPlotlyJsonToSankeyProps","transformPlotlyJsonToGaugeProps","transformPlotlyJsonToGVBCProps","transformPlotlyJsonToVBCProps","transformPlotlyJsonToChartTableProps","transformPlotlyJsonToScatterChartProps","projectPolarToCartesian","getAllupLegendsProps","NON_PLOT_KEY_PREFIX","SINGLE_REPEAT","transformPlotlyJsonToFunnelChartProps","transformPlotlyJsonToGanttChartProps","transformPlotlyJsonToAnnotationChartProps","AnnotationOnlyChart","DonutChart","VerticalStackedBarChart","LineChart","HorizontalBarChartWithAxis","AreaChart","HeatMapChart","SankeyChart","GaugeChart","GroupedVerticalBarChart","VerticalBarChart","ScatterChart","FunnelChart","GanttChart","withResponsiveContainer","ChartTable","Legends","resolveCSSVariables","useRtl","exportChartsAsImage","ResponsiveDonutChart","ResponsiveVerticalStackedBarChart","ResponsiveLineChart","ResponsiveHorizontalBarChartWithAxis","ResponsiveAreaChart","ResponsiveHeatMapChart","ResponsiveSankeyChart","ResponsiveGaugeChart","ResponsiveGroupedVerticalBarChart","ResponsiveVerticalBarChart","ResponsiveScatterChart","ResponsiveChartTable","ResponsiveGanttChart","DEFAULT_XAXIS","useColorMapping","colorMap","useRef","Map","renderChart","Renderer","transformer","transformerArgs","commonProps","cellRow","cellColumn","chartProps","div","key","style","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","LineAreaPreTransformOp","plotlyInput","xValues","data","x","isXMonth","renderData","map","dataPoint","layout","chartMap","annotation","renderer","donut","sankey","table","horizontalbar","groupedverticalbar","verticalstackedbar","heatmap","gauge","verticalbar","area","preTransformOperation","line","scatter","gantt","funnel","fallback","useIsDarkTheme","parentV9Theme","useContext","v9Theme","backgroundColor","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","DeclarativeChart","forwardRef","colorwayType","props","forwardedRef","plotlySchema","chartSchema","chart","isValid","Error","errorMessage","error","plotlyInputWithValidData","validTracesInfo","trace","index","validTracesFilteredIndex","type","selectedLegends","chartRefs","isMultiPlot","legendsRef","containerRef","isRTL","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","interactiveCommonProps","legendProps","createLegends","legendRef","exportAsImage","useCallback","opts","current","imgExpOpts","background","scale","compRef","toImage","item","container","chartContainer","row","col","toSVG","useImperativeHandle","componentRef","cartesianProjection","forEach","mode","includes","groupedTraces","nonCartesianTraceCount","traceKey","xaxis","push","Object","length","gridProperties","templateRows","templateColumns","allupLegendsProps","display","gridTemplateRows","gridTemplateColumns","ref","entries","xAxisKey","chartIdx","filteredTracesInfo","plotlyInputForGroup","idx","filter","chartType","some","chartEntry","preTransformCondition","undefined","transformedInput","cellProperties","resolvedCommonProps","xAxisAnnotation","xAnnotation","yAxisAnnotation","yAnnotation","column","displayName"],"mappings":"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"}

package/lib-commonjs/components/DonutChart/DonutChart.js

@@ -19,7 +19,7 @@ const _index2 = require("../../index");
 const _reactutilities = require("@fluentui/react-utilities");
 const _reacttabster = require("@fluentui/react-tabster");
 const _ChartPopover = require("../CommonComponents/ChartPopover");
-const _imageexportutils = require("../../utilities/image-export-utils");
+const _hooks = require("../../utilities/hooks");
 const MIN_LEGEND_CONTAINER_HEIGHT = 40;
 const DonutChart = /*#__PURE__*/ _react.forwardRef(({ innerRadius = 0, hideLabels = true, ...restProps }, forwardedRef)=>{
     var _props_legendProps;
@@ -28,7 +28,7 @@ const DonutChart = /*#__PURE__*/ _react.forwardRef(({ innerRadius = 0, hideLabel
         hideLabels,
         ...restProps
     };
-    const _rootElem = _react.useRef(null);
+    const { chartContainerRef: _rootElem, legendsRef: _legendsRef } = (0, _hooks.useImageExport)(props.componentRef, props.hideLegend, false);
     const _uniqText = (0, _reactutilities.useId)('_Pie_');
     /* eslint-disable @typescript-eslint/no-explicit-any */ let _calloutAnchorPoint;
     let _emptyChartId;
@@ -48,8 +48,6 @@ const DonutChart = /*#__PURE__*/ _react.forwardRef(({ innerRadius = 0, hideLabel
     const [refSelected, setRefSelected] = _react.useState(null);
     const [isPopoverOpen, setPopoverOpen] = _react.useState(false);
     const prevPropsRef = _react.useRef(null);
-    const _legendsRef = _react.useRef(null);
-    const _isRTL = (0, _index1.useRtl)();
     _react.useEffect(()=>{
         _fitParentContainer();
     }, []);
@@ -76,13 +74,6 @@ const DonutChart = /*#__PURE__*/ _react.forwardRef(({ innerRadius = 0, hideLabel
         props.width,
         props.height
     ]);
-    _react.useImperativeHandle(props.componentRef, ()=>({
-            chartContainer: _rootElem.current,
-            toImage: (opts)=>{
-                var _legendsRef_current;
-                return (0, _imageexportutils.toImage)(_rootElem.current, (_legendsRef_current = _legendsRef.current) === null || _legendsRef_current === void 0 ? void 0 : _legendsRef_current.toSVG, _isRTL, opts);
-            }
-        }), []);
     function _elevateToMinimums(data) {
         let sumOfData = 0;
         const minPercent = 0.01;

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DonutChart/DonutChart.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable react/jsx-no-bind */\nimport * as React from 'react';\nimport { Pie } from './Pie/index';\nimport { DonutChartProps } from './DonutChart.types';\nimport { useDonutChartStyles } from './useDonutChartStyles.styles';\nimport { ChartDataPoint } from '../../DonutChart';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { areArraysEqual, getColorFromToken, getNextColor, MIN_DONUT_RADIUS, useRtl } from '../../utilities/index';\nimport { Legend, Legends, LegendContainer } from '../../index';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { ImageExportOptions } from '../../types/index';\nimport { toImage } from '../../utilities/image-export-utils';\n\nconst MIN_LEGEND_CONTAINER_HEIGHT = 40;\n\n// Create a DonutChart variant which uses these default styles and this styled subcomponent.\n/**\n * Donutchart component.\n * {@docCategory DonutChart}\n */\nexport const DonutChart: React.FunctionComponent<DonutChartProps> = React.forwardRef<HTMLDivElement, DonutChartProps>(\n  ({ innerRadius = 0, hideLabels = true, ...restProps }, forwardedRef) => {\n    const props = { innerRadius, hideLabels, ...restProps };\n    const _rootElem = React.useRef<HTMLDivElement | null>(null);\n    const _uniqText: string = useId('_Pie_');\n    /* eslint-disable @typescript-eslint/no-explicit-any */\n    let _calloutAnchorPoint: ChartDataPoint | null;\n    let _emptyChartId: string | null;\n    const legendContainer = React.useRef<HTMLDivElement | null>(null);\n    const prevSize = React.useRef<{ width?: number; height?: number }>({});\n\n    const [value, setValue] = React.useState<string | undefined>('');\n    const [legend, setLegend] = React.useState<string | undefined>('');\n    const [_width, setWidth] = React.useState<number | undefined>(props.width || 200);\n    const [_height, setHeight] = React.useState<number | undefined>(props.height || 200);\n    const [activeLegend, setActiveLegend] = React.useState<string | undefined>(undefined);\n    const [color, setColor] = React.useState<string | undefined>('');\n    const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n    const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n    const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n    const [focusedArcId, setFocusedArcId] = React.useState<string>('');\n    const [dataPointCalloutProps, setDataPointCalloutProps] = React.useState<ChartDataPoint | undefined>();\n    const [refSelected, setRefSelected] = React.useState<HTMLElement | null>(null);\n    const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n    const prevPropsRef = React.useRef<DonutChartProps | null>(null);\n    const _legendsRef = React.useRef<LegendContainer>(null);\n    const _isRTL: boolean = useRtl();\n\n    React.useEffect(() => {\n      _fitParentContainer();\n    }, []);\n\n    React.useEffect(() => {\n      if (prevPropsRef.current) {\n        const prevProps = prevPropsRef.current;\n        if (!areArraysEqual(prevProps.legendProps?.selectedLegends, props.legendProps?.selectedLegends)) {\n          setSelectedLegends(props.legendProps?.selectedLegends || []);\n        }\n      }\n      prevPropsRef.current = props;\n    }, [props]);\n\n    React.useEffect(() => {\n      if (prevSize.current.height !== props.height || prevSize.current.width !== props.width) {\n        _fitParentContainer();\n      }\n      prevSize.current.height = props.height;\n      prevSize.current.width = props.width;\n    }, [props.width, props.height]);\n\n    React.useImperativeHandle(\n      props.componentRef,\n      () => ({\n        chartContainer: _rootElem.current,\n        toImage: (opts?: ImageExportOptions): Promise<string> => {\n          return toImage(_rootElem.current, _legendsRef.current?.toSVG, _isRTL, opts);\n        },\n      }),\n      [],\n    );\n\n    function _elevateToMinimums(data: ChartDataPoint[]) {\n      let sumOfData = 0;\n      const minPercent = 0.01;\n      const elevatedData: ChartDataPoint[] = [];\n      data.forEach(item => {\n        sumOfData += item.data!;\n      });\n      data.forEach(item => {\n        elevatedData.push(\n          minPercent * sumOfData > item.data! && item.data! > 0\n            ? {\n                ...item,\n                data: minPercent * sumOfData,\n                yAxisCalloutData:\n                  item.yAxisCalloutData === undefined ? item.data!.toLocaleString() : item.yAxisCalloutData,\n              }\n            : item,\n        );\n      });\n      return elevatedData;\n    }\n    function _createLegends(chartData: ChartDataPoint[]): JSXElement {\n      if (props.order === 'sorted') {\n        chartData.sort((a: ChartDataPoint, b: ChartDataPoint) => {\n          return b.data! - a.data!;\n        });\n      }\n      const legendDataItems = chartData.map((point: ChartDataPoint, index: number) => {\n        const color: string = point.color!;\n        // mapping data to the format Legends component needs\n        const legend: Legend = {\n          title: point.legend!,\n          color,\n          hoverAction: () => {\n            _handleChartMouseLeave();\n            setActiveLegend(point.legend!);\n          },\n          onMouseOutAction: () => {\n            setActiveLegend(undefined);\n          },\n        };\n        return legend;\n      });\n      const legends = (\n        <Legends\n          legends={legendDataItems}\n          centerLegends\n          overflowText={props.legendsOverflowText}\n          {...props.legendProps}\n          // eslint-disable-next-line react/jsx-no-bind\n          onChange={_onLegendSelectionChange}\n          legendRef={_legendsRef}\n        />\n      );\n      return legends;\n    }\n    function _onLegendSelectionChange(\n      selectedLegends: string[],\n      event: React.MouseEvent<HTMLButtonElement>,\n      currentLegend?: Legend,\n    ): void {\n      if (props.legendProps && props.legendProps?.canSelectMultipleLegends) {\n        setSelectedLegends(selectedLegends);\n      } else {\n        setSelectedLegends(selectedLegends.slice(-1));\n      }\n      if (props.legendProps?.onChange) {\n        props.legendProps.onChange(selectedLegends, event, currentLegend);\n      }\n    }\n\n    function _focusCallback(\n      data: ChartDataPoint,\n      id: string,\n      e: React.FocusEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      setPopoverOpen(_noLegendsHighlighted() || _isLegendHighlighted(data.legend));\n      setValue(data.data!.toString());\n      setLegend(data.legend);\n      setColor(data.color!);\n      setXCalloutValue(data.xAxisCalloutData!);\n      setYCalloutValue(data.yAxisCalloutData!);\n      setFocusedArcId(id);\n      setDataPointCalloutProps(data);\n      setRefSelected(targetElement!);\n    }\n\n    function _hoverCallback(\n      data: ChartDataPoint,\n      e: React.MouseEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      if (_calloutAnchorPoint !== data) {\n        _calloutAnchorPoint = data;\n        setPopoverOpen(_noLegendsHighlighted() || _isLegendHighlighted(data.legend));\n        setValue(data.data!.toString());\n        setLegend(data.legend);\n        setColor(data.color!);\n        setXCalloutValue(data.xAxisCalloutData!);\n        setYCalloutValue(data.yAxisCalloutData!);\n        setDataPointCalloutProps(data);\n        setRefSelected(targetElement!);\n      }\n    }\n    function _onBlur(): void {\n      setFocusedArcId('');\n    }\n\n    function _hoverLeave(): void {\n      /**/\n    }\n\n    function _handleChartMouseLeave() {\n      _calloutAnchorPoint = null;\n      setPopoverOpen(false);\n    }\n\n    function _valueInsideDonut(valueInsideDonut: string | number | undefined, data: ChartDataPoint[]) {\n      const highlightedLegends = _getHighlightedLegend();\n      if (valueInsideDonut !== undefined && (highlightedLegends.length === 1 || isPopoverOpen)) {\n        const pointValue = data.find(point => _isLegendHighlighted(point.legend));\n        return pointValue\n          ? pointValue.yAxisCalloutData\n            ? pointValue.yAxisCalloutData\n            : pointValue.data!\n          : valueInsideDonut;\n      } else if (highlightedLegends.length > 0) {\n        let totalValue = 0;\n        data.forEach(point => {\n          if (highlightedLegends.includes(point.legend!)) {\n            totalValue += point.data!;\n          }\n        });\n        return totalValue;\n      } else {\n        return valueInsideDonut;\n      }\n    }\n\n    function _toLocaleString(data: string | number | undefined) {\n      const localeString = formatToLocaleString(data, props.culture);\n      if (!localeString) {\n        return data;\n      }\n      return localeString?.toString();\n    }\n\n    /**\n     * This function returns\n     * the selected legend if there is one\n     * or the hovered legend if none of the legends is selected.\n     */\n    function _getHighlightedLegend() {\n      return selectedLegends.length > 0 ? selectedLegends : activeLegend ? [activeLegend] : [];\n    }\n\n    function _isLegendHighlighted(legend: string | undefined): boolean {\n      return _getHighlightedLegend().includes(legend!);\n    }\n\n    function _noLegendsHighlighted(): boolean {\n      return _getHighlightedLegend().length === 0;\n    }\n\n    function _isChartEmpty(): boolean {\n      return !(\n        props.data &&\n        props.data.chartData &&\n        props.data.chartData!.filter((d: ChartDataPoint) => d.data! > 0).length > 0\n      );\n    }\n\n    function _addDefaultColors(donutChartDataPoint?: ChartDataPoint[]): ChartDataPoint[] {\n      return donutChartDataPoint\n        ? donutChartDataPoint.map((item, index) => {\n            let defaultColor: string;\n            if (typeof item.color === 'undefined') {\n              defaultColor = getNextColor(index, 0);\n            } else {\n              defaultColor = getColorFromToken(item.color);\n            }\n            return { ...item, defaultColor };\n          })\n        : [];\n    }\n\n    /**\n     * When screen resizes, along with screen, chart also auto adjusted.\n     * This method used to adjust height and width of the charts.\n     */\n    function _fitParentContainer(): void {\n      //_reqID = requestAnimationFrame(() => {\n      let legendContainerHeight;\n      if (props.hideLegend) {\n        // If there is no legend, need not to allocate some space from total chart space.\n        legendContainerHeight = 0;\n      } else {\n        const legendContainerComputedStyles = legendContainer.current && getComputedStyle(legendContainer.current);\n        legendContainerHeight =\n          ((legendContainer.current && legendContainer.current.getBoundingClientRect().height) ||\n            MIN_LEGEND_CONTAINER_HEIGHT) +\n          parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginTop) || '0') +\n          parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginBottom) || '0');\n      }\n      if (props.parentRef || _rootElem.current) {\n        const container = props.parentRef ? props.parentRef : _rootElem.current!;\n        const currentContainerWidth = container.getBoundingClientRect().width;\n        const currentContainerHeight =\n          container.getBoundingClientRect().height > legendContainerHeight\n            ? container.getBoundingClientRect().height\n            : 200;\n        const shouldResize =\n          _width !== currentContainerWidth || _height !== currentContainerHeight - legendContainerHeight;\n        if (shouldResize) {\n          setWidth(currentContainerWidth);\n          setHeight(currentContainerHeight - legendContainerHeight);\n        }\n      }\n      //});\n    }\n\n    const { data, hideLegend = false } = props;\n    const points = _addDefaultColors(data?.chartData);\n\n    const classes = useDonutChartStyles(props);\n\n    const legendBars = _createLegends(points.filter(d => d.data! >= 0));\n    const donutMarginHorizontal = props.hideLabels ? 0 : 80;\n    const donutMarginVertical = props.hideLabels ? 0 : 40;\n    const outerRadius = Math.min(_width! - donutMarginHorizontal, _height! - donutMarginVertical) / 2;\n    const chartData = _elevateToMinimums(points);\n    const valueInsideDonut =\n      props.innerRadius! > MIN_DONUT_RADIUS ? _valueInsideDonut(props.valueInsideDonut!, chartData!) : '';\n    const focusAttributes = useFocusableGroup();\n    return !_isChartEmpty() ? (\n      <div\n        className={classes.root}\n        ref={(rootElem: HTMLDivElement | null) => {\n          _rootElem.current = rootElem;\n        }}\n        onMouseLeave={_handleChartMouseLeave}\n      >\n        {props.xAxisAnnotation && (\n          <text className={classes.axisAnnotation} x={_width! / 2} y={_height! - 10} textAnchor=\"middle\">\n            {props.xAxisAnnotation}\n          </text>\n        )}\n        <div className={classes.chartWrapper} {...focusAttributes}>\n          <svg className={classes.chart} aria-label={data?.chartTitle} width={_width} height={_height}>\n            <Pie\n              width={_width!}\n              height={_height!}\n              outerRadius={outerRadius}\n              innerRadius={props.innerRadius!}\n              data={chartData!}\n              onFocusCallback={_focusCallback}\n              hoverOnCallback={_hoverCallback}\n              hoverLeaveCallback={_hoverLeave}\n              uniqText={_uniqText}\n              onBlurCallback={_onBlur}\n              activeArc={_getHighlightedLegend()}\n              focusedArcId={focusedArcId || ''}\n              href={props.href!}\n              valueInsideDonut={_toLocaleString(valueInsideDonut)}\n              showLabelsInPercent={props.showLabelsInPercent}\n              hideLabels={props.hideLabels}\n            />\n          </svg>\n        </div>\n        <ChartPopover\n          xCalloutValue={xCalloutValue}\n          yCalloutValue={yCalloutValue}\n          culture={props.culture}\n          positioning={{\n            target: refSelected,\n          }}\n          isPopoverOpen={\n            !props.hideTooltip && isPopoverOpen && (_noLegendsHighlighted() || _isLegendHighlighted(legend))\n          }\n          legend={legend!}\n          YValue={value!}\n          color={color}\n          isCalloutForStack={false}\n          customCallout={{\n            customizedCallout: props.onRenderCalloutPerDataPoint\n              ? props.onRenderCalloutPerDataPoint(dataPointCalloutProps!)\n              : undefined,\n            customCalloutProps: props.calloutPropsPerDataPoint\n              ? props.calloutPropsPerDataPoint(dataPointCalloutProps!)\n              : undefined,\n          }}\n          isCartesian={false}\n        />\n        {!hideLegend && (\n          <div\n            ref={(e: HTMLDivElement) => {\n              legendContainer.current = e;\n            }}\n            className={classes.legendContainer}\n          >\n            {legendBars}\n          </div>\n        )}\n      </div>\n    ) : (\n      <div id={_emptyChartId!} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n    );\n  },\n);\n\nDonutChart.displayName = 'DonutChart';\n"],"names":["React","Pie","useDonutChartStyles","formatToLocaleString","areArraysEqual","getColorFromToken","getNextColor","MIN_DONUT_RADIUS","useRtl","Legends","useId","useFocusableGroup","ChartPopover","toImage","MIN_LEGEND_CONTAINER_HEIGHT","DonutChart","forwardRef","innerRadius","hideLabels","restProps","forwardedRef","props","_rootElem","useRef","_uniqText","_calloutAnchorPoint","_emptyChartId","legendContainer","prevSize","value","setValue","useState","legend","setLegend","_width","setWidth","width","_height","setHeight","height","activeLegend","setActiveLegend","undefined","color","setColor","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","selectedLegends","setSelectedLegends","legendProps","focusedArcId","setFocusedArcId","dataPointCalloutProps","setDataPointCalloutProps","refSelected","setRefSelected","isPopoverOpen","setPopoverOpen","prevPropsRef","_legendsRef","_isRTL","useEffect","_fitParentContainer","current","prevProps","useImperativeHandle","componentRef","chartContainer","opts","toSVG","_elevateToMinimums","data","sumOfData","minPercent","elevatedData","forEach","item","push","yAxisCalloutData","toLocaleString","_createLegends","chartData","order","sort","a","b","legendDataItems","map","point","index","title","hoverAction","_handleChartMouseLeave","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","onChange","_onLegendSelectionChange","legendRef","event","currentLegend","canSelectMultipleLegends","slice","_focusCallback","id","e","targetElement","_noLegendsHighlighted","_isLegendHighlighted","toString","xAxisCalloutData","_hoverCallback","_onBlur","_hoverLeave","_valueInsideDonut","valueInsideDonut","highlightedLegends","_getHighlightedLegend","length","pointValue","find","totalValue","includes","_toLocaleString","localeString","culture","_isChartEmpty","filter","d","_addDefaultColors","donutChartDataPoint","defaultColor","legendContainerHeight","hideLegend","legendContainerComputedStyles","getComputedStyle","getBoundingClientRect","parseFloat","marginTop","marginBottom","parentRef","container","currentContainerWidth","currentContainerHeight","shouldResize","points","classes","legendBars","donutMarginHorizontal","donutMarginVertical","outerRadius","Math","min","focusAttributes","div","className","root","ref","rootElem","onMouseLeave","xAxisAnnotation","text","axisAnnotation","x","y","textAnchor","chartWrapper","svg","chart","aria-label","chartTitle","onFocusCallback","hoverOnCallback","hoverLeaveCallback","uniqText","onBlurCallback","activeArc","href","showLabelsInPercent","positioning","target","hideTooltip","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerDataPoint","customCalloutProps","calloutPropsPerDataPoint","isCartesian","role","style","opacity","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/DonutChart/DonutChart.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable react/jsx-no-bind */\nimport * as React from 'react';\nimport { Pie } from './Pie/index';\nimport { DonutChartProps } from './DonutChart.types';\nimport { useDonutChartStyles } from './useDonutChartStyles.styles';\nimport { ChartDataPoint } from '../../DonutChart';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { areArraysEqual, getColorFromToken, getNextColor, MIN_DONUT_RADIUS } from '../../utilities/index';\nimport { Legend, Legends } from '../../index';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { useImageExport } from '../../utilities/hooks';\n\nconst MIN_LEGEND_CONTAINER_HEIGHT = 40;\n\n// Create a DonutChart variant which uses these default styles and this styled subcomponent.\n/**\n * Donutchart component.\n * {@docCategory DonutChart}\n */\nexport const DonutChart: React.FunctionComponent<DonutChartProps> = React.forwardRef<HTMLDivElement, DonutChartProps>(\n  ({ innerRadius = 0, hideLabels = true, ...restProps }, forwardedRef) => {\n    const props = { innerRadius, hideLabels, ...restProps };\n    const { chartContainerRef: _rootElem, legendsRef: _legendsRef } = useImageExport(\n      props.componentRef,\n      props.hideLegend,\n      false,\n    );\n    const _uniqText: string = useId('_Pie_');\n    /* eslint-disable @typescript-eslint/no-explicit-any */\n    let _calloutAnchorPoint: ChartDataPoint | null;\n    let _emptyChartId: string | null;\n    const legendContainer = React.useRef<HTMLDivElement | null>(null);\n    const prevSize = React.useRef<{ width?: number; height?: number }>({});\n\n    const [value, setValue] = React.useState<string | undefined>('');\n    const [legend, setLegend] = React.useState<string | undefined>('');\n    const [_width, setWidth] = React.useState<number | undefined>(props.width || 200);\n    const [_height, setHeight] = React.useState<number | undefined>(props.height || 200);\n    const [activeLegend, setActiveLegend] = React.useState<string | undefined>(undefined);\n    const [color, setColor] = React.useState<string | undefined>('');\n    const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n    const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n    const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n    const [focusedArcId, setFocusedArcId] = React.useState<string>('');\n    const [dataPointCalloutProps, setDataPointCalloutProps] = React.useState<ChartDataPoint | undefined>();\n    const [refSelected, setRefSelected] = React.useState<HTMLElement | null>(null);\n    const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n    const prevPropsRef = React.useRef<DonutChartProps | null>(null);\n\n    React.useEffect(() => {\n      _fitParentContainer();\n    }, []);\n\n    React.useEffect(() => {\n      if (prevPropsRef.current) {\n        const prevProps = prevPropsRef.current;\n        if (!areArraysEqual(prevProps.legendProps?.selectedLegends, props.legendProps?.selectedLegends)) {\n          setSelectedLegends(props.legendProps?.selectedLegends || []);\n        }\n      }\n      prevPropsRef.current = props;\n    }, [props]);\n\n    React.useEffect(() => {\n      if (prevSize.current.height !== props.height || prevSize.current.width !== props.width) {\n        _fitParentContainer();\n      }\n      prevSize.current.height = props.height;\n      prevSize.current.width = props.width;\n    }, [props.width, props.height]);\n\n    function _elevateToMinimums(data: ChartDataPoint[]) {\n      let sumOfData = 0;\n      const minPercent = 0.01;\n      const elevatedData: ChartDataPoint[] = [];\n      data.forEach(item => {\n        sumOfData += item.data!;\n      });\n      data.forEach(item => {\n        elevatedData.push(\n          minPercent * sumOfData > item.data! && item.data! > 0\n            ? {\n                ...item,\n                data: minPercent * sumOfData,\n                yAxisCalloutData:\n                  item.yAxisCalloutData === undefined ? item.data!.toLocaleString() : item.yAxisCalloutData,\n              }\n            : item,\n        );\n      });\n      return elevatedData;\n    }\n    function _createLegends(chartData: ChartDataPoint[]): JSXElement {\n      if (props.order === 'sorted') {\n        chartData.sort((a: ChartDataPoint, b: ChartDataPoint) => {\n          return b.data! - a.data!;\n        });\n      }\n      const legendDataItems = chartData.map((point: ChartDataPoint, index: number) => {\n        const color: string = point.color!;\n        // mapping data to the format Legends component needs\n        const legend: Legend = {\n          title: point.legend!,\n          color,\n          hoverAction: () => {\n            _handleChartMouseLeave();\n            setActiveLegend(point.legend!);\n          },\n          onMouseOutAction: () => {\n            setActiveLegend(undefined);\n          },\n        };\n        return legend;\n      });\n      const legends = (\n        <Legends\n          legends={legendDataItems}\n          centerLegends\n          overflowText={props.legendsOverflowText}\n          {...props.legendProps}\n          // eslint-disable-next-line react/jsx-no-bind\n          onChange={_onLegendSelectionChange}\n          legendRef={_legendsRef}\n        />\n      );\n      return legends;\n    }\n    function _onLegendSelectionChange(\n      selectedLegends: string[],\n      event: React.MouseEvent<HTMLButtonElement>,\n      currentLegend?: Legend,\n    ): void {\n      if (props.legendProps && props.legendProps?.canSelectMultipleLegends) {\n        setSelectedLegends(selectedLegends);\n      } else {\n        setSelectedLegends(selectedLegends.slice(-1));\n      }\n      if (props.legendProps?.onChange) {\n        props.legendProps.onChange(selectedLegends, event, currentLegend);\n      }\n    }\n\n    function _focusCallback(\n      data: ChartDataPoint,\n      id: string,\n      e: React.FocusEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      setPopoverOpen(_noLegendsHighlighted() || _isLegendHighlighted(data.legend));\n      setValue(data.data!.toString());\n      setLegend(data.legend);\n      setColor(data.color!);\n      setXCalloutValue(data.xAxisCalloutData!);\n      setYCalloutValue(data.yAxisCalloutData!);\n      setFocusedArcId(id);\n      setDataPointCalloutProps(data);\n      setRefSelected(targetElement!);\n    }\n\n    function _hoverCallback(\n      data: ChartDataPoint,\n      e: React.MouseEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      if (_calloutAnchorPoint !== data) {\n        _calloutAnchorPoint = data;\n        setPopoverOpen(_noLegendsHighlighted() || _isLegendHighlighted(data.legend));\n        setValue(data.data!.toString());\n        setLegend(data.legend);\n        setColor(data.color!);\n        setXCalloutValue(data.xAxisCalloutData!);\n        setYCalloutValue(data.yAxisCalloutData!);\n        setDataPointCalloutProps(data);\n        setRefSelected(targetElement!);\n      }\n    }\n    function _onBlur(): void {\n      setFocusedArcId('');\n    }\n\n    function _hoverLeave(): void {\n      /**/\n    }\n\n    function _handleChartMouseLeave() {\n      _calloutAnchorPoint = null;\n      setPopoverOpen(false);\n    }\n\n    function _valueInsideDonut(valueInsideDonut: string | number | undefined, data: ChartDataPoint[]) {\n      const highlightedLegends = _getHighlightedLegend();\n      if (valueInsideDonut !== undefined && (highlightedLegends.length === 1 || isPopoverOpen)) {\n        const pointValue = data.find(point => _isLegendHighlighted(point.legend));\n        return pointValue\n          ? pointValue.yAxisCalloutData\n            ? pointValue.yAxisCalloutData\n            : pointValue.data!\n          : valueInsideDonut;\n      } else if (highlightedLegends.length > 0) {\n        let totalValue = 0;\n        data.forEach(point => {\n          if (highlightedLegends.includes(point.legend!)) {\n            totalValue += point.data!;\n          }\n        });\n        return totalValue;\n      } else {\n        return valueInsideDonut;\n      }\n    }\n\n    function _toLocaleString(data: string | number | undefined) {\n      const localeString = formatToLocaleString(data, props.culture);\n      if (!localeString) {\n        return data;\n      }\n      return localeString?.toString();\n    }\n\n    /**\n     * This function returns\n     * the selected legend if there is one\n     * or the hovered legend if none of the legends is selected.\n     */\n    function _getHighlightedLegend() {\n      return selectedLegends.length > 0 ? selectedLegends : activeLegend ? [activeLegend] : [];\n    }\n\n    function _isLegendHighlighted(legend: string | undefined): boolean {\n      return _getHighlightedLegend().includes(legend!);\n    }\n\n    function _noLegendsHighlighted(): boolean {\n      return _getHighlightedLegend().length === 0;\n    }\n\n    function _isChartEmpty(): boolean {\n      return !(\n        props.data &&\n        props.data.chartData &&\n        props.data.chartData!.filter((d: ChartDataPoint) => d.data! > 0).length > 0\n      );\n    }\n\n    function _addDefaultColors(donutChartDataPoint?: ChartDataPoint[]): ChartDataPoint[] {\n      return donutChartDataPoint\n        ? donutChartDataPoint.map((item, index) => {\n            let defaultColor: string;\n            if (typeof item.color === 'undefined') {\n              defaultColor = getNextColor(index, 0);\n            } else {\n              defaultColor = getColorFromToken(item.color);\n            }\n            return { ...item, defaultColor };\n          })\n        : [];\n    }\n\n    /**\n     * When screen resizes, along with screen, chart also auto adjusted.\n     * This method used to adjust height and width of the charts.\n     */\n    function _fitParentContainer(): void {\n      //_reqID = requestAnimationFrame(() => {\n      let legendContainerHeight;\n      if (props.hideLegend) {\n        // If there is no legend, need not to allocate some space from total chart space.\n        legendContainerHeight = 0;\n      } else {\n        const legendContainerComputedStyles = legendContainer.current && getComputedStyle(legendContainer.current);\n        legendContainerHeight =\n          ((legendContainer.current && legendContainer.current.getBoundingClientRect().height) ||\n            MIN_LEGEND_CONTAINER_HEIGHT) +\n          parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginTop) || '0') +\n          parseFloat((legendContainerComputedStyles && legendContainerComputedStyles.marginBottom) || '0');\n      }\n      if (props.parentRef || _rootElem.current) {\n        const container = props.parentRef ? props.parentRef : _rootElem.current!;\n        const currentContainerWidth = container.getBoundingClientRect().width;\n        const currentContainerHeight =\n          container.getBoundingClientRect().height > legendContainerHeight\n            ? container.getBoundingClientRect().height\n            : 200;\n        const shouldResize =\n          _width !== currentContainerWidth || _height !== currentContainerHeight - legendContainerHeight;\n        if (shouldResize) {\n          setWidth(currentContainerWidth);\n          setHeight(currentContainerHeight - legendContainerHeight);\n        }\n      }\n      //});\n    }\n\n    const { data, hideLegend = false } = props;\n    const points = _addDefaultColors(data?.chartData);\n\n    const classes = useDonutChartStyles(props);\n\n    const legendBars = _createLegends(points.filter(d => d.data! >= 0));\n    const donutMarginHorizontal = props.hideLabels ? 0 : 80;\n    const donutMarginVertical = props.hideLabels ? 0 : 40;\n    const outerRadius = Math.min(_width! - donutMarginHorizontal, _height! - donutMarginVertical) / 2;\n    const chartData = _elevateToMinimums(points);\n    const valueInsideDonut =\n      props.innerRadius! > MIN_DONUT_RADIUS ? _valueInsideDonut(props.valueInsideDonut!, chartData!) : '';\n    const focusAttributes = useFocusableGroup();\n    return !_isChartEmpty() ? (\n      <div\n        className={classes.root}\n        ref={(rootElem: HTMLDivElement | null) => {\n          _rootElem.current = rootElem;\n        }}\n        onMouseLeave={_handleChartMouseLeave}\n      >\n        {props.xAxisAnnotation && (\n          <text className={classes.axisAnnotation} x={_width! / 2} y={_height! - 10} textAnchor=\"middle\">\n            {props.xAxisAnnotation}\n          </text>\n        )}\n        <div className={classes.chartWrapper} {...focusAttributes}>\n          <svg className={classes.chart} aria-label={data?.chartTitle} width={_width} height={_height}>\n            <Pie\n              width={_width!}\n              height={_height!}\n              outerRadius={outerRadius}\n              innerRadius={props.innerRadius!}\n              data={chartData!}\n              onFocusCallback={_focusCallback}\n              hoverOnCallback={_hoverCallback}\n              hoverLeaveCallback={_hoverLeave}\n              uniqText={_uniqText}\n              onBlurCallback={_onBlur}\n              activeArc={_getHighlightedLegend()}\n              focusedArcId={focusedArcId || ''}\n              href={props.href!}\n              valueInsideDonut={_toLocaleString(valueInsideDonut)}\n              showLabelsInPercent={props.showLabelsInPercent}\n              hideLabels={props.hideLabels}\n            />\n          </svg>\n        </div>\n        <ChartPopover\n          xCalloutValue={xCalloutValue}\n          yCalloutValue={yCalloutValue}\n          culture={props.culture}\n          positioning={{\n            target: refSelected,\n          }}\n          isPopoverOpen={\n            !props.hideTooltip && isPopoverOpen && (_noLegendsHighlighted() || _isLegendHighlighted(legend))\n          }\n          legend={legend!}\n          YValue={value!}\n          color={color}\n          isCalloutForStack={false}\n          customCallout={{\n            customizedCallout: props.onRenderCalloutPerDataPoint\n              ? props.onRenderCalloutPerDataPoint(dataPointCalloutProps!)\n              : undefined,\n            customCalloutProps: props.calloutPropsPerDataPoint\n              ? props.calloutPropsPerDataPoint(dataPointCalloutProps!)\n              : undefined,\n          }}\n          isCartesian={false}\n        />\n        {!hideLegend && (\n          <div\n            ref={(e: HTMLDivElement) => {\n              legendContainer.current = e;\n            }}\n            className={classes.legendContainer}\n          >\n            {legendBars}\n          </div>\n        )}\n      </div>\n    ) : (\n      <div id={_emptyChartId!} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n    );\n  },\n);\n\nDonutChart.displayName = 'DonutChart';\n"],"names":["React","Pie","useDonutChartStyles","formatToLocaleString","areArraysEqual","getColorFromToken","getNextColor","MIN_DONUT_RADIUS","Legends","useId","useFocusableGroup","ChartPopover","useImageExport","MIN_LEGEND_CONTAINER_HEIGHT","DonutChart","forwardRef","innerRadius","hideLabels","restProps","forwardedRef","props","chartContainerRef","_rootElem","legendsRef","_legendsRef","componentRef","hideLegend","_uniqText","_calloutAnchorPoint","_emptyChartId","legendContainer","useRef","prevSize","value","setValue","useState","legend","setLegend","_width","setWidth","width","_height","setHeight","height","activeLegend","setActiveLegend","undefined","color","setColor","xCalloutValue","setXCalloutValue","yCalloutValue","setYCalloutValue","selectedLegends","setSelectedLegends","legendProps","focusedArcId","setFocusedArcId","dataPointCalloutProps","setDataPointCalloutProps","refSelected","setRefSelected","isPopoverOpen","setPopoverOpen","prevPropsRef","useEffect","_fitParentContainer","current","prevProps","_elevateToMinimums","data","sumOfData","minPercent","elevatedData","forEach","item","push","yAxisCalloutData","toLocaleString","_createLegends","chartData","order","sort","a","b","legendDataItems","map","point","index","title","hoverAction","_handleChartMouseLeave","onMouseOutAction","legends","centerLegends","overflowText","legendsOverflowText","onChange","_onLegendSelectionChange","legendRef","event","currentLegend","canSelectMultipleLegends","slice","_focusCallback","id","e","targetElement","_noLegendsHighlighted","_isLegendHighlighted","toString","xAxisCalloutData","_hoverCallback","_onBlur","_hoverLeave","_valueInsideDonut","valueInsideDonut","highlightedLegends","_getHighlightedLegend","length","pointValue","find","totalValue","includes","_toLocaleString","localeString","culture","_isChartEmpty","filter","d","_addDefaultColors","donutChartDataPoint","defaultColor","legendContainerHeight","legendContainerComputedStyles","getComputedStyle","getBoundingClientRect","parseFloat","marginTop","marginBottom","parentRef","container","currentContainerWidth","currentContainerHeight","shouldResize","points","classes","legendBars","donutMarginHorizontal","donutMarginVertical","outerRadius","Math","min","focusAttributes","div","className","root","ref","rootElem","onMouseLeave","xAxisAnnotation","text","axisAnnotation","x","y","textAnchor","chartWrapper","svg","chart","aria-label","chartTitle","onFocusCallback","hoverOnCallback","hoverLeaveCallback","uniqText","onBlurCallback","activeArc","href","showLabelsInPercent","positioning","target","hideTooltip","YValue","isCalloutForStack","customCallout","customizedCallout","onRenderCalloutPerDataPoint","customCalloutProps","calloutPropsPerDataPoint","isCartesian","role","style","opacity","displayName"],"mappings":"AAAA;;;;;+BAwBac;;;;;;;iEArBU,QAAQ;uBACX,cAAc;2CAEE,+BAA+B;gCAE9B,4BAA4B;wBACiB,wBAAwB;wBAC1E,cAAc;gCACxB,4BAA4B;8BAEhB,0BAA0B;8BAC/B,mCAAmC;uBACjC,wBAAwB;AAEvD,MAAMD,8BAA8B;AAO7B,mBAAMC,WAAAA,GAAuDd,OAAMe,UAAU,CAClF,CAAC,EAAEC,cAAc,CAAC,EAAEC,aAAa,IAAI,EAAE,GAAGC,WAAW,EAAEC;QAsBkBC;IArBvE,MAAMA,QAAQ;QAAEJ;QAAaC;QAAY,GAAGC,SAAS;IAAC;IACtD,MAAM,EAAEG,mBAAmBC,SAAS,EAAEC,YAAYC,WAAW,EAAE,OAAGZ,qBAAAA,EAChEQ,MAAMK,YAAY,EAClBL,MAAMM,UAAU,EAChB;IAEF,MAAMC,gBAAoBlB,qBAAAA,EAAM;IAChC,qDAAqD,GACrD,IAAImB;IACJ,IAAIC;IACJ,MAAMC,kBAAkB9B,OAAM+B,MAAM,CAAwB;IAC5D,MAAMC,WAAWhC,OAAM+B,MAAM,CAAsC,CAAC;IAEpE,MAAM,CAACE,OAAOC,SAAS,GAAGlC,OAAMmC,QAAQ,CAAqB;IAC7D,MAAM,CAACC,QAAQC,UAAU,GAAGrC,OAAMmC,QAAQ,CAAqB;IAC/D,MAAM,CAACG,QAAQC,SAAS,GAAGvC,OAAMmC,QAAQ,CAAqBf,MAAMoB,KAAK,IAAI;IAC7E,MAAM,CAACC,SAASC,UAAU,GAAG1C,OAAMmC,QAAQ,CAAqBf,MAAMuB,MAAM,IAAI;IAChF,MAAM,CAACC,cAAcC,gBAAgB,GAAG7C,OAAMmC,QAAQ,CAAqBW;IAC3E,MAAM,CAACC,OAAOC,SAAS,GAAGhD,OAAMmC,QAAQ,CAAqB;IAC7D,MAAM,CAACc,eAAeC,iBAAiB,GAAGlD,OAAMmC,QAAQ,CAAS;IACjE,MAAM,CAACgB,eAAeC,iBAAiB,GAAGpD,OAAMmC,QAAQ,CAAS;IACjE,MAAM,CAACkB,iBAAiBC,mBAAmB,GAAGtD,OAAMmC,QAAQ,CAAWf,CAAAA,CAAAA,qBAAAA,MAAMmC,WAAAA,AAAW,MAAA,QAAjBnC,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBiC,eAAAA,AAAe,KAAI,EAAE;IAC/G,MAAM,CAACG,cAAcC,gBAAgB,GAAGzD,OAAMmC,QAAQ,CAAS;IAC/D,MAAM,CAACuB,uBAAuBC,yBAAyB,GAAG3D,OAAMmC,QAAQ;IACxE,MAAM,CAACyB,aAAaC,eAAe,GAAG7D,OAAMmC,QAAQ,CAAqB;IACzE,MAAM,CAAC2B,eAAeC,eAAe,GAAG/D,OAAMmC,QAAQ,CAAC;IACvD,MAAM6B,eAAehE,OAAM+B,MAAM,CAAyB;IAE1D/B,OAAMiE,SAAS,CAAC;QACdC;IACF,GAAG,EAAE;IAELlE,OAAMiE,SAAS,CAAC;QACd,IAAID,aAAaG,OAAO,EAAE;gBAEJC,wBAAwChD;YAD5D,MAAMgD,YAAYJ,aAAaG,OAAO;YACtC,IAAI,KAAC/D,sBAAAA,EAAAA,CAAegE,yBAAAA,UAAUb,WAAAA,AAAW,MAAA,QAArBa,2BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,uBAAuBf,eAAe,EAAA,CAAEjC,qBAAAA,MAAMmC,WAAAA,AAAW,MAAA,QAAjBnC,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBiC,eAAe,GAAG;oBAC5EjC;gBAAnBkC,mBAAmBlC,CAAAA,CAAAA,sBAAAA,MAAMmC,WAAW,AAAXA,MAAW,QAAjBnC,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAmBiC,eAAAA,AAAe,KAAI,EAAE;YAC7D;QACF;QACAW,aAAaG,OAAO,GAAG/C;IACzB,GAAG;QAACA;KAAM;IAEVpB,OAAMiE,SAAS,CAAC;QACd,IAAIjC,SAASmC,OAAO,CAACxB,MAAM,KAAKvB,MAAMuB,MAAM,IAAIX,SAASmC,OAAO,CAAC3B,KAAK,KAAKpB,MAAMoB,KAAK,EAAE;YACtF0B;QACF;QACAlC,SAASmC,OAAO,CAACxB,MAAM,GAAGvB,MAAMuB,MAAM;QACtCX,SAASmC,OAAO,CAAC3B,KAAK,GAAGpB,MAAMoB,KAAK;IACtC,GAAG;QAACpB,MAAMoB,KAAK;QAAEpB,MAAMuB,MAAM;KAAC;IAE9B,SAAS0B,mBAAmBC,IAAsB;QAChD,IAAIC,YAAY;QAChB,MAAMC,aAAa;QACnB,MAAMC,eAAiC,EAAE;QACzCH,KAAKI,OAAO,CAACC,CAAAA;YACXJ,aAAaI,KAAKL,IAAI;QACxB;QACAA,KAAKI,OAAO,CAACC,CAAAA;YACXF,aAAaG,IAAI,CACfJ,aAAaD,YAAYI,KAAKL,IAAI,IAAKK,KAAKL,IAAI,GAAI,IAChD;gBACE,GAAGK,IAAI;gBACPL,MAAME,aAAaD;gBACnBM,kBACEF,KAAKE,gBAAgB,KAAK/B,YAAY6B,KAAKL,IAAI,CAAEQ,cAAc,KAAKH,KAAKE,gBAAgB;YAC7F,IACAF;QAER;QACA,OAAOF;IACT;IACA,SAASM,eAAeC,SAA2B;QACjD,IAAI5D,MAAM6D,KAAK,KAAK,UAAU;YAC5BD,UAAUE,IAAI,CAAC,CAACC,GAAmBC;gBACjC,OAAOA,EAAEd,IAAI,GAAIa,EAAEb,IAAI;YACzB;QACF;QACA,MAAMe,kBAAkBL,UAAUM,GAAG,CAAC,CAACC,OAAuBC;YAC5D,MAAMzC,QAAgBwC,MAAMxC,KAAK;YACjC,qDAAqD;YACrD,MAAMX,SAAiB;gBACrBqD,OAAOF,MAAMnD,MAAM;gBACnBW;gBACA2C,aAAa;oBACXC;oBACA9C,gBAAgB0C,MAAMnD,MAAM;gBAC9B;gBACAwD,kBAAkB;oBAChB/C,gBAAgBC;gBAClB;YACF;YACA,OAAOV;QACT;QACA,MAAMyD,UAAAA,WAAAA,GACJ,OAAA,aAAA,CAACrF,eAAAA,EAAAA;YACCqF,SAASR;YACTS,eAAAA;YACAC,cAAc3E,MAAM4E,mBAAmB;YACtC,GAAG5E,MAAMmC,WAAW;YACrB,6CAA6C;YAC7C0C,UAAUC;YACVC,WAAW3E;;QAGf,OAAOqE;IACT;IACA,SAASK,yBACP7C,eAAyB,EACzB+C,KAA0C,EAC1CC,aAAsB;YAEGjF,oBAKrBA;QALJ,IAAIA,MAAMmC,WAAW,IAAA,CAAA,AAAInC,sBAAAA,MAAMmC,WAAAA,AAAW,MAAA,QAAjBnC,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBkF,wBAAAA,AAAwB,GAAE;YACpEhD,mBAAmBD;QACrB,OAAO;YACLC,mBAAmBD,gBAAgBkD,KAAK,CAAC,CAAC;QAC5C;QACA,IAAA,CAAInF,sBAAAA,MAAMmC,WAAAA,AAAW,MAAA,QAAjBnC,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAmB6E,QAAQ,EAAE;YAC/B7E,MAAMmC,WAAW,CAAC0C,QAAQ,CAAC5C,iBAAiB+C,OAAOC;QACrD;IACF;IAEA,SAASG,eACPlC,IAAoB,EACpBmC,EAAU,EACVC,CAAmC,EACnCC,aAAkC;QAElC5C,eAAe6C,2BAA2BC,qBAAqBvC,KAAKlC,MAAM;QAC1EF,SAASoC,KAAKA,IAAI,CAAEwC,QAAQ;QAC5BzE,UAAUiC,KAAKlC,MAAM;QACrBY,SAASsB,KAAKvB,KAAK;QACnBG,iBAAiBoB,KAAKyC,gBAAgB;QACtC3D,iBAAiBkB,KAAKO,gBAAgB;QACtCpB,gBAAgBgD;QAChB9C,yBAAyBW;QACzBT,eAAe8C;IACjB;IAEA,SAASK,eACP1C,IAAoB,EACpBoC,CAAmC,EACnCC,aAAkC;QAElC,IAAI/E,wBAAwB0C,MAAM;YAChC1C,sBAAsB0C;YACtBP,eAAe6C,2BAA2BC,qBAAqBvC,KAAKlC,MAAM;YAC1EF,SAASoC,KAAKA,IAAI,CAAEwC,QAAQ;YAC5BzE,UAAUiC,KAAKlC,MAAM;YACrBY,SAASsB,KAAKvB,KAAK;YACnBG,iBAAiBoB,KAAKyC,gBAAgB;YACtC3D,iBAAiBkB,KAAKO,gBAAgB;YACtClB,yBAAyBW;YACzBT,eAAe8C;QACjB;IACF;IACA,SAASM;QACPxD,gBAAgB;IAClB;IAEA,SAASyD;IACP,EAAE,GACJ;IAEA,SAASvB;QACP/D,sBAAsB;QACtBmC,eAAe;IACjB;IAEA,SAASoD,kBAAkBC,gBAA6C,EAAE9C,IAAsB;QAC9F,MAAM+C,qBAAqBC;QAC3B,IAAIF,qBAAqBtE,aAAcuE,CAAAA,mBAAmBE,MAAM,KAAK,KAAKzD,aAAAA,CAAY,EAAI;YACxF,MAAM0D,aAAalD,KAAKmD,IAAI,CAAClC,CAAAA,QAASsB,qBAAqBtB,MAAMnD,MAAM;YACvE,OAAOoF,aACHA,WAAW3C,gBAAgB,GACzB2C,WAAW3C,gBAAgB,GAC3B2C,WAAWlD,IAAI,GACjB8C;QACN,OAAO,IAAIC,mBAAmBE,MAAM,GAAG,GAAG;YACxC,IAAIG,aAAa;YACjBpD,KAAKI,OAAO,CAACa,CAAAA;gBACX,IAAI8B,mBAAmBM,QAAQ,CAACpC,MAAMnD,MAAM,GAAI;oBAC9CsF,cAAcnC,MAAMjB,IAAI;gBAC1B;YACF;YACA,OAAOoD;QACT,OAAO;YACL,OAAON;QACT;IACF;IAEA,SAASQ,gBAAgBtD,IAAiC;QACxD,MAAMuD,mBAAe1H,oCAAAA,EAAqBmE,MAAMlD,MAAM0G,OAAO;QAC7D,IAAI,CAACD,cAAc;YACjB,OAAOvD;QACT;QACA,OAAOuD,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,aAAcf,QAAQ;IAC/B;IAEA;;;;KAIC,GACD,SAASQ;QACP,OAAOjE,gBAAgBkE,MAAM,GAAG,IAAIlE,kBAAkBT,eAAe;YAACA;SAAa,GAAG,EAAE;IAC1F;IAEA,SAASiE,qBAAqBzE,MAA0B;QACtD,OAAOkF,wBAAwBK,QAAQ,CAACvF;IAC1C;IAEA,SAASwE;QACP,OAAOU,wBAAwBC,MAAM,KAAK;IAC5C;IAEA,SAASQ;QACP,OAAO,CACL3G,CAAAA,MAAMkD,IAAI,IACVlD,MAAMkD,IAAI,CAACU,SAAS,IACpB5D,MAAMkD,IAAI,CAACU,SAAS,CAAEgD,MAAM,CAAC,CAACC,IAAsBA,EAAE3D,IAAI,GAAI,GAAGiD,MAAM,IAAG,CAAA;IAE9E;IAEA,SAASW,kBAAkBC,mBAAsC;QAC/D,OAAOA,sBACHA,oBAAoB7C,GAAG,CAAC,CAACX,MAAMa;YAC7B,IAAI4C;YACJ,IAAI,OAAOzD,KAAK5B,KAAK,KAAK,aAAa;gBACrCqF,mBAAe9H,oBAAAA,EAAakF,OAAO;YACrC,OAAO;gBACL4C,mBAAe/H,yBAAAA,EAAkBsE,KAAK5B,KAAK;YAC7C;YACA,OAAO;gBAAE,GAAG4B,IAAI;gBAAEyD;YAAa;QACjC,KACA,EAAE;IACR;IAEA;;;KAGC,GACD,SAASlE;QACP,wCAAwC;QACxC,IAAImE;QACJ,IAAIjH,MAAMM,UAAU,EAAE;YACpB,iFAAiF;YACjF2G,wBAAwB;QAC1B,OAAO;YACL,MAAMC,gCAAgCxG,gBAAgBqC,OAAO,IAAIoE,iBAAiBzG,gBAAgBqC,OAAO;YACzGkE,wBACG,CAACvG,gBAAgBqC,OAAO,IAAIrC,gBAAgBqC,OAAO,CAACqE,qBAAqB,GAAG7F,MAAM,IACjF9B,2BAAAA,CAA0B,GAC5B4H,WAAYH,iCAAiCA,8BAA8BI,SAAS,IAAK,OACzFD,WAAYH,iCAAiCA,8BAA8BK,YAAY,IAAK;QAChG;QACA,IAAIvH,MAAMwH,SAAS,IAAItH,UAAU6C,OAAO,EAAE;YACxC,MAAM0E,YAAYzH,MAAMwH,SAAS,GAAGxH,MAAMwH,SAAS,GAAGtH,UAAU6C,OAAO;YACvE,MAAM2E,wBAAwBD,UAAUL,qBAAqB,GAAGhG,KAAK;YACrE,MAAMuG,yBACJF,UAAUL,qBAAqB,GAAG7F,MAAM,GAAG0F,wBACvCQ,UAAUL,qBAAqB,GAAG7F,MAAM,GACxC;YACN,MAAMqG,eACJ1G,WAAWwG,yBAAyBrG,YAAYsG,yBAAyBV;YAC3E,IAAIW,cAAc;gBAChBzG,SAASuG;gBACTpG,UAAUqG,yBAAyBV;YACrC;QACF;IACA,KAAK;IACP;IAEA,MAAM,EAAE/D,IAAI,EAAE5C,aAAa,KAAK,EAAE,GAAGN;IACrC,MAAM6H,SAASf,kBAAkB5D,SAAAA,QAAAA,SAAAA,KAAAA,IAAAA,KAAAA,IAAAA,KAAMU,SAAS;IAEhD,MAAMkE,UAAUhJ,kDAAAA,EAAoBkB;IAEpC,MAAM+H,aAAapE,eAAekE,OAAOjB,MAAM,CAACC,CAAAA,IAAKA,EAAE3D,IAAI,IAAK;IAChE,MAAM8E,wBAAwBhI,MAAMH,UAAU,GAAG,IAAI;IACrD,MAAMoI,sBAAsBjI,MAAMH,UAAU,GAAG,IAAI;IACnD,MAAMqI,cAAcC,KAAKC,GAAG,CAAClH,SAAU8G,uBAAuB3G,UAAW4G,uBAAuB;IAChG,MAAMrE,YAAYX,mBAAmB4E;IACrC,MAAM7B,mBACJhG,MAAMJ,WAAW,GAAIT,wBAAAA,GAAmB4G,kBAAkB/F,MAAMgG,gBAAgB,EAAGpC,aAAc;IACnG,MAAMyE,sBAAkB/I,+BAAAA;IACxB,OAAO,CAACqH,kBAAAA,WAAAA,GACN,OAAA,aAAA,CAAC2B,OAAAA;QACCC,WAAWT,QAAQU,IAAI;QACvBC,KAAK,CAACC;YACJxI,UAAU6C,OAAO,GAAG2F;QACtB;QACAC,cAAcpE;OAEbvE,MAAM4I,eAAe,IAAA,WAAA,GACpB,OAAA,aAAA,CAACC,QAAAA;QAAKN,WAAWT,QAAQgB,cAAc;QAAEC,GAAG7H,SAAU;QAAG8H,GAAG3H,UAAW;QAAI4H,YAAW;OACnFjJ,MAAM4I,eAAe,GAAA,WAAA,GAG1B,OAAA,aAAA,CAACN,OAAAA;QAAIC,WAAWT,QAAQoB,YAAY;QAAG,GAAGb,eAAe;qBACvD,OAAA,aAAA,CAACc,OAAAA;QAAIZ,WAAWT,QAAQsB,KAAK;QAAEC,YAAU,EAAEnG,SAAAA,QAAAA,SAAAA,KAAAA,IAAAA,KAAAA,IAAAA,KAAMoG,UAAU;QAAElI,OAAOF;QAAQK,QAAQF;qBAClF,OAAA,aAAA,CAACxC,UAAAA,EAAAA;QACCuC,OAAOF;QACPK,QAAQF;QACR6G,aAAaA;QACbtI,aAAaI,MAAMJ,WAAW;QAC9BsD,MAAMU;QACN2F,iBAAiBnE;QACjBoE,iBAAiB5D;QACjB6D,oBAAoB3D;QACpB4D,UAAUnJ;QACVoJ,gBAAgB9D;QAChB+D,WAAW1D;QACX9D,cAAcA,gBAAgB;QAC9ByH,MAAM7J,MAAM6J,IAAI;QAChB7D,kBAAkBQ,gBAAgBR;QAClC8D,qBAAqB9J,MAAM8J,mBAAmB;QAC9CjK,YAAYG,MAAMH,UAAU;wBAIlC,OAAA,aAAA,CAACN,0BAAAA,EAAAA;QACCsC,eAAeA;QACfE,eAAeA;QACf2E,SAAS1G,MAAM0G,OAAO;QACtBqD,aAAa;YACXC,QAAQxH;QACV;QACAE,eACE,CAAC1C,MAAMiK,WAAW,IAAIvH,iBAAkB8C,CAAAA,2BAA2BC,qBAAqBzE,OAAAA,CAAM;QAEhGA,QAAQA;QACRkJ,QAAQrJ;QACRc,OAAOA;QACPwI,mBAAmB;QACnBC,eAAe;YACbC,mBAAmBrK,MAAMsK,2BAA2B,GAChDtK,MAAMsK,2BAA2B,CAAChI,yBAClCZ;YACJ6I,oBAAoBvK,MAAMwK,wBAAwB,GAC9CxK,MAAMwK,wBAAwB,CAAClI,yBAC/BZ;QACN;QACA+I,aAAa;QAEd,CAACnK,cAAAA,WAAAA,GACA,OAAA,aAAA,CAACgI,OAAAA;QACCG,KAAK,CAACnD;YACJ5E,gBAAgBqC,OAAO,GAAGuC;QAC5B;QACAiD,WAAWT,QAAQpH,eAAe;OAEjCqH,eAAAA,WAAAA,GAKP,OAAA,aAAA,CAACO,OAAAA;QAAIjD,IAAI5E;QAAgBiK,MAAM;QAASC,OAAO;YAAEC,SAAS;QAAI;QAAGvB,cAAY;;AAEjF,GACA;AAEF3J,WAAWmL,WAAW,GAAG"}