@fluentui/react-charts 9.3.21 → 9.74.3-experimental.esm.20260709-49ee7a20cf.0

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/DonutChart/index.ts"],"sourcesContent":["export * from './DonutChart';\nexport * from './DonutChart.types';\nexport * from '../../types/index';\n"],"names":[],"mappings":"AAAA,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,oBAAoB"}

package/lib/components/DonutChart/useDonutChartStyles.styles.js

@@ -1,98 +0,0 @@
-'use client';
-
-import { __styles, mergeClasses } from '@griffel/react';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
-import { getAxisTitleStyle, getChartTitleStyles, HighContrastSelector } from '../../utilities/index';
-/**
- * @internal
- */
-export const donutClassNames = {
-  root: 'fui-donut__root',
-  chart: 'fui-donut__chart',
-  legendContainer: 'fui-donut__legendContainer',
-  chartWrapper: 'fui-donut__chartWrapper',
-  axisAnnotation: 'fui-donut__axisAnnotation',
-  chartTitle: 'fui-donut__chartTitle',
-  svgTooltip: 'fui-donut__svgTooltip'
-};
-/**
- * Base Styles
- */
-const useStyles = /*#__PURE__*/__styles({
-  root: {
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "fkhj508",
-    Bhrd7zp: "figsok6",
-    Bg96gwp: "f1i3iumi",
-    mc9l5x: "f22iagw",
-    Beiy3e4: "f1vx9l62",
-    a9b677: "fly5x3f",
-    Bqenvij: "f1l02sjl",
-    fsow6f: ["f1o700av", "fes3tcz"]
-  },
-  chart: {
-    B7ck84d: "f1e4lqlz",
-    ek0pe7: "fzm18in",
-    mc9l5x: "ftgm304",
-    B68tc82: 0,
-    Bmxbyg5: 0,
-    Bpg54ce: "f1gl81tg"
-  },
-  legendContainer: {
-    z8tnut: "fikn0iw",
-    a9b677: "fly5x3f"
-  },
-  axisAnnotation: {
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "f13mqy1h",
-    Bhrd7zp: "fl43uef",
-    Bg96gwp: "fcpl73t",
-    B80ckks: "fmd4ok8",
-    fsow6f: "f17mccla",
-    sj55zd: "fkfq4zb",
-    Bkfmm31: "fhuob2q",
-    Bxms50k: "f1yn2ez9"
-  },
-  chartTitle: {
-    Bahqtrf: "fk6fouc",
-    Be2twd7: "f13mqy1h",
-    Bhrd7zp: "fl43uef",
-    Bg96gwp: "fcpl73t",
-    Bkfmm31: "fhuob2q",
-    Bvjb7m6: "fhv2zbx",
-    fsow6f: "f17mccla",
-    jrapky: "fqcjy3b"
-  },
-  svgTooltip: {
-    Bkfmm31: "f5q6cfr",
-    Bxms50k: "f1bgda6t"
-  }
-}, {
-  d: [".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f22iagw{display:flex;}", ".f1vx9l62{flex-direction:column;}", ".fly5x3f{width:100%;}", ".f1l02sjl{height:100%;}", ".f1o700av{text-align:left;}", ".fes3tcz{text-align:right;}", ".f1e4lqlz{box-sizing:content-box;}", ".fzm18in{alignment-adjust:center;}", ".ftgm304{display:block;}", [".f1gl81tg{overflow:visible;}", {
-    p: -1
-  }], ".fikn0iw{padding-top:var(--spacingVerticalL);}", ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fmd4ok8{font-style:normal;}", ".f17mccla{text-align:center;}", ".fkfq4zb{color:var(--colorNeutralForeground2);}", ".fhuob2q{fill:var(--colorNeutralForeground1);}", ".fhv2zbx{forced-color-adjust:auto;}", ".fqcjy3b{margin-bottom:var(--spacingVerticalS);}", ".f5q6cfr{fill:var(--colorNeutralBackground1);}"],
-  m: [["@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f1yn2ez9{fill:CanvasText;}}", {
-    m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
-  }], ["@media screen and (-ms-high-contrast: active),screen and (forced-colors: active){.f1bgda6t{fill:Canvas;}}", {
-    m: "screen and (-ms-high-contrast: active), screen and (forced-colors: active)"
-  }]]
-});
-/**
- * Apply styling to the DonutChart component
- */
-export const useDonutChartStyles = props => {
-  var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6;
-  const {
-    className
-  } = props;
-  const baseStyles = useStyles();
-  return {
-    root: mergeClasses(donutClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),
-    chart: mergeClasses(donutClassNames.chart, baseStyles.chart, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.chart),
-    legendContainer: mergeClasses(donutClassNames.legendContainer, baseStyles.legendContainer, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.legendContainer),
-    chartWrapper: mergeClasses(donutClassNames.chartWrapper, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chartWrapper),
-    axisAnnotation: mergeClasses(donutClassNames.axisAnnotation, baseStyles.axisAnnotation, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.axisAnnotation),
-    chartTitle: mergeClasses(donutClassNames.chartTitle, baseStyles.chartTitle, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.chartTitle),
-    svgTooltip: mergeClasses(donutClassNames.svgTooltip, baseStyles.svgTooltip, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.svgTooltip)
-  };
-};

package/lib/components/DonutChart/useDonutChartStyles.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","typographyStyles","getAxisTitleStyle","getChartTitleStyles","HighContrastSelector","donutClassNames","root","chart","legendContainer","chartWrapper","axisAnnotation","chartTitle","svgTooltip","useStyles","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","mc9l5x","Beiy3e4","a9b677","Bqenvij","fsow6f","B7ck84d","ek0pe7","B68tc82","Bmxbyg5","Bpg54ce","z8tnut","B80ckks","sj55zd","Bkfmm31","Bxms50k","Bvjb7m6","jrapky","d","p","m","useDonutChartStyles","props","_props_styles","_props_styles1","_props_styles2","_props_styles3","_props_styles4","_props_styles5","_props_styles6","className","baseStyles","styles"],"sources":["useDonutChartStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { getAxisTitleStyle, getChartTitleStyles, HighContrastSelector } from '../../utilities/index';\n/**\n * @internal\n */ export const donutClassNames = {\n    root: 'fui-donut__root',\n    chart: 'fui-donut__chart',\n    legendContainer: 'fui-donut__legendContainer',\n    chartWrapper: 'fui-donut__chartWrapper',\n    axisAnnotation: 'fui-donut__axisAnnotation',\n    chartTitle: 'fui-donut__chartTitle',\n    svgTooltip: 'fui-donut__svgTooltip'\n};\n/**\n * Base Styles\n */ const useStyles = makeStyles({\n    root: {\n        // alignItems: 'center',\n        ...typographyStyles.body1,\n        display: 'flex',\n        flexDirection: 'column',\n        width: '100%',\n        height: '100%',\n        textAlign: 'left'\n    },\n    chart: {\n        boxSizing: 'content-box',\n        alignmentAdjust: 'center',\n        display: 'block',\n        overflow: 'visible'\n    },\n    legendContainer: {\n        paddingTop: tokens.spacingVerticalL,\n        width: '100%'\n    },\n    axisAnnotation: getAxisTitleStyle(),\n    chartTitle: getChartTitleStyles(),\n    svgTooltip: {\n        fill: tokens.colorNeutralBackground1,\n        [HighContrastSelector]: {\n            fill: 'Canvas'\n        }\n    }\n});\n/**\n * Apply styling to the DonutChart component\n */ export const useDonutChartStyles = (props)=>{\n    var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6;\n    const { className } = props;\n    const baseStyles = useStyles();\n    return {\n        root: mergeClasses(donutClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),\n        chart: mergeClasses(donutClassNames.chart, baseStyles.chart, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.chart),\n        legendContainer: mergeClasses(donutClassNames.legendContainer, baseStyles.legendContainer, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.legendContainer),\n        chartWrapper: mergeClasses(donutClassNames.chartWrapper, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chartWrapper),\n        axisAnnotation: mergeClasses(donutClassNames.axisAnnotation, baseStyles.axisAnnotation, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.axisAnnotation),\n        chartTitle: mergeClasses(donutClassNames.chartTitle, baseStyles.chartTitle, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.chartTitle),\n        svgTooltip: mergeClasses(donutClassNames.svgTooltip, baseStyles.svgTooltip, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.svgTooltip)\n    };\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/DonutChart/useDonutChartStyles.styles.raw.js

@@ -1,62 +0,0 @@
-'use client';
-import { makeStyles, mergeClasses } from '@griffel/react';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
-import { getAxisTitleStyle, getChartTitleStyles, HighContrastSelector } from '../../utilities/index';
-/**
- * @internal
- */ export const donutClassNames = {
-    root: 'fui-donut__root',
-    chart: 'fui-donut__chart',
-    legendContainer: 'fui-donut__legendContainer',
-    chartWrapper: 'fui-donut__chartWrapper',
-    axisAnnotation: 'fui-donut__axisAnnotation',
-    chartTitle: 'fui-donut__chartTitle',
-    svgTooltip: 'fui-donut__svgTooltip'
-};
-/**
- * Base Styles
- */ const useStyles = makeStyles({
-    root: {
-        // alignItems: 'center',
-        ...typographyStyles.body1,
-        display: 'flex',
-        flexDirection: 'column',
-        width: '100%',
-        height: '100%',
-        textAlign: 'left'
-    },
-    chart: {
-        boxSizing: 'content-box',
-        alignmentAdjust: 'center',
-        display: 'block',
-        overflow: 'visible'
-    },
-    legendContainer: {
-        paddingTop: tokens.spacingVerticalL,
-        width: '100%'
-    },
-    axisAnnotation: getAxisTitleStyle(),
-    chartTitle: getChartTitleStyles(),
-    svgTooltip: {
-        fill: tokens.colorNeutralBackground1,
-        [HighContrastSelector]: {
-            fill: 'Canvas'
-        }
-    }
-});
-/**
- * Apply styling to the DonutChart component
- */ export const useDonutChartStyles = (props)=>{
-    var _props_styles, _props_styles1, _props_styles2, _props_styles3, _props_styles4, _props_styles5, _props_styles6;
-    const { className } = props;
-    const baseStyles = useStyles();
-    return {
-        root: mergeClasses(donutClassNames.root, baseStyles.root, className, (_props_styles = props.styles) === null || _props_styles === void 0 ? void 0 : _props_styles.root),
-        chart: mergeClasses(donutClassNames.chart, baseStyles.chart, (_props_styles1 = props.styles) === null || _props_styles1 === void 0 ? void 0 : _props_styles1.chart),
-        legendContainer: mergeClasses(donutClassNames.legendContainer, baseStyles.legendContainer, (_props_styles2 = props.styles) === null || _props_styles2 === void 0 ? void 0 : _props_styles2.legendContainer),
-        chartWrapper: mergeClasses(donutClassNames.chartWrapper, (_props_styles3 = props.styles) === null || _props_styles3 === void 0 ? void 0 : _props_styles3.chartWrapper),
-        axisAnnotation: mergeClasses(donutClassNames.axisAnnotation, baseStyles.axisAnnotation, (_props_styles4 = props.styles) === null || _props_styles4 === void 0 ? void 0 : _props_styles4.axisAnnotation),
-        chartTitle: mergeClasses(donutClassNames.chartTitle, baseStyles.chartTitle, (_props_styles5 = props.styles) === null || _props_styles5 === void 0 ? void 0 : _props_styles5.chartTitle),
-        svgTooltip: mergeClasses(donutClassNames.svgTooltip, baseStyles.svgTooltip, (_props_styles6 = props.styles) === null || _props_styles6 === void 0 ? void 0 : _props_styles6.svgTooltip)
-    };
-};

package/lib/components/DonutChart/useDonutChartStyles.styles.raw.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/DonutChart/useDonutChartStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { GriffelStyle } from '@griffel/react';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { DonutChartProps, DonutChartStyles } from './index';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { getAxisTitleStyle, getChartTitleStyles, HighContrastSelector } from '../../utilities/index';\n\n/**\n * @internal\n */\nexport const donutClassNames: SlotClassNames<DonutChartStyles> = {\n  root: 'fui-donut__root',\n  chart: 'fui-donut__chart',\n  legendContainer: 'fui-donut__legendContainer',\n  chartWrapper: 'fui-donut__chartWrapper',\n  axisAnnotation: 'fui-donut__axisAnnotation',\n  chartTitle: 'fui-donut__chartTitle',\n  svgTooltip: 'fui-donut__svgTooltip',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n  root: {\n    // alignItems: 'center',\n    ...typographyStyles.body1,\n    display: 'flex',\n    flexDirection: 'column',\n    width: '100%',\n    height: '100%',\n    textAlign: 'left',\n  },\n  chart: {\n    boxSizing: 'content-box',\n    alignmentAdjust: 'center',\n    display: 'block',\n    overflow: 'visible',\n  },\n  legendContainer: {\n    paddingTop: tokens.spacingVerticalL,\n    width: '100%',\n  },\n  axisAnnotation: getAxisTitleStyle() as GriffelStyle,\n  chartTitle: getChartTitleStyles() as GriffelStyle,\n  svgTooltip: {\n    fill: tokens.colorNeutralBackground1,\n    [HighContrastSelector]: {\n      fill: 'Canvas',\n    },\n  },\n});\n\n/**\n * Apply styling to the DonutChart component\n */\nexport const useDonutChartStyles = (props: DonutChartProps): DonutChartStyles => {\n  const { className } = props;\n  const baseStyles = useStyles();\n\n  return {\n    root: mergeClasses(donutClassNames.root, baseStyles.root, className, props.styles?.root),\n    chart: mergeClasses(donutClassNames.chart, baseStyles.chart, props.styles?.chart),\n    legendContainer: mergeClasses(\n      donutClassNames.legendContainer,\n      baseStyles.legendContainer,\n      props.styles?.legendContainer,\n    ),\n    chartWrapper: mergeClasses(donutClassNames.chartWrapper, props.styles?.chartWrapper),\n    axisAnnotation: mergeClasses(\n      donutClassNames.axisAnnotation,\n      baseStyles.axisAnnotation,\n      props.styles?.axisAnnotation,\n    ),\n    chartTitle: mergeClasses(donutClassNames.chartTitle, baseStyles.chartTitle, props.styles?.chartTitle),\n    svgTooltip: mergeClasses(donutClassNames.svgTooltip, baseStyles.svgTooltip, props.styles?.svgTooltip),\n  };\n};\n"],"names":["makeStyles","mergeClasses","tokens","typographyStyles","getAxisTitleStyle","getChartTitleStyles","HighContrastSelector","donutClassNames","root","chart","legendContainer","chartWrapper","axisAnnotation","chartTitle","svgTooltip","useStyles","body1","display","flexDirection","width","height","textAlign","boxSizing","alignmentAdjust","overflow","paddingTop","spacingVerticalL","fill","colorNeutralBackground1","useDonutChartStyles","props","className","baseStyles","styles"],"mappings":"AAAA;AAGA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAC1D,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AAGjE,SAASC,iBAAiB,EAAEC,mBAAmB,EAAEC,oBAAoB,QAAQ,wBAAwB;AAErG;;CAEC,GACD,OAAO,MAAMC,kBAAoD;IAC/DC,MAAM;IACNC,OAAO;IACPC,iBAAiB;IACjBC,cAAc;IACdC,gBAAgB;IAChBC,YAAY;IACZC,YAAY;AACd,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYf,WAAW;IAC3BQ,MAAM;QACJ,wBAAwB;QACxB,GAAGL,iBAAiBa,KAAK;QACzBC,SAAS;QACTC,eAAe;QACfC,OAAO;QACPC,QAAQ;QACRC,WAAW;IACb;IACAZ,OAAO;QACLa,WAAW;QACXC,iBAAiB;QACjBN,SAAS;QACTO,UAAU;IACZ;IACAd,iBAAiB;QACfe,YAAYvB,OAAOwB,gBAAgB;QACnCP,OAAO;IACT;IACAP,gBAAgBR;IAChBS,YAAYR;IACZS,YAAY;QACVa,MAAMzB,OAAO0B,uBAAuB;QACpC,CAACtB,qBAAqB,EAAE;YACtBqB,MAAM;QACR;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAME,sBAAsB,CAACC;QAKqCA,eACRA,gBAI3DA,gBAEuDA,gBAIvDA,gBAE0EA,gBACAA;IAlB9E,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,MAAME,aAAajB;IAEnB,OAAO;QACLP,MAAMP,aAAaM,gBAAgBC,IAAI,EAAEwB,WAAWxB,IAAI,EAAEuB,YAAWD,gBAAAA,MAAMG,MAAM,cAAZH,oCAAAA,cAActB,IAAI;QACvFC,OAAOR,aAAaM,gBAAgBE,KAAK,EAAEuB,WAAWvB,KAAK,GAAEqB,iBAAAA,MAAMG,MAAM,cAAZH,qCAAAA,eAAcrB,KAAK;QAChFC,iBAAiBT,aACfM,gBAAgBG,eAAe,EAC/BsB,WAAWtB,eAAe,GAC1BoB,iBAAAA,MAAMG,MAAM,cAAZH,qCAAAA,eAAcpB,eAAe;QAE/BC,cAAcV,aAAaM,gBAAgBI,YAAY,GAAEmB,iBAAAA,MAAMG,MAAM,cAAZH,qCAAAA,eAAcnB,YAAY;QACnFC,gBAAgBX,aACdM,gBAAgBK,cAAc,EAC9BoB,WAAWpB,cAAc,GACzBkB,iBAAAA,MAAMG,MAAM,cAAZH,qCAAAA,eAAclB,cAAc;QAE9BC,YAAYZ,aAAaM,gBAAgBM,UAAU,EAAEmB,WAAWnB,UAAU,GAAEiB,iBAAAA,MAAMG,MAAM,cAAZH,qCAAAA,eAAcjB,UAAU;QACpGC,YAAYb,aAAaM,gBAAgBO,UAAU,EAAEkB,WAAWlB,UAAU,GAAEgB,iBAAAA,MAAMG,MAAM,cAAZH,qCAAAA,eAAchB,UAAU;IACtG;AACF,EAAE"}

package/lib/components/FunnelChart/FunnelChart.js

@@ -1,401 +0,0 @@
-'use client';
-import * as React from 'react';
-import { useId } from '@fluentui/react-utilities';
-import { useRtl, ChartTitle, CHART_TITLE_PADDING } from '../../utilities/index';
-import { Legends } from '../Legends/index';
-import { useArrowNavigationGroup } from '@fluentui/react-tabster';
-import { ChartPopover } from '../CommonComponents/ChartPopover';
-import { formatToLocaleString } from '@fluentui/chart-utilities';
-import { getContrastTextColor } from '../../utilities/colors';
-import { useFunnelChartStyles } from './useFunnelChartStyles.styles';
-import { getHorizontalFunnelSegmentGeometry, getVerticalFunnelSegmentGeometry, getSegmentTextProps, getStackedHorizontalFunnelSegmentGeometry, getStackedVerticalFunnelSegmentGeometry } from './funnelGeometry';
-import { useImageExport } from '../../utilities/hooks';
-export const FunnelChart = /*#__PURE__*/ React.forwardRef(({ orientation = 'vertical', ...restProps }, forwardedRef)=>{
-    var _props_legendProps, _props_titleStyles_titleFont, _props_titleStyles;
-    const props = {
-        orientation,
-        ...restProps
-    };
-    const _emptyChartId = useId('_FunnelChart_empty');
-    const isRTL = useRtl();
-    const [hoveredStage, setHoveredStage] = React.useState(null);
-    const [calloutData, setCalloutData] = React.useState(null);
-    const [selectedLegends, setSelectedLegends] = React.useState([]);
-    const [isPopoverOpen, setPopoverOpen] = React.useState(false);
-    const [refSelected, setRefSelected] = React.useState(null);
-    const isStacked = isStackedFunnelData(props.data);
-    const { chartContainerRef, legendsRef: _legendsRef } = useImageExport(props.componentRef, props.hideLegend, false);
-    React.useEffect(()=>{
-        var _props_legendProps;
-        if ((_props_legendProps = props.legendProps) === null || _props_legendProps === void 0 ? void 0 : _props_legendProps.selectedLegends) {
-            setSelectedLegends(props.legendProps.selectedLegends);
-        }
-    }, [
-        (_props_legendProps = props.legendProps) === null || _props_legendProps === void 0 ? void 0 : _props_legendProps.selectedLegends
-    ]);
-    function _handleHover(data, mouseEvent, targetElement) {
-        mouseEvent === null || mouseEvent === void 0 ? void 0 : mouseEvent.persist();
-        setCalloutData(data);
-        setRefSelected(targetElement);
-        setPopoverOpen(true);
-    }
-    function _handleFocus(data, focusEvent, targetElement) {
-        focusEvent === null || focusEvent === void 0 ? void 0 : focusEvent.persist();
-        setCalloutData(data);
-        setRefSelected(targetElement);
-        setPopoverOpen(true);
-    }
-    function _handleStackedHover(stage, subValue, mouseEvent, targetElement) {
-        mouseEvent === null || mouseEvent === void 0 ? void 0 : mouseEvent.persist();
-        setCalloutData({
-            stage,
-            value: subValue.value,
-            color: subValue.color,
-            category: subValue.category
-        });
-        setRefSelected(targetElement);
-        setPopoverOpen(true);
-    }
-    function _handleStackedFocus(stage, subValue, focusEvent, targetElement) {
-        focusEvent === null || focusEvent === void 0 ? void 0 : focusEvent.persist();
-        setCalloutData({
-            stage,
-            value: subValue.value,
-            color: subValue.color,
-            category: subValue.category
-        });
-        setRefSelected(targetElement);
-        setPopoverOpen(true);
-    }
-    function _handleMouseOut() {
-        setHoveredStage(null);
-        setPopoverOpen(false);
-        setCalloutData(null);
-    }
-    function _onLegendSelectionChange(legendsSelected, event, currentLegend) {
-        var _props_legendProps, _props_legendProps1;
-        if ((_props_legendProps = props.legendProps) === null || _props_legendProps === void 0 ? void 0 : _props_legendProps.canSelectMultipleLegends) {
-            setSelectedLegends(legendsSelected);
-        } else {
-            setSelectedLegends(legendsSelected.slice(-1));
-        }
-        if ((_props_legendProps1 = props.legendProps) === null || _props_legendProps1 === void 0 ? void 0 : _props_legendProps1.onChange) {
-            props.legendProps.onChange(legendsSelected, event, currentLegend);
-        }
-    }
-    const _onLegendSelectionChangeCallback = React.useCallback(_onLegendSelectionChange, [
-        props.legendProps
-    ]);
-    function getHighlightedLegend() {
-        return selectedLegends.length > 0 ? selectedLegends : hoveredStage ? [
-            hoveredStage
-        ] : [];
-    }
-    function legendHighlighted(legend) {
-        return getHighlightedLegend().includes(legend);
-    }
-    function noLegendHighlighted() {
-        return getHighlightedLegend().length === 0;
-    }
-    function _getAriaLabel(data) {
-        if ('subValue' in data) {
-            // Stacked funnel segment
-            const formattedValue = formatToLocaleString(data.subValue.value.toString(), props.culture);
-            return `${data.stage}, ${data.subValue.category}, ${formattedValue}.`;
-        } else {
-            var _data_value;
-            // Non-stacked funnel segment
-            const formattedValue = formatToLocaleString(((_data_value = data.value) !== null && _data_value !== void 0 ? _data_value : 0).toString(), props.culture);
-            return `${data.stage}, ${formattedValue}.`;
-        }
-    }
-    function _getEventHandlerProps(data, opacity, segmentId) {
-        const targetElement = document.getElementById(segmentId);
-        if ('subValue' in data) {
-            return {
-                culture: props.culture,
-                onMouseOver: opacity == 1 ? (event)=>_handleStackedHover(data.stage, data.subValue, event, targetElement) : undefined,
-                onMouseMove: opacity == 1 ? (event)=>_handleStackedHover(data.stage, data.subValue, event, targetElement) : undefined,
-                onFocus: (event)=>_handleStackedFocus(data.stage, data.subValue, event, targetElement),
-                onBlur: ()=>_handleMouseOut(),
-                onMouseOut: ()=>_handleMouseOut()
-            };
-        } else {
-            return {
-                culture: props.culture,
-                onMouseOver: opacity == 1 ? (event)=>_handleHover(data, event, targetElement) : undefined,
-                onMouseMove: opacity == 1 ? (event)=>_handleHover(data, event, targetElement) : undefined,
-                onFocus: (event)=>_handleFocus(data, event, targetElement),
-                onBlur: ()=>_handleMouseOut(),
-                onMouseOut: ()=>_handleMouseOut()
-            };
-        }
-    }
-    function _renderSegmentText({ show, x, y, value, textColor, opacity }) {
-        if (!show) {
-            return null;
-        }
-        const textElement = /*#__PURE__*/ React.createElement("text", {
-            x: isRTL ? funnelWidth - x : x,
-            y: y,
-            opacity: opacity,
-            textAnchor: "middle",
-            alignmentBaseline: "middle",
-            fill: textColor
-        }, formatToLocaleString(value.toString(), props.culture));
-        if (isRTL) {
-            return /*#__PURE__*/ React.createElement("g", {
-                transform: `scale(-1,1) translate(${-funnelWidth},0)`
-            }, textElement);
-        }
-        return textElement;
-    }
-    function _renderFunnelSegment({ key, pathD, fill, opacity, textProps, data, tabIndex }) {
-        const segmentId = `funnel-segment-${key}`;
-        const eventHandlers = _getEventHandlerProps(data, opacity, segmentId);
-        const textColor = getContrastTextColor(fill);
-        return /*#__PURE__*/ React.createElement("g", {
-            key: key
-        }, /*#__PURE__*/ React.createElement("path", {
-            id: segmentId,
-            d: pathD,
-            fill: fill,
-            opacity: opacity,
-            ...eventHandlers,
-            tabIndex: tabIndex,
-            role: "img",
-            "aria-label": _getAriaLabel(data)
-        }), textProps && /*#__PURE__*/ React.createElement("g", eventHandlers, _renderSegmentText({
-            ...textProps,
-            textColor,
-            opacity
-        })));
-    }
-    function _createFunnel(containerHeight, containerWidth) {
-        const { data } = props;
-        const funnelWidth = containerWidth;
-        const funnelHeight = containerHeight * 0.8;
-        return data.map((d, i)=>{
-            const geometryProps = props.orientation === 'vertical' ? getVerticalFunnelSegmentGeometry({
-                d,
-                i,
-                data,
-                funnelWidth,
-                funnelHeight,
-                isRTL
-            }) : getHorizontalFunnelSegmentGeometry({
-                d,
-                i,
-                data,
-                funnelWidth,
-                funnelHeight,
-                isRTL
-            });
-            const { pathD, textX, textY, availableWidth } = geometryProps;
-            const minTextWidth = 16;
-            const eventHandlerProps = _getEventHandlerProps(d);
-            const textProps = getSegmentTextProps({
-                availableWidth,
-                minTextWidth,
-                textX,
-                textY,
-                value: d.value,
-                ...eventHandlerProps
-            });
-            return _renderFunnelSegment({
-                key: i,
-                pathD,
-                fill: d.color,
-                opacity: legendHighlighted(d.stage) || noLegendHighlighted() ? 1 : 0.1,
-                textProps,
-                data: d,
-                tabIndex: legendHighlighted(d.stage) || noLegendHighlighted() ? 0 : undefined
-            });
-        });
-    }
-    function isStackedFunnelData(data) {
-        return Array.isArray(data) && data.every((stage)=>Array.isArray(stage.subValues));
-    }
-    function _renderStackedSegment(stage, subValue, stageIndex, subValueIndex, geometryParams) {
-        // Ensure stages have subValues for geometry functions
-        const stagesWithSubValues = geometryParams.stages.map((s)=>({
-                ...s,
-                subValues: s.subValues || []
-            }));
-        const geom = props.orientation === 'vertical' ? getStackedVerticalFunnelSegmentGeometry({
-            ...geometryParams,
-            stages: stagesWithSubValues,
-            i: stageIndex,
-            k: subValueIndex
-        }) : getStackedHorizontalFunnelSegmentGeometry({
-            ...geometryParams,
-            stages: stagesWithSubValues,
-            i: stageIndex,
-            k: subValueIndex
-        });
-        const minTextWidth = 16;
-        const eventHandlerProps = _getEventHandlerProps({
-            stage: stage.stage,
-            subValue
-        });
-        const textProps = getSegmentTextProps({
-            availableWidth: geom.availableWidth,
-            minTextWidth,
-            textX: geom.textX,
-            textY: geom.textY,
-            value: subValue.value,
-            ...eventHandlerProps
-        });
-        return _renderFunnelSegment({
-            key: `${stageIndex}-${subValueIndex}`,
-            pathD: geom.pathD,
-            fill: subValue.color,
-            opacity: isStackedFunnelData(props.data) && legendHighlighted(subValue.category) || noLegendHighlighted() ? 1 : 0.1,
-            textProps,
-            data: {
-                stage: stage.stage,
-                subValue
-            },
-            tabIndex: legendHighlighted(subValue.category) || noLegendHighlighted() ? 0 : undefined
-        });
-    }
-    function _createStackedFunnel(containerHeight, containerWidth) {
-        const { data } = props;
-        const stages = data;
-        const totals = stages.map((s)=>{
-            var _s_subValues;
-            var _s_subValues_reduce;
-            return (_s_subValues_reduce = s === null || s === void 0 ? void 0 : (_s_subValues = s.subValues) === null || _s_subValues === void 0 ? void 0 : _s_subValues.reduce((sum, subValue)=>sum + subValue.value, 0)) !== null && _s_subValues_reduce !== void 0 ? _s_subValues_reduce : 0;
-        });
-        const maxTotal = Math.max(...totals);
-        const funnelWidth = containerWidth;
-        const funnelHeight = containerHeight * 0.8;
-        const paths = [];
-        const geometryParams = {
-            stages,
-            totals,
-            maxTotal,
-            funnelWidth,
-            funnelHeight,
-            isRTL
-        };
-        for(let i = 0; i < stages.length; i++){
-            const cur = stages[i];
-            var _cur_subValues;
-            for(let k = 0; k < ((_cur_subValues = cur.subValues) !== null && _cur_subValues !== void 0 ? _cur_subValues : []).length; k++){
-                var _cur_subValues1;
-                const v = (_cur_subValues1 = cur.subValues) === null || _cur_subValues1 === void 0 ? void 0 : _cur_subValues1[k];
-                if (!v) {
-                    continue;
-                }
-                paths.push(_renderStackedSegment(cur, v, i, k, geometryParams));
-            }
-        }
-        return paths;
-    }
-    function _renderLegends() {
-        if (props.hideLegend) {
-            return /*#__PURE__*/ React.createElement(React.Fragment, null);
-        }
-        let legends;
-        if (isStacked) {
-            // Collect unique categories and their color
-            const categoryMap = {};
-            props.data.forEach((stage)=>{
-                (stage.subValues || []).forEach((sub)=>{
-                    if (!(sub.category in categoryMap)) {
-                        categoryMap[sub.category] = sub.color;
-                    }
-                });
-            });
-            legends = Object.entries(categoryMap).map(([category, color])=>({
-                    title: category,
-                    color,
-                    hoverAction: ()=>setHoveredStage(category),
-                    onMouseOutAction: ()=>setHoveredStage(null)
-                }));
-        } else {
-            legends = props.data.map((d)=>({
-                    title: d.stage,
-                    color: d.color,
-                    hoverAction: ()=>setHoveredStage(d.stage),
-                    onMouseOutAction: ()=>setHoveredStage(null)
-                }));
-        }
-        return /*#__PURE__*/ React.createElement("div", {
-            style: {
-                display: 'flex',
-                justifyContent: 'center'
-            }
-        }, /*#__PURE__*/ React.createElement(Legends, {
-            legends: legends,
-            centerLegends: true,
-            onChange: _onLegendSelectionChangeCallback,
-            ...props.legendProps,
-            legendRef: _legendsRef
-        }));
-    }
-    function _isChartEmpty() {
-        return !(props.data && props.data.length > 0);
-    }
-    const classes = useFunnelChartStyles(props);
-    const calloutProps = {
-        ...props.calloutProps,
-        color: calloutData === null || calloutData === void 0 ? void 0 : calloutData.color,
-        hoverXValue: calloutData === null || calloutData === void 0 ? void 0 : calloutData.stage,
-        YValue: calloutData === null || calloutData === void 0 ? void 0 : calloutData.value
-    };
-    const width = props.width || 350;
-    const height = props.height || 500;
-    const titleHeight = props.chartTitle ? Math.max((typeof ((_props_titleStyles = props.titleStyles) === null || _props_titleStyles === void 0 ? void 0 : (_props_titleStyles_titleFont = _props_titleStyles.titleFont) === null || _props_titleStyles_titleFont === void 0 ? void 0 : _props_titleStyles_titleFont.size) === 'number' ? props.titleStyles.titleFont.size : 13) + CHART_TITLE_PADDING, 40) : 40;
-    const funnelMarginTop = titleHeight;
-    const funnelWidth = width * 0.8;
-    const funnelOffsetX = (width - funnelWidth) / 2;
-    const arrowAttributes = useArrowNavigationGroup({
-        circular: true,
-        axis: 'horizontal'
-    });
-    return !_isChartEmpty() ? /*#__PURE__*/ React.createElement("div", {
-        ref: chartContainerRef,
-        className: classes.root,
-        style: {
-            width,
-            height
-        }
-    }, /*#__PURE__*/ React.createElement("svg", {
-        width: width,
-        height: height,
-        className: classes.chart,
-        ...arrowAttributes,
-        role: 'region',
-        "aria-label": props.chartTitle
-    }, !props.hideLegend && props.chartTitle && /*#__PURE__*/ React.createElement(ChartTitle, {
-        title: props.chartTitle,
-        x: width / 2,
-        maxWidth: width - 20,
-        className: classes.chartTitle,
-        titleStyles: props.titleStyles,
-        tooltipClassName: classes.svgTooltip
-    }), /*#__PURE__*/ React.createElement("g", {
-        transform: isRTL ? `translate(${funnelOffsetX + funnelWidth}, ${funnelMarginTop}) scale(-1,1)` : `translate(${funnelOffsetX}, ${funnelMarginTop})`
-    }, isStacked ? _createStackedFunnel(height - funnelMarginTop, funnelWidth) : _createFunnel(height - funnelMarginTop, funnelWidth))), isPopoverOpen && /*#__PURE__*/ React.createElement(ChartPopover, {
-        ...props.calloutProps,
-        XValue: calloutProps === null || calloutProps === void 0 ? void 0 : calloutProps.hoverXValue,
-        yCalloutValue: calloutProps === null || calloutProps === void 0 ? void 0 : calloutProps.YValue,
-        culture: props.culture,
-        positioning: {
-            target: refSelected
-        },
-        isPopoverOpen: isPopoverOpen,
-        color: calloutProps === null || calloutProps === void 0 ? void 0 : calloutProps.color,
-        isCartesian: false
-    }), _renderLegends()) : /*#__PURE__*/ React.createElement("div", {
-        id: _emptyChartId,
-        role: 'alert',
-        style: {
-            opacity: '0'
-        },
-        "aria-label": 'Graph has no data to display'
-    });
-});
-FunnelChart.displayName = 'FunnelChart';