@fluentui/react-charts 0.0.0-nightly-20251127-0406.1 → 0.0.0-nightly-20251128-0406.1

package/CHANGELOG.md

@@ -1,26 +1,26 @@
 # Change Log - @fluentui/react-charts
 
-This log was last generated on Thu, 27 Nov 2025 04:20:44 GMT and should not be manually modified.
+This log was last generated on Fri, 28 Nov 2025 04:21:08 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly-20251127-0406.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v0.0.0-nightly-20251127-0406.1)
+## [0.0.0-nightly-20251128-0406.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v0.0.0-nightly-20251128-0406.1)
 
-Thu, 27 Nov 2025 04:20:44 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.3.6..@fluentui/react-charts_v0.0.0-nightly-20251127-0406.1)
+Fri, 28 Nov 2025 04:21:08 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.3.6..@fluentui/react-charts_v0.0.0-nightly-20251128-0406.1)
 
 ### Changes
 
 - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
-- Bump @fluentui/react-button to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-overflow to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-popover to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-tabster to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-theme to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-tooltip to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
-- Bump @fluentui/react-utilities to v0.0.0-nightly-20251127-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/d47af6f876f379b847740a36e49be6c938b30ef7) by beachball)
+- Bump @fluentui/react-button to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-overflow to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-popover to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-tabster to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-theme to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-tooltip to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
+- Bump @fluentui/react-utilities to v0.0.0-nightly-20251128-0406.1 ([commit](https://github.com/microsoft/fluentui/commit/185ed644940482856381ff7dfb0dc7319c8559bc) by beachball)
 
 ## [9.3.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v9.3.6)
 

package/lib/components/CommonComponents/ChartPopover.js

@@ -37,7 +37,7 @@ combining the logic for Callout and ChartHoverCard in v8 charts. */ export const
         className: classes.calloutContainer
     }, /*#__PURE__*/ React.createElement(Popover, {
         positioning: {
-            target: target,
+            target,
             autoSize: 'always',
             offset: 20,
             coverTarget: false
@@ -79,7 +79,6 @@ combining the logic for Callout and ChartHoverCard in v8 charts. */ export const
     }, formatToLocaleString(props.ratio[1], props.culture))))), !!props.descriptionMessage && /*#__PURE__*/ React.createElement("div", {
         className: classes.descriptionMessage
     }, props.descriptionMessage)))));
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     function _multiValueCallout() {
         var _yValueHoverSubCountsExists1;
         const yValueHoverSubCountsExists = (_yValueHoverSubCountsExists1 = _yValueHoverSubCountsExists(props.YValueHover)) !== null && _yValueHoverSubCountsExists1 !== void 0 ? _yValueHoverSubCountsExists1 : false;

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

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

package/lib/components/DonutChart/Pie/Pie.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/DonutChart/Pie/Pie.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable react/jsx-no-bind */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { pie as d3Pie } from 'd3-shape';\nimport { PieProps } from './index';\nimport { Arc } from '../Arc/index';\nimport { ChartDataPoint } from '../index';\nimport { usePieStyles } from './usePieStyles.styles';\nimport { wrapTextInsideDonut } from '../../../utilities/index';\nconst TEXT_PADDING: number = 5;\n\n// Create a Pie within Donut Chart variant which uses these default styles and this styled subcomponent.\n/**\n * Pie component within Donut Chart.\n * {@docCategory PieDonutChart}\n */\nexport const Pie: React.FunctionComponent<PieProps> = React.forwardRef<HTMLDivElement, PieProps>(\n  (props, forwardedRef) => {\n    React.useEffect(() => {\n      wrapTextInsideDonut(classes.insideDonutString, props.innerRadius! * 2 - TEXT_PADDING);\n    }, []);\n\n    let _totalValue: number;\n    const classes = usePieStyles(props);\n    const pieForFocusRing = d3Pie()\n      .sort(null)\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .value((d: any) => d.data)\n      .padAngle(0);\n\n    function _focusCallback(\n      data: ChartDataPoint,\n      id: string,\n      e: React.FocusEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      props.onFocusCallback!(data, id, e, targetElement);\n    }\n\n    function _hoverCallback(\n      data: ChartDataPoint,\n      e: React.MouseEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      props.hoverOnCallback!(data, e, targetElement);\n    }\n\n    function _computeTotalValue() {\n      let totalValue = 0;\n      props.data.forEach((arc: ChartDataPoint) => {\n        totalValue += arc.data!;\n      });\n      return totalValue;\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    function arcGenerator(\n      d: any,\n      i: number,\n      focusData: any,\n      href?: string,\n    ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n    JSXElement {\n      const color = d && d.data && d.data.color;\n      return (\n        <Arc\n          key={i}\n          data={d}\n          focusData={focusData}\n          innerRadius={props.innerRadius}\n          outerRadius={props.outerRadius}\n          color={color!}\n          onFocusCallback={_focusCallback}\n          hoverOnCallback={_hoverCallback}\n          onBlurCallback={props.onBlurCallback}\n          hoverLeaveCallback={props.hoverLeaveCallback}\n          uniqText={props.uniqText}\n          activeArc={props.activeArc}\n          href={href}\n          calloutId={props.calloutId}\n          valueInsideDonut={props.valueInsideDonut}\n          focusedArcId={props.focusedArcId}\n          showLabelsInPercent={props.showLabelsInPercent}\n          totalValue={_totalValue}\n          hideLabels={props.hideLabels}\n        />\n      );\n    }\n\n    const { data } = props;\n\n    // Filter out data points with value 0 to avoid gaps in the donut chart\n    const filteredData = data.filter((d: ChartDataPoint) => d.data !== 0);\n\n    const focusData = pieForFocusRing(filteredData.map(d => d.data!));\n\n    const piechart = d3Pie<ChartDataPoint>()\n      .sort(null)\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .value((d: any) => d.data)\n      .padAngle(0.02)(filteredData);\n    const translate = `translate(${props.width / 2}, ${props.height / 2})`;\n\n    _totalValue = _computeTotalValue();\n\n    return (\n      <g transform={translate}>\n        {piechart.map((d: any, i: number) => arcGenerator(d, i, focusData[i], props.href))}\n        {props.valueInsideDonut && (\n          <text y={5} textAnchor=\"middle\" dominantBaseline=\"middle\" className={classes.insideDonutString}>\n            {props.valueInsideDonut}\n          </text>\n        )}\n      </g>\n    );\n  },\n);\nPie.displayName = 'Pie';\n"],"names":["React","pie","d3Pie","Arc","usePieStyles","wrapTextInsideDonut","TEXT_PADDING","Pie","forwardRef","props","forwardedRef","useEffect","classes","insideDonutString","innerRadius","_totalValue","pieForFocusRing","sort","value","d","data","padAngle","_focusCallback","id","e","targetElement","onFocusCallback","_hoverCallback","hoverOnCallback","_computeTotalValue","totalValue","forEach","arc","arcGenerator","i","focusData","href","color","key","outerRadius","onBlurCallback","hoverLeaveCallback","uniqText","activeArc","calloutId","valueInsideDonut","focusedArcId","showLabelsInPercent","hideLabels","filteredData","filter","map","piechart","translate","width","height","g","transform","text","y","textAnchor","dominantBaseline","className","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/DonutChart/Pie/Pie.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable react/jsx-no-bind */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { pie as d3Pie } from 'd3-shape';\nimport { PieProps } from './index';\nimport { Arc } from '../Arc/index';\nimport { ChartDataPoint } from '../index';\nimport { usePieStyles } from './usePieStyles.styles';\nimport { wrapTextInsideDonut } from '../../../utilities/index';\nconst TEXT_PADDING: number = 5;\n\n// Create a Pie within Donut Chart variant which uses these default styles and this styled subcomponent.\n/**\n * Pie component within Donut Chart.\n * {@docCategory PieDonutChart}\n */\nexport const Pie: React.FunctionComponent<PieProps> = React.forwardRef<HTMLDivElement, PieProps>(\n  (props, forwardedRef) => {\n    React.useEffect(() => {\n      wrapTextInsideDonut(classes.insideDonutString, props.innerRadius! * 2 - TEXT_PADDING);\n    }, []);\n\n    let _totalValue: number;\n    const classes = usePieStyles(props);\n    const pieForFocusRing = d3Pie()\n      .sort(null)\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .value((d: any) => d.data)\n      .padAngle(0);\n\n    function _focusCallback(\n      data: ChartDataPoint,\n      id: string,\n      e: React.FocusEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      props.onFocusCallback!(data, id, e, targetElement);\n    }\n\n    function _hoverCallback(\n      data: ChartDataPoint,\n      e: React.MouseEvent<SVGPathElement>,\n      targetElement?: HTMLElement | null,\n    ): void {\n      props.hoverOnCallback!(data, e, targetElement);\n    }\n\n    function _computeTotalValue() {\n      let totalValue = 0;\n      props.data.forEach((arc: ChartDataPoint) => {\n        totalValue += arc.data!;\n      });\n      return totalValue;\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    function arcGenerator(d: any, i: number, focusData: any, href?: string): JSXElement {\n      const color = d && d.data && d.data.color;\n      return (\n        <Arc\n          key={i}\n          data={d}\n          focusData={focusData}\n          innerRadius={props.innerRadius}\n          outerRadius={props.outerRadius}\n          color={color!}\n          onFocusCallback={_focusCallback}\n          hoverOnCallback={_hoverCallback}\n          onBlurCallback={props.onBlurCallback}\n          hoverLeaveCallback={props.hoverLeaveCallback}\n          uniqText={props.uniqText}\n          activeArc={props.activeArc}\n          href={href}\n          calloutId={props.calloutId}\n          valueInsideDonut={props.valueInsideDonut}\n          focusedArcId={props.focusedArcId}\n          showLabelsInPercent={props.showLabelsInPercent}\n          totalValue={_totalValue}\n          hideLabels={props.hideLabels}\n        />\n      );\n    }\n\n    const { data } = props;\n\n    // Filter out data points with value 0 to avoid gaps in the donut chart\n    const filteredData = data.filter((d: ChartDataPoint) => d.data !== 0);\n\n    const focusData = pieForFocusRing(filteredData.map(d => d.data!));\n\n    const piechart = d3Pie<ChartDataPoint>()\n      .sort(null)\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      .value((d: any) => d.data)\n      .padAngle(0.02)(filteredData);\n    const translate = `translate(${props.width / 2}, ${props.height / 2})`;\n\n    _totalValue = _computeTotalValue();\n\n    return (\n      <g transform={translate}>\n        {piechart.map((d: any, i: number) => arcGenerator(d, i, focusData[i], props.href))}\n        {props.valueInsideDonut && (\n          <text y={5} textAnchor=\"middle\" dominantBaseline=\"middle\" className={classes.insideDonutString}>\n            {props.valueInsideDonut}\n          </text>\n        )}\n      </g>\n    );\n  },\n);\nPie.displayName = 'Pie';\n"],"names":["React","pie","d3Pie","Arc","usePieStyles","wrapTextInsideDonut","TEXT_PADDING","Pie","forwardRef","props","forwardedRef","useEffect","classes","insideDonutString","innerRadius","_totalValue","pieForFocusRing","sort","value","d","data","padAngle","_focusCallback","id","e","targetElement","onFocusCallback","_hoverCallback","hoverOnCallback","_computeTotalValue","totalValue","forEach","arc","arcGenerator","i","focusData","href","color","key","outerRadius","onBlurCallback","hoverLeaveCallback","uniqText","activeArc","calloutId","valueInsideDonut","focusedArcId","showLabelsInPercent","hideLabels","filteredData","filter","map","piechart","translate","width","height","g","transform","text","y","textAnchor","dominantBaseline","className","displayName"],"mappings":"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"}

package/lib/components/FunnelChart/FunnelChart.js

@@ -256,7 +256,6 @@ export const FunnelChart = /*#__PURE__*/ React.forwardRef(({ orientation = 'vert
         const maxTotal = Math.max(...totals);
         const funnelWidth = containerWidth;
         const funnelHeight = containerHeight * 0.8;
-        // eslint-disable-next-line @typescript-eslint/no-deprecated
         const paths = [];
         const geometryParams = {
             stages,

package/lib/components/FunnelChart/FunnelChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/FunnelChart/FunnelChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { useRtl } from '../../utilities/index';\nimport { FunnelChartDataPoint, FunnelChartProps } from './FunnelChart.types';\nimport { Legend, Legends } from '../Legends/index';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { getContrastTextColor } from '../../utilities/colors';\nimport { useFunnelChartStyles } from './useFunnelChartStyles.styles';\nimport {\n  getHorizontalFunnelSegmentGeometry,\n  getVerticalFunnelSegmentGeometry,\n  getSegmentTextProps,\n  getStackedHorizontalFunnelSegmentGeometry,\n  getStackedVerticalFunnelSegmentGeometry,\n} from './funnelGeometry';\nimport { ChartPopoverProps } from '../../index';\nimport { useImageExport } from '../../utilities/hooks';\n\nexport const FunnelChart: React.FunctionComponent<FunnelChartProps> = React.forwardRef<\n  HTMLDivElement,\n  FunnelChartProps\n>(({ orientation = 'vertical', ...restProps }, forwardedRef) => {\n  const props = { orientation, ...restProps };\n  const _emptyChartId: string = useId('_FunnelChart_empty');\n  const isRTL = useRtl();\n\n  const [hoveredStage, setHoveredStage] = React.useState<string | null>(null);\n  const [calloutData, setCalloutData] = React.useState<FunnelChartDataPoint | null>(null);\n  const [selectedLegends, setSelectedLegends] = React.useState<string[]>([]);\n  const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n  const [refSelected, setRefSelected] = React.useState<HTMLElement | null>(null);\n  const isStacked = isStackedFunnelData(props.data);\n  const { chartContainerRef, legendsRef: _legendsRef } = useImageExport(props.componentRef, props.hideLegend, false);\n\n  React.useEffect(() => {\n    if (props.legendProps?.selectedLegends) {\n      setSelectedLegends(props.legendProps.selectedLegends);\n    }\n  }, [props.legendProps?.selectedLegends]);\n\n  function _handleHover(\n    data: FunnelChartDataPoint,\n    mouseEvent: React.MouseEvent<SVGElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    mouseEvent?.persist();\n    setCalloutData(data);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleFocus(\n    data: FunnelChartDataPoint,\n    focusEvent: React.FocusEvent<SVGPathElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    focusEvent?.persist();\n    setCalloutData(data);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedHover(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    mouseEvent: React.MouseEvent<SVGElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    mouseEvent?.persist();\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedFocus(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    focusEvent: React.FocusEvent<SVGPathElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    focusEvent?.persist();\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleMouseOut() {\n    setHoveredStage(null);\n    setPopoverOpen(false);\n    setCalloutData(null);\n  }\n\n  function _onLegendSelectionChange(\n    legendsSelected: string[],\n    event: React.MouseEvent<HTMLButtonElement>,\n    currentLegend?: Legend,\n  ): void {\n    if (props.legendProps?.canSelectMultipleLegends) {\n      setSelectedLegends(legendsSelected);\n    } else {\n      setSelectedLegends(legendsSelected.slice(-1));\n    }\n\n    if (props.legendProps?.onChange) {\n      props.legendProps.onChange(legendsSelected, event, currentLegend);\n    }\n  }\n\n  const _onLegendSelectionChangeCallback = React.useCallback(_onLegendSelectionChange, [props.legendProps]);\n\n  function getHighlightedLegend(): string[] {\n    return selectedLegends.length > 0 ? selectedLegends : hoveredStage ? [hoveredStage] : [];\n  }\n\n  function legendHighlighted(legend: string): boolean {\n    return getHighlightedLegend().includes(legend);\n  }\n\n  function noLegendHighlighted(): boolean {\n    return getHighlightedLegend().length === 0;\n  }\n\n  function _getEventHandlerProps(\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } },\n    opacity?: number,\n    segmentId?: string,\n  ) {\n    const targetElement = document.getElementById(segmentId!);\n    if ('subValue' in data) {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) =>\n                _handleStackedHover(data.stage, data.subValue, event, targetElement)\n            : undefined,\n        onMouseMove:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) =>\n                _handleStackedHover(data.stage, data.subValue, event, targetElement)\n            : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) =>\n          _handleStackedFocus(data.stage, data.subValue, event, targetElement),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    } else {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event, targetElement) : undefined,\n        onMouseMove:\n          opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event, targetElement) : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) => _handleFocus(data, event, targetElement),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    }\n  }\n\n  function _renderSegmentText({\n    show,\n    x,\n    y,\n    value,\n    textColor,\n    opacity,\n  }: {\n    show: boolean;\n    x: number;\n    y: number;\n    value: number;\n    textColor: string;\n    opacity: number;\n  }) {\n    if (!show) {\n      return null;\n    }\n\n    const textElement = (\n      <text\n        x={isRTL ? funnelWidth - x : x}\n        y={y}\n        opacity={opacity}\n        textAnchor=\"middle\"\n        alignmentBaseline=\"middle\"\n        fill={textColor}\n      >\n        {formatToLocaleString(value.toString(), props.culture) as React.ReactNode}\n      </text>\n    );\n\n    if (isRTL) {\n      return <g transform={`scale(-1,1) translate(${-funnelWidth},0)`}>{textElement}</g>;\n    }\n    return textElement;\n  }\n\n  function _renderFunnelSegment({\n    key,\n    pathD,\n    fill,\n    opacity,\n    textProps,\n    data,\n    tabIndex,\n  }: {\n    key: string | number;\n    pathD: string;\n    fill: string;\n    opacity: number;\n    textProps?: {\n      show: boolean;\n      x: number;\n      y: number;\n      value: number;\n    };\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } };\n    tabIndex?: number;\n  }) {\n    const segmentId = `funnel-segment-${key}`;\n    const eventHandlers = _getEventHandlerProps(data, opacity, segmentId);\n    const textColor = getContrastTextColor(fill);\n    return (\n      <g key={key}>\n        <path id={segmentId} d={pathD} fill={fill} opacity={opacity} {...eventHandlers} tabIndex={tabIndex} />\n        {textProps && <g {...eventHandlers}>{_renderSegmentText({ ...textProps, textColor, opacity })}</g>}\n      </g>\n    );\n  }\n\n  function _createFunnel(\n    containerHeight: number,\n    containerWidth: number,\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement[] {\n    const { data } = props;\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    return data.map((d, i) => {\n      const geometryProps =\n        props.orientation === 'vertical'\n          ? getVerticalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL })\n          : getHorizontalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL });\n\n      const { pathD, textX, textY, availableWidth } = geometryProps;\n      const minTextWidth = 16;\n      const eventHandlerProps = _getEventHandlerProps(d);\n      const textProps = getSegmentTextProps({\n        availableWidth,\n        minTextWidth,\n        textX,\n        textY,\n        value: d.value!,\n        ...eventHandlerProps,\n      });\n\n      return _renderFunnelSegment({\n        key: i,\n        pathD,\n        fill: d.color!,\n        opacity: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 1 : 0.1,\n        textProps,\n        data: d,\n        tabIndex: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 0 : undefined,\n      });\n    });\n  }\n\n  function isStackedFunnelData(data: FunnelChartDataPoint[]): boolean {\n    return Array.isArray(data) && data.every(stage => Array.isArray(stage.subValues));\n  }\n\n  function _renderStackedSegment(\n    stage: FunnelChartDataPoint,\n    subValue: { value: number; color: string; category: string },\n    stageIndex: number,\n    subValueIndex: number,\n    geometryParams: {\n      stages: FunnelChartDataPoint[];\n      totals: number[];\n      maxTotal: number;\n      funnelWidth: number;\n      funnelHeight: number;\n      isRTL: boolean;\n    },\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement {\n    // Ensure stages have subValues for geometry functions\n    const stagesWithSubValues = geometryParams.stages.map(s => ({\n      ...s,\n      subValues: s.subValues || [],\n    }));\n    const geom =\n      props.orientation === 'vertical'\n        ? getStackedVerticalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          })\n        : getStackedHorizontalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          });\n\n    const minTextWidth = 16;\n    const eventHandlerProps = _getEventHandlerProps({ stage: stage.stage as string, subValue });\n    const textProps = getSegmentTextProps({\n      availableWidth: geom.availableWidth,\n      minTextWidth,\n      textX: geom.textX,\n      textY: geom.textY,\n      value: subValue.value,\n      ...eventHandlerProps,\n    });\n\n    return _renderFunnelSegment({\n      key: `${stageIndex}-${subValueIndex}`,\n      pathD: geom.pathD,\n      fill: subValue.color,\n      opacity:\n        (isStackedFunnelData(props.data) && legendHighlighted(subValue.category)) || noLegendHighlighted() ? 1 : 0.1,\n      textProps,\n      data: { stage: stage.stage as string, subValue },\n      tabIndex: legendHighlighted(subValue.category) || noLegendHighlighted() ? 0 : undefined,\n    });\n  }\n\n  function _createStackedFunnel(\n    containerHeight: number,\n    containerWidth: number,\n  ): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement[] {\n    const { data } = props;\n\n    const stages = data;\n    const totals = stages.map(s => s?.subValues?.reduce((sum, subValue) => sum + subValue.value, 0) ?? 0);\n    const maxTotal = Math.max(...totals);\n\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    const paths: JSXElement[] = [];\n\n    const geometryParams = {\n      stages,\n      totals,\n      maxTotal,\n      funnelWidth,\n      funnelHeight,\n      isRTL,\n    };\n\n    for (let i = 0; i < stages.length; i++) {\n      const cur = stages[i];\n      for (let k = 0; k < (cur.subValues ?? []).length; k++) {\n        const v = cur.subValues?.[k];\n        if (!v) {\n          continue;\n        }\n        paths.push(_renderStackedSegment(cur, v, i, k, geometryParams));\n      }\n    }\n    return paths;\n  }\n\n  function _renderLegends(): // eslint-disable-next-line @typescript-eslint/no-deprecated\n  JSXElement {\n    if (props.hideLegend) {\n      return <></>;\n    }\n    let legends: Legend[];\n\n    if (isStacked) {\n      // Collect unique categories and their color\n      const categoryMap: Record<string, string> = {};\n      props.data.forEach((stage: FunnelChartDataPoint) => {\n        (stage.subValues || []).forEach(sub => {\n          if (!(sub.category in categoryMap)) {\n            categoryMap[sub.category] = sub.color;\n          }\n        });\n      });\n      legends = Object.entries(categoryMap).map(([category, color]) => ({\n        title: category,\n        color,\n        hoverAction: () => setHoveredStage(category),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    } else {\n      legends = props.data.map((d: FunnelChartDataPoint) => ({\n        title: d.stage as string,\n        color: d.color!,\n        hoverAction: () => setHoveredStage(d.stage as string),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    }\n\n    return (\n      <div style={{ display: 'flex', justifyContent: 'center' }}>\n        <Legends\n          legends={legends}\n          centerLegends={true}\n          onChange={_onLegendSelectionChangeCallback}\n          {...props.legendProps}\n          legendRef={_legendsRef}\n        />\n      </div>\n    );\n  }\n\n  function _isChartEmpty(): boolean {\n    return !(props.data && props.data.length > 0);\n  }\n\n  const classes = useFunnelChartStyles(props);\n\n  const calloutProps: ChartPopoverProps = {\n    ...props.calloutProps,\n    color: calloutData?.color,\n    hoverXValue: calloutData?.stage,\n    YValue: calloutData?.value,\n  };\n\n  const width = props.width || 350;\n  const height = props.height || 500;\n\n  const funnelMarginTop = 40;\n  const funnelWidth = width * 0.8;\n  const funnelOffsetX = (width - funnelWidth) / 2;\n  const focusAttributes = useFocusableGroup();\n\n  return !_isChartEmpty() ? (\n    <div ref={chartContainerRef} className={classes.root} {...focusAttributes} style={{ width, height }}>\n      <svg width={width} height={height} className={classes.chart} role={'img'} aria-label={props.chartTitle}>\n        <g\n          transform={\n            isRTL\n              ? `translate(${funnelOffsetX + funnelWidth}, ${funnelMarginTop}) scale(-1,1)`\n              : `translate(${funnelOffsetX}, ${funnelMarginTop})`\n          }\n        >\n          {isStacked\n            ? _createStackedFunnel(height - funnelMarginTop, funnelWidth)\n            : _createFunnel(height - funnelMarginTop, funnelWidth)}\n        </g>\n      </svg>\n      {isPopoverOpen && (\n        <ChartPopover\n          {...props.calloutProps}\n          XValue={calloutProps?.hoverXValue as string}\n          yCalloutValue={calloutProps?.YValue as string}\n          culture={props.culture}\n          positioning={{\n            target: refSelected,\n          }}\n          isPopoverOpen={isPopoverOpen}\n          color={calloutProps?.color}\n          isCartesian={false}\n        />\n      )}\n      {_renderLegends()}\n    </div>\n  ) : (\n    <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n  );\n});\nFunnelChart.displayName = 'FunnelChart';\n"],"names":["React","useId","useRtl","Legends","useFocusableGroup","ChartPopover","formatToLocaleString","getContrastTextColor","useFunnelChartStyles","getHorizontalFunnelSegmentGeometry","getVerticalFunnelSegmentGeometry","getSegmentTextProps","getStackedHorizontalFunnelSegmentGeometry","getStackedVerticalFunnelSegmentGeometry","useImageExport","FunnelChart","forwardRef","orientation","restProps","forwardedRef","props","_emptyChartId","isRTL","hoveredStage","setHoveredStage","useState","calloutData","setCalloutData","selectedLegends","setSelectedLegends","isPopoverOpen","setPopoverOpen","refSelected","setRefSelected","isStacked","isStackedFunnelData","data","chartContainerRef","legendsRef","_legendsRef","componentRef","hideLegend","useEffect","legendProps","_handleHover","mouseEvent","targetElement","persist","_handleFocus","focusEvent","_handleStackedHover","stage","subValue","value","color","category","_handleStackedFocus","_handleMouseOut","_onLegendSelectionChange","legendsSelected","event","currentLegend","canSelectMultipleLegends","slice","onChange","_onLegendSelectionChangeCallback","useCallback","getHighlightedLegend","length","legendHighlighted","legend","includes","noLegendHighlighted","_getEventHandlerProps","opacity","segmentId","document","getElementById","culture","onMouseOver","undefined","onMouseMove","onFocus","onBlur","onMouseOut","_renderSegmentText","show","x","y","textColor","textElement","text","funnelWidth","textAnchor","alignmentBaseline","fill","toString","g","transform","_renderFunnelSegment","key","pathD","textProps","tabIndex","eventHandlers","path","id","d","_createFunnel","containerHeight","containerWidth","funnelHeight","map","i","geometryProps","textX","textY","availableWidth","minTextWidth","eventHandlerProps","Array","isArray","every","subValues","_renderStackedSegment","stageIndex","subValueIndex","geometryParams","stagesWithSubValues","stages","s","geom","k","_createStackedFunnel","totals","reduce","sum","maxTotal","Math","max","paths","cur","v","push","_renderLegends","legends","categoryMap","forEach","sub","Object","entries","title","hoverAction","onMouseOutAction","div","style","display","justifyContent","centerLegends","legendRef","_isChartEmpty","classes","calloutProps","hoverXValue","YValue","width","height","funnelMarginTop","funnelOffsetX","focusAttributes","ref","className","root","svg","chart","role","aria-label","chartTitle","XValue","yCalloutValue","positioning","target","isCartesian","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/FunnelChart/FunnelChart.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { useRtl } from '../../utilities/index';\nimport { FunnelChartDataPoint, FunnelChartProps } from './FunnelChart.types';\nimport { Legend, Legends } from '../Legends/index';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { ChartPopover } from '../CommonComponents/ChartPopover';\nimport { formatToLocaleString } from '@fluentui/chart-utilities';\nimport { getContrastTextColor } from '../../utilities/colors';\nimport { useFunnelChartStyles } from './useFunnelChartStyles.styles';\nimport {\n  getHorizontalFunnelSegmentGeometry,\n  getVerticalFunnelSegmentGeometry,\n  getSegmentTextProps,\n  getStackedHorizontalFunnelSegmentGeometry,\n  getStackedVerticalFunnelSegmentGeometry,\n} from './funnelGeometry';\nimport { ChartPopoverProps } from '../../index';\nimport { useImageExport } from '../../utilities/hooks';\n\nexport const FunnelChart: React.FunctionComponent<FunnelChartProps> = React.forwardRef<\n  HTMLDivElement,\n  FunnelChartProps\n>(({ orientation = 'vertical', ...restProps }, forwardedRef) => {\n  const props = { orientation, ...restProps };\n  const _emptyChartId: string = useId('_FunnelChart_empty');\n  const isRTL = useRtl();\n\n  const [hoveredStage, setHoveredStage] = React.useState<string | null>(null);\n  const [calloutData, setCalloutData] = React.useState<FunnelChartDataPoint | null>(null);\n  const [selectedLegends, setSelectedLegends] = React.useState<string[]>([]);\n  const [isPopoverOpen, setPopoverOpen] = React.useState(false);\n  const [refSelected, setRefSelected] = React.useState<HTMLElement | null>(null);\n  const isStacked = isStackedFunnelData(props.data);\n  const { chartContainerRef, legendsRef: _legendsRef } = useImageExport(props.componentRef, props.hideLegend, false);\n\n  React.useEffect(() => {\n    if (props.legendProps?.selectedLegends) {\n      setSelectedLegends(props.legendProps.selectedLegends);\n    }\n  }, [props.legendProps?.selectedLegends]);\n\n  function _handleHover(\n    data: FunnelChartDataPoint,\n    mouseEvent: React.MouseEvent<SVGElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    mouseEvent?.persist();\n    setCalloutData(data);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleFocus(\n    data: FunnelChartDataPoint,\n    focusEvent: React.FocusEvent<SVGPathElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    focusEvent?.persist();\n    setCalloutData(data);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedHover(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    mouseEvent: React.MouseEvent<SVGElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    mouseEvent?.persist();\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleStackedFocus(\n    stage: string,\n    subValue: { category: string; value: number; color: string },\n    focusEvent: React.FocusEvent<SVGPathElement>,\n    targetElement?: HTMLElement | null,\n  ) {\n    focusEvent?.persist();\n    setCalloutData({\n      stage,\n      value: subValue.value,\n      color: subValue.color,\n      category: subValue.category,\n    } as FunnelChartDataPoint);\n    setRefSelected(targetElement!);\n    setPopoverOpen(true);\n  }\n\n  function _handleMouseOut() {\n    setHoveredStage(null);\n    setPopoverOpen(false);\n    setCalloutData(null);\n  }\n\n  function _onLegendSelectionChange(\n    legendsSelected: string[],\n    event: React.MouseEvent<HTMLButtonElement>,\n    currentLegend?: Legend,\n  ): void {\n    if (props.legendProps?.canSelectMultipleLegends) {\n      setSelectedLegends(legendsSelected);\n    } else {\n      setSelectedLegends(legendsSelected.slice(-1));\n    }\n\n    if (props.legendProps?.onChange) {\n      props.legendProps.onChange(legendsSelected, event, currentLegend);\n    }\n  }\n\n  const _onLegendSelectionChangeCallback = React.useCallback(_onLegendSelectionChange, [props.legendProps]);\n\n  function getHighlightedLegend(): string[] {\n    return selectedLegends.length > 0 ? selectedLegends : hoveredStage ? [hoveredStage] : [];\n  }\n\n  function legendHighlighted(legend: string): boolean {\n    return getHighlightedLegend().includes(legend);\n  }\n\n  function noLegendHighlighted(): boolean {\n    return getHighlightedLegend().length === 0;\n  }\n\n  function _getEventHandlerProps(\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } },\n    opacity?: number,\n    segmentId?: string,\n  ) {\n    const targetElement = document.getElementById(segmentId!);\n    if ('subValue' in data) {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) =>\n                _handleStackedHover(data.stage, data.subValue, event, targetElement)\n            : undefined,\n        onMouseMove:\n          opacity == 1\n            ? (event: React.MouseEvent<SVGElement>) =>\n                _handleStackedHover(data.stage, data.subValue, event, targetElement)\n            : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) =>\n          _handleStackedFocus(data.stage, data.subValue, event, targetElement),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    } else {\n      return {\n        culture: props.culture,\n        onMouseOver:\n          opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event, targetElement) : undefined,\n        onMouseMove:\n          opacity == 1 ? (event: React.MouseEvent<SVGElement>) => _handleHover(data, event, targetElement) : undefined,\n        onFocus: (event: React.FocusEvent<SVGPathElement>) => _handleFocus(data, event, targetElement),\n        onBlur: () => _handleMouseOut(),\n        onMouseOut: () => _handleMouseOut(),\n      };\n    }\n  }\n\n  function _renderSegmentText({\n    show,\n    x,\n    y,\n    value,\n    textColor,\n    opacity,\n  }: {\n    show: boolean;\n    x: number;\n    y: number;\n    value: number;\n    textColor: string;\n    opacity: number;\n  }) {\n    if (!show) {\n      return null;\n    }\n\n    const textElement = (\n      <text\n        x={isRTL ? funnelWidth - x : x}\n        y={y}\n        opacity={opacity}\n        textAnchor=\"middle\"\n        alignmentBaseline=\"middle\"\n        fill={textColor}\n      >\n        {formatToLocaleString(value.toString(), props.culture) as React.ReactNode}\n      </text>\n    );\n\n    if (isRTL) {\n      return <g transform={`scale(-1,1) translate(${-funnelWidth},0)`}>{textElement}</g>;\n    }\n    return textElement;\n  }\n\n  function _renderFunnelSegment({\n    key,\n    pathD,\n    fill,\n    opacity,\n    textProps,\n    data,\n    tabIndex,\n  }: {\n    key: string | number;\n    pathD: string;\n    fill: string;\n    opacity: number;\n    textProps?: {\n      show: boolean;\n      x: number;\n      y: number;\n      value: number;\n    };\n    data: FunnelChartDataPoint | { stage: string; subValue: { category: string; value: number; color: string } };\n    tabIndex?: number;\n  }) {\n    const segmentId = `funnel-segment-${key}`;\n    const eventHandlers = _getEventHandlerProps(data, opacity, segmentId);\n    const textColor = getContrastTextColor(fill);\n    return (\n      <g key={key}>\n        <path id={segmentId} d={pathD} fill={fill} opacity={opacity} {...eventHandlers} tabIndex={tabIndex} />\n        {textProps && <g {...eventHandlers}>{_renderSegmentText({ ...textProps, textColor, opacity })}</g>}\n      </g>\n    );\n  }\n\n  function _createFunnel(containerHeight: number, containerWidth: number): JSXElement[] {\n    const { data } = props;\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    return data.map((d, i) => {\n      const geometryProps =\n        props.orientation === 'vertical'\n          ? getVerticalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL })\n          : getHorizontalFunnelSegmentGeometry({ d, i, data, funnelWidth, funnelHeight, isRTL });\n\n      const { pathD, textX, textY, availableWidth } = geometryProps;\n      const minTextWidth = 16;\n      const eventHandlerProps = _getEventHandlerProps(d);\n      const textProps = getSegmentTextProps({\n        availableWidth,\n        minTextWidth,\n        textX,\n        textY,\n        value: d.value!,\n        ...eventHandlerProps,\n      });\n\n      return _renderFunnelSegment({\n        key: i,\n        pathD,\n        fill: d.color!,\n        opacity: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 1 : 0.1,\n        textProps,\n        data: d,\n        tabIndex: legendHighlighted(d.stage as string) || noLegendHighlighted() ? 0 : undefined,\n      });\n    });\n  }\n\n  function isStackedFunnelData(data: FunnelChartDataPoint[]): boolean {\n    return Array.isArray(data) && data.every(stage => Array.isArray(stage.subValues));\n  }\n\n  function _renderStackedSegment(\n    stage: FunnelChartDataPoint,\n    subValue: { value: number; color: string; category: string },\n    stageIndex: number,\n    subValueIndex: number,\n    geometryParams: {\n      stages: FunnelChartDataPoint[];\n      totals: number[];\n      maxTotal: number;\n      funnelWidth: number;\n      funnelHeight: number;\n      isRTL: boolean;\n    },\n  ): JSXElement {\n    // Ensure stages have subValues for geometry functions\n    const stagesWithSubValues = geometryParams.stages.map(s => ({\n      ...s,\n      subValues: s.subValues || [],\n    }));\n    const geom =\n      props.orientation === 'vertical'\n        ? getStackedVerticalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          })\n        : getStackedHorizontalFunnelSegmentGeometry({\n            ...geometryParams,\n            stages: stagesWithSubValues,\n            i: stageIndex,\n            k: subValueIndex,\n          });\n\n    const minTextWidth = 16;\n    const eventHandlerProps = _getEventHandlerProps({ stage: stage.stage as string, subValue });\n    const textProps = getSegmentTextProps({\n      availableWidth: geom.availableWidth,\n      minTextWidth,\n      textX: geom.textX,\n      textY: geom.textY,\n      value: subValue.value,\n      ...eventHandlerProps,\n    });\n\n    return _renderFunnelSegment({\n      key: `${stageIndex}-${subValueIndex}`,\n      pathD: geom.pathD,\n      fill: subValue.color,\n      opacity:\n        (isStackedFunnelData(props.data) && legendHighlighted(subValue.category)) || noLegendHighlighted() ? 1 : 0.1,\n      textProps,\n      data: { stage: stage.stage as string, subValue },\n      tabIndex: legendHighlighted(subValue.category) || noLegendHighlighted() ? 0 : undefined,\n    });\n  }\n\n  function _createStackedFunnel(containerHeight: number, containerWidth: number): JSXElement[] {\n    const { data } = props;\n\n    const stages = data;\n    const totals = stages.map(s => s?.subValues?.reduce((sum, subValue) => sum + subValue.value, 0) ?? 0);\n    const maxTotal = Math.max(...totals);\n\n    const funnelWidth = containerWidth;\n    const funnelHeight = containerHeight * 0.8;\n\n    const paths: JSXElement[] = [];\n\n    const geometryParams = {\n      stages,\n      totals,\n      maxTotal,\n      funnelWidth,\n      funnelHeight,\n      isRTL,\n    };\n\n    for (let i = 0; i < stages.length; i++) {\n      const cur = stages[i];\n      for (let k = 0; k < (cur.subValues ?? []).length; k++) {\n        const v = cur.subValues?.[k];\n        if (!v) {\n          continue;\n        }\n        paths.push(_renderStackedSegment(cur, v, i, k, geometryParams));\n      }\n    }\n    return paths;\n  }\n\n  function _renderLegends(): JSXElement {\n    if (props.hideLegend) {\n      return <></>;\n    }\n    let legends: Legend[];\n\n    if (isStacked) {\n      // Collect unique categories and their color\n      const categoryMap: Record<string, string> = {};\n      props.data.forEach((stage: FunnelChartDataPoint) => {\n        (stage.subValues || []).forEach(sub => {\n          if (!(sub.category in categoryMap)) {\n            categoryMap[sub.category] = sub.color;\n          }\n        });\n      });\n      legends = Object.entries(categoryMap).map(([category, color]) => ({\n        title: category,\n        color,\n        hoverAction: () => setHoveredStage(category),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    } else {\n      legends = props.data.map((d: FunnelChartDataPoint) => ({\n        title: d.stage as string,\n        color: d.color!,\n        hoverAction: () => setHoveredStage(d.stage as string),\n        onMouseOutAction: () => setHoveredStage(null),\n      }));\n    }\n\n    return (\n      <div style={{ display: 'flex', justifyContent: 'center' }}>\n        <Legends\n          legends={legends}\n          centerLegends={true}\n          onChange={_onLegendSelectionChangeCallback}\n          {...props.legendProps}\n          legendRef={_legendsRef}\n        />\n      </div>\n    );\n  }\n\n  function _isChartEmpty(): boolean {\n    return !(props.data && props.data.length > 0);\n  }\n\n  const classes = useFunnelChartStyles(props);\n\n  const calloutProps: ChartPopoverProps = {\n    ...props.calloutProps,\n    color: calloutData?.color,\n    hoverXValue: calloutData?.stage,\n    YValue: calloutData?.value,\n  };\n\n  const width = props.width || 350;\n  const height = props.height || 500;\n\n  const funnelMarginTop = 40;\n  const funnelWidth = width * 0.8;\n  const funnelOffsetX = (width - funnelWidth) / 2;\n  const focusAttributes = useFocusableGroup();\n\n  return !_isChartEmpty() ? (\n    <div ref={chartContainerRef} className={classes.root} {...focusAttributes} style={{ width, height }}>\n      <svg width={width} height={height} className={classes.chart} role={'img'} aria-label={props.chartTitle}>\n        <g\n          transform={\n            isRTL\n              ? `translate(${funnelOffsetX + funnelWidth}, ${funnelMarginTop}) scale(-1,1)`\n              : `translate(${funnelOffsetX}, ${funnelMarginTop})`\n          }\n        >\n          {isStacked\n            ? _createStackedFunnel(height - funnelMarginTop, funnelWidth)\n            : _createFunnel(height - funnelMarginTop, funnelWidth)}\n        </g>\n      </svg>\n      {isPopoverOpen && (\n        <ChartPopover\n          {...props.calloutProps}\n          XValue={calloutProps?.hoverXValue as string}\n          yCalloutValue={calloutProps?.YValue as string}\n          culture={props.culture}\n          positioning={{\n            target: refSelected,\n          }}\n          isPopoverOpen={isPopoverOpen}\n          color={calloutProps?.color}\n          isCartesian={false}\n        />\n      )}\n      {_renderLegends()}\n    </div>\n  ) : (\n    <div id={_emptyChartId} role={'alert'} style={{ opacity: '0' }} aria-label={'Graph has no data to display'} />\n  );\n});\nFunnelChart.displayName = 'FunnelChart';\n"],"names":["React","useId","useRtl","Legends","useFocusableGroup","ChartPopover","formatToLocaleString","getContrastTextColor","useFunnelChartStyles","getHorizontalFunnelSegmentGeometry","getVerticalFunnelSegmentGeometry","getSegmentTextProps","getStackedHorizontalFunnelSegmentGeometry","getStackedVerticalFunnelSegmentGeometry","useImageExport","FunnelChart","forwardRef","orientation","restProps","forwardedRef","props","_emptyChartId","isRTL","hoveredStage","setHoveredStage","useState","calloutData","setCalloutData","selectedLegends","setSelectedLegends","isPopoverOpen","setPopoverOpen","refSelected","setRefSelected","isStacked","isStackedFunnelData","data","chartContainerRef","legendsRef","_legendsRef","componentRef","hideLegend","useEffect","legendProps","_handleHover","mouseEvent","targetElement","persist","_handleFocus","focusEvent","_handleStackedHover","stage","subValue","value","color","category","_handleStackedFocus","_handleMouseOut","_onLegendSelectionChange","legendsSelected","event","currentLegend","canSelectMultipleLegends","slice","onChange","_onLegendSelectionChangeCallback","useCallback","getHighlightedLegend","length","legendHighlighted","legend","includes","noLegendHighlighted","_getEventHandlerProps","opacity","segmentId","document","getElementById","culture","onMouseOver","undefined","onMouseMove","onFocus","onBlur","onMouseOut","_renderSegmentText","show","x","y","textColor","textElement","text","funnelWidth","textAnchor","alignmentBaseline","fill","toString","g","transform","_renderFunnelSegment","key","pathD","textProps","tabIndex","eventHandlers","path","id","d","_createFunnel","containerHeight","containerWidth","funnelHeight","map","i","geometryProps","textX","textY","availableWidth","minTextWidth","eventHandlerProps","Array","isArray","every","subValues","_renderStackedSegment","stageIndex","subValueIndex","geometryParams","stagesWithSubValues","stages","s","geom","k","_createStackedFunnel","totals","reduce","sum","maxTotal","Math","max","paths","cur","v","push","_renderLegends","legends","categoryMap","forEach","sub","Object","entries","title","hoverAction","onMouseOutAction","div","style","display","justifyContent","centerLegends","legendRef","_isChartEmpty","classes","calloutProps","hoverXValue","YValue","width","height","funnelMarginTop","funnelOffsetX","focusAttributes","ref","className","root","svg","chart","role","aria-label","chartTitle","XValue","yCalloutValue","positioning","target","isCartesian","displayName"],"mappings":"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"}

package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js

@@ -167,7 +167,6 @@ export const GroupedVerticalBarChart = /*#__PURE__*/ React.forwardRef((_props, f
             props.legendProps.onChange(selectedLegends, event, currentLegend);
         }
     };
-    // eslint-disable-next-line @typescript-eslint/no-deprecated
     const _getLegendData = ()=>{
         const actions = [];
         const addLegendButton = (legendTitle, isLineLegendInBarChart)=>{
@@ -416,9 +415,7 @@ export const GroupedVerticalBarChart = /*#__PURE__*/ React.forwardRef((_props, f
     singleSet, // eslint-disable-next-line @typescript-eslint/no-explicit-any
     xScale0, // eslint-disable-next-line @typescript-eslint/no-explicit-any
     xScale1, yScalePrimary, yScaleSecondary, containerHeight, xElement)=>{
-        // eslint-disable-next-line @typescript-eslint/no-deprecated
         const singleGroup = [];
-        // eslint-disable-next-line @typescript-eslint/no-deprecated
         const barLabelsForGroup = [];
         // Get the actual legends present at this x-axis point
         const presentLegends = _barLegends.filter((key)=>key in singleSet);