@fluentui/react-charts 9.1.10 → 9.2.0

package/lib-commonjs/components/LineChart/eventAnnotation/Textbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Textbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { select } from 'd3-selection';\nimport { getSecureProps } from '../../../utilities/utilities';\n\ninterface TextboxProps {\n  text: string;\n  width: number;\n  x: number;\n  y: number;\n  lineHeight: number;\n  textAnchor?: 'start' | 'middle' | 'end';\n  fontSize?: string;\n  fill?: string;\n}\n\nexport const Textbox: React.FunctionComponent<TextboxProps> = props => {\n  const textElementRef: React.RefObject<SVGTextElement> = React.useRef(null);\n\n  const wrapWords = () => {\n    if (!textElementRef.current) {\n      return;\n    }\n    const text = select(textElementRef.current);\n    const words = props.text.split(/\\s+/);\n    let line: string[] = [];\n    let tspan = text.append<SVGTSpanElement>('tspan');\n    let numLines = 0;\n\n    words.forEach(word => {\n      line.push(word);\n      tspan.text(line.join(' '));\n      const node = tspan.node();\n      if (node && node.getComputedTextLength() > props.width && line.length > 1) {\n        numLines++;\n        line.pop();\n        tspan.text(line.join(' '));\n        line = [word];\n        tspan = text.append<SVGTSpanElement>('tspan').text(word).attr('dy', props.lineHeight).attr('x', props.x);\n      }\n    });\n    // bottom aligns text\n    text.attr('dy', -numLines * props.lineHeight);\n\n    return () => {\n      text.selectAll('tspan').remove();\n    };\n  };\n  React.useEffect(wrapWords);\n\n  const { lineHeight, ...rest } = props;\n\n  return <text ref={textElementRef} {...getSecureProps(rest)} />;\n};\n"],"names":["React","select","getSecureProps","Textbox","props","textElementRef","useRef","wrapWords","current","text","words","split","line","tspan","append","numLines","forEach","word","push","join","node","getComputedTextLength","width","length","pop","attr","lineHeight","x","selectAll","remove","useEffect","rest","ref"],"mappings":";;;;+BAeaG;;;;;;;iEAfU,QAAQ;6BACR,eAAe;2BACP,+BAA+B;AAavD,gBAAuDC,CAAAA;IAC5D,MAAMC,iBAAkDL,OAAMM,MAAM,CAAC;IAErE,MAAMC,YAAY;QAChB,IAAI,CAACF,eAAeG,OAAO,EAAE;YAC3B;QACF;QACA,MAAMC,OAAOR,uBAAAA,EAAOI,eAAeG,OAAO;QAC1C,MAAME,QAAQN,MAAMK,IAAI,CAACE,KAAK,CAAC;QAC/B,IAAIC,OAAiB,EAAE;QACvB,IAAIC,QAAQJ,KAAKK,MAAM,CAAkB;QACzC,IAAIC,WAAW;QAEfL,MAAMM,OAAO,CAACC,CAAAA;YACZL,KAAKM,IAAI,CAACD;YACVJ,MAAMJ,IAAI,CAACG,KAAKO,IAAI,CAAC;YACrB,MAAMC,OAAOP,MAAMO,IAAI;YACvB,IAAIA,QAAQA,KAAKC,qBAAqB,KAAKjB,MAAMkB,KAAK,IAAIV,KAAKW,MAAM,GAAG,GAAG;gBACzER;gBACAH,KAAKY,GAAG;gBACRX,MAAMJ,IAAI,CAACG,KAAKO,IAAI,CAAC;gBACrBP,OAAO;oBAACK;iBAAK;gBACbJ,QAAQJ,KAAKK,MAAM,CAAkB,SAASL,IAAI,CAACQ,MAAMQ,IAAI,CAAC,MAAMrB,MAAMsB,UAAU,EAAED,IAAI,CAAC,KAAKrB,MAAMuB,CAAC;YACzG;QACF;QACA,qBAAqB;QACrBlB,KAAKgB,IAAI,CAAC,MAAM,CAACV,WAAWX,MAAMsB,UAAU;QAE5C,OAAO;YACLjB,KAAKmB,SAAS,CAAC,SAASC,MAAM;QAChC;IACF;IACA7B,OAAM8B,SAAS,CAACvB;IAEhB,MAAM,EAAEmB,UAAU,EAAE,GAAGK,MAAM,GAAG3B;IAEhC,OAAA,WAAA,GAAO,OAAA,aAAA,CAACK,QAAAA;QAAKuB,KAAK3B;QAAiB,OAAGH,yBAAAA,EAAe6B,KAAK;;AAC5D,EAAE"}
+{"version":3,"sources":["../src/components/LineChart/eventAnnotation/Textbox.tsx"],"sourcesContent":["import * as React from 'react';\nimport { select } from 'd3-selection';\nimport { getSecureProps } from '../../../utilities/utilities';\n\ninterface TextboxProps {\n  text: string;\n  width: number;\n  x: number;\n  y: number;\n  lineHeight: number;\n  textAnchor?: 'start' | 'middle' | 'end';\n  fontSize?: string;\n  fill?: string;\n}\n\nexport const Textbox: React.FunctionComponent<TextboxProps> = props => {\n  const textElementRef: React.RefObject<SVGTextElement> = React.useRef(null);\n\n  const wrapWords = () => {\n    if (!textElementRef.current) {\n      return;\n    }\n    const text = select(textElementRef.current);\n    const words = props.text.split(/\\s+/);\n    let line: string[] = [];\n    let tspan = text.append<SVGTSpanElement>('tspan');\n    let numLines = 0;\n\n    words.forEach(word => {\n      line.push(word);\n      tspan.text(line.join(' '));\n      const node = tspan.node();\n      if (node && node.getComputedTextLength() > props.width && line.length > 1) {\n        numLines++;\n        line.pop();\n        tspan.text(line.join(' '));\n        line = [word];\n        tspan = text.append<SVGTSpanElement>('tspan').text(word).attr('dy', props.lineHeight).attr('x', props.x);\n      }\n    });\n    // bottom aligns text\n    text.attr('dy', -numLines * props.lineHeight);\n\n    return () => {\n      text.selectAll('tspan').remove();\n    };\n  };\n  React.useEffect(wrapWords);\n\n  const { lineHeight, ...rest } = props;\n\n  return <text ref={textElementRef} {...getSecureProps(rest)} />;\n};\n"],"names":["React","select","getSecureProps","Textbox","props","textElementRef","useRef","wrapWords","current","text","words","split","line","tspan","append","numLines","forEach","word","push","join","node","getComputedTextLength","width","length","pop","attr","lineHeight","x","selectAll","remove","useEffect","rest","ref"],"mappings":";;;;+BAeaG;;;;;;;iEAfU,QAAQ;6BACR,eAAe;2BACP,+BAA+B;AAavD,gBAAuDC,CAAAA;IAC5D,MAAMC,iBAAkDL,OAAMM,MAAM,CAAC;IAErE,MAAMC,YAAY;QAChB,IAAI,CAACF,eAAeG,OAAO,EAAE;YAC3B;QACF;QACA,MAAMC,OAAOR,uBAAAA,EAAOI,eAAeG,OAAO;QAC1C,MAAME,QAAQN,MAAMK,IAAI,CAACE,KAAK,CAAC;QAC/B,IAAIC,OAAiB,EAAE;QACvB,IAAIC,QAAQJ,KAAKK,MAAM,CAAkB;QACzC,IAAIC,WAAW;QAEfL,MAAMM,OAAO,CAACC,CAAAA;YACZL,KAAKM,IAAI,CAACD;YACVJ,MAAMJ,IAAI,CAACG,KAAKO,IAAI,CAAC;YACrB,MAAMC,OAAOP,MAAMO,IAAI;YACvB,IAAIA,QAAQA,KAAKC,qBAAqB,KAAKjB,MAAMkB,KAAK,IAAIV,KAAKW,MAAM,GAAG,GAAG;gBACzER;gBACAH,KAAKY,GAAG;gBACRX,MAAMJ,IAAI,CAACG,KAAKO,IAAI,CAAC;gBACrBP,OAAO;oBAACK;iBAAK;gBACbJ,QAAQJ,KAAKK,MAAM,CAAkB,SAASL,IAAI,CAACQ,MAAMQ,IAAI,CAAC,MAAMrB,MAAMsB,UAAU,EAAED,IAAI,CAAC,KAAKrB,MAAMuB,CAAC;YACzG;QACF;QACA,qBAAqB;QACrBlB,KAAKgB,IAAI,CAAC,MAAM,CAACV,WAAWX,MAAMsB,UAAU;QAE5C,OAAO;YACLjB,KAAKmB,SAAS,CAAC,SAASC,MAAM;QAChC;IACF;IACA7B,OAAM8B,SAAS,CAACvB;IAEhB,MAAM,EAAEmB,UAAU,EAAE,GAAGK,MAAM,GAAG3B;IAEhC,OAAA,WAAA,GAAO,OAAA,aAAA,CAACK,QAAAA;QAAKuB,KAAK3B;QAAiB,OAAGH,yBAAAA,EAAe6B,KAAK;;AAC5D,EAAE"}

package/lib-commonjs/components/LineChart/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './LineChart';\nexport * from './LineChart.types';\nexport * from './eventAnnotation/Textbox';\nexport * from '../../types/index';\n"],"names":[],"mappings":";;;;;uBAAc,cAAc;uBACd,oBAAoB;uBACpB,4BAA4B;uBAC5B,oBAAoB"}
+{"version":3,"sources":["../src/components/LineChart/index.ts"],"sourcesContent":["export * from './LineChart';\nexport * from './LineChart.types';\nexport * from './eventAnnotation/Textbox';\nexport * from '../../types/index';\n"],"names":[],"mappings":";;;;;uBAAc,cAAc;uBACd,oBAAoB;uBACpB,4BAA4B;uBAC5B,oBAAoB"}

package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js

@@ -101,4 +101,4 @@ const useLineChartStyles = (props)=>{
         tooltip: (0, _react.mergeClasses)(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),
         lineBorder: (0, _react.mergeClasses)(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/ )
     };
-}; //# sourceMappingURL=useLineChartStyles.styles.js.map
+};

package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js

@@ -0,0 +1,66 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    linechartClassNames: function() {
+        return linechartClassNames;
+    },
+    useLineChartStyles: function() {
+        return useLineChartStyles;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const _index = require("../../utilities/index");
+const linechartClassNames = {
+    tooltip: 'fui-line__tooltip',
+    lineBorder: 'fui-line_lineBorder',
+    root: 'fui-line__root',
+    xAxis: 'fui-line__xAxis',
+    yAxis: 'fui-line__yAxis',
+    legendContainer: 'fui-line__legendContainer',
+    hover: 'fui-line__hover',
+    descriptionMessage: 'fui-line__descriptionMessage',
+    axisTitle: 'fui-line__axisTitle',
+    chartTitle: 'fui-line__chartTitle',
+    opacityChangeOnHover: 'fui-line__opacityChangeOnHover',
+    shapeStyles: 'fui-line__shapeStyles',
+    chartWrapper: 'fui-line__chartWrapper',
+    svgTooltip: '',
+    chart: ''
+};
+/**
+ * Base Styles
+ */ const useStyles = (0, _react.makeStyles)({
+    tooltip: {
+        display: 'flex',
+        flexDirection: 'column',
+        ..._react.shorthands.padding(_reacttheme.tokens.spacingHorizontalS),
+        position: 'absolute',
+        textAlign: 'center',
+        top: _reacttheme.tokens.spacingVerticalNone,
+        fill: _reacttheme.tokens.colorNeutralBackground1,
+        borderRadius: _reacttheme.tokens.borderRadiusSmall,
+        pointerEvents: 'none'
+    },
+    lineBorder: {
+        stroke: _reacttheme.tokens.colorNeutralBackground1,
+        [_index.HighContrastSelector]: {
+            stroke: 'Canvas'
+        }
+    }
+});
+const useLineChartStyles = (props)=>{
+    const baseStyles = useStyles();
+    return {
+        tooltip: (0, _react.mergeClasses)(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/ ),
+        lineBorder: (0, _react.mergeClasses)(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/ )
+    };
+};

package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/LineChart/useLineChartStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { LineChartProps, LineChartStyles } from './LineChart.types';\nimport { SlotClassNames } from '@fluentui/react-utilities/src/index';\nimport { HighContrastSelector } from '../../utilities/index';\n\n/**\n * @internal\n */\nexport const linechartClassNames: SlotClassNames<LineChartStyles> = {\n  tooltip: 'fui-line__tooltip',\n  lineBorder: 'fui-line_lineBorder',\n  root: 'fui-line__root',\n  xAxis: 'fui-line__xAxis',\n  yAxis: 'fui-line__yAxis',\n  legendContainer: 'fui-line__legendContainer',\n  hover: 'fui-line__hover',\n  descriptionMessage: 'fui-line__descriptionMessage',\n  axisTitle: 'fui-line__axisTitle',\n  chartTitle: 'fui-line__chartTitle',\n  opacityChangeOnHover: 'fui-line__opacityChangeOnHover',\n  shapeStyles: 'fui-line__shapeStyles',\n  chartWrapper: 'fui-line__chartWrapper',\n  svgTooltip: '',\n  chart: '',\n};\n\n/**\n * Base Styles\n */\nconst useStyles = makeStyles({\n  tooltip: {\n    display: 'flex',\n    flexDirection: 'column',\n    ...shorthands.padding(tokens.spacingHorizontalS),\n    position: 'absolute',\n    textAlign: 'center',\n    top: tokens.spacingVerticalNone,\n    fill: tokens.colorNeutralBackground1,\n    borderRadius: tokens.borderRadiusSmall,\n    pointerEvents: 'none',\n  },\n  lineBorder: {\n    stroke: tokens.colorNeutralBackground1,\n    [HighContrastSelector]: {\n      stroke: 'Canvas',\n    },\n  },\n});\n\n/**\n * Apply styling to the Carousel slots based on the state\n */\nexport const useLineChartStyles = (props: LineChartProps): LineChartStyles => {\n  const baseStyles = useStyles();\n  return {\n    tooltip: mergeClasses(linechartClassNames.tooltip, baseStyles.tooltip /*props.styles?.tooltip*/),\n    lineBorder: mergeClasses(linechartClassNames.lineBorder, baseStyles.lineBorder /*props.styles?.lineBorder*/),\n  };\n};\n"],"names":["makeStyles","mergeClasses","shorthands","tokens","HighContrastSelector","linechartClassNames","tooltip","lineBorder","root","xAxis","yAxis","legendContainer","hover","descriptionMessage","axisTitle","chartTitle","opacityChangeOnHover","shapeStyles","chartWrapper","svgTooltip","chart","useStyles","display","flexDirection","padding","spacingHorizontalS","position","textAlign","top","spacingVerticalNone","fill","colorNeutralBackground1","borderRadius","borderRadiusSmall","pointerEvents","stroke","useLineChartStyles","props","baseStyles"],"mappings":";;;;;;;;;;;IASaK,mBAAAA;;;sBA4CA+B;eAAAA;;;uBArDwC,iBAAiB;4BAC/C,wBAAwB;uBAGV,wBAAwB;AAKtD,4BAA6D;IAClE9B,SAAS;IACTC,YAAY;IACZC,MAAM;IACNC,OAAO;IACPC,OAAO;IACPC,iBAAiB;IACjBC,OAAO;IACPC,oBAAoB;IACpBC,WAAW;IACXC,YAAY;IACZC,sBAAsB;IACtBC,aAAa;IACbC,cAAc;IACdC,YAAY;IACZC,OAAO;AACT,EAAE;AAEF;;CAEC,GACD,MAAMC,gBAAYrB,iBAAAA,EAAW;IAC3BM,SAAS;QACPgB,SAAS;QACTC,eAAe;QACf,GAAGrB,iBAAAA,CAAWsB,OAAO,CAACrB,kBAAAA,CAAOsB,kBAAkB,CAAC;QAChDC,UAAU;QACVC,WAAW;QACXC,KAAKzB,kBAAAA,CAAO0B,mBAAmB;QAC/BC,MAAM3B,kBAAAA,CAAO4B,uBAAuB;QACpCC,cAAc7B,kBAAAA,CAAO8B,iBAAiB;QACtCC,eAAe;IACjB;IACA3B,YAAY;QACV4B,QAAQhC,kBAAAA,CAAO4B,uBAAuB;QACtC,CAAC3B,2BAAAA,CAAqB,EAAE;YACtB+B,QAAQ;QACV;IACF;AACF;AAKO,2BAA2B,CAACE;IACjC,MAAMC,aAAajB;IACnB,OAAO;QACLf,aAASL,mBAAAA,EAAaI,oBAAoBC,OAAO,EAAEgC,WAAWhC,OAAO,CAAC,uBAAuB;QAC7FC,gBAAYN,mBAAAA,EAAaI,oBAAoBE,UAAU,EAAE+B,WAAW/B,UAAU,CAAC,0BAA0B;IAC3G;AACF,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"sources":["ResponsiveContainer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getWindow } from '../../utilities/getWindow';\nimport { ResponsiveChildProps, ResponsiveContainerProps } from './ResponsiveContainer.types';\nimport { useResponsiveChildStyles } from './useResponsiveChildStyles.styles';\nimport { mergeClasses } from '@griffel/react';\n\n/**\n * Responsive Container component\n * {@docCategory ResponsiveContainer}\n */\nexport const ResponsiveContainer: React.FC<ResponsiveContainerProps> = props => {\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const onResizeRef = React.useRef<ResponsiveContainerProps['onResize']>();\n  const childClasses = useResponsiveChildStyles();\n\n  const [size, setSize] = React.useState<{ containerWidth?: number; containerHeight?: number }>({});\n\n  onResizeRef.current = props.onResize;\n\n  React.useEffect(() => {\n    const _window = getWindow(containerRef.current) as (Window & typeof globalThis) | undefined;\n    let animationFrameId: number | undefined;\n    let resizeObserver: ResizeObserver | undefined;\n\n    const resizeCallback = (entries: ResizeObserverEntry[]) => {\n      const { width: containerWidth, height: containerHeight } = entries[0].contentRect;\n      // rAF is an alternative to the throttle function. For more info, see:\n      // https://css-tricks.com/debouncing-throttling-explained-examples/#aa-requestanimationframe-raf\n      animationFrameId = _window?.requestAnimationFrame(() => {\n        setSize(prevSize => {\n          const roundedWidth = Math.floor(containerWidth);\n          const roundedHeight = Math.floor(containerHeight);\n          if (prevSize.containerWidth === roundedWidth && prevSize.containerHeight === roundedHeight) {\n            return prevSize;\n          }\n\n          return { containerWidth: roundedWidth, containerHeight: roundedHeight };\n        });\n      });\n      onResizeRef.current?.(containerWidth, containerHeight);\n    };\n\n    if (_window && _window.ResizeObserver) {\n      resizeObserver = new _window.ResizeObserver(resizeCallback);\n      if (containerRef.current) {\n        resizeObserver.observe(containerRef.current);\n      }\n    }\n\n    return () => {\n      if (animationFrameId) {\n        _window?.cancelAnimationFrame(animationFrameId);\n      }\n\n      resizeObserver?.disconnect();\n    };\n  }, []);\n\n  const chartContent = React.useMemo(() => {\n    let calculatedWidth = size.containerWidth;\n    let calculatedHeight = size.containerHeight;\n\n    if (typeof props.aspect === 'number' && props.aspect > 0) {\n      if (calculatedWidth) {\n        calculatedHeight = calculatedWidth / props.aspect;\n      } else if (calculatedHeight) {\n        calculatedWidth = calculatedHeight * props.aspect;\n      }\n\n      if (typeof props.maxHeight === 'number' && calculatedHeight && calculatedHeight > props.maxHeight) {\n        calculatedHeight = props.maxHeight;\n      }\n    }\n\n    return React.Children.map(props.children, child => {\n      return React.cloneElement<ResponsiveChildProps>(child, {\n        width: calculatedWidth,\n        height: calculatedHeight,\n        // For SankeyChart\n        shouldResize: (calculatedWidth ?? 0) + (calculatedHeight ?? 0),\n        styles: {\n          root: mergeClasses(child.props.styles?.root, childClasses.root),\n          chartWrapper: mergeClasses(child.props.styles?.chartWrapper, childClasses.chartWrapper),\n          chart: mergeClasses(child.props.styles?.chart, childClasses.chart),\n        },\n      });\n    });\n  }, [size, props.aspect, props.maxHeight, props.children]);\n\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        width: props.width ?? '100%',\n        height: props.height ?? '100%',\n        minWidth: props.minWidth,\n        minHeight: props.minHeight,\n        maxHeight: props.maxHeight,\n      }}\n    >\n      {chartContent}\n    </div>\n  );\n};\nResponsiveContainer.displayName = 'ResponsiveContainer';\n"],"names":["React","getWindow","useResponsiveChildStyles","mergeClasses","ResponsiveContainer","props","containerRef","useRef","onResizeRef","childClasses","size","setSize","useState","current","onResize","useEffect","_window","animationFrameId","resizeObserver","resizeCallback","entries","width","containerWidth","height","containerHeight","contentRect","requestAnimationFrame","prevSize","roundedWidth","Math","floor","roundedHeight","ResizeObserver","observe","cancelAnimationFrame","disconnect","chartContent","useMemo","calculatedWidth","calculatedHeight","aspect","maxHeight","Children","map","children","child","cloneElement","shouldResize","styles","root","chartWrapper","chart","div","ref","style","minWidth","minHeight","displayName"],"mappings":"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"}
+{"version":3,"sources":["../src/components/ResponsiveContainer/ResponsiveContainer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getWindow } from '../../utilities/getWindow';\nimport { ResponsiveChildProps, ResponsiveContainerProps } from './ResponsiveContainer.types';\nimport { useResponsiveChildStyles } from './useResponsiveChildStyles.styles';\nimport { mergeClasses } from '@griffel/react';\n\n/**\n * Responsive Container component\n * {@docCategory ResponsiveContainer}\n */\nexport const ResponsiveContainer: React.FC<ResponsiveContainerProps> = props => {\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const onResizeRef = React.useRef<ResponsiveContainerProps['onResize']>();\n  const childClasses = useResponsiveChildStyles();\n\n  const [size, setSize] = React.useState<{ containerWidth?: number; containerHeight?: number }>({});\n\n  onResizeRef.current = props.onResize;\n\n  React.useEffect(() => {\n    const _window = getWindow(containerRef.current) as (Window & typeof globalThis) | undefined;\n    let animationFrameId: number | undefined;\n    let resizeObserver: ResizeObserver | undefined;\n\n    const resizeCallback = (entries: ResizeObserverEntry[]) => {\n      const { width: containerWidth, height: containerHeight } = entries[0].contentRect;\n      // rAF is an alternative to the throttle function. For more info, see:\n      // https://css-tricks.com/debouncing-throttling-explained-examples/#aa-requestanimationframe-raf\n      animationFrameId = _window?.requestAnimationFrame(() => {\n        setSize(prevSize => {\n          const roundedWidth = Math.floor(containerWidth);\n          const roundedHeight = Math.floor(containerHeight);\n          if (prevSize.containerWidth === roundedWidth && prevSize.containerHeight === roundedHeight) {\n            return prevSize;\n          }\n\n          return { containerWidth: roundedWidth, containerHeight: roundedHeight };\n        });\n      });\n      onResizeRef.current?.(containerWidth, containerHeight);\n    };\n\n    if (_window && _window.ResizeObserver) {\n      resizeObserver = new _window.ResizeObserver(resizeCallback);\n      if (containerRef.current) {\n        resizeObserver.observe(containerRef.current);\n      }\n    }\n\n    return () => {\n      if (animationFrameId) {\n        _window?.cancelAnimationFrame(animationFrameId);\n      }\n\n      resizeObserver?.disconnect();\n    };\n  }, []);\n\n  const chartContent = React.useMemo(() => {\n    let calculatedWidth = size.containerWidth;\n    let calculatedHeight = size.containerHeight;\n\n    if (typeof props.aspect === 'number' && props.aspect > 0) {\n      if (calculatedWidth) {\n        calculatedHeight = calculatedWidth / props.aspect;\n      } else if (calculatedHeight) {\n        calculatedWidth = calculatedHeight * props.aspect;\n      }\n\n      if (typeof props.maxHeight === 'number' && calculatedHeight && calculatedHeight > props.maxHeight) {\n        calculatedHeight = props.maxHeight;\n      }\n    }\n\n    return React.Children.map(props.children, child => {\n      return React.cloneElement<ResponsiveChildProps>(child, {\n        width: calculatedWidth,\n        height: calculatedHeight,\n        // For SankeyChart\n        shouldResize: (calculatedWidth ?? 0) + (calculatedHeight ?? 0),\n        styles: {\n          root: mergeClasses(child.props.styles?.root, childClasses.root),\n          chartWrapper: mergeClasses(child.props.styles?.chartWrapper, childClasses.chartWrapper),\n          chart: mergeClasses(child.props.styles?.chart, childClasses.chart),\n        },\n      });\n    });\n  }, [size, props.aspect, props.maxHeight, props.children]);\n\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        width: props.width ?? '100%',\n        height: props.height ?? '100%',\n        minWidth: props.minWidth,\n        minHeight: props.minHeight,\n        maxHeight: props.maxHeight,\n      }}\n    >\n      {chartContent}\n    </div>\n  );\n};\nResponsiveContainer.displayName = 'ResponsiveContainer';\n"],"names":["React","getWindow","useResponsiveChildStyles","mergeClasses","ResponsiveContainer","props","containerRef","useRef","onResizeRef","childClasses","size","setSize","useState","current","onResize","useEffect","_window","animationFrameId","resizeObserver","resizeCallback","entries","width","containerWidth","height","containerHeight","contentRect","requestAnimationFrame","prevSize","roundedWidth","Math","floor","roundedHeight","ResizeObserver","observe","cancelAnimationFrame","disconnect","chartContent","useMemo","calculatedWidth","calculatedHeight","aspect","maxHeight","Children","map","children","child","cloneElement","shouldResize","styles","root","chartWrapper","chart","div","ref","style","minWidth","minHeight","displayName"],"mappings":"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"}

package/lib-commonjs/components/ResponsiveContainer/ResponsiveContainer.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ResponsiveContainer.types.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Responsive Child styles\n * {@docCategory ResponsiveContainer}\n */\nexport interface ResponsiveChildStyles {\n  root?: string;\n  chartWrapper?: string;\n  chart?: string;\n}\n\n/**\n * Responsive Child props\n * {@docCategory ResponsiveContainer}\n */\nexport interface ResponsiveChildProps {\n  width?: number;\n  height?: number;\n  shouldResize?: number;\n  styles?: ResponsiveChildStyles;\n}\n\n/**\n * Responsive Container props\n * {@docCategory ResponsiveContainer}\n */\nexport interface ResponsiveContainerProps {\n  /**\n   * Aspect ratio (width / height) of the container. If specified, the height will be calculated by width / aspect.\n   */\n  aspect?: number;\n\n  /**\n   * Width of the container\n   */\n  width?: number | string;\n\n  /**\n   * Height of the container\n   */\n  height?: number | string;\n\n  /**\n   * Minimum width of the container\n   */\n  minWidth?: number | string;\n\n  /**\n   * Minimum height of the container\n   */\n  minHeight?: number | string;\n\n  /**\n   * Maximum height of the container\n   */\n  maxHeight?: number;\n\n  /**\n   * Callback providing the updated chart width and height values when the container is resized\n   */\n  onResize?: (width: number, height: number) => void;\n\n  /**\n   * Child component to be rendered within the container\n   */\n  children: React.ReactElement<ResponsiveChildProps>;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}
+{"version":3,"sources":["../src/components/ResponsiveContainer/ResponsiveContainer.types.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Responsive Child styles\n * {@docCategory ResponsiveContainer}\n */\nexport interface ResponsiveChildStyles {\n  root?: string;\n  chartWrapper?: string;\n  chart?: string;\n}\n\n/**\n * Responsive Child props\n * {@docCategory ResponsiveContainer}\n */\nexport interface ResponsiveChildProps {\n  width?: number;\n  height?: number;\n  shouldResize?: number;\n  styles?: ResponsiveChildStyles;\n}\n\n/**\n * Responsive Container props\n * {@docCategory ResponsiveContainer}\n */\nexport interface ResponsiveContainerProps {\n  /**\n   * Aspect ratio (width / height) of the container. If specified, the height will be calculated by width / aspect.\n   */\n  aspect?: number;\n\n  /**\n   * Width of the container\n   */\n  width?: number | string;\n\n  /**\n   * Height of the container\n   */\n  height?: number | string;\n\n  /**\n   * Minimum width of the container\n   */\n  minWidth?: number | string;\n\n  /**\n   * Minimum height of the container\n   */\n  minHeight?: number | string;\n\n  /**\n   * Maximum height of the container\n   */\n  maxHeight?: number;\n\n  /**\n   * Callback providing the updated chart width and height values when the container is resized\n   */\n  onResize?: (width: number, height: number) => void;\n\n  /**\n   * Child component to be rendered within the container\n   */\n  children: React.ReactElement<ResponsiveChildProps>;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

package/lib-commonjs/components/ResponsiveContainer/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './ResponsiveContainer';\nexport * from './ResponsiveContainer.types';\nexport * from './withResponsiveContainer';\n"],"names":[],"mappings":";;;;;uBAAc,wBAAwB;uBACxB,8BAA8B;uBAC9B,4BAA4B"}
+{"version":3,"sources":["../src/components/ResponsiveContainer/index.ts"],"sourcesContent":["export * from './ResponsiveContainer';\nexport * from './ResponsiveContainer.types';\nexport * from './withResponsiveContainer';\n"],"names":[],"mappings":";;;;;uBAAc,wBAAwB;uBACxB,8BAA8B;uBAC9B,4BAA4B"}

package/lib-commonjs/components/ResponsiveContainer/useResponsiveChildStyles.styles.js

@@ -46,4 +46,4 @@ const useResponsiveChildStyles = ()=>{
         chartWrapper: (0, _react.mergeClasses)(responsiveChildClassNames.chartWrapper, baseStyles.chartWrapper),
         chart: (0, _react.mergeClasses)(responsiveChildClassNames.chart, baseStyles.chart)
     };
-}; //# sourceMappingURL=useResponsiveChildStyles.styles.js.map
+};

package/lib-commonjs/components/ResponsiveContainer/useResponsiveChildStyles.styles.raw.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    responsiveChildClassNames: function() {
+        return responsiveChildClassNames;
+    },
+    useResponsiveChildStyles: function() {
+        return useResponsiveChildStyles;
+    }
+});
+const _react = require("@griffel/react");
+const responsiveChildClassNames = {
+    root: 'fui-charts-resp-child__root',
+    chartWrapper: 'fui-charts-resp-child__chartWrapper',
+    chart: 'fui-charts-resp-child__chart'
+};
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        width: '100%',
+        height: '100%'
+    },
+    chartWrapper: {
+        width: '100%'
+    },
+    chart: {
+        // This overrides the pixel width of svg allowing it to resize properly within a flexbox or grid layout.
+        // Note: height is not set to 100% because that causes the charts to resize vertically in an infinite loop.
+        width: '100%'
+    }
+});
+const useResponsiveChildStyles = ()=>{
+    const baseStyles = useStyles();
+    return {
+        root: (0, _react.mergeClasses)(responsiveChildClassNames.root, baseStyles.root),
+        chartWrapper: (0, _react.mergeClasses)(responsiveChildClassNames.chartWrapper, baseStyles.chartWrapper),
+        chart: (0, _react.mergeClasses)(responsiveChildClassNames.chart, baseStyles.chart)
+    };
+};

package/lib-commonjs/components/ResponsiveContainer/useResponsiveChildStyles.styles.raw.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ResponsiveContainer/useResponsiveChildStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { ResponsiveChildStyles } from './ResponsiveContainer.types';\nimport { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const responsiveChildClassNames: SlotClassNames<ResponsiveChildStyles> = {\n  root: 'fui-charts-resp-child__root',\n  chartWrapper: 'fui-charts-resp-child__chartWrapper',\n  chart: 'fui-charts-resp-child__chart',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    width: '100%',\n    height: '100%',\n  },\n  chartWrapper: {\n    width: '100%',\n  },\n  chart: {\n    // This overrides the pixel width of svg allowing it to resize properly within a flexbox or grid layout.\n    // Note: height is not set to 100% because that causes the charts to resize vertically in an infinite loop.\n    width: '100%',\n  },\n});\n\nexport const useResponsiveChildStyles = (): ResponsiveChildStyles => {\n  const baseStyles = useStyles();\n\n  return {\n    root: mergeClasses(responsiveChildClassNames.root, baseStyles.root),\n    chartWrapper: mergeClasses(responsiveChildClassNames.chartWrapper, baseStyles.chartWrapper),\n    chart: mergeClasses(responsiveChildClassNames.chart, baseStyles.chart),\n  };\n};\n"],"names":["makeStyles","mergeClasses","responsiveChildClassNames","root","chartWrapper","chart","useStyles","width","height","useResponsiveChildStyles","baseStyles"],"mappings":";;;;;;;;;;;IAIaE,yBAAAA;;;IAqBAO,wBAAAA;;;;uBAzB4B,iBAAiB;AAInD,kCAAyE;IAC9EN,MAAM;IACNC,cAAc;IACdC,OAAO;AACT,EAAE;AAEF,MAAMC,gBAAYN,iBAAAA,EAAW;IAC3BG,MAAM;QACJI,OAAO;QACPC,QAAQ;IACV;IACAJ,cAAc;QACZG,OAAO;IACT;IACAF,OAAO;QACL,wGAAwG;QACxG,2GAA2G;QAC3GE,OAAO;IACT;AACF;AAEO,iCAAiC;IACtC,MAAMG,aAAaJ;IAEnB,OAAO;QACLH,UAAMF,mBAAAA,EAAaC,0BAA0BC,IAAI,EAAEO,WAAWP,IAAI;QAClEC,kBAAcH,mBAAAA,EAAaC,0BAA0BE,YAAY,EAAEM,WAAWN,YAAY;QAC1FC,WAAOJ,mBAAAA,EAAaC,0BAA0BG,KAAK,EAAEK,WAAWL,KAAK;IACvE;AACF,EAAE"}

package/lib-commonjs/components/ResponsiveContainer/withResponsiveContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["withResponsiveContainer.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport * as React from 'react';\nimport { ResponsiveContainer } from './ResponsiveContainer';\nimport { ResponsiveContainerProps } from './ResponsiveContainer.types';\n\n/**\n * An HOC to update wrapped component on container resize.\n * {@docCategory ResponsiveContainer}\n */\nexport function withResponsiveContainer<TProps extends Omit<ResponsiveContainerProps, 'children'>>(\n  WrappedComponent: React.ComponentType<TProps>,\n) {\n  const ComponentWithResponsiveContainer: React.FC<TProps> = ({\n    aspect,\n    width,\n    height,\n    minWidth,\n    minHeight,\n    maxHeight,\n    onResize,\n    ...restProps\n  }) => {\n    return (\n      <ResponsiveContainer\n        aspect={aspect}\n        width={width}\n        height={height}\n        minWidth={minWidth}\n        minHeight={minHeight}\n        maxHeight={maxHeight}\n        onResize={onResize}\n      >\n        <WrappedComponent {...(restProps as any)} />\n      </ResponsiveContainer>\n    );\n  };\n\n  return ComponentWithResponsiveContainer;\n}\n"],"names":["React","ResponsiveContainer","withResponsiveContainer","WrappedComponent","ComponentWithResponsiveContainer","aspect","width","height","minWidth","minHeight","maxHeight","onResize","restProps"],"mappings":"AAAA,qDAAqD,GACrD,YAAYA;;;;;;;;;;;iEAAW,QAAQ;qCACK,wBAAwB;AAOrD,SAASE,wBACdC,gBAA6C;IAE7C,MAAMC,mCAAqD,CAAC,EAC1DC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACR,GAAGC,WACJ;QACC,OAAA,WAAA,GACE,OAAA,aAAA,CAACX,wCAAAA,EAAAA;YACCI,QAAQA;YACRC,OAAOA;YACPC,QAAQA;YACRC,UAAUA;YACVC,WAAWA;YACXC,WAAWA;YACXC,UAAUA;yBAEV,OAAA,aAAA,CAACR,kBAAsBS;IAG7B;IAEA,OAAOR;AACT"}
+{"version":3,"sources":["../src/components/ResponsiveContainer/withResponsiveContainer.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport * as React from 'react';\nimport { ResponsiveContainer } from './ResponsiveContainer';\nimport { ResponsiveContainerProps } from './ResponsiveContainer.types';\n\n/**\n * An HOC to update wrapped component on container resize.\n * {@docCategory ResponsiveContainer}\n */\nexport function withResponsiveContainer<TProps extends Omit<ResponsiveContainerProps, 'children'>>(\n  WrappedComponent: React.ComponentType<TProps>,\n) {\n  const ComponentWithResponsiveContainer: React.FC<TProps> = ({\n    aspect,\n    width,\n    height,\n    minWidth,\n    minHeight,\n    maxHeight,\n    onResize,\n    ...restProps\n  }) => {\n    return (\n      <ResponsiveContainer\n        aspect={aspect}\n        width={width}\n        height={height}\n        minWidth={minWidth}\n        minHeight={minHeight}\n        maxHeight={maxHeight}\n        onResize={onResize}\n      >\n        <WrappedComponent {...(restProps as any)} />\n      </ResponsiveContainer>\n    );\n  };\n\n  return ComponentWithResponsiveContainer;\n}\n"],"names":["React","ResponsiveContainer","withResponsiveContainer","WrappedComponent","ComponentWithResponsiveContainer","aspect","width","height","minWidth","minHeight","maxHeight","onResize","restProps"],"mappings":"AAAA,qDAAqD,GACrD,YAAYA;;;;;;;;;;;iEAAW,QAAQ;qCACK,wBAAwB;AAOrD,SAASE,wBACdC,gBAA6C;IAE7C,MAAMC,mCAAqD,CAAC,EAC1DC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,QAAQ,EACRC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACR,GAAGC,WACJ;QACC,OAAA,WAAA,GACE,OAAA,aAAA,CAACX,wCAAAA,EAAAA;YACCI,QAAQA;YACRC,OAAOA;YACPC,QAAQA;YACRC,UAAUA;YACVC,WAAWA;YACXC,WAAWA;YACXC,UAAUA;yBAEV,OAAA,aAAA,CAACR,kBAAsBS;IAG7B;IAEA,OAAOR;AACT"}

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

@@ -35,6 +35,7 @@ const _useSankeyChartStylesstyles = require("./useSankeyChartStyles.styles");
 const _index = require("../CommonComponents/index");
 const _reacttabster = require("@fluentui/react-tabster");
 const _string = require("../../utilities/string");
+const _imageexportutils = require("../../utilities/image-export-utils");
 const PADDING_PERCENTAGE = 0.3;
 const NON_SELECTED_NODE_AND_STREAM_COLOR = '#757575';
 const DEFAULT_NODE_COLORS = [
@@ -482,7 +483,10 @@ const SankeyChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>{
         y: 0
     });
     _react.useImperativeHandle(props.componentRef, ()=>({
-            chartContainer: chartContainer.current
+            chartContainer: chartContainer.current,
+            toImage: (opts)=>{
+                return (0, _imageexportutils.toImage)(chartContainer.current, undefined, _isRtl, opts);
+            }
         }), []);
     const _fitParentContainer = _react.useCallback(()=>{
         _reqID.current = _window === null || _window === void 0 ? void 0 : _window.requestAnimationFrame(()=>{