@fluentui/react-charting 5.12.26 → 5.12.29

package/lib-amd/components/CommonComponents/CartesianChart.base.js.map

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.base.js","sourceRoot":"../src/","sources":["components/CommonComponents/CartesianChart.base.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { IProcessedStyleSet } from '@fluentui/react/lib/Styling';\nimport { classNamesFunction, getId, getRTL } from '@fluentui/react/lib/Utilities';\nimport { Callout } from '@fluentui/react/lib/Callout';\nimport { FocusZone, FocusZoneDirection } from '@fluentui/react-focus';\nimport {\n  ICartesianChartStyles,\n  ICartesianChartStyleProps,\n  IModifiedCartesianChartProps,\n  IYValueHover,\n} from '../../index';\nimport {\n  ChartHoverCard,\n  convertToLocaleString,\n  createNumericXAxis,\n  createStringXAxis,\n  IAxisData,\n  getAccessibleDataObject,\n  getDomainNRangeValues,\n  createDateXAxis,\n  createYAxis,\n  createStringYAxis,\n  IMargins,\n  getMinMaxOfYAxis,\n  XAxisTypes,\n  YAxisType,\n  createWrapOfXLabels,\n  rotateXAxisLabels,\n  Points,\n  pointTypes,\n} from '../../utilities/index';\nimport { LegendShape, Shape } from '../Legends/index';\n\nconst getClassNames = classNamesFunction<ICartesianChartStyleProps, ICartesianChartStyles>();\n\nexport interface ICartesianChartState {\n  containerWidth: number;\n  containerHeight: number;\n  _width: number;\n  _height: number;\n  /* To update this values using setState in render method.\n   * To avoid multiple re renders, Only first time setting the value.\n   */\n  isRemoveValCalculated?: boolean;\n  /* Used for when WrapXAxisLabels props appeared.\n   * To display the total word (space separated words), Need to have more space than usual.\n   * This height will get total height need to disaply total word.\n   * These value need to be removed from actual svg height/graph height.\n   * Defalut value is 0. And this values calculted when 'wrapXAxisLables' or 'showXAxisLablesTooltip' is true.\n   */\n  _removalValueForTextTuncate?: number;\n}\n\n/**\n * Cartesian chart used for\n * 1.draw X and Y axis of the chart\n * 2.Callout\n * 3.Fit parent Continer\n */\nexport class CartesianChartBase extends React.Component<IModifiedCartesianChartProps, ICartesianChartState> {\n  private _classNames: IProcessedStyleSet<ICartesianChartStyles>;\n  private chartContainer: HTMLDivElement;\n  private legendContainer: HTMLDivElement;\n  private minLegendContainerHeight: number = 32;\n  private xAxisElement: SVGElement | null;\n  private yAxisElement: SVGElement | null;\n  private margins: IMargins;\n  private idForGraph: string;\n  private _reqID: number;\n  private _isRtl: boolean = getRTL();\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private _xScale: any;\n\n  constructor(props: IModifiedCartesianChartProps) {\n    super(props);\n    this.state = {\n      containerHeight: 0,\n      containerWidth: 0,\n      _width: this.props.width || 600,\n      _height: this.props.height || 350,\n      _removalValueForTextTuncate: 0,\n      isRemoveValCalculated: true,\n    };\n    this.idForGraph = getId('chart_');\n    /**\n     * In RTL mode, Only graph will be rendered left/right. We need to provide left and right margins manually.\n     * So that, in RTL, left margins becomes right margins and viceversa.\n     * As graph needs to be drawn perfecty, these values consider as default values.\n     * Same margins using for all other cartesian charts. Can be accessible through 'getMargins' call back method.\n     */\n    this.margins = {\n      top: this.props.margins?.top ?? 20,\n      bottom: this.props.margins?.bottom ?? 35,\n      right: this._isRtl ? this.props.margins?.left ?? 40 : this.props.margins?.right ?? 20,\n      left: this._isRtl ? this.props.margins?.right ?? 20 : this.props.margins?.left ?? 40,\n    };\n  }\n\n  public componentDidMount(): void {\n    this._fitParentContainer();\n  }\n\n  public componentWillUnmount(): void {\n    cancelAnimationFrame(this._reqID);\n  }\n\n  public componentDidUpdate(prevProps: IModifiedCartesianChartProps): void {\n    if (prevProps.height !== this.props.height || prevProps.width !== this.props.width) {\n      this._fitParentContainer();\n    }\n\n    if (\n      !this.props.wrapXAxisLables &&\n      this.props.rotateXAxisLables &&\n      this.props.xAxisType! === XAxisTypes.StringAxis\n    ) {\n      const rotateLabelProps = {\n        node: this.xAxisElement,\n        xAxis: this._xScale,\n      };\n      const rotatedHeight = rotateXAxisLabels(rotateLabelProps);\n      if (\n        this.state.isRemoveValCalculated &&\n        this.state._removalValueForTextTuncate !== rotatedHeight! + this.margins.bottom! &&\n        rotatedHeight! > 0\n      ) {\n        this.setState({\n          _removalValueForTextTuncate: rotatedHeight! + this.margins.bottom!,\n          isRemoveValCalculated: false,\n        });\n      }\n    }\n  }\n\n  public render(): JSX.Element {\n    const { calloutProps, points, chartType, chartHoverProps, svgFocusZoneProps, svgProps, culture } = this.props;\n    if (this.props.parentRef) {\n      this._fitParentContainer();\n    }\n    // Callback for margins to the chart\n    this.props.getmargins && this.props.getmargins(this.margins);\n\n    const XAxisParams = {\n      domainNRangeValues: getDomainNRangeValues(\n        points,\n        this.margins,\n        this.state.containerWidth,\n        chartType,\n        this._isRtl,\n        this.props.xAxisType,\n        this.props.barwidth!,\n        this.props.tickValues!,\n      ),\n      xAxisElement: this.xAxisElement!,\n      showRoundOffXTickValues: true,\n      xAxisCount: this.props.xAxisTickCount,\n      xAxistickSize: this.props.xAxistickSize,\n      tickPadding: this.props.tickPadding || this.props.showXAxisLablesTooltip ? 5 : 10,\n      xAxisPadding: this.props.xAxisPadding,\n    };\n\n    const YAxisParams = {\n      margins: this.margins,\n      containerWidth: this.state.containerWidth,\n      containerHeight: this.state.containerHeight - this.state._removalValueForTextTuncate!,\n      yAxisElement: this.yAxisElement,\n      yAxisTickFormat: this.props.yAxisTickFormat!,\n      yAxisTickCount: this.props.yAxisTickCount!,\n      yMinValue: this.props.yMinValue || 0,\n      yMaxValue: this.props.yMaxValue || 0,\n      tickPadding: 10,\n      maxOfYVal: this.props.maxOfYVal,\n      yMinMaxValues: getMinMaxOfYAxis(points, chartType),\n      yAxisPadding: this.props.yAxisPadding,\n    };\n\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let xScale: any;\n    switch (this.props.xAxisType!) {\n      case XAxisTypes.NumericAxis:\n        xScale = createNumericXAxis(XAxisParams, culture);\n        break;\n      case XAxisTypes.DateAxis:\n        xScale = createDateXAxis(XAxisParams, this.props.tickParams!);\n        break;\n      case XAxisTypes.StringAxis:\n        xScale = createStringXAxis(XAxisParams, this.props.tickParams!, this.props.datasetForXAxisDomain!, culture);\n        break;\n      default:\n        xScale = createNumericXAxis(XAxisParams, culture);\n    }\n    this._xScale = xScale;\n\n    /*\n     * To enable wrapping of x axis tick values or to disaply complete x axis tick values,\n     * we need to calculate how much space it needed to render the text.\n     * No need to re-calculate every time the chart renders and same time need to get an update. So using setState.\n     * Required space will be calculated first time chart rendering and if any width/height of chart updated.\n     * */\n    if (this.props.wrapXAxisLables || this.props.showXAxisLablesTooltip) {\n      const wrapLabelProps = {\n        node: this.xAxisElement,\n        xAxis: xScale,\n        showXAxisLablesTooltip: this.props.showXAxisLablesTooltip || false,\n        noOfCharsToTruncate: this.props.noOfCharsToTruncate || 4,\n      };\n      const temp = xScale && (createWrapOfXLabels(wrapLabelProps) as number);\n      // this value need to be updated for draw graph updated. So instead of using private value, using set state.\n      if (this.state.isRemoveValCalculated && this.state._removalValueForTextTuncate !== temp) {\n        this.setState({ _removalValueForTextTuncate: temp, isRemoveValCalculated: false });\n      }\n    }\n\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let yScale: any;\n    const axisData: IAxisData = { yAxisDomainValues: [] };\n    if (this.props.yAxisType && this.props.yAxisType === YAxisType.StringAxis) {\n      yScale = createStringYAxis(YAxisParams, this.props.stringDatasetForYAxisDomain!, this._isRtl);\n    } else {\n      yScale = createYAxis(YAxisParams, this._isRtl, axisData);\n    }\n    this.props.getAxisData && this.props.getAxisData(axisData);\n    // Callback function for chart, returns axis\n    this._getData(xScale, yScale);\n\n    this._classNames = getClassNames(this.props.styles!, {\n      theme: this.props.theme!,\n      width: this.state._width,\n      height: this.state._height,\n      className: this.props.className,\n      isRtl: this._isRtl,\n    });\n\n    const svgDimensions = {\n      width: this.state.containerWidth,\n      height: this.state.containerHeight,\n    };\n\n    const children = this.props.children({\n      ...this.state,\n      xScale,\n      yScale,\n    });\n\n    let focusDirection;\n    if (this.props.focusZoneDirection === FocusZoneDirection.vertical) {\n      focusDirection = this.props.focusZoneDirection;\n    } else if (this.props.focusZoneDirection) {\n      focusDirection = this.props.focusZoneDirection;\n    } else {\n      focusDirection = FocusZoneDirection.horizontal;\n    }\n    return (\n      <div\n        id={this.idForGraph}\n        className={this._classNames.root}\n        role={'presentation'}\n        ref={(rootElem: HTMLDivElement) => (this.chartContainer = rootElem)}\n        onMouseLeave={this.props.onChartMouseLeave}\n      >\n        <FocusZone direction={focusDirection} {...svgFocusZoneProps}>\n          <svg\n            width={svgDimensions.width}\n            height={svgDimensions.height}\n            aria-label={this.props.chartTitle}\n            style={{ display: 'block' }}\n            {...svgProps}\n          >\n            <g\n              ref={(e: SVGElement | null) => {\n                this.xAxisElement = e;\n              }}\n              id={`xAxisGElement${this.idForGraph}`}\n              // To add wrap of x axis lables feature, need to remove word height from svg height.\n              transform={`translate(0, ${\n                svgDimensions.height - this.margins.bottom! - this.state._removalValueForTextTuncate!\n              })`}\n              className={this._classNames.xAxis}\n            />\n            <g\n              ref={(e: SVGElement | null) => {\n                this.yAxisElement = e;\n              }}\n              id={`yAxisGElement${this.idForGraph}`}\n              transform={`translate(${\n                this._isRtl ? svgDimensions.width - this.margins.right! : this.margins.left!\n              }, 0)`}\n              className={this._classNames.yAxis}\n            />\n            {children}\n          </svg>\n        </FocusZone>\n        {!this.props.hideLegend && (\n          <div ref={(e: HTMLDivElement) => (this.legendContainer = e)} className={this._classNames.legendContainer}>\n            {this.props.legendBars}\n          </div>\n        )}\n        {!this.props.hideTooltip && calloutProps!.isCalloutVisible && (\n          <Callout {...calloutProps}>\n            {/** Given custom callout, then it will render */}\n            {this.props.customizedCallout && this.props.customizedCallout}\n            {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n            {!this.props.customizedCallout && this.props.isCalloutForStack && this._multiValueCallout(calloutProps)}\n            {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n            {!this.props.customizedCallout && !this.props.isCalloutForStack && (\n              <ChartHoverCard\n                XValue={calloutProps.XValue}\n                Legend={calloutProps.legend!}\n                YValue={calloutProps.YValue!}\n                color={calloutProps.color!}\n                culture={this.props.culture}\n                {...chartHoverProps}\n              />\n            )}\n          </Callout>\n        )}\n      </div>\n    );\n  }\n\n  // TO DO: Write a common functional component for Multi value callout and divide sub count method\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private _multiValueCallout = (calloutProps: any) => {\n    const yValueHoverSubCountsExists: boolean = this._yValueHoverSubCountsExists(calloutProps.YValueHover);\n    return (\n      <div className={this._classNames.calloutContentRoot}>\n        <div\n          className={this._classNames.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={this._classNames.calloutContentX}\n            {...getAccessibleDataObject(calloutProps!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {convertToLocaleString(calloutProps!.hoverXValue, this.props.culture)}\n          </div>\n        </div>\n        <div\n          className={this._classNames.calloutInfoContainer}\n          style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}\n        >\n          {calloutProps!.YValueHover &&\n            calloutProps!.YValueHover.map((yValue: IYValueHover, index: number, yValues: IYValueHover[]) => {\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 ${this.props.theme!.semanticColors.menuDivider}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${this.props.theme!.semanticColors.menuDivider}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {this._getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!calloutProps.descriptionMessage && (\n            <div className={this._classNames.descriptionMessage}>{calloutProps.descriptionMessage}</div>\n          )}\n        </div>\n      </div>\n    );\n  };\n\n  private _yValueHoverSubCountsExists(yValueHover?: IYValueHover[]) {\n    if (yValueHover) {\n      return 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    return false;\n  }\n\n  private _getCalloutContent(\n    xValue: IYValueHover,\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 _classNames = getClassNames(this.props.styles!, {\n      theme: this.props.theme!,\n      width: this.state._width,\n      height: this.state._height,\n      className: this.props.className,\n      isRtl: this._isRtl,\n      lineColor: xValue.color,\n      toDrawShape,\n    });\n\n    const { culture } = this.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 id={`${index}_${xValue.y}`} className={_classNames.calloutBlockContainer}>\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: _classNames.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div>\n              <div className={_classNames.calloutlegendText}> {xValue.legend}</div>\n              <div className={_classNames.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={_classNames.calloutBlockContainer}>\n                <div className={_classNames.calloutlegendText}> {convertToLocaleString(subcountName, culture)}</div>\n                <div className={_classNames.calloutContentY}>\n                  {convertToLocaleString(subcounts[subcountName], culture)}\n                </div>\n              </div>\n            );\n          })}\n        </div>\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  private _fitParentContainer(): void {\n    const { containerWidth, containerHeight } = this.state;\n    this._reqID = requestAnimationFrame(() => {\n      let legendContainerHeight;\n      if (this.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 = getComputedStyle(this.legendContainer);\n        legendContainerHeight =\n          (this.legendContainer.getBoundingClientRect().height || this.minLegendContainerHeight) +\n          parseFloat(legendContainerComputedStyles.marginTop || '0') +\n          parseFloat(legendContainerComputedStyles.marginBottom || '0');\n      }\n      const container = this.props.parentRef ? this.props.parentRef : this.chartContainer;\n      const currentContainerWidth = container.getBoundingClientRect().width;\n      const currentContainerHeight =\n        container.getBoundingClientRect().height > legendContainerHeight\n          ? container.getBoundingClientRect().height\n          : 350;\n      const shouldResize =\n        containerWidth !== currentContainerWidth || containerHeight !== currentContainerHeight - legendContainerHeight;\n      if (shouldResize) {\n        this.setState({\n          containerWidth: currentContainerWidth,\n          containerHeight: currentContainerHeight - legendContainerHeight,\n        });\n      }\n    });\n  }\n\n  // Call back to the chart.\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private _getData = (xScale: any, yScale: any) => {\n    this.props.getGraphData &&\n      this.props.getGraphData(\n        xScale,\n        yScale,\n        this.state.containerHeight - this.state._removalValueForTextTuncate!,\n        this.state.containerWidth,\n        this.xAxisElement,\n      );\n  };\n}\n"]}
+{"version":3,"file":"CartesianChart.base.js","sourceRoot":"../src/","sources":["components/CommonComponents/CartesianChart.base.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { IProcessedStyleSet } from '@fluentui/react/lib/Styling';\nimport { classNamesFunction, getId, getRTL } from '@fluentui/react/lib/Utilities';\nimport { Callout } from '@fluentui/react/lib/Callout';\nimport { FocusZone, FocusZoneDirection } from '@fluentui/react-focus';\nimport {\n  ICartesianChartStyles,\n  ICartesianChartStyleProps,\n  IModifiedCartesianChartProps,\n  IYValueHover,\n} from '../../index';\nimport {\n  ChartHoverCard,\n  convertToLocaleString,\n  createNumericXAxis,\n  createStringXAxis,\n  IAxisData,\n  getAccessibleDataObject,\n  getDomainNRangeValues,\n  createDateXAxis,\n  createYAxis,\n  createStringYAxis,\n  IMargins,\n  getMinMaxOfYAxis,\n  XAxisTypes,\n  YAxisType,\n  createWrapOfXLabels,\n  rotateXAxisLabels,\n  Points,\n  pointTypes,\n} from '../../utilities/index';\nimport { LegendShape, Shape } from '../Legends/index';\n\nconst getClassNames = classNamesFunction<ICartesianChartStyleProps, ICartesianChartStyles>();\n\nexport interface ICartesianChartState {\n  containerWidth: number;\n  containerHeight: number;\n  _width: number;\n  _height: number;\n  /* To update this values using setState in render method.\n   * To avoid multiple re renders, Only first time setting the value.\n   */\n  isRemoveValCalculated?: boolean;\n  /* Used for when WrapXAxisLabels props appeared.\n   * To display the total word (space separated words), Need to have more space than usual.\n   * This height will get total height need to disaply total word.\n   * These value need to be removed from actual svg height/graph height.\n   * Defalut value is 0. And this values calculted when 'wrapXAxisLables' or 'showXAxisLablesTooltip' is true.\n   */\n  _removalValueForTextTuncate?: number;\n}\n\n/**\n * Cartesian chart used for\n * 1.draw X and Y axis of the chart\n * 2.Callout\n * 3.Fit parent Continer\n */\nexport class CartesianChartBase extends React.Component<IModifiedCartesianChartProps, ICartesianChartState> {\n  private _classNames: IProcessedStyleSet<ICartesianChartStyles>;\n  private chartContainer: HTMLDivElement;\n  private legendContainer: HTMLDivElement;\n  private minLegendContainerHeight: number = 32;\n  private xAxisElement: SVGElement | null;\n  private yAxisElement: SVGElement | null;\n  private margins: IMargins;\n  private idForGraph: string;\n  private _reqID: number;\n  private _isRtl: boolean = getRTL();\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private _xScale: any;\n\n  constructor(props: IModifiedCartesianChartProps) {\n    super(props);\n    this.state = {\n      containerHeight: 0,\n      containerWidth: 0,\n      _width: this.props.width || 600,\n      _height: this.props.height || 350,\n      _removalValueForTextTuncate: 0,\n      isRemoveValCalculated: true,\n    };\n    this.idForGraph = getId('chart_');\n    /**\n     * In RTL mode, Only graph will be rendered left/right. We need to provide left and right margins manually.\n     * So that, in RTL, left margins becomes right margins and viceversa.\n     * As graph needs to be drawn perfecty, these values consider as default values.\n     * Same margins using for all other cartesian charts. Can be accessible through 'getMargins' call back method.\n     */\n    this.margins = {\n      top: this.props.margins?.top ?? 20,\n      bottom: this.props.margins?.bottom ?? 35,\n      right: this._isRtl ? this.props.margins?.left ?? 40 : this.props.margins?.right ?? 20,\n      left: this._isRtl ? this.props.margins?.right ?? 20 : this.props.margins?.left ?? 40,\n    };\n  }\n\n  public componentDidMount(): void {\n    this._fitParentContainer();\n  }\n\n  public componentWillUnmount(): void {\n    cancelAnimationFrame(this._reqID);\n  }\n\n  public componentDidUpdate(prevProps: IModifiedCartesianChartProps): void {\n    if (prevProps.height !== this.props.height || prevProps.width !== this.props.width) {\n      this._fitParentContainer();\n    }\n\n    if (\n      !this.props.wrapXAxisLables &&\n      this.props.rotateXAxisLables &&\n      this.props.xAxisType! === XAxisTypes.StringAxis\n    ) {\n      const rotateLabelProps = {\n        node: this.xAxisElement,\n        xAxis: this._xScale,\n      };\n      const rotatedHeight = rotateXAxisLabels(rotateLabelProps);\n      if (\n        this.state.isRemoveValCalculated &&\n        this.state._removalValueForTextTuncate !== rotatedHeight! + this.margins.bottom! &&\n        rotatedHeight! > 0\n      ) {\n        this.setState({\n          _removalValueForTextTuncate: rotatedHeight! + this.margins.bottom!,\n          isRemoveValCalculated: false,\n        });\n      }\n    }\n  }\n\n  public render(): JSX.Element {\n    const { calloutProps, points, chartType, chartHoverProps, svgFocusZoneProps, svgProps, culture } = this.props;\n    if (this.props.parentRef) {\n      this._fitParentContainer();\n    }\n    // Callback for margins to the chart\n    this.props.getmargins && this.props.getmargins(this.margins);\n\n    const XAxisParams = {\n      domainNRangeValues: getDomainNRangeValues(\n        points,\n        this.margins,\n        this.state.containerWidth,\n        chartType,\n        this._isRtl,\n        this.props.xAxisType,\n        this.props.barwidth!,\n        this.props.tickValues!,\n      ),\n      xAxisElement: this.xAxisElement!,\n      showRoundOffXTickValues: true,\n      xAxisCount: this.props.xAxisTickCount,\n      xAxistickSize: this.props.xAxistickSize,\n      tickPadding: this.props.tickPadding || this.props.showXAxisLablesTooltip ? 5 : 10,\n      xAxisPadding: this.props.xAxisPadding,\n    };\n\n    const YAxisParams = {\n      margins: this.margins,\n      containerWidth: this.state.containerWidth,\n      containerHeight: this.state.containerHeight - this.state._removalValueForTextTuncate!,\n      yAxisElement: this.yAxisElement,\n      yAxisTickFormat: this.props.yAxisTickFormat!,\n      yAxisTickCount: this.props.yAxisTickCount!,\n      yMinValue: this.props.yMinValue || 0,\n      yMaxValue: this.props.yMaxValue || 0,\n      tickPadding: 10,\n      maxOfYVal: this.props.maxOfYVal,\n      yMinMaxValues: getMinMaxOfYAxis(points, chartType),\n      yAxisPadding: this.props.yAxisPadding,\n    };\n\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let xScale: any;\n    switch (this.props.xAxisType!) {\n      case XAxisTypes.NumericAxis:\n        xScale = createNumericXAxis(XAxisParams, culture);\n        break;\n      case XAxisTypes.DateAxis:\n        xScale = createDateXAxis(XAxisParams, this.props.tickParams!);\n        break;\n      case XAxisTypes.StringAxis:\n        xScale = createStringXAxis(XAxisParams, this.props.tickParams!, this.props.datasetForXAxisDomain!, culture);\n        break;\n      default:\n        xScale = createNumericXAxis(XAxisParams, culture);\n    }\n    this._xScale = xScale;\n\n    /*\n     * To enable wrapping of x axis tick values or to display complete x axis tick values,\n     * we need to calculate how much space it needed to render the text.\n     * No need to re-calculate every time the chart renders and same time need to get an update. So using setState.\n     * Required space will be calculated first time chart rendering and if any width/height of chart updated.\n     * */\n    if (this.props.wrapXAxisLables || this.props.showXAxisLablesTooltip) {\n      const wrapLabelProps = {\n        node: this.xAxisElement,\n        xAxis: xScale,\n        showXAxisLablesTooltip: this.props.showXAxisLablesTooltip || false,\n        noOfCharsToTruncate: this.props.noOfCharsToTruncate || 4,\n      };\n      const temp = xScale && (createWrapOfXLabels(wrapLabelProps) as number);\n      // this value need to be updated for draw graph updated. So instead of using private value, using set state.\n      if (this.state.isRemoveValCalculated && this.state._removalValueForTextTuncate !== temp) {\n        this.setState({ _removalValueForTextTuncate: temp, isRemoveValCalculated: false });\n      }\n    }\n\n    /**\n     * These scales used for 2 purposes.\n     * 1. To create x and y axis\n     * 2. To draw the graph.\n     * For area/line chart using same scales. For other charts, creating their own scales to draw the graph.\n     */\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    let yScale: any;\n    const axisData: IAxisData = { yAxisDomainValues: [] };\n    if (this.props.yAxisType && this.props.yAxisType === YAxisType.StringAxis) {\n      yScale = createStringYAxis(YAxisParams, this.props.stringDatasetForYAxisDomain!, this._isRtl);\n    } else {\n      yScale = createYAxis(YAxisParams, this._isRtl, axisData);\n    }\n    this.props.getAxisData && this.props.getAxisData(axisData);\n    // Callback function for chart, returns axis\n    this._getData(xScale, yScale);\n\n    this._classNames = getClassNames(this.props.styles!, {\n      theme: this.props.theme!,\n      width: this.state._width,\n      height: this.state._height,\n      className: this.props.className,\n      isRtl: this._isRtl,\n    });\n\n    const svgDimensions = {\n      width: this.state.containerWidth,\n      height: this.state.containerHeight,\n    };\n\n    const children = this.props.children({\n      ...this.state,\n      xScale,\n      yScale,\n    });\n\n    let focusDirection;\n    if (this.props.focusZoneDirection === FocusZoneDirection.vertical) {\n      focusDirection = this.props.focusZoneDirection;\n    } else if (this.props.focusZoneDirection) {\n      focusDirection = this.props.focusZoneDirection;\n    } else {\n      focusDirection = FocusZoneDirection.horizontal;\n    }\n    return (\n      <div\n        id={this.idForGraph}\n        className={this._classNames.root}\n        role={'presentation'}\n        ref={(rootElem: HTMLDivElement) => (this.chartContainer = rootElem)}\n        onMouseLeave={this.props.onChartMouseLeave}\n      >\n        <FocusZone direction={focusDirection} {...svgFocusZoneProps}>\n          <svg\n            width={svgDimensions.width}\n            height={svgDimensions.height}\n            aria-label={this.props.chartTitle}\n            style={{ display: 'block' }}\n            {...svgProps}\n          >\n            <g\n              ref={(e: SVGElement | null) => {\n                this.xAxisElement = e;\n              }}\n              id={`xAxisGElement${this.idForGraph}`}\n              // To add wrap of x axis lables feature, need to remove word height from svg height.\n              transform={`translate(0, ${\n                svgDimensions.height - this.margins.bottom! - this.state._removalValueForTextTuncate!\n              })`}\n              className={this._classNames.xAxis}\n            />\n            <g\n              ref={(e: SVGElement | null) => {\n                this.yAxisElement = e;\n              }}\n              id={`yAxisGElement${this.idForGraph}`}\n              transform={`translate(${\n                this._isRtl ? svgDimensions.width - this.margins.right! : this.margins.left!\n              }, 0)`}\n              className={this._classNames.yAxis}\n            />\n            {children}\n          </svg>\n        </FocusZone>\n        {!this.props.hideLegend && (\n          <div ref={(e: HTMLDivElement) => (this.legendContainer = e)} className={this._classNames.legendContainer}>\n            {this.props.legendBars}\n          </div>\n        )}\n        {!this.props.hideTooltip && calloutProps!.isCalloutVisible && (\n          <Callout {...calloutProps}>\n            {/** Given custom callout, then it will render */}\n            {this.props.customizedCallout && this.props.customizedCallout}\n            {/** single x point its corresponding y points of all the bars/lines in chart will render in callout */}\n            {!this.props.customizedCallout && this.props.isCalloutForStack && this._multiValueCallout(calloutProps)}\n            {/** single x point its corresponding y point of single line/bar in the chart will render in callout */}\n            {!this.props.customizedCallout && !this.props.isCalloutForStack && (\n              <ChartHoverCard\n                XValue={calloutProps.XValue}\n                Legend={calloutProps.legend!}\n                YValue={calloutProps.YValue!}\n                color={calloutProps.color!}\n                culture={this.props.culture}\n                {...chartHoverProps}\n              />\n            )}\n          </Callout>\n        )}\n      </div>\n    );\n  }\n\n  // TO DO: Write a common functional component for Multi value callout and divide sub count method\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private _multiValueCallout = (calloutProps: any) => {\n    const yValueHoverSubCountsExists: boolean = this._yValueHoverSubCountsExists(calloutProps.YValueHover);\n    return (\n      <div className={this._classNames.calloutContentRoot}>\n        <div\n          className={this._classNames.calloutDateTimeContainer}\n          style={yValueHoverSubCountsExists ? { marginBottom: '11px' } : {}}\n        >\n          <div\n            className={this._classNames.calloutContentX}\n            {...getAccessibleDataObject(calloutProps!.xAxisCalloutAccessibilityData, 'text', false)}\n          >\n            {convertToLocaleString(calloutProps!.hoverXValue, this.props.culture)}\n          </div>\n        </div>\n        <div\n          className={this._classNames.calloutInfoContainer}\n          style={yValueHoverSubCountsExists ? { display: 'flex' } : {}}\n        >\n          {calloutProps!.YValueHover &&\n            calloutProps!.YValueHover.map((yValue: IYValueHover, index: number, yValues: IYValueHover[]) => {\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 ${this.props.theme!.semanticColors.menuDivider}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                      : {\n                          ...(shouldDrawBorderBottom && {\n                            borderBottom: `1px solid ${this.props.theme!.semanticColors.menuDivider}`,\n                            paddingBottom: '10px',\n                          }),\n                        }\n                  }\n                >\n                  {this._getCalloutContent(yValue, index, yValueHoverSubCountsExists, isLast)}\n                </div>\n              );\n            })}\n          {!!calloutProps.descriptionMessage && (\n            <div className={this._classNames.descriptionMessage}>{calloutProps.descriptionMessage}</div>\n          )}\n        </div>\n      </div>\n    );\n  };\n\n  private _yValueHoverSubCountsExists(yValueHover?: IYValueHover[]) {\n    if (yValueHover) {\n      return 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    return false;\n  }\n\n  private _getCalloutContent(\n    xValue: IYValueHover,\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 _classNames = getClassNames(this.props.styles!, {\n      theme: this.props.theme!,\n      width: this.state._width,\n      height: this.state._height,\n      className: this.props.className,\n      isRtl: this._isRtl,\n      lineColor: xValue.color,\n      toDrawShape,\n    });\n\n    const { culture } = this.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 id={`${index}_${xValue.y}`} className={_classNames.calloutBlockContainer}>\n            {toDrawShape && (\n              <Shape\n                svgProps={{\n                  className: _classNames.shapeStyles,\n                }}\n                pathProps={{ fill: xValue.color }}\n                shape={Points[xValue.index! % Object.keys(pointTypes).length] as LegendShape}\n              />\n            )}\n            <div>\n              <div className={_classNames.calloutlegendText}> {xValue.legend}</div>\n              <div className={_classNames.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={_classNames.calloutBlockContainer}>\n                <div className={_classNames.calloutlegendText}> {convertToLocaleString(subcountName, culture)}</div>\n                <div className={_classNames.calloutContentY}>\n                  {convertToLocaleString(subcounts[subcountName], culture)}\n                </div>\n              </div>\n            );\n          })}\n        </div>\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  private _fitParentContainer(): void {\n    const { containerWidth, containerHeight } = this.state;\n    this._reqID = requestAnimationFrame(() => {\n      let legendContainerHeight;\n      if (this.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 = getComputedStyle(this.legendContainer);\n        legendContainerHeight =\n          (this.legendContainer.getBoundingClientRect().height || this.minLegendContainerHeight) +\n          parseFloat(legendContainerComputedStyles.marginTop || '0') +\n          parseFloat(legendContainerComputedStyles.marginBottom || '0');\n      }\n      const container = this.props.parentRef ? this.props.parentRef : this.chartContainer;\n      const currentContainerWidth = container.getBoundingClientRect().width;\n      const currentContainerHeight =\n        container.getBoundingClientRect().height > legendContainerHeight\n          ? container.getBoundingClientRect().height\n          : 350;\n      const shouldResize =\n        containerWidth !== currentContainerWidth || containerHeight !== currentContainerHeight - legendContainerHeight;\n      if (shouldResize) {\n        this.setState({\n          containerWidth: currentContainerWidth,\n          containerHeight: currentContainerHeight - legendContainerHeight,\n        });\n      }\n    });\n  }\n\n  // Call back to the chart.\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  private _getData = (xScale: any, yScale: any) => {\n    this.props.getGraphData &&\n      this.props.getGraphData(\n        xScale,\n        yScale,\n        this.state.containerHeight - this.state._removalValueForTextTuncate!,\n        this.state.containerWidth,\n        this.xAxisElement,\n      );\n  };\n}\n"]}

package/lib-amd/components/CommonComponents/CartesianChart.types.d.ts

@@ -33,7 +33,7 @@ export interface ICartesianChartStyleProps {
      */
     href?: string;
     /**
-     * prop to check if the chart is selcted or hovered upon to determine opacity
+     * prop to check if the chart is selected or hovered upon to determine opacity
      */
     shouldHighlight?: boolean;
     /**
@@ -91,17 +91,20 @@ export interface ICartesianChartStyles {
      */
     calloutDateTimeContainer?: IStyle;
     /**
-     * styles for callout Date time container
+     * styles for callout info container
      */
     calloutInfoContainer?: IStyle;
     /**
-     * styles for callout Date time container
+     * styles for callout block container
      */
     calloutBlockContainer?: IStyle;
     /**
-     * styles for callout y-content
+     * styles for callout legend text
      */
     calloutlegendText?: IStyle;
+    /**
+     * styles for tooltip
+     */
     tooltip?: IStyle;
     /**
      * Style for the chart Title.
@@ -112,7 +115,7 @@ export interface ICartesianChartStyles {
      */
     opacityChangeOnHover?: IStyle;
     /**
-     * styles set for the shape object in the callout
+     * styles for the shape object in the callout
      */
     shapeStyles?: IStyle;
 }
@@ -163,8 +166,9 @@ export interface ICartesianChartProps {
      */
     tickValues?: number[] | Date[];
     /**
-     * the format in for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'
-     * Please look at https://www.npmjs.com/package/d3-time-format for all the formats supported
+     * the format for the data on x-axis. For date object this can be specified to your requirement. Eg: '%m/%d', '%d'
+     * Please look at https://github.com/d3/d3-time-format for all the formats supported for date axis
+     * Only applicable for date axis. For y-axis format use yAxisTickFormat prop.
      */
     tickFormat?: string;
     /**
@@ -172,7 +176,7 @@ export interface ICartesianChartProps {
      */
     strokeWidth?: number;
     /**
-     * x Axis labels tick padding
+     * x Axis labels tick padding. This defines the gap between tick labels and tick lines.
      * @default 10
      */
     xAxisTickPadding?: number;
@@ -192,22 +196,23 @@ export interface ICartesianChartProps {
     yMaxValue?: number;
     /**
      * Number of ticks on the y-axis.
-     * Tick count should be factor of difference between (yMinValue, yMaxValue)
+     * Tick count should be factor of difference between (yMinValue, yMaxValue)?
      * @default 4
      */
     yAxisTickCount?: number;
     /**
-     * defines the number of ticks on the x-axis
+     * defines the number of ticks on the x-axis. Tries to match the nearest interval satisfying the count.
+     * Does not work for string axis.
      * @default 6
      */
     xAxisTickCount?: number;
     /**
-     * define the size of the tick on the x-axis
+     * define the size of the tick lines on the x-axis
      * @default 10
      */
     xAxistickSize?: number;
     /**
-     * define the space between the tick and the data point
+     * defines the space between the tick line and the data label
      * @default 10
      */
     tickPadding?: number;
@@ -247,7 +252,7 @@ export interface ICartesianChartProps {
     noOfCharsToTruncate?: number;
     /**
      * @default false
-     * Used to display x axis labels values (whole value)
+     * Used to wrap x axis labels values (whole value)
      */
     wrapXAxisLables?: boolean;
     /**
@@ -309,7 +314,7 @@ export interface IModifiedCartesianChartProps extends ICartesianChartProps {
     /** Y axis type */
     yAxisType?: YAxisType;
     /**
-     * Legeds of the chart.
+     * Legends of the chart.
      */
     legendBars: JSX.Element;
     /**
@@ -344,6 +349,7 @@ export interface IModifiedCartesianChartProps extends ICartesianChartProps {
     barwidth?: number;
     /**
      * Used for tick styles of the x axis of the chart
+     * Tick params are applicable for date axis only.
      */
     tickParams?: {
         tickValues?: number[] | Date[];
@@ -357,9 +363,12 @@ export interface IModifiedCartesianChartProps extends ICartesianChartProps {
      * it's padding between bar's or lines in the graph
      */
     yAxisPadding?: number;
+    /**
+     * Children elements specific to derived chart types.
+     */
     children(props: IChildProps): React.ReactNode;
     /**
-     * To enable callout for bar. Using for only Vertical stacked bar chart.
+     * To enable callout for individualbar or complete stack. Using for only Vertical stacked bar chart.
      * @default false
      * @type {boolean}
      */
@@ -389,7 +398,7 @@ export interface IModifiedCartesianChartProps extends ICartesianChartProps {
      */
     svgFocusZoneProps?: IFocusZoneProps;
     /**
-     * The prop used to define the culture to localized the numbers
+     * The prop used to define the culture to localize the numbers
      */
     culture?: string;
     getAxisData?: any;

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

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.types.js","sourceRoot":"../src/","sources":["components/CommonComponents/CartesianChart.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { ITheme, IStyle } from '@fluentui/react/lib/Styling';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps, FocusZoneDirection } from '@fluentui/react-focus';\nimport { ICalloutProps } from '@fluentui/react/lib/Callout';\nimport { ILegendsProps } from '../Legends/index';\nimport { IAccessibilityProps, IMargins } from '../../types/index';\nimport { ChartTypes, IChartHoverCardProps, XAxisTypes, YAxisType } from '../../utilities/index';\n\nexport interface ICartesianChartStyleProps {\n  /**\n   * Theme (provided through customization.)\n   */\n  theme: ITheme;\n\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 selcted or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check if the Page is in Rtl\n   */\n  isRtl?: 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\nexport interface ICartesianChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: IStyle;\n\n  /**\n   * Style for the element containing the x-axis.\n   */\n  xAxis?: IStyle;\n\n  /**\n   * Style for the element containing the y-axis.\n   */\n  yAxis?: IStyle;\n\n  /**\n   * Style for legend container\n   */\n  legendContainer?: IStyle;\n\n  /**\n   * line hover box css\n   */\n  hover?: IStyle;\n\n  /**\n   * styles for callout root-content\n   */\n  calloutContentRoot?: IStyle;\n\n  /**\n   * styles for callout x-content\n   */\n  calloutContentX?: IStyle;\n\n  /**\n   * styles for callout y-content\n   */\n  calloutContentY?: IStyle;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: IStyle;\n\n  /**\n   * styles for callout Date time container\n   */\n  calloutDateTimeContainer?: IStyle;\n\n  /**\n   * styles for callout Date time container\n   */\n  calloutInfoContainer?: IStyle;\n\n  /**\n   * styles for callout Date time container\n   */\n  calloutBlockContainer?: IStyle;\n\n  /**\n   * styles for callout y-content\n   */\n  calloutlegendText?: IStyle;\n\n  tooltip?: IStyle;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: IStyle;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover?: IStyle;\n\n  /**\n   * styles set for the shape object in the callout\n   */\n  shapeStyles?: IStyle;\n}\n\nexport interface ICartesianChartProps {\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   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\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?: IMargins;\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[];\n\n  /**\n   * the format in 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://www.npmjs.com/package/d3-time-format for all the formats supported\n   */\n  tickFormat?: string;\n\n  /**\n   * Width of line stroke\n   */\n  strokeWidth?: number;\n\n  /**\n   * x Axis labels tick padding\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   * 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   * 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\n   * @default 6\n   */\n  xAxisTickCount?: number;\n\n  /**\n   * define the size of the tick on the x-axis\n   * @default 10\n   */\n  xAxistickSize?: number;\n\n  /**\n   * define the space between the tick and the data point\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  /**\n   * Label to apply to the whole chart.\n   * @deprecated - Use your chart label for the chart.\n   */\n  chartLabel?: string;\n\n  /**\n   * overflow props for the legends\n   */\n  legendsOverflowProps?: Partial<IOverflowSetProps>;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /**\n   * focus zone props in hover card for legends\n   */\n  focusZonePropsForLegendsInHoverCard?: IFocusZoneProps;\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<ILegendsProps>;\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 display 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; // check for RTL\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<ICartesianChartStyleProps, ICartesianChartStyles>;\n\n  /**\n   * Callout customization props\n   */\n  calloutProps?: Partial<ICalloutProps>;\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\nexport interface IYValueHover {\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?: IAccessibilityProps;\n}\n\nexport interface IChildProps {\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  containerHeight?: number;\n  containerWidth?: number;\n}\n\n// Only used for Cartesian chart base\nexport interface IModifiedCartesianChartProps extends ICartesianChartProps {\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   * Legeds of the chart.\n   */\n  legendBars: JSX.Element;\n\n  /**\n   * Callout props\n   */\n  calloutProps: Partial<ICalloutProps> & {\n    isCalloutVisible: boolean;\n    id: string;\n    YValueHover?: IYValueHover[];\n    hoverXValue?: string | number | null;\n    legend?: string;\n    color?: string;\n    YValue?: string | number;\n    XValue?: string;\n    descriptionMessage?: string;\n  };\n\n  /**\n   * Callback method used for to get margins to the chart.\n   */\n  getmargins?: (margins: IMargins) => 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   */\n  tickParams?: {\n    tickValues?: number[] | Date[];\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  children(props: IChildProps): React.ReactNode;\n\n  /**\n   * To enable callout for bar. 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   * Focus zone direction to the chart\n   * @default FocusZoneDirection.horizontal\n   */\n  focusZoneDirection?: FocusZoneDirection;\n\n  /**\n   * props to send into the chart hover card\n   */\n  chartHoverProps?: IChartHoverCardProps;\n\n  /**\n   * props to send to the focuszone\n   */\n  svgFocusZoneProps?: IFocusZoneProps;\n\n  /**\n   * The prop used to define the culture to localized the numbers\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"]}
+{"version":3,"file":"CartesianChart.types.js","sourceRoot":"../src/","sources":["components/CommonComponents/CartesianChart.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { ITheme, IStyle } from '@fluentui/react/lib/Styling';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps, FocusZoneDirection } from '@fluentui/react-focus';\nimport { ICalloutProps } from '@fluentui/react/lib/Callout';\nimport { ILegendsProps } from '../Legends/index';\nimport { IAccessibilityProps, IMargins } from '../../types/index';\nimport { ChartTypes, IChartHoverCardProps, XAxisTypes, YAxisType } from '../../utilities/index';\n\nexport interface ICartesianChartStyleProps {\n  /**\n   * Theme (provided through customization.)\n   */\n  theme: ITheme;\n\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  isRtl?: 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\nexport interface ICartesianChartStyles {\n  /**\n   *  Style for the root element.\n   */\n  root?: IStyle;\n\n  /**\n   * Style for the element containing the x-axis.\n   */\n  xAxis?: IStyle;\n\n  /**\n   * Style for the element containing the y-axis.\n   */\n  yAxis?: IStyle;\n\n  /**\n   * Style for legend container\n   */\n  legendContainer?: IStyle;\n\n  /**\n   * line hover box css\n   */\n  hover?: IStyle;\n\n  /**\n   * styles for callout root-content\n   */\n  calloutContentRoot?: IStyle;\n\n  /**\n   * styles for callout x-content\n   */\n  calloutContentX?: IStyle;\n\n  /**\n   * styles for callout y-content\n   */\n  calloutContentY?: IStyle;\n\n  /**\n   * styles for description message\n   */\n  descriptionMessage?: IStyle;\n\n  /**\n   * styles for callout Date time container\n   */\n  calloutDateTimeContainer?: IStyle;\n\n  /**\n   * styles for callout info container\n   */\n  calloutInfoContainer?: IStyle;\n\n  /**\n   * styles for callout block container\n   */\n  calloutBlockContainer?: IStyle;\n\n  /**\n   * styles for callout legend text\n   */\n  calloutlegendText?: IStyle;\n\n  /**\n   * styles for tooltip\n   */\n  tooltip?: IStyle;\n\n  /**\n   * Style for the chart Title.\n   */\n  chartTitle?: IStyle;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover?: IStyle;\n\n  /**\n   * styles for the shape object in the callout\n   */\n  shapeStyles?: IStyle;\n}\n\nexport interface ICartesianChartProps {\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   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\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?: IMargins;\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[];\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   * 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   * 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  /**\n   * Label to apply to the whole chart.\n   * @deprecated - Use your chart label for the chart.\n   */\n  chartLabel?: string;\n\n  /**\n   * overflow props for the legends\n   */\n  legendsOverflowProps?: Partial<IOverflowSetProps>;\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  legendsOverflowText?: any;\n\n  /**\n   * focus zone props in hover card for legends\n   */\n  focusZonePropsForLegendsInHoverCard?: IFocusZoneProps;\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<ILegendsProps>;\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; // check for RTL\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<ICartesianChartStyleProps, ICartesianChartStyles>;\n\n  /**\n   * Callout customization props\n   */\n  calloutProps?: Partial<ICalloutProps>;\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\nexport interface IYValueHover {\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?: IAccessibilityProps;\n}\n\nexport interface IChildProps {\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  containerHeight?: number;\n  containerWidth?: number;\n}\n\n// Only used for Cartesian chart base\nexport interface IModifiedCartesianChartProps extends ICartesianChartProps {\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;\n\n  /**\n   * Callout props\n   */\n  calloutProps: Partial<ICalloutProps> & {\n    isCalloutVisible: boolean;\n    id: string;\n    YValueHover?: IYValueHover[];\n    hoverXValue?: string | number | null;\n    legend?: string;\n    color?: string;\n    YValue?: string | number;\n    XValue?: string;\n    descriptionMessage?: string;\n  };\n\n  /**\n   * Callback method used for to get margins to the chart.\n   */\n  getmargins?: (margins: IMargins) => 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[];\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: IChildProps): React.ReactNode;\n\n  /**\n   * To enable callout for individualbar 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   * Focus zone direction to the chart\n   * @default FocusZoneDirection.horizontal\n   */\n  focusZoneDirection?: FocusZoneDirection;\n\n  /**\n   * props to send into the chart hover card\n   */\n  chartHoverProps?: IChartHoverCardProps;\n\n  /**\n   * props to send to the focuszone\n   */\n  svgFocusZoneProps?: IFocusZoneProps;\n\n  /**\n   * The prop used to define the culture to localize the numbers\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"]}

package/lib-amd/components/Legends/Legends.types.d.ts

@@ -84,7 +84,7 @@ export interface ILegend {
      */
     shape?: LegendShape;
     /**
-     * Indicated whether of not to apply stripe pattern
+     * Indicated whether or not to apply stripe pattern
      */
     stripePattern?: boolean;
     /**

package/lib-amd/components/Legends/Legends.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Legends.types.js","sourceRoot":"../src/","sources":["components/Legends/Legends.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ITheme, IStyle } from '@fluentui/react/lib/Styling';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IHoverCardStyleProps, IHoverCardStyles } from '@fluentui/react/lib/HoverCard';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps } from '@fluentui/react-focus';\nimport { CustomPoints, Points } from '../../utilities/utilities';\n\nexport interface ILegendOverflowData {\n  primary: ILegend[];\n\n  overflow?: ILegend[];\n}\n\nexport interface ILegendSubComponentStyles {\n  hoverCardStyles: IStyleFunctionOrObject<IHoverCardStyleProps, IHoverCardStyles>;\n}\n\nexport interface ILegendsStyles {\n  /**\n   * Style set for the root of the legend component\n   */\n  root: IStyle;\n\n  /**\n   * Style set for Legend. This is a wrapping class for text of legend and the rectange box that represents a legend\n   */\n  legend: IStyle;\n\n  /**\n   * Style set for the rectangle that represents a legend\n   */\n  rect: IStyle;\n\n  /**\n   * styles set for the shape that represents a legend\n   */\n  shape: IStyle;\n\n  /**\n   * Style set for the triangle that represents a legend\n   */\n  triangle: IStyle;\n\n  /**\n   * Style for the legend text\n   */\n  text: IStyle;\n\n  /**\n   * Style for the legend text\n   */\n  hoverChange: IStyle;\n\n  /**\n   * Style for the text that indicates the no.of legends that are in hovercard due to lack of space\n   */\n  overflowIndicationTextStyle: IStyle;\n\n  /**\n   * Style for the overflow container\n   */\n  hoverCardRoot: IStyle;\n\n  /**\n   * sub component styles\n   */\n  subComponentStyles: ILegendSubComponentStyles;\n}\n\nexport interface ILegend {\n  /**\n   * Defines the title of the legend\n   */\n  title: string;\n\n  /**\n   * Defines the function that is executed on clicking this legend\n   */\n  action?: VoidFunction;\n\n  /**\n   * Defines the function that is executed upon hovering over the legend\n   */\n  hoverAction?: VoidFunction;\n\n  /**\n   * Defines the function that is executed upon moving the mouse away from the legend\n   */\n  onMouseOutAction?: (isLegendFocused?: boolean) => void;\n\n  /**\n   * The color for the legend\n   */\n  color: string;\n\n  /**\n   * The opacity of the legend color\n   */\n  opacity?: number;\n\n  /**\n   * The shape for the legend\n   */\n  shape?: LegendShape;\n\n  /**\n   * Indicated whether of not to apply stripe pattern\n   */\n  stripePattern?: boolean;\n\n  /**\n   * Indicates if the legend belongs to a line in the Bar Chart\n   */\n  isLineLegendInBarChart?: boolean;\n\n  /*\n   *  native button props for the legend button\n   */\n  nativeButtonProps?: React.ButtonHTMLAttributes<HTMLButtonElement>;\n}\n\nexport interface ILegendStyleProps {\n  theme?: ITheme;\n  className?: string;\n  colorOnSelectedState?: string;\n  borderColor?: string;\n  opacity?: number;\n  overflow?: boolean;\n  stripePattern?: boolean;\n  isLineLegendInBarChart?: boolean;\n}\n\nexport interface ILegendsProps {\n  /**\n   * Prop that takes list of legends\n   */\n  legends: ILegend[];\n\n  /**\n   * Additional CSS class(es) to apply to the legneds component.\n   */\n  className?: string;\n\n  /**\n   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<ILegendStyleProps, ILegendsStyles>;\n\n  /**\n   * This prop makes the legends component align itself to the center in the container it is sitting in\n   */\n  centerLegends?: boolean;\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  enabledWrapLines?: boolean;\n\n  /**\n   * props for the overflow set component\n   */\n  overflowProps?: Partial<IOverflowSetProps>;\n\n  /**\n   * focus zone props in hover card\n   */\n  focusZonePropsInHoverCard?: IFocusZoneProps;\n\n  /**\n   * text for overflow legends string\n   */\n  overflowText?: string;\n\n  /**\n   * Prop that takes the active legend\n   */\n  selectedLegend?: string;\n\n  /**\n   * prop that decides if legends are focusable\n   * @default true\n   */\n  allowFocusOnLegends?: boolean;\n\n  /**\n   * prop that decide if we can select multiple legends or single legend at a time\n   * @default false\n   */\n  canSelectMultipleLegends?: boolean;\n\n  /**\n   * Defines the function that is executed upon hiding of hover card\n   * make sure to send prop  when  the prop  is canSelectMultipleLegends is set to ture\n   * and empty the selecetd state legends\n   */\n  onLegendHoverCardLeave?: VoidFunction;\n}\n\n/**\n * The shape for the legend\n * default: show the rect legend\n * triangle: show the triangle legend\n */\nexport type LegendShape = 'default' | 'triangle' | keyof typeof Points | keyof typeof CustomPoints;\n"]}
+{"version":3,"file":"Legends.types.js","sourceRoot":"../src/","sources":["components/Legends/Legends.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ITheme, IStyle } from '@fluentui/react/lib/Styling';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IHoverCardStyleProps, IHoverCardStyles } from '@fluentui/react/lib/HoverCard';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps } from '@fluentui/react-focus';\nimport { CustomPoints, Points } from '../../utilities/utilities';\n\nexport interface ILegendOverflowData {\n  primary: ILegend[];\n\n  overflow?: ILegend[];\n}\n\nexport interface ILegendSubComponentStyles {\n  hoverCardStyles: IStyleFunctionOrObject<IHoverCardStyleProps, IHoverCardStyles>;\n}\n\nexport interface ILegendsStyles {\n  /**\n   * Style set for the root of the legend component\n   */\n  root: IStyle;\n\n  /**\n   * Style set for Legend. This is a wrapping class for text of legend and the rectange box that represents a legend\n   */\n  legend: IStyle;\n\n  /**\n   * Style set for the rectangle that represents a legend\n   */\n  rect: IStyle;\n\n  /**\n   * styles set for the shape that represents a legend\n   */\n  shape: IStyle;\n\n  /**\n   * Style set for the triangle that represents a legend\n   */\n  triangle: IStyle;\n\n  /**\n   * Style for the legend text\n   */\n  text: IStyle;\n\n  /**\n   * Style for the legend text\n   */\n  hoverChange: IStyle;\n\n  /**\n   * Style for the text that indicates the no.of legends that are in hovercard due to lack of space\n   */\n  overflowIndicationTextStyle: IStyle;\n\n  /**\n   * Style for the overflow container\n   */\n  hoverCardRoot: IStyle;\n\n  /**\n   * sub component styles\n   */\n  subComponentStyles: ILegendSubComponentStyles;\n}\n\nexport interface ILegend {\n  /**\n   * Defines the title of the legend\n   */\n  title: string;\n\n  /**\n   * Defines the function that is executed on clicking this legend\n   */\n  action?: VoidFunction;\n\n  /**\n   * Defines the function that is executed upon hovering over the legend\n   */\n  hoverAction?: VoidFunction;\n\n  /**\n   * Defines the function that is executed upon moving the mouse away from the legend\n   */\n  onMouseOutAction?: (isLegendFocused?: boolean) => void;\n\n  /**\n   * The color for the legend\n   */\n  color: string;\n\n  /**\n   * The opacity of the legend color\n   */\n  opacity?: number;\n\n  /**\n   * The shape for the legend\n   */\n  shape?: LegendShape;\n\n  /**\n   * Indicated whether or not to apply stripe pattern\n   */\n  stripePattern?: boolean;\n\n  /**\n   * Indicates if the legend belongs to a line in the Bar Chart\n   */\n  isLineLegendInBarChart?: boolean;\n\n  /*\n   *  native button props for the legend button\n   */\n  nativeButtonProps?: React.ButtonHTMLAttributes<HTMLButtonElement>;\n}\n\nexport interface ILegendStyleProps {\n  theme?: ITheme;\n  className?: string;\n  colorOnSelectedState?: string;\n  borderColor?: string;\n  opacity?: number;\n  overflow?: boolean;\n  stripePattern?: boolean;\n  isLineLegendInBarChart?: boolean;\n}\n\nexport interface ILegendsProps {\n  /**\n   * Prop that takes list of legends\n   */\n  legends: ILegend[];\n\n  /**\n   * Additional CSS class(es) to apply to the legneds component.\n   */\n  className?: string;\n\n  /**\n   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<ILegendStyleProps, ILegendsStyles>;\n\n  /**\n   * This prop makes the legends component align itself to the center in the container it is sitting in\n   */\n  centerLegends?: boolean;\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  enabledWrapLines?: boolean;\n\n  /**\n   * props for the overflow set component\n   */\n  overflowProps?: Partial<IOverflowSetProps>;\n\n  /**\n   * focus zone props in hover card\n   */\n  focusZonePropsInHoverCard?: IFocusZoneProps;\n\n  /**\n   * text for overflow legends string\n   */\n  overflowText?: string;\n\n  /**\n   * Prop that takes the active legend\n   */\n  selectedLegend?: string;\n\n  /**\n   * prop that decides if legends are focusable\n   * @default true\n   */\n  allowFocusOnLegends?: boolean;\n\n  /**\n   * prop that decide if we can select multiple legends or single legend at a time\n   * @default false\n   */\n  canSelectMultipleLegends?: boolean;\n\n  /**\n   * Defines the function that is executed upon hiding of hover card\n   * make sure to send prop  when  the prop  is canSelectMultipleLegends is set to ture\n   * and empty the selecetd state legends\n   */\n  onLegendHoverCardLeave?: VoidFunction;\n}\n\n/**\n * The shape for the legend\n * default: show the rect legend\n * triangle: show the triangle legend\n */\nexport type LegendShape = 'default' | 'triangle' | keyof typeof Points | keyof typeof CustomPoints;\n"]}

package/lib-amd/components/Sparkline/Sparkline.styles.js

@@ -7,7 +7,7 @@ define(["require", "exports", "tslib"], function (require, exports, tslib_1) {
             inlineBlock: {
                 display: 'inline',
             },
-            valueText: tslib_1.__assign({}, props.theme.fonts.smallPlus),
+            valueText: tslib_1.__assign(tslib_1.__assign({}, props.theme.fonts.smallPlus), { fill: props.theme.palette.black }),
         };
     };
     exports.getStyles = getStyles;

package/lib-amd/components/Sparkline/Sparkline.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sparkline.styles.js","sourceRoot":"../src/","sources":["components/Sparkline/Sparkline.styles.ts"],"names":[],"mappings":";;;;IAEO,IAAM,SAAS,GAAG,UAAC,KAA2B;QACnD,OAAO;YACL,WAAW,EAAE;gBACX,OAAO,EAAE,QAAQ;aAClB;YACD,SAAS,uBACJ,KAAK,CAAC,KAAM,CAAC,KAAK,CAAC,SAAS,CAChC;SACF,CAAC;IACJ,CAAC,CAAC;IATW,QAAA,SAAS,aASpB","sourcesContent":["import { ISparklineStyleProps, ISparklineStyles } from './Sparkline.types';\n\nexport const getStyles = (props: ISparklineStyleProps): ISparklineStyles => {\n  return {\n    inlineBlock: {\n      display: 'inline',\n    },\n    valueText: {\n      ...props.theme!.fonts.smallPlus,\n    },\n  };\n};\n"]}
+{"version":3,"file":"Sparkline.styles.js","sourceRoot":"../src/","sources":["components/Sparkline/Sparkline.styles.ts"],"names":[],"mappings":";;;;IAEO,IAAM,SAAS,GAAG,UAAC,KAA2B;QACnD,OAAO;YACL,WAAW,EAAE;gBACX,OAAO,EAAE,QAAQ;aAClB;YACD,SAAS,wCACJ,KAAK,CAAC,KAAM,CAAC,KAAK,CAAC,SAAS,KAC/B,IAAI,EAAE,KAAK,CAAC,KAAM,CAAC,OAAO,CAAC,KAAK,GACjC;SACF,CAAC;IACJ,CAAC,CAAC;IAVW,QAAA,SAAS,aAUpB","sourcesContent":["import { ISparklineStyleProps, ISparklineStyles } from './Sparkline.types';\n\nexport const getStyles = (props: ISparklineStyleProps): ISparklineStyles => {\n  return {\n    inlineBlock: {\n      display: 'inline',\n    },\n    valueText: {\n      ...props.theme!.fonts.smallPlus,\n      fill: props.theme!.palette.black,\n    },\n  };\n};\n"]}

package/lib-amd/components/StackedBarChart/MultiStackedBarChart.types.d.ts

@@ -29,6 +29,7 @@ export interface IMultiStackedBarChartProps {
     theme?: ITheme;
     /**
      * This property tells whether to show ratio on top of stacked bar chart or not.
+     * This property is applicable only if there are 1 or 2 datapoints.
      */
     hideRatio?: boolean[];
     /**
@@ -53,6 +54,7 @@ export interface IMultiStackedBarChartProps {
     href?: string;
     /**
      * If this value is set to true the denominator will not be shown for the ratio above the chart
+     * This prop is applicable only if hide ratio is false and there are exactly 2 datapoints.
      */
     hideDenominator?: boolean[];
     /**

package/lib-amd/components/StackedBarChart/MultiStackedBarChart.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiStackedBarChart.types.js","sourceRoot":"../src/","sources":["components/StackedBarChart/MultiStackedBarChart.types.ts"],"names":[],"mappings":"","sourcesContent":["import { IChartProps, IChartDataPoint } from './index';\nimport { IStyle, ITheme } from '@fluentui/react/lib/Styling';\nimport { ICalloutProps } from '@fluentui/react/lib/Callout';\nimport { IRenderFunction, IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps } from '@fluentui/react-focus';\nimport { ILegendsProps } from '../Legends/index';\n\nexport interface IMultiStackedBarChartProps {\n  /**\n   * An array of chart data points for the multistacked bar chart\n   */\n  data?: IChartProps[];\n\n  /**\n   * Width of bar chart\n   */\n  width?: number;\n\n  /**\n   * Height of bar chart\n   * @default 15\n   */\n  barHeight?: number;\n\n  /**\n   * Additional CSS class(es) to apply to the StackedBarChart.\n   */\n  className?: string;\n\n  /**\n   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\n\n  /**\n   * This property tells whether to show ratio on top of stacked bar chart or not.\n   */\n  hideRatio?: boolean[];\n\n  /**\n   * Do not show the legend at the bottom of chart\n   *\n   * @default false\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Do not show tooltips in chart\n   *\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<IMultiStackedBarChartStyleProps, IMultiStackedBarChartStyles>;\n\n  /**\n   * Url that the data-viz needs to redirect to upon clicking on it\n   */\n  href?: string;\n\n  /**\n   * If this value is set to true the denominator will not be shown for the ratio above the chart\n   */\n  hideDenominator?: boolean[];\n\n  /**\n   * overflow props for legend\n   */\n  legendsOverflowProps?: Partial<IOverflowSetProps>;\n\n  /**\n   * text for overflow legends string\n   */\n  legendsOverflowText?: string;\n\n  /**\n   * focus zone props in hover card for legends\n   */\n  focusZonePropsForLegendsInHoverCard?: IFocusZoneProps;\n\n  /**\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<ILegendsProps>;\n\n  /**\n   * Define a custom callout renderer for a data point\n   */\n  onRenderCalloutPerDataPoint?: IRenderFunction<IChartDataPoint>;\n\n  /**\n   * props for the callout in the chart\n   */\n  calloutProps?: Partial<ICalloutProps>;\n\n  /**\n   * The prop used to define the culture to localized the numbers\n   */\n  culture?: string;\n}\n\nexport interface IMultiStackedBarChartStyleProps {\n  /**\n   * Theme (provided through customization.)\n   */\n  theme: ITheme;\n\n  /**\n   * Additional CSS class(es) to apply to the StackedBarChart.\n   */\n  className?: string;\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * barHeight for each chart\n   */\n  barHeight?: number;\n\n  /**\n   * color of the datapoint legend\n   */\n  legendColor?: string;\n\n  /**\n   * prop to check if the chart is selcted or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check to decide cursor type\n   */\n  href?: string;\n}\n\nexport interface IMultiStackedBarChartStyles {\n  /**\n   * Styling for the root container\n   */\n  root: IStyle;\n\n  /**\n   * Styling for the root container of each chart in the multistacked bar chart\n   */\n  singleChartRoot: IStyle;\n\n  /**\n   * Styling for each item in the container\n   */\n  items: IStyle;\n\n  /**\n   * Styling for each svg in the multistacked bar chart\n   */\n  chart: IStyle;\n\n  /**\n   * Styling for chart title of the stacked bar chart\n   */\n  chartTitle: IStyle;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover: IStyle;\n\n  /**\n   * Style to change the opacity of placeholder data point when we hover a single bar or legend\n   */\n  placeHolderOnHover: IStyle;\n\n  /**\n   * Style for the legends container\n   */\n  legendContainer: IStyle;\n\n  /**\n   * Style for stacked bar chart with no data\n   */\n  noData: IStyle;\n}\n"]}
+{"version":3,"file":"MultiStackedBarChart.types.js","sourceRoot":"../src/","sources":["components/StackedBarChart/MultiStackedBarChart.types.ts"],"names":[],"mappings":"","sourcesContent":["import { IChartProps, IChartDataPoint } from './index';\nimport { IStyle, ITheme } from '@fluentui/react/lib/Styling';\nimport { ICalloutProps } from '@fluentui/react/lib/Callout';\nimport { IRenderFunction, IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps } from '@fluentui/react-focus';\nimport { ILegendsProps } from '../Legends/index';\n\nexport interface IMultiStackedBarChartProps {\n  /**\n   * An array of chart data points for the multistacked bar chart\n   */\n  data?: IChartProps[];\n\n  /**\n   * Width of bar chart\n   */\n  width?: number;\n\n  /**\n   * Height of bar chart\n   * @default 15\n   */\n  barHeight?: number;\n\n  /**\n   * Additional CSS class(es) to apply to the StackedBarChart.\n   */\n  className?: string;\n\n  /**\n   * Theme (provided through customization.)\n   */\n  theme?: ITheme;\n\n  /**\n   * This property tells whether to show ratio on top of stacked bar chart or not.\n   * This property is applicable only if there are 1 or 2 datapoints.\n   */\n  hideRatio?: boolean[];\n\n  /**\n   * Do not show the legend at the bottom of chart\n   *\n   * @default false\n   */\n  hideLegend?: boolean;\n\n  /**\n   * Do not show tooltips in chart\n   *\n   * @default false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules.\n   */\n  styles?: IStyleFunctionOrObject<IMultiStackedBarChartStyleProps, IMultiStackedBarChartStyles>;\n\n  /**\n   * Url that the data-viz needs to redirect to upon clicking on it\n   */\n  href?: string;\n\n  /**\n   * If this value is set to true the denominator will not be shown for the ratio above the chart\n   * This prop is applicable only if hide ratio is false and there are exactly 2 datapoints.\n   */\n  hideDenominator?: boolean[];\n\n  /**\n   * overflow props for legend\n   */\n  legendsOverflowProps?: Partial<IOverflowSetProps>;\n\n  /**\n   * text for overflow legends string\n   */\n  legendsOverflowText?: string;\n\n  /**\n   * focus zone props in hover card for legends\n   */\n  focusZonePropsForLegendsInHoverCard?: IFocusZoneProps;\n\n  /**\n   * props for the legends in the chart\n   */\n  legendProps?: Partial<ILegendsProps>;\n\n  /**\n   * Define a custom callout renderer for a data point\n   */\n  onRenderCalloutPerDataPoint?: IRenderFunction<IChartDataPoint>;\n\n  /**\n   * props for the callout in the chart\n   */\n  calloutProps?: Partial<ICalloutProps>;\n\n  /**\n   * The prop used to define the culture to localized the numbers\n   */\n  culture?: string;\n}\n\nexport interface IMultiStackedBarChartStyleProps {\n  /**\n   * Theme (provided through customization.)\n   */\n  theme: ITheme;\n\n  /**\n   * Additional CSS class(es) to apply to the StackedBarChart.\n   */\n  className?: string;\n\n  /**\n   * Width of the chart.\n   */\n  width?: number;\n\n  /**\n   * barHeight for each chart\n   */\n  barHeight?: number;\n\n  /**\n   * color of the datapoint legend\n   */\n  legendColor?: string;\n\n  /**\n   * prop to check if the chart is selcted or hovered upon to determine opacity\n   */\n  shouldHighlight?: boolean;\n\n  /**\n   * prop to check to decide cursor type\n   */\n  href?: string;\n}\n\nexport interface IMultiStackedBarChartStyles {\n  /**\n   * Styling for the root container\n   */\n  root: IStyle;\n\n  /**\n   * Styling for the root container of each chart in the multistacked bar chart\n   */\n  singleChartRoot: IStyle;\n\n  /**\n   * Styling for each item in the container\n   */\n  items: IStyle;\n\n  /**\n   * Styling for each svg in the multistacked bar chart\n   */\n  chart: IStyle;\n\n  /**\n   * Styling for chart title of the stacked bar chart\n   */\n  chartTitle: IStyle;\n\n  /**\n   * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n   */\n  opacityChangeOnHover: IStyle;\n\n  /**\n   * Style to change the opacity of placeholder data point when we hover a single bar or legend\n   */\n  placeHolderOnHover: IStyle;\n\n  /**\n   * Style for the legends container\n   */\n  legendContainer: IStyle;\n\n  /**\n   * Style for stacked bar chart with no data\n   */\n  noData: IStyle;\n}\n"]}

package/lib-amd/version.js

@@ -1,6 +1,6 @@
 define(["require", "exports", "@fluentui/set-version"], function (require, exports, set_version_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
-    set_version_1.setVersion('@fluentui/react-charting', '5.12.26');
+    set_version_1.setVersion('@fluentui/react-charting', '5.12.29');
 });
 //# sourceMappingURL=version.js.map

package/lib-amd/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;;IAGA,wBAAU,CAAC,0BAA0B,EAAE,SAAS,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.12.26');"]}
+{"version":3,"file":"version.js","sourceRoot":"../src/","sources":["version.ts"],"names":[],"mappings":";;;IAGA,wBAAU,CAAC,0BAA0B,EAAE,SAAS,CAAC,CAAC","sourcesContent":["// Do not modify this file; it is generated as part of publish.\n// The checked in version is a placeholder only and will not be updated.\nimport { setVersion } from '@fluentui/set-version';\nsetVersion('@fluentui/react-charting', '5.12.29');"]}

package/lib-commonjs/components/CommonComponents/CartesianChart.base.js

@@ -156,7 +156,7 @@ var CartesianChartBase = /** @class */ (function (_super) {
         }
         this._xScale = xScale;
         /*
-         * To enable wrapping of x axis tick values or to disaply complete x axis tick values,
+         * To enable wrapping of x axis tick values or to display complete x axis tick values,
          * we need to calculate how much space it needed to render the text.
          * No need to re-calculate every time the chart renders and same time need to get an update. So using setState.
          * Required space will be calculated first time chart rendering and if any width/height of chart updated.