@fluentui/react-charts 9.0.3 → 9.0.5

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

@@ -1 +1 @@
-{"version":3,"sources":["CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { LegendsProps } from '../Legends/index';\nimport { AccessibilityProps, Chart, Margins } from '../../types/index';\nimport { ChartTypes, XAxisTypes, YAxisType } from '../../utilities/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\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/**\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 callout root-content\n   */\n  calloutContentRoot?: string;\n\n  /**\n   * styles for callout x-content\n   */\n  calloutContentX?: string;\n\n  /**\n   * styles for callout y-content\n   */\n  calloutContentY?: string;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: string;\n\n  /**\n   * styles for callout Date time container\n   */\n  calloutDateTimeContainer?: string;\n\n  /**\n   * styles for callout info container\n   */\n  calloutInfoContainer?: string;\n\n  /**\n   * styles for callout block container\n   */\n  calloutBlockContainer?: string;\n\n  /**\n   * Styles for callout block container when toDrawShape is false\n   */\n  calloutBlockContainertoDrawShapefalse?: string;\n\n  /**\n   * Styles for callout block container when toDrawShape is true\n   */\n  calloutBlockContainertoDrawShapetrue?: string;\n\n  /**\n   * styles for callout legend text\n   */\n  calloutlegendText?: string;\n\n  /**\n   * styles for tooltip\n   */\n  tooltip?: string;\n\n  /**\n   * styles for tooltip\n   */\n  axisTitle?: 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/**\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   * 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   * 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 false\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>;\n}\n\nexport interface YValueHover {\n  legend?: string;\n  y?: number;\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  yScale?: 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: JSX.Element | 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  /** 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"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}
+{"version":3,"sources":["CartesianChart.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { LegendsProps } from '../Legends/index';\nimport { AccessibilityProps, Chart, Margins } from '../../types/index';\nimport { ChartTypes, XAxisTypes, YAxisType } from '../../utilities/index';\nimport { TimeLocaleDefinition } from 'd3-time-format';\nimport { ChartPopoverProps } from './ChartPopover.types';\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/**\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 tooltip\n   */\n  axisTitle?: 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/**\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   * 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   * 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 false\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>;\n}\n\nexport interface YValueHover {\n  legend?: string;\n  y?: number;\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  yScale?: 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: JSX.Element | 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  /** 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"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}

package/lib-commonjs/components/CommonComponents/ChartPopover.js

@@ -65,7 +65,7 @@ const ChartPopover = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
                 display: 'flex',
                 alignItems: 'flex-end'
             },
-            borderLeft: `4px solid ${props.color}`
+            borderInlineStart: `4px solid ${props.color}`
         }
     }, /*#__PURE__*/ _react.createElement("div", {
         className: classes.calloutBlockContainer
@@ -151,7 +151,7 @@ const ChartPopover = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
                 style: {
                     marginTop: props.XValue ? '13px' : 'unset',
                     ...!toDrawShape ? {
-                        borderLeft: `4px solid ${xValue.color}`
+                        borderInlineStart: `4px solid ${xValue.color}`
                     } : {}
                 }
             }, toDrawShape && /*#__PURE__*/ _react.createElement(_shape.Shape, {

package/lib-commonjs/components/CommonComponents/ChartPopover.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ChartPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { mergeClasses } from '@griffel/react';\nimport type { PositioningVirtualElement } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { useId } from '@fluentui/react-utilities';\nimport { getAccessibleDataObject, Points, pointTypes } from '../../utilities/index';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { Shape } from '../Legends/shape';\nimport { usePopoverStyles_unstable } from './useChartPopoverStyles.styles';\nimport { YValueHover } from './CartesianChart.types';\nimport { LegendShape } from '../Legends/Legends.types';\nimport { ChartPopoverProps } from './ChartPopover.types';\n\n/* This component is a wrapper over Popover component which implements the logic for rendering popovers for any chart\ncombining the logic for Callout and ChartHoverCard in v8 charts. */\nexport const ChartPopover: React.FunctionComponent<ChartPopoverProps> = React.forwardRef<\n  HTMLDivElement,\n  ChartPopoverProps\n>((props, forwardedRef) => {\n  const virtualElement: PositioningVirtualElement = {\n    getBoundingClientRect: () => ({\n      top: props.clickPosition!.y,\n      left: props.clickPosition!.x,\n      right: props.clickPosition!.x,\n      bottom: props.clickPosition!.y,\n      x: props.clickPosition!.x,\n      y: props.clickPosition!.y,\n      width: 0,\n      height: 0,\n    }),\n  };\n  props = { ...props, ...props.customCallout?.customCalloutProps };\n  const classes = usePopoverStyles_unstable(props);\n  const legend = props.xCalloutValue ? props.xCalloutValue : props.legend;\n  const YValue = props.yCalloutValue ? props.yCalloutValue : props.YValue;\n  return (\n    <div id={useId('callout')} ref={forwardedRef} className={classes.calloutContainer}>\n      <Popover\n        positioning={{ target: virtualElement, autoSize: 'always', offset: 20, coverTarget: false }}\n        open={props.isPopoverOpen}\n        inline\n      >\n        <PopoverSurface>\n          {/** Given custom callout, then it will render */}\n          {props.customCallout && props.customCallout.customizedCallout && props.customCallout.customizedCallout}\n          {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) &&\n            props.isCalloutForStack &&\n            _multiValueCallout()}\n          {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) && !props.isCalloutForStack && (\n            <div className={classes.calloutContentRoot}>\n              <div className={classes.calloutDateTimeContainer}>\n                <div className={classes.calloutContentX}>{props.XValue} </div>\n                {/*TO DO  if we add time for callout then will use this */}\n                {/* <div className={classNames.calloutContentX}>07:00am</div> */}\n              </div>\n              <div\n                className={classes.calloutInfoContainer}\n                style={{\n                  ...(props.ratio && {\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                  }),\n                  borderLeft: `4px solid ${props.color}`,\n                }}\n              >\n                <div className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>{convertToLocaleString(legend, props.culture)}</div>\n                  <div\n                    className={classes.calloutContentY}\n                    style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                  >\n                    {convertToLocaleString(YValue, props.culture)}\n                  </div>\n                </div>\n                {!!props.ratio && (\n                  <div className={classes.ratio}>\n                    <>\n                      <span className={classes.numerator}>{convertToLocaleString(props.ratio[0], props.culture)}</span>/\n                      <span className={classes.denominator}>\n                        {convertToLocaleString(props.ratio[1], props.culture)}\n                      </span>\n                    </>\n                  </div>\n                )}\n              </div>\n              {!!props.descriptionMessage && (\n                <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>\n              )}\n            </div>\n          )}\n        </PopoverSurface>\n      </Popover>\n    </div>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _multiValueCallout() {\n    const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(props.YValueHover) ?? false;\n    return (\n      <div className={classes.calloutContentRoot}>\n        <div\n          className={classes.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={classes.calloutContentX}\n            {...getAccessibleDataObject(props!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {convertToLocaleString(props!.hoverXValue, props.culture)}\n          </div>\n        </div>\n        <div style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n          {props!.YValueHover &&\n            props!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n              const isLast: boolean = index + 1 === yValues.length;\n              const { shouldDrawBorderBottom = false } = yValue;\n              return (\n                <div\n                  {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                  key={`callout-content-${index}`}\n                  style={\n                    yValueHoverSubCountsExists\n                      ? {\n                          display: 'inline-block',\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!props.descriptionMessage && <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>}\n        </div>\n      </div>\n    );\n  }\n\n  function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]): boolean | undefined {\n    return (\n      yValueHover &&\n      yValueHover.some(\n        (yValue: {\n          legend?: string;\n          y?: number;\n          color?: string;\n          yAxisCalloutData?: string | { [id: string]: number };\n        }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n      )\n    );\n  }\n\n  function _getCalloutContent(\n    xValue: YValueHover,\n    index: number,\n    yValueHoverSubCountsExists: boolean,\n    isLast: boolean,\n  ): React.ReactNode {\n    const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n    const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n    const { culture } = props;\n    const yValue = convertToLocaleString(xValue.y, culture);\n    if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n      return (\n        <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n          {yValueHoverSubCountsExists && (\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n          )}\n          <div\n            id={`${index}_${xValue.y}`}\n            className={classes.calloutBlockContainer}\n            style={{\n              marginTop: props.XValue ? '13px' : 'unset',\n              ...(!toDrawShape\n                ? {\n                    borderLeft: `4px solid ${xValue.color}`,\n                  }\n                : {}),\n            }}\n          >\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: classes.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div\n              className={mergeClasses(\n                classes.calloutBlockContainer,\n                toDrawShape\n                  ? classes.calloutBlockContainertoDrawShapetrue\n                  : classes.calloutBlockContainertoDrawShapefalse,\n              )}\n            >\n              <div className={classes.calloutlegendText}> {xValue.legend}</div>\n              <div className={classes.calloutContentY}>\n                {convertToLocaleString(\n                  xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y ?? xValue.data,\n                  culture,\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n      return (\n        <div style={marginStyle}>\n          <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n            {xValue.legend!} ({yValue})\n          </div>\n          {Object.keys(subcounts).map((subcountName: string) => {\n            return (\n              <div key={subcountName} className={classes.calloutBlockContainer}>\n                <div className={classes.calloutlegendText}> {convertToLocaleString(subcountName, culture)}</div>\n                <div\n                  className={classes.calloutContentY}\n                  style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                >\n                  {convertToLocaleString(subcounts[subcountName], culture)}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      );\n    }\n  }\n});\nChartPopover.displayName = 'ChartPopover';\n"],"names":["ChartPopover","React","forwardRef","props","forwardedRef","virtualElement","getBoundingClientRect","top","clickPosition","y","left","x","right","bottom","width","height","customCallout","customCalloutProps","classes","usePopoverStyles_unstable","legend","xCalloutValue","YValue","yCalloutValue","createElement","div","id","useId","ref","className","calloutContainer","Popover","positioning","target","autoSize","offset","coverTarget","open","isPopoverOpen","inline","PopoverSurface","customizedCallout","isCalloutForStack","_multiValueCallout","calloutContentRoot","calloutDateTimeContainer","calloutContentX","XValue","calloutInfoContainer","style","ratio","display","alignItems","borderLeft","color","calloutBlockContainer","calloutlegendText","convertToLocaleString","culture","calloutContentY","tokens","colorNeutralForeground1","Fragment","span","numerator","denominator","descriptionMessage","_yValueHoverSubCountsExists","yValueHoverSubCountsExists","YValueHover","marginBottom","getAccessibleDataObject","xAxisCalloutAccessibilityData","hoverXValue","map","yValue","index","yValues","isLast","length","shouldDrawBorderBottom","callOutAccessibilityData","key","borderBottom","colorNeutralStroke2","paddingBottom","_getCalloutContent","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","fontSize","marginTop","Shape","svgProps","shapeStyles","pathProps","fill","shape","Points","Object","keys","pointTypes","mergeClasses","calloutBlockContainertoDrawShapetrue","calloutBlockContainertoDrawShapefalse","data","subcounts","subcountName","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["ChartPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Popover, PopoverSurface } from '@fluentui/react-popover';\nimport { mergeClasses } from '@griffel/react';\nimport type { PositioningVirtualElement } from '@fluentui/react-positioning';\nimport { tokens } from '@fluentui/react-theme';\nimport { useId } from '@fluentui/react-utilities';\nimport { getAccessibleDataObject, Points, pointTypes } from '../../utilities/index';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { Shape } from '../Legends/shape';\nimport { usePopoverStyles_unstable } from './useChartPopoverStyles.styles';\nimport { YValueHover } from './CartesianChart.types';\nimport { LegendShape } from '../Legends/Legends.types';\nimport { ChartPopoverProps } from './ChartPopover.types';\n\n/* This component is a wrapper over Popover component which implements the logic for rendering popovers for any chart\ncombining the logic for Callout and ChartHoverCard in v8 charts. */\nexport const ChartPopover: React.FunctionComponent<ChartPopoverProps> = React.forwardRef<\n  HTMLDivElement,\n  ChartPopoverProps\n>((props, forwardedRef) => {\n  const virtualElement: PositioningVirtualElement = {\n    getBoundingClientRect: () => ({\n      top: props.clickPosition!.y,\n      left: props.clickPosition!.x,\n      right: props.clickPosition!.x,\n      bottom: props.clickPosition!.y,\n      x: props.clickPosition!.x,\n      y: props.clickPosition!.y,\n      width: 0,\n      height: 0,\n    }),\n  };\n  props = { ...props, ...props.customCallout?.customCalloutProps };\n  const classes = usePopoverStyles_unstable(props);\n  const legend = props.xCalloutValue ? props.xCalloutValue : props.legend;\n  const YValue = props.yCalloutValue ? props.yCalloutValue : props.YValue;\n  return (\n    <div id={useId('callout')} ref={forwardedRef} className={classes.calloutContainer}>\n      <Popover\n        positioning={{ target: virtualElement, autoSize: 'always', offset: 20, coverTarget: false }}\n        open={props.isPopoverOpen}\n        inline\n      >\n        <PopoverSurface>\n          {/** Given custom callout, then it will render */}\n          {props.customCallout && props.customCallout.customizedCallout && props.customCallout.customizedCallout}\n          {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) &&\n            props.isCalloutForStack &&\n            _multiValueCallout()}\n          {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n          {(!props.customCallout || !props.customCallout.customizedCallout) && !props.isCalloutForStack && (\n            <div className={classes.calloutContentRoot}>\n              <div className={classes.calloutDateTimeContainer}>\n                <div className={classes.calloutContentX}>{props.XValue} </div>\n                {/*TO DO  if we add time for callout then will use this */}\n                {/* <div className={classNames.calloutContentX}>07:00am</div> */}\n              </div>\n              <div\n                className={classes.calloutInfoContainer}\n                style={{\n                  ...(props.ratio && {\n                    display: 'flex',\n                    alignItems: 'flex-end',\n                  }),\n                  borderInlineStart: `4px solid ${props.color}`,\n                }}\n              >\n                <div className={classes.calloutBlockContainer}>\n                  <div className={classes.calloutlegendText}>{convertToLocaleString(legend, props.culture)}</div>\n                  <div\n                    className={classes.calloutContentY}\n                    style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                  >\n                    {convertToLocaleString(YValue, props.culture)}\n                  </div>\n                </div>\n                {!!props.ratio && (\n                  <div className={classes.ratio}>\n                    <>\n                      <span className={classes.numerator}>{convertToLocaleString(props.ratio[0], props.culture)}</span>/\n                      <span className={classes.denominator}>\n                        {convertToLocaleString(props.ratio[1], props.culture)}\n                      </span>\n                    </>\n                  </div>\n                )}\n              </div>\n              {!!props.descriptionMessage && (\n                <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>\n              )}\n            </div>\n          )}\n        </PopoverSurface>\n      </Popover>\n    </div>\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  function _multiValueCallout() {\n    const yValueHoverSubCountsExists: boolean = _yValueHoverSubCountsExists(props.YValueHover) ?? false;\n    return (\n      <div className={classes.calloutContentRoot}>\n        <div\n          className={classes.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={classes.calloutContentX}\n            {...getAccessibleDataObject(props!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {convertToLocaleString(props!.hoverXValue, props.culture)}\n          </div>\n        </div>\n        <div style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}>\n          {props!.YValueHover &&\n            props!.YValueHover.map((yValue: YValueHover, index: number, yValues: YValueHover[]) => {\n              const isLast: boolean = index + 1 === yValues.length;\n              const { shouldDrawBorderBottom = false } = yValue;\n              return (\n                <div\n                  {...getAccessibleDataObject(yValue.callOutAccessibilityData, 'text', false)}\n                  key={`callout-content-${index}`}\n                  style={\n                    yValueHoverSubCountsExists\n                      ? {\n                          display: 'inline-block',\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${tokens.colorNeutralStroke2}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {_getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!props.descriptionMessage && <div className={classes.descriptionMessage}>{props.descriptionMessage}</div>}\n        </div>\n      </div>\n    );\n  }\n\n  function _yValueHoverSubCountsExists(yValueHover?: YValueHover[]): boolean | undefined {\n    return (\n      yValueHover &&\n      yValueHover.some(\n        (yValue: {\n          legend?: string;\n          y?: number;\n          color?: string;\n          yAxisCalloutData?: string | { [id: string]: number };\n        }) => yValue.yAxisCalloutData && typeof yValue.yAxisCalloutData !== 'string',\n      )\n    );\n  }\n\n  function _getCalloutContent(\n    xValue: YValueHover,\n    index: number,\n    yValueHoverSubCountsExists: boolean,\n    isLast: boolean,\n  ): React.ReactNode {\n    const marginStyle: React.CSSProperties = isLast ? {} : { marginRight: '16px' };\n    const toDrawShape = xValue.index !== undefined && xValue.index !== -1;\n    const { culture } = props;\n    const yValue = convertToLocaleString(xValue.y, culture);\n    if (!xValue.yAxisCalloutData || typeof xValue.yAxisCalloutData === 'string') {\n      return (\n        <div style={yValueHoverSubCountsExists ? marginStyle : {}}>\n          {yValueHoverSubCountsExists && (\n            <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n              {xValue.legend!} ({yValue})\n            </div>\n          )}\n          <div\n            id={`${index}_${xValue.y}`}\n            className={classes.calloutBlockContainer}\n            style={{\n              marginTop: props.XValue ? '13px' : 'unset',\n              ...(!toDrawShape\n                ? {\n                    borderInlineStart: `4px solid ${xValue.color}`,\n                  }\n                : {}),\n            }}\n          >\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: classes.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div\n              className={mergeClasses(\n                classes.calloutBlockContainer,\n                toDrawShape\n                  ? classes.calloutBlockContainertoDrawShapetrue\n                  : classes.calloutBlockContainertoDrawShapefalse,\n              )}\n            >\n              <div className={classes.calloutlegendText}> {xValue.legend}</div>\n              <div className={classes.calloutContentY}>\n                {convertToLocaleString(\n                  xValue.yAxisCalloutData ? xValue.yAxisCalloutData : xValue.y ?? xValue.data,\n                  culture,\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      );\n    } else {\n      const subcounts: { [id: string]: number } = xValue.yAxisCalloutData as { [id: string]: number };\n      return (\n        <div style={marginStyle}>\n          <div className=\"ms-fontWeight-semibold\" style={{ fontSize: '12pt' }}>\n            {xValue.legend!} ({yValue})\n          </div>\n          {Object.keys(subcounts).map((subcountName: string) => {\n            return (\n              <div key={subcountName} className={classes.calloutBlockContainer}>\n                <div className={classes.calloutlegendText}> {convertToLocaleString(subcountName, culture)}</div>\n                <div\n                  className={classes.calloutContentY}\n                  style={{ color: props.color ? props.color : tokens.colorNeutralForeground1 }}\n                >\n                  {convertToLocaleString(subcounts[subcountName], culture)}\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      );\n    }\n  }\n});\nChartPopover.displayName = 'ChartPopover';\n"],"names":["ChartPopover","React","forwardRef","props","forwardedRef","virtualElement","getBoundingClientRect","top","clickPosition","y","left","x","right","bottom","width","height","customCallout","customCalloutProps","classes","usePopoverStyles_unstable","legend","xCalloutValue","YValue","yCalloutValue","createElement","div","id","useId","ref","className","calloutContainer","Popover","positioning","target","autoSize","offset","coverTarget","open","isPopoverOpen","inline","PopoverSurface","customizedCallout","isCalloutForStack","_multiValueCallout","calloutContentRoot","calloutDateTimeContainer","calloutContentX","XValue","calloutInfoContainer","style","ratio","display","alignItems","borderInlineStart","color","calloutBlockContainer","calloutlegendText","convertToLocaleString","culture","calloutContentY","tokens","colorNeutralForeground1","Fragment","span","numerator","denominator","descriptionMessage","_yValueHoverSubCountsExists","yValueHoverSubCountsExists","YValueHover","marginBottom","getAccessibleDataObject","xAxisCalloutAccessibilityData","hoverXValue","map","yValue","index","yValues","isLast","length","shouldDrawBorderBottom","callOutAccessibilityData","key","borderBottom","colorNeutralStroke2","paddingBottom","_getCalloutContent","yValueHover","some","yAxisCalloutData","xValue","marginStyle","marginRight","toDrawShape","undefined","fontSize","marginTop","Shape","svgProps","shapeStyles","pathProps","fill","shape","Points","Object","keys","pointTypes","mergeClasses","calloutBlockContainertoDrawShapetrue","calloutBlockContainertoDrawShapefalse","data","subcounts","subcountName","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js

@@ -26,18 +26,9 @@ const cartesianchartClassNames = {
     yAxis: 'fui-cart__yAxis',
     opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',
     legendContainer: 'fui-cart__legendContainer',
-    calloutContentRoot: 'fui-cart__calloutContentRoot',
-    calloutDateTimeContainer: 'fui-cart__calloutDateTimeContainer',
-    calloutContentX: 'fui-cart__calloutContentX',
-    calloutBlockContainer: 'fui-cart__calloutBlockContainer',
-    calloutBlockContainertoDrawShapefalse: 'fui-cart__calloutBlockContainertoDrawShapefalse',
-    calloutBlockContainertoDrawShapetrue: 'fui-cart__calloutBlockContainertoDrawShapetrue',
     shapeStyles: 'fui-cart__shapeStyles',
-    calloutlegendText: 'fui-cart__calloutlegendText',
-    calloutContentY: 'fui-cart__calloutContentY',
     descriptionMessage: 'fui-cart__descriptionMessage',
     hover: 'fui-cart__hover',
-    calloutInfoContainer: 'fui-cart__calloutInfoContainer',
     tooltip: 'fui-cart__tooltip',
     chartTitle: 'fui-cart__chartTitle'
 };
@@ -78,14 +69,11 @@ const cartesianchartClassNames = {
         D01gh: "f1wvrikb",
         vxuu72: "fidmvdy",
         lclgl4: "f1noc3f3",
-        Dzfv0s: "f1rtcel9",
-        s17mou: "f4w8oyz",
+        zp1vxd: "f44ebzg",
         jxu3ei: "fkuun",
         B3i31d3: "f1u7a78k",
         Bhcy8il: "f1myyn02",
-        t7r2jy: "f1ypwncy",
-        Bpf2t2a: "fs22wna",
-        J19x1g: "f19ju15u",
+        z3m6do: "f1oca6e6",
         se2xxg: "f1x8lysa"
     },
     yAxis: {
@@ -94,13 +82,10 @@ const cartesianchartClassNames = {
         vxuu72: "fidmvdy",
         lclgl4: "f1noc3f3",
         Bifops1: "fk6onyz",
-        Dzfv0s: "f1rtcel9",
-        s17mou: "f4w8oyz",
+        zp1vxd: "f44ebzg",
         jxu3ei: "fkuun",
         B3i31d3: "f1u7a78k",
-        t7r2jy: "f1ypwncy",
-        Bpf2t2a: "fs22wna",
-        J19x1g: "f19ju15u",
+        z3m6do: "f1oca6e6",
         se2xxg: "f1x8lysa"
     },
     rtl: {
@@ -117,92 +102,6 @@ const cartesianchartClassNames = {
             "ff3wqvv",
             "f1l2akhw"
         ]
-    },
-    calloutContentRoot: {
-        mc9l5x: "f13qh94s",
-        B68tc82: 0,
-        Bmxbyg5: 0,
-        Bpg54ce: "f1a3p1vp",
-        z8tnut: "f1dvrhzg",
-        z189sj: [
-            "fjnv7mu",
-            "fae8789"
-        ],
-        Byoj8tv: "f1av7aef",
-        uwmqm3: [
-            "fae8789",
-            "fjnv7mu"
-        ],
-        De3pzq: "fxugw4r",
-        jy2i9i: "fronft5"
-    },
-    calloutDateTimeContainer: {
-        mc9l5x: "f22iagw",
-        Beiy3e4: "f1063pyq",
-        Brf1p80: "f1869bpl"
-    },
-    calloutContentX: {
-        Bahqtrf: "fk6fouc",
-        Be2twd7: "fy9rknc",
-        Bhrd7zp: "figsok6",
-        Bg96gwp: "fwrc4pm",
-        abs64n: "fp25eh",
-        sj55zd: "fkfq4zb"
-    },
-    calloutBlockContainer: {
-        Bahqtrf: "fk6fouc",
-        Be2twd7: "fod5ikn",
-        Bhrd7zp: "figsok6",
-        Bg96gwp: "faaz57k",
-        B6of3ja: "f7jvbu2",
-        sj55zd: "fkfq4zb"
-    },
-    calloutBlockContainertoDrawShapefalse: {
-        B93v9kj: "f15mrrko",
-        ibv6hh: [
-            "frjpdoz",
-            "fm1xp1g"
-        ],
-        uwmqm3: [
-            "f1f5gg8d",
-            "f1vdfbxk"
-        ]
-    },
-    calloutBlockContainertoDrawShapetrue: {
-        mc9l5x: "f22iagw"
-    },
-    shapeStyles: {
-        t21cq0: [
-            "f1vcna3q",
-            "foyynoy"
-        ]
-    },
-    calloutLegendText: {
-        Bahqtrf: "fk6fouc",
-        Be2twd7: "fy9rknc",
-        Bhrd7zp: "figsok6",
-        Bg96gwp: "fwrc4pm",
-        sj55zd: "fkfq4zb",
-        Bd6j3yi: "f5klfrb",
-        hbub2c: "f1f0smcx"
-    },
-    calloutContentY: {
-        Bahqtrf: "fk6fouc",
-        Be2twd7: "fod5ikn",
-        Bhrd7zp: "flh3ekv",
-        Bg96gwp: "faaz57k",
-        Bd6j3yi: "f5klfrb",
-        hbub2c: "f1f0smcx"
-    },
-    descriptionMessage: {
-        Bahqtrf: "fk6fouc",
-        Be2twd7: "fy9rknc",
-        Bhrd7zp: "figsok6",
-        Bg96gwp: "fwrc4pm",
-        sj55zd: "fkfq4zb",
-        B6of3ja: "f1gaxbfw",
-        z8tnut: "f1ngh7ph",
-        B4j52fo: "f1pgliyk"
     }
 }, {
     d: [
@@ -238,97 +137,18 @@ const cartesianchartClassNames = {
         ".f1wvrikb text{font-size:var(--fontSizeBase100);}",
         ".fidmvdy text{font-weight:var(--fontWeightSemibold);}",
         ".f1noc3f3 text{line-height:var(--lineHeightBase100);}",
+        ".f44ebzg text{forced-color-adjust:auto;}",
         ".fkuun line{opacity:0.2;}",
         ".f1u7a78k line{stroke:var(--colorNeutralForeground1);}",
         ".f1myyn02 line{width:1px;}",
+        ".f1oca6e6 line{forced-color-adjust:auto;}",
         ".f1x8lysa path{display:none;}",
         ".f1j2g1si g{text-anchor:end;}",
         ".f9das1l{opacity:0.1;}",
         ".f158kwzp{cursor:default;}",
         ".frnwi6n{margin-top:var(--spacingVerticalS);}",
         ".ff3wqvv{margin-left:var(--spacingHorizontalXL);}",
-        ".f1l2akhw{margin-right:var(--spacingHorizontalXL);}",
-        ".f13qh94s{display:grid;}",
-        [
-            ".f1a3p1vp{overflow:hidden;}",
-            {
-                p: -1
-            }
-        ],
-        ".f1dvrhzg{padding-top:11px 16px 10px 16px;}",
-        ".fjnv7mu{padding-right:11px 16px 10px 16px;}",
-        ".fae8789{padding-left:11px 16px 10px 16px;}",
-        ".f1av7aef{padding-bottom:11px 16px 10px 16px;}",
-        ".fxugw4r{background-color:var(--colorNeutralBackground1);}",
-        ".fronft5{background-blend-mode:normal,luminosity;}",
-        ".f1063pyq{flex-direction:row;}",
-        ".f1869bpl{justify-content:space-between;}",
-        ".fy9rknc{font-size:var(--fontSizeBase200);}",
-        ".fwrc4pm{line-height:var(--lineHeightBase200);}",
-        ".fp25eh{opacity:0.8;}",
-        ".fod5ikn{font-size:var(--fontSizeBase400);}",
-        ".faaz57k{line-height:var(--lineHeightBase400);}",
-        ".f7jvbu2{margin-top:13px;}",
-        ".frjpdoz{border-left-width:4px solid;}",
-        ".fm1xp1g{border-right-width:4px solid;}",
-        ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
-        ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
-        ".f1vcna3q{margin-right:var(--spacingHorizontalS);}",
-        ".foyynoy{margin-left:var(--spacingHorizontalS);}",
-        ".flh3ekv{font-weight:var(--fontWeightBold);}",
-        ".f1gaxbfw{margin-top:var(--spacingVerticalMNudge);}",
-        ".f1ngh7ph{padding-top:var(--spacingVerticalMNudge);}",
-        ".f1pgliyk{border-top-width:1px solid var(--colorNeutralStroke2);}"
-    ],
-    m: [
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f1rtcel9 text{fill:rgb(179, 179, 179);}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f4w8oyz text{forced-color-adjust:none;}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f1ypwncy line{opacity:0.1;}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.fs22wna line{stroke:rgb(179, 179, 179);}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f19ju15u line{forced-color-adjust:none;}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f15mrrko{forced-color-adjust:none;}}",
-            {
-                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f5klfrb{color:rgb(255, 255, 255);}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.f1f0smcx{forced-color-adjust:none;}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ]
+        ".f1l2akhw{margin-right:var(--spacingHorizontalXL);}"
     ]
 });
 const useCartesianChartStyles = (props)=>{
@@ -341,16 +161,6 @@ const useCartesianChartStyles = (props)=>{
         xAxis: (0, _react.mergeClasses)(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),
         yAxis: (0, _react.mergeClasses)(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),
         opacityChangeOnHover: (0, _react.mergeClasses)(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),
-        legendContainer: (0, _react.mergeClasses)(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ ),
-        calloutContentRoot: (0, _react.mergeClasses)(cartesianchartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*props.styles?. calloutContentRoot*/ ),
-        calloutDateTimeContainer: (0, _react.mergeClasses)(cartesianchartClassNames.calloutDateTimeContainer, baseStyles.calloutDateTimeContainer /*props.styles?.calloutDateTimeContainer*/ ),
-        calloutContentX: (0, _react.mergeClasses)(cartesianchartClassNames.calloutContentX, baseStyles.calloutContentX /*props.styles?.calloutContentX*/ ),
-        calloutBlockContainer: (0, _react.mergeClasses)(cartesianchartClassNames.calloutBlockContainer, baseStyles.calloutBlockContainer /*props.styles?.calloutBlockContainer*/ ),
-        calloutBlockContainertoDrawShapefalse: (0, _react.mergeClasses)(cartesianchartClassNames.calloutBlockContainertoDrawShapefalse, baseStyles.calloutBlockContainertoDrawShapefalse /*props.styles?.calloutBlockContainertoDrawShapefalse*/ ),
-        calloutBlockContainertoDrawShapetrue: (0, _react.mergeClasses)(cartesianchartClassNames.calloutBlockContainertoDrawShapetrue, baseStyles.calloutBlockContainertoDrawShapetrue /*props.styles?.calloutBlockContainertoDrawShapetrue*/ ),
-        shapeStyles: (0, _react.mergeClasses)(cartesianchartClassNames.shapeStyles, baseStyles.shapeStyles /*props.styles?.shapeStyles*/ ),
-        calloutlegendText: (0, _react.mergeClasses)(cartesianchartClassNames.calloutlegendText, baseStyles.calloutLegendText /*props.styles?.calloutlegendText*/ ),
-        calloutContentY: (0, _react.mergeClasses)(cartesianchartClassNames.calloutContentY, baseStyles.calloutContentY /*props.styles?.calloutContentY*/ ),
-        descriptionMessage: (0, _react.mergeClasses)(cartesianchartClassNames.descriptionMessage, baseStyles.descriptionMessage /*props.styles?. descriptionMessage*/ )
+        legendContainer: (0, _react.mergeClasses)(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ )
     };
 }; //# sourceMappingURL=useCartesianChartStyles.styles.js.map

package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCartesianChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { HighContrastSelectorBlack, HighContrastSelector } from '../../utilities/index';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useRtl } from '../../utilities/utilities';\n/**\n * @internal\n */ export const cartesianchartClassNames = {\n    root: 'fui-cart__root',\n    chartWrapper: 'fui-cart__chartWrapper',\n    axisTitle: 'fui-cart__axisTitle',\n    xAxis: 'fui-cart__xAxis',\n    yAxis: 'fui-cart__yAxis',\n    opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',\n    legendContainer: 'fui-cart__legendContainer',\n    calloutContentRoot: 'fui-cart__calloutContentRoot',\n    calloutDateTimeContainer: 'fui-cart__calloutDateTimeContainer',\n    calloutContentX: 'fui-cart__calloutContentX',\n    calloutBlockContainer: 'fui-cart__calloutBlockContainer',\n    calloutBlockContainertoDrawShapefalse: 'fui-cart__calloutBlockContainertoDrawShapefalse',\n    calloutBlockContainertoDrawShapetrue: 'fui-cart__calloutBlockContainertoDrawShapetrue',\n    shapeStyles: 'fui-cart__shapeStyles',\n    calloutlegendText: 'fui-cart__calloutlegendText',\n    calloutContentY: 'fui-cart__calloutContentY',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    hover: 'fui-cart__hover',\n    calloutInfoContainer: 'fui-cart__calloutInfoContainer',\n    tooltip: 'fui-cart__tooltip',\n    chartTitle: 'fui-cart__chartTitle'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        ...typographyStyles.body1,\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden'\n    },\n    chartWrapper: {\n        overflow: 'auto'\n    },\n    axisTitle: {\n        ...typographyStyles.caption2Strong,\n        fontStyle: 'normal',\n        textAlign: 'center',\n        color: tokens.colorNeutralForeground2,\n        fill: tokens.colorNeutralForeground1\n    },\n    xAxis: {\n        '& text': {\n            fill: tokens.colorNeutralForeground1,\n            ...typographyStyles.caption2Strong,\n            [HighContrastSelectorBlack]: {\n                fill: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            width: '1px',\n            [HighContrastSelectorBlack]: {\n                opacity: 0.1,\n                stroke: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    yAxis: {\n        '& text': {\n            ...typographyStyles.caption2Strong,\n            fill: tokens.colorNeutralForeground1,\n            [HighContrastSelectorBlack]: {\n                fill: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            [HighContrastSelectorBlack]: {\n                opacity: 0.1,\n                stroke: 'rgb(179, 179, 179)',\n                forcedColorAdjust: 'none'\n            }\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    rtl: {\n        '& g': {\n            textAnchor: 'end'\n        }\n    },\n    ltr: {},\n    opacityChangeOnHover: {\n        opacity: '0.1',\n        cursor: 'default'\n    },\n    legendContainer: {\n        marginTop: tokens.spacingVerticalS,\n        marginLeft: tokens.spacingHorizontalXL\n    },\n    calloutContentRoot: {\n        display: 'grid',\n        overflow: 'hidden',\n        ...shorthands.padding('11px 16px 10px 16px'),\n        backgroundColor: tokens.colorNeutralBackground1,\n        backgroundBlendMode: 'normal, luminosity'\n    },\n    calloutDateTimeContainer: {\n        display: 'flex',\n        flexDirection: 'row',\n        justifyContent: 'space-between'\n    },\n    calloutContentX: {\n        ...typographyStyles.caption1,\n        opacity: '0.8',\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainer: {\n        ...typographyStyles.body2,\n        marginTop: '13px',\n        color: tokens.colorNeutralForeground2\n    },\n    calloutBlockContainertoDrawShapefalse: {\n        [HighContrastSelector]: {\n            forcedColorAdjust: 'none'\n        },\n        ...shorthands.borderLeft('4px solid'),\n        paddingLeft: tokens.spacingHorizontalS\n    },\n    calloutBlockContainertoDrawShapetrue: {\n        display: 'flex'\n    },\n    shapeStyles: {\n        marginRight: tokens.spacingHorizontalS\n    },\n    calloutLegendText: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        [HighContrastSelectorBlack]: {\n            color: 'rgb(255, 255, 255)',\n            forcedColorAdjust: 'none'\n        }\n    },\n    calloutContentY: {\n        ...typographyStyles.subtitle2Stronger,\n        [HighContrastSelectorBlack]: {\n            color: 'rgb(255, 255, 255)',\n            forcedColorAdjust: 'none'\n        }\n    },\n    descriptionMessage: {\n        ...typographyStyles.caption1,\n        color: tokens.colorNeutralForeground2,\n        marginTop: tokens.spacingVerticalMNudge,\n        paddingTop: tokens.spacingVerticalMNudge,\n        ...shorthands.borderTop(`1px solid ${tokens.colorNeutralStroke2}`)\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useCartesianChartStyles = (props)=>{\n    const _useRtl = useRtl();\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(cartesianchartClassNames.root, baseStyles.root /*props.styles?.root*/ ),\n        chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, baseStyles.chartWrapper /*props.styles?.chartWrapper*/ ),\n        axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/ ),\n        xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),\n        yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),\n        opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n        legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ ),\n        calloutContentRoot: mergeClasses(cartesianchartClassNames.calloutContentRoot, baseStyles.calloutContentRoot /*props.styles?. calloutContentRoot*/ ),\n        calloutDateTimeContainer: mergeClasses(cartesianchartClassNames.calloutDateTimeContainer, baseStyles.calloutDateTimeContainer /*props.styles?.calloutDateTimeContainer*/ ),\n        calloutContentX: mergeClasses(cartesianchartClassNames.calloutContentX, baseStyles.calloutContentX /*props.styles?.calloutContentX*/ ),\n        calloutBlockContainer: mergeClasses(cartesianchartClassNames.calloutBlockContainer, baseStyles.calloutBlockContainer /*props.styles?.calloutBlockContainer*/ ),\n        calloutBlockContainertoDrawShapefalse: mergeClasses(cartesianchartClassNames.calloutBlockContainertoDrawShapefalse, baseStyles.calloutBlockContainertoDrawShapefalse /*props.styles?.calloutBlockContainertoDrawShapefalse*/ ),\n        calloutBlockContainertoDrawShapetrue: mergeClasses(cartesianchartClassNames.calloutBlockContainertoDrawShapetrue, baseStyles.calloutBlockContainertoDrawShapetrue /*props.styles?.calloutBlockContainertoDrawShapetrue*/ ),\n        shapeStyles: mergeClasses(cartesianchartClassNames.shapeStyles, baseStyles.shapeStyles /*props.styles?.shapeStyles*/ ),\n        calloutlegendText: mergeClasses(cartesianchartClassNames.calloutlegendText, baseStyles.calloutLegendText /*props.styles?.calloutlegendText*/ ),\n        calloutContentY: mergeClasses(cartesianchartClassNames.calloutContentY, baseStyles.calloutContentY /*props.styles?.calloutContentY*/ ),\n        descriptionMessage: mergeClasses(cartesianchartClassNames.descriptionMessage, baseStyles.descriptionMessage /*props.styles?. descriptionMessage*/ )\n    };\n};\n"],"names":["cartesianchartClassNames","useCartesianChartStyles","root","chartWrapper","axisTitle","xAxis","yAxis","opacityChangeOnHover","legendContainer","calloutContentRoot","calloutDateTimeContainer","calloutContentX","calloutBlockContainer","calloutBlockContainertoDrawShapefalse","calloutBlockContainertoDrawShapetrue","shapeStyles","calloutlegendText","calloutContentY","descriptionMessage","hover","calloutInfoContainer","tooltip","chartTitle","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","a9b677","Bqenvij","Beiy3e4","B68tc82","Bmxbyg5","Bpg54ce","B80ckks","fsow6f","sj55zd","Bkfmm31","Bifops1","lr70ht","D01gh","vxuu72","lclgl4","Dzfv0s","s17mou","jxu3ei","B3i31d3","Bhcy8il","t7r2jy","Bpf2t2a","J19x1g","se2xxg","rtl","Bkw34lo","ltr","abs64n","Bceei9c","B6of3ja","Frg6f3","z8tnut","z189sj","Byoj8tv","uwmqm3","De3pzq","jy2i9i","Brf1p80","B93v9kj","ibv6hh","t21cq0","calloutLegendText","Bd6j3yi","hbub2c","B4j52fo","d","p","m","props","_useRtl","useRtl","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["useCartesianChartStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useRtl } from '../../utilities/utilities';\n/**\n * @internal\n */ export const cartesianchartClassNames = {\n    root: 'fui-cart__root',\n    chartWrapper: 'fui-cart__chartWrapper',\n    axisTitle: 'fui-cart__axisTitle',\n    xAxis: 'fui-cart__xAxis',\n    yAxis: 'fui-cart__yAxis',\n    opacityChangeOnHover: 'fui-cart__opacityChangeOnHover',\n    legendContainer: 'fui-cart__legendContainer',\n    shapeStyles: 'fui-cart__shapeStyles',\n    descriptionMessage: 'fui-cart__descriptionMessage',\n    hover: 'fui-cart__hover',\n    tooltip: 'fui-cart__tooltip',\n    chartTitle: 'fui-cart__chartTitle'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        ...typographyStyles.body1,\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden'\n    },\n    chartWrapper: {\n        overflow: 'auto'\n    },\n    axisTitle: {\n        ...typographyStyles.caption2Strong,\n        fontStyle: 'normal',\n        textAlign: 'center',\n        color: tokens.colorNeutralForeground2,\n        fill: tokens.colorNeutralForeground1\n    },\n    xAxis: {\n        '& text': {\n            fill: tokens.colorNeutralForeground1,\n            ...typographyStyles.caption2Strong,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            width: '1px',\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    yAxis: {\n        '& text': {\n            ...typographyStyles.caption2Strong,\n            fill: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& line': {\n            opacity: 0.2,\n            stroke: tokens.colorNeutralForeground1,\n            forcedColorAdjust: 'auto'\n        },\n        '& path': {\n            display: 'none'\n        }\n    },\n    rtl: {\n        '& g': {\n            textAnchor: 'end'\n        }\n    },\n    ltr: {},\n    opacityChangeOnHover: {\n        opacity: '0.1',\n        cursor: 'default'\n    },\n    legendContainer: {\n        marginTop: tokens.spacingVerticalS,\n        marginLeft: tokens.spacingHorizontalXL\n    }\n});\n/**\n * Apply styling to the Carousel slots based on the state\n */ export const useCartesianChartStyles = (props)=>{\n    const _useRtl = useRtl();\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(cartesianchartClassNames.root, baseStyles.root /*props.styles?.root*/ ),\n        chartWrapper: mergeClasses(cartesianchartClassNames.chartWrapper, baseStyles.chartWrapper /*props.styles?.chartWrapper*/ ),\n        axisTitle: mergeClasses(cartesianchartClassNames.axisTitle, baseStyles.axisTitle /*props.styles?.axisTitle*/ ),\n        xAxis: mergeClasses(cartesianchartClassNames.xAxis, baseStyles.xAxis /*props.styles?.xAxis*/ ),\n        yAxis: mergeClasses(cartesianchartClassNames.yAxis, baseStyles.yAxis, _useRtl ? baseStyles.rtl : baseStyles.ltr /*props.styles?.yAxis*/ ),\n        opacityChangeOnHover: mergeClasses(cartesianchartClassNames.opacityChangeOnHover, baseStyles.opacityChangeOnHover /*props.styles?.opacityChangeOnHover*/ ),\n        legendContainer: mergeClasses(cartesianchartClassNames.legendContainer, baseStyles.legendContainer /*props.styles?.legendContainer*/ )\n    };\n};\n"],"names":["cartesianchartClassNames","useCartesianChartStyles","root","chartWrapper","axisTitle","xAxis","yAxis","opacityChangeOnHover","legendContainer","shapeStyles","descriptionMessage","hover","tooltip","chartTitle","useStyles","__styles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","a9b677","Bqenvij","Beiy3e4","B68tc82","Bmxbyg5","Bpg54ce","B80ckks","fsow6f","sj55zd","Bkfmm31","Bifops1","lr70ht","D01gh","vxuu72","lclgl4","zp1vxd","jxu3ei","B3i31d3","Bhcy8il","z3m6do","se2xxg","rtl","Bkw34lo","ltr","abs64n","Bceei9c","B6of3ja","Frg6f3","d","p","props","_useRtl","useRtl","baseStyles","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKiBA,wBAAwB;eAAxBA;;IAmFAC,uBAAuB;eAAvBA;;;uBAxFwB;2BAElB;AAGZ,MAAMD,2BAA2B;IACxCE,MAAM;IACNC,cAAc;IACdC,WAAW;IACXC,OAAO;IACPC,OAAO;IACPC,sBAAsB;IACtBC,iBAAiB;IACjBC,aAAa;IACbC,oBAAoB;IACpBC,OAAO;IACPC,SAAS;IACTC,YAAY;AAChB;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAb,MAAA;QAAAc,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAvB,cAAA;QAAAqB,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;IAAAtB,WAAA;QAAAY,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAQ,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;IAAA;IAAAzB,OAAA;QAAA0B,SAAA;QAAAC,QAAA;QAAAC,OAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;IAAA;IAAAnC,OAAA;QAAA0B,QAAA;QAAAC,OAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAJ,SAAA;QAAAK,QAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAE,QAAA;QAAAC,QAAA;IAAA;IAAAC,KAAA;QAAAC,SAAA;IAAA;IAAAC,KAAA,CAAA;IAAArC,sBAAA;QAAAsC,QAAA;QAAAC,SAAA;IAAA;IAAAtC,iBAAA;QAAAuC,SAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;AAmEX,MAAMjD,0BAA2BkD,CAAAA;IACxC,MAAMC,UAAUC,IAAAA,iBAAM;IACtB,MAAMC,aAAaxC;IACnB,OAAO;QACHZ,MAAMqD,IAAAA,mBAAY,EAACvD,yBAAyBE,IAAI,EAAEoD,WAAWpD,IAAI,CAAC,oBAAA;QAClEC,cAAcoD,IAAAA,mBAAY,EAACvD,yBAAyBG,YAAY,EAAEmD,WAAWnD,YAAY,CAAC,4BAAA;QAC1FC,WAAWmD,IAAAA,mBAAY,EAACvD,yBAAyBI,SAAS,EAAEkD,WAAWlD,SAAS,CAAC,yBAAA;QACjFC,OAAOkD,IAAAA,mBAAY,EAACvD,yBAAyBK,KAAK,EAAEiD,WAAWjD,KAAK,CAAC,qBAAA;QACrEC,OAAOiD,IAAAA,mBAAY,EAACvD,yBAAyBM,KAAK,EAAEgD,WAAWhD,KAAK,EAAE8C,UAAUE,WAAWZ,GAAG,GAAGY,WAAWV,GAAG,CAAC,qBAAA;QAChHrC,sBAAsBgD,IAAAA,mBAAY,EAACvD,yBAAyBO,oBAAoB,EAAE+C,WAAW/C,oBAAoB,CAAC,oCAAA;QAClHC,iBAAiB+C,IAAAA,mBAAY,EAACvD,yBAAyBQ,eAAe,EAAE8C,WAAW9C,eAAe,CAAC,+BAAA;IACvG;AACJ"}

package/lib-commonjs/components/CommonComponents/useChartPopoverStyles.styles.js

@@ -76,19 +76,20 @@ const popoverClassNames = {
         Be2twd7: "fy9rknc",
         Bhrd7zp: "figsok6",
         Bg96gwp: "fwrc4pm",
-        B6of3ja: "f7jvbu2"
+        B6of3ja: "f7jvbu2",
+        Bvjb7m6: "fdgv6k0"
     },
     calloutBlockContainerNonCartesian: {
         Be2twd7: "fojgt09",
         Bg96gwp: "f82itaf",
-        bo4z9n: "fg7a56h"
+        Bvjb7m6: "fdgv6k0"
     },
     calloutBlockContainertoDrawShapefalse: {
-        bo4z9n: "fg7a56h",
         uwmqm3: [
             "f1f5gg8d",
             "f1vdfbxk"
-        ]
+        ],
+        Bvjb7m6: "fdgv6k0"
     },
     calloutBlockContainertoDrawShapetrue: {
         mc9l5x: "fwk3njj"
@@ -105,10 +106,10 @@ const popoverClassNames = {
         Bhrd7zp: "figsok6",
         Bg96gwp: "fwrc4pm",
         sj55zd: "fkfq4zb",
-        B1cpy0k: "fig6os7"
+        Bvjb7m6: "fhv2zbx"
     },
     calloutContentY: {
-        B1cpy0k: "fig6os7"
+        Bvjb7m6: "fhv2zbx"
     },
     calloutContentYCartesian: {
         Bahqtrf: "fk6fouc",
@@ -159,12 +160,10 @@ const popoverClassNames = {
         uwmqm3: [
             "f1f5gg8d",
             "f1vdfbxk"
-        ]
+        ],
+        Bvjb7m6: "fdgv6k0"
     },
-    calloutContainer: {
-        a6j6cd: "f1j86lqe",
-        B93v9kj: "f15mrrko"
-    }
+    calloutContainer: {}
 }, {
     d: [
         ".f1bxpd7w{display:contents;}",
@@ -190,6 +189,7 @@ const popoverClassNames = {
         ".fp25eh{opacity:0.8;}",
         ".fkfq4zb{color:var(--colorNeutralForeground2);}",
         ".f7jvbu2{margin-top:13px;}",
+        ".fdgv6k0{forced-color-adjust:none;}",
         ".fojgt09{font-size:var(--fontSizeHero700);}",
         ".f82itaf{line-height:22px;}",
         ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
@@ -197,6 +197,7 @@ const popoverClassNames = {
         ".fwk3njj{display:inline-grid;}",
         ".f1vcna3q{margin-right:var(--spacingHorizontalS);}",
         ".foyynoy{margin-left:var(--spacingHorizontalS);}",
+        ".fhv2zbx{forced-color-adjust:auto;}",
         ".fod5ikn{font-size:var(--fontSizeBase400);}",
         ".flh3ekv{font-weight:var(--fontWeightBold);}",
         ".faaz57k{line-height:var(--lineHeightBase400);}",
@@ -210,32 +211,6 @@ const popoverClassNames = {
         ".f1t5qyk5{margin-left:var(--spacingHorizontalSNudge);}",
         ".f1ikr372{margin-right:var(--spacingHorizontalSNudge);}",
         ".f19n0e5{color:var(--colorNeutralForeground1);}"
-    ],
-    m: [
-        [
-            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.fg7a56h selectors{forced-color-adjust:none;}}",
-            {
-                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: white-on-black),screen and (forced-colors: active) and (prefers-color-scheme: dark){.fig6os7 selectors{color:rgb(255, 255, 255);}}",
-            {
-                m: "screen and (-ms-high-contrast: white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f1j86lqe{fill:WindowText;}}",
-            {
-                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
-            }
-        ],
-        [
-            "@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f15mrrko{forced-color-adjust:none;}}",
-            {
-                m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
-            }
-        ]
     ]
 });
 const usePopoverStyles_unstable = (props)=>{