@fluentui/react-charting 5.24.5 → 5.24.6

package/lib-amd/components/CommonComponents/CartesianChart.styles.js

@@ -1,11 +1,11 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui/react"], function (require, exports, tslib_1, Styling_1, react_1) {
+define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui/react", "../../utilities/index"], function (require, exports, tslib_1, Styling_1, react_1, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var isIE11Var = (0, react_1.isIE11)();
     var getStyles = function (props) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        var className = props.className, theme = props.theme, isRtl = props.isRtl, shouldHighlight = props.shouldHighlight, href = props.href, _m = props.lineColor, lineColor = _m === void 0 ? 'transparent' : _m, toDrawShape = props.toDrawShape, enableReflow = props.enableReflow;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        var className = props.className, theme = props.theme, isRtl = props.isRtl, shouldHighlight = props.shouldHighlight, href = props.href, _k = props.lineColor, lineColor = _k === void 0 ? 'transparent' : _k, toDrawShape = props.toDrawShape, enableReflow = props.enableReflow;
         var fonts = theme.fonts;
         return {
             root: [
@@ -20,36 +20,8 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui
                 className,
             ],
             chartWrapper: tslib_1.__assign({}, (enableReflow ? { overflow: 'auto' } : {})),
-            axisTitle: [
-                theme.fonts.xSmall,
-                (_a = {
-                        textAlign: 'center',
-                        fontWeight: Styling_1.FontWeights.semibold,
-                        fontStyle: 'normal',
-                        lineHeight: Styling_1.FontSizes.medium,
-                        color: react_1.NeutralColors.gray160,
-                        fill: theme.semanticColors.bodyText
-                    },
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            ],
-            axisAnnotation: [
-                theme.fonts.small,
-                (_b = {
-                        textAlign: 'center',
-                        fontWeight: Styling_1.FontWeights.semibold,
-                        fontStyle: 'normal',
-                        lineHeight: Styling_1.FontSizes.medium,
-                        color: react_1.NeutralColors.gray160,
-                        fill: theme.semanticColors.bodyText
-                    },
-                    _b[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _b),
-            ],
+            axisTitle: (0, index_1.getAxisTitleStyle)(theme, theme.fonts.xSmall),
+            axisAnnotation: (0, index_1.getAxisTitleStyle)(theme, theme.fonts.small),
             xAxis: {
                 selectors: {
                     text: [
@@ -57,23 +29,23 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui
                         {
                             fill: theme.semanticColors.bodyText,
                             fontWeight: '600',
-                            selectors: (_c = {},
-                                _c[Styling_1.HighContrastSelector] = {
+                            selectors: (_a = {},
+                                _a[Styling_1.HighContrastSelector] = {
                                     fill: 'CanvasText',
                                 },
-                                _c),
+                                _a),
                         },
                     ],
                     line: {
                         opacity: 0.2,
                         stroke: theme.semanticColors.bodyText,
                         width: '1px',
-                        selectors: (_d = {},
-                            _d[Styling_1.HighContrastSelector] = {
+                        selectors: (_b = {},
+                            _b[Styling_1.HighContrastSelector] = {
                                 opacity: 0.1,
                                 stroke: 'CanvasText',
                             },
-                            _d),
+                            _b),
                     },
                     path: {
                         display: 'none',
@@ -87,11 +59,11 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui
                         {
                             fill: theme.semanticColors.bodyText,
                             fontWeight: '600',
-                            selectors: (_e = {},
-                                _e[Styling_1.HighContrastSelector] = {
+                            selectors: (_c = {},
+                                _c[Styling_1.HighContrastSelector] = {
                                     fill: 'CanvasText',
                                 },
-                                _e),
+                                _c),
                         },
                     ],
                     path: {
@@ -100,12 +72,12 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui
                     line: {
                         opacity: 0.2,
                         stroke: theme.semanticColors.bodyText,
-                        selectors: (_f = {},
-                            _f[Styling_1.HighContrastSelector] = {
+                        selectors: (_d = {},
+                            _d[Styling_1.HighContrastSelector] = {
                                 opacity: 0.1,
                                 stroke: 'CanvasText',
                             },
-                            _f),
+                            _d),
                     },
                     g: [
                         isRtl &&
@@ -149,11 +121,11 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui
                     color: theme.semanticColors.bodyText,
                 },
                 !toDrawShape && {
-                    selectors: (_g = {},
-                        _g[Styling_1.HighContrastSelector] = {
+                    selectors: (_e = {},
+                        _e[Styling_1.HighContrastSelector] = {
                             forcedColorAdjust: 'none',
                         },
-                        _g),
+                        _e),
                     borderLeft: "4px solid ".concat(lineColor),
                     paddingLeft: '8px',
                 },
@@ -164,40 +136,40 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui
             shapeStyles: {
                 marginRight: '8px',
             },
-            calloutlegendText: tslib_1.__assign(tslib_1.__assign({}, fonts.small), { lineHeight: '16px', selectors: (_h = {},
-                    _h[Styling_1.HighContrastSelector] = {
+            calloutlegendText: tslib_1.__assign(tslib_1.__assign({}, fonts.small), { lineHeight: '16px', selectors: (_f = {},
+                    _f[Styling_1.HighContrastSelector] = {
                         color: 'CanvasText',
                     },
-                    _h), color: theme.semanticColors.bodySubtext }),
+                    _f), color: theme.semanticColors.bodySubtext }),
             calloutContentY: [
-                tslib_1.__assign(tslib_1.__assign({}, fonts.mediumPlus), { fontWeight: 'bold', lineHeight: '22px', selectors: (_j = {},
-                        _j[Styling_1.HighContrastSelector] = {
+                tslib_1.__assign(tslib_1.__assign({}, fonts.mediumPlus), { fontWeight: 'bold', lineHeight: '22px', selectors: (_g = {},
+                        _g[Styling_1.HighContrastSelector] = {
                             color: 'CanvasText',
                         },
-                        _j) }),
+                        _g) }),
             ],
             descriptionMessage: [
                 theme.fonts.small,
                 {
-                    selectors: (_k = {},
-                        _k[Styling_1.HighContrastSelector] = {
+                    selectors: (_h = {},
+                        _h[Styling_1.HighContrastSelector] = {
                             color: 'CanvasText',
                         },
-                        _k),
+                        _h),
                     color: theme.semanticColors.bodyText,
                     marginTop: '10px',
                     paddingTop: '10px',
                     borderTop: "1px solid ".concat(theme.semanticColors.menuDivider),
                 },
             ],
-            tooltip: tslib_1.__assign(tslib_1.__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none' }),
-            svgTooltip: (_l = {
+            tooltip: (0, index_1.getTooltipStyle)(theme),
+            svgTooltip: (_j = {
                     fill: theme.semanticColors.bodyBackground
                 },
-                _l[Styling_1.HighContrastSelector] = {
+                _j[Styling_1.HighContrastSelector] = {
                     fill: 'Canvas',
                 },
-                _l),
+                _j),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"CartesianChart.styles.js","sourceRoot":"../src/","sources":["components/CommonComponents/CartesianChart.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { ICartesianChartStyleProps, ICartesianChartStyles } from './CartesianChart.types';\nimport { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { NeutralColors, isIE11 } from '@fluentui/react';\n\nconst isIE11Var: boolean = isIE11();\n\nexport const getStyles = (props: ICartesianChartStyleProps): ICartesianChartStyles => {\n  const {\n    className,\n    theme,\n    isRtl,\n    shouldHighlight,\n    href,\n    lineColor = 'transparent',\n    toDrawShape,\n    enableReflow,\n  } = props;\n  const { fonts } = theme!;\n  return {\n    root: [\n      theme.fonts.medium,\n      {\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden',\n      },\n      className,\n    ],\n    chartWrapper: {\n      ...(enableReflow ? { overflow: 'auto' } : {}),\n    },\n    axisTitle: [\n      theme.fonts.xSmall,\n      {\n        textAlign: 'center',\n        fontWeight: FontWeights.semibold,\n        fontStyle: 'normal',\n        lineHeight: FontSizes.medium,\n        color: NeutralColors.gray160,\n        fill: theme.semanticColors.bodyText,\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    ],\n    axisAnnotation: [\n      theme.fonts.small,\n      {\n        textAlign: 'center',\n        fontWeight: FontWeights.semibold,\n        fontStyle: 'normal',\n        lineHeight: FontSizes.medium,\n        color: NeutralColors.gray160,\n        fill: theme.semanticColors.bodyText,\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    ],\n    xAxis: {\n      selectors: {\n        text: [\n          theme.fonts.tiny,\n          {\n            fill: theme.semanticColors.bodyText,\n            fontWeight: '600',\n            selectors: {\n              [HighContrastSelector]: {\n                fill: 'CanvasText',\n              },\n            },\n          },\n        ],\n        line: {\n          opacity: 0.2,\n          stroke: theme.semanticColors.bodyText,\n          width: '1px',\n          selectors: {\n            [HighContrastSelector]: {\n              opacity: 0.1,\n              stroke: 'CanvasText',\n            },\n          },\n        },\n        path: {\n          display: 'none',\n        },\n      },\n    },\n    yAxis: {\n      selectors: {\n        text: [\n          theme.fonts.tiny,\n          {\n            fill: theme.semanticColors.bodyText,\n            fontWeight: '600',\n            selectors: {\n              [HighContrastSelector]: {\n                fill: 'CanvasText',\n              },\n            },\n          },\n        ],\n        path: {\n          display: 'none',\n        },\n        line: {\n          opacity: 0.2,\n          stroke: theme.semanticColors.bodyText,\n          selectors: {\n            [HighContrastSelector]: {\n              opacity: 0.1,\n              stroke: 'CanvasText',\n            },\n          },\n        },\n        g: [\n          isRtl &&\n            !isIE11Var && {\n              textAnchor: 'end',\n            },\n        ],\n      },\n    },\n\n    opacityChangeOnHover: {\n      opacity: shouldHighlight ? '' : '0.1',\n      cursor: href ? 'pointer' : 'default',\n    },\n\n    legendContainer: [\n      {\n        marginTop: '8px',\n        marginLeft: '20px',\n      },\n    ],\n    calloutContentRoot: [\n      {\n        display: 'grid',\n        overflow: 'hidden',\n        padding: '11px 16px 10px 16px',\n        backgroundColor: theme.semanticColors.bodyBackground,\n        backgroundBlendMode: 'normal, luminosity',\n      },\n    ],\n    calloutDateTimeContainer: {\n      display: 'flex',\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n    },\n    calloutContentX: [\n      {\n        ...fonts.small,\n        lineHeight: '16px',\n        opacity: '0.85',\n        color: theme.semanticColors.bodySubtext,\n      },\n    ],\n    calloutBlockContainer: [\n      theme.fonts.mediumPlus,\n      {\n        marginTop: '13px',\n        color: theme.semanticColors.bodyText,\n      },\n      !toDrawShape && {\n        selectors: {\n          [HighContrastSelector]: {\n            forcedColorAdjust: 'none',\n          },\n        },\n        borderLeft: `4px solid ${lineColor}`,\n        paddingLeft: '8px',\n      },\n      toDrawShape && {\n        display: 'flex',\n      },\n    ],\n    shapeStyles: {\n      marginRight: '8px',\n    },\n    calloutlegendText: {\n      ...fonts.small,\n      lineHeight: '16px',\n      selectors: {\n        [HighContrastSelector]: {\n          color: 'CanvasText',\n        },\n      },\n      color: theme.semanticColors.bodySubtext,\n    },\n    calloutContentY: [\n      {\n        ...fonts.mediumPlus,\n        fontWeight: 'bold',\n        lineHeight: '22px',\n        selectors: {\n          [HighContrastSelector]: {\n            color: 'CanvasText',\n          },\n        },\n      },\n    ],\n    descriptionMessage: [\n      theme.fonts.small,\n      {\n        selectors: {\n          [HighContrastSelector]: {\n            color: 'CanvasText',\n          },\n        },\n        color: theme.semanticColors.bodyText,\n        marginTop: '10px',\n        paddingTop: '10px',\n        borderTop: `1px solid ${theme.semanticColors.menuDivider}`,\n      },\n    ],\n    tooltip: {\n      ...theme.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: theme.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n    },\n    svgTooltip: {\n      fill: theme.semanticColors.bodyBackground,\n      [HighContrastSelector]: {\n        fill: 'Canvas',\n      },\n    },\n  };\n};\n"]}
+{"version":3,"file":"CartesianChart.styles.js","sourceRoot":"../src/","sources":["components/CommonComponents/CartesianChart.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { ICartesianChartStyleProps, ICartesianChartStyles } from './CartesianChart.types';\nimport { HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { isIE11 } from '@fluentui/react';\nimport { getAxisTitleStyle, getTooltipStyle } from '../../utilities/index';\n\nconst isIE11Var: boolean = isIE11();\n\nexport const getStyles = (props: ICartesianChartStyleProps): ICartesianChartStyles => {\n  const {\n    className,\n    theme,\n    isRtl,\n    shouldHighlight,\n    href,\n    lineColor = 'transparent',\n    toDrawShape,\n    enableReflow,\n  } = props;\n  const { fonts } = theme!;\n  return {\n    root: [\n      theme.fonts.medium,\n      {\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden',\n      },\n      className,\n    ],\n    chartWrapper: {\n      ...(enableReflow ? { overflow: 'auto' } : {}),\n    },\n    axisTitle: getAxisTitleStyle(theme!, theme.fonts.xSmall),\n    axisAnnotation: getAxisTitleStyle(theme!, theme.fonts.small),\n    xAxis: {\n      selectors: {\n        text: [\n          theme.fonts.tiny,\n          {\n            fill: theme.semanticColors.bodyText,\n            fontWeight: '600',\n            selectors: {\n              [HighContrastSelector]: {\n                fill: 'CanvasText',\n              },\n            },\n          },\n        ],\n        line: {\n          opacity: 0.2,\n          stroke: theme.semanticColors.bodyText,\n          width: '1px',\n          selectors: {\n            [HighContrastSelector]: {\n              opacity: 0.1,\n              stroke: 'CanvasText',\n            },\n          },\n        },\n        path: {\n          display: 'none',\n        },\n      },\n    },\n    yAxis: {\n      selectors: {\n        text: [\n          theme.fonts.tiny,\n          {\n            fill: theme.semanticColors.bodyText,\n            fontWeight: '600',\n            selectors: {\n              [HighContrastSelector]: {\n                fill: 'CanvasText',\n              },\n            },\n          },\n        ],\n        path: {\n          display: 'none',\n        },\n        line: {\n          opacity: 0.2,\n          stroke: theme.semanticColors.bodyText,\n          selectors: {\n            [HighContrastSelector]: {\n              opacity: 0.1,\n              stroke: 'CanvasText',\n            },\n          },\n        },\n        g: [\n          isRtl &&\n            !isIE11Var && {\n              textAnchor: 'end',\n            },\n        ],\n      },\n    },\n\n    opacityChangeOnHover: {\n      opacity: shouldHighlight ? '' : '0.1',\n      cursor: href ? 'pointer' : 'default',\n    },\n\n    legendContainer: [\n      {\n        marginTop: '8px',\n        marginLeft: '20px',\n      },\n    ],\n    calloutContentRoot: [\n      {\n        display: 'grid',\n        overflow: 'hidden',\n        padding: '11px 16px 10px 16px',\n        backgroundColor: theme.semanticColors.bodyBackground,\n        backgroundBlendMode: 'normal, luminosity',\n      },\n    ],\n    calloutDateTimeContainer: {\n      display: 'flex',\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n    },\n    calloutContentX: [\n      {\n        ...fonts.small,\n        lineHeight: '16px',\n        opacity: '0.85',\n        color: theme.semanticColors.bodySubtext,\n      },\n    ],\n    calloutBlockContainer: [\n      theme.fonts.mediumPlus,\n      {\n        marginTop: '13px',\n        color: theme.semanticColors.bodyText,\n      },\n      !toDrawShape && {\n        selectors: {\n          [HighContrastSelector]: {\n            forcedColorAdjust: 'none',\n          },\n        },\n        borderLeft: `4px solid ${lineColor}`,\n        paddingLeft: '8px',\n      },\n      toDrawShape && {\n        display: 'flex',\n      },\n    ],\n    shapeStyles: {\n      marginRight: '8px',\n    },\n    calloutlegendText: {\n      ...fonts.small,\n      lineHeight: '16px',\n      selectors: {\n        [HighContrastSelector]: {\n          color: 'CanvasText',\n        },\n      },\n      color: theme.semanticColors.bodySubtext,\n    },\n    calloutContentY: [\n      {\n        ...fonts.mediumPlus,\n        fontWeight: 'bold',\n        lineHeight: '22px',\n        selectors: {\n          [HighContrastSelector]: {\n            color: 'CanvasText',\n          },\n        },\n      },\n    ],\n    descriptionMessage: [\n      theme.fonts.small,\n      {\n        selectors: {\n          [HighContrastSelector]: {\n            color: 'CanvasText',\n          },\n        },\n        color: theme.semanticColors.bodyText,\n        marginTop: '10px',\n        paddingTop: '10px',\n        borderTop: `1px solid ${theme.semanticColors.menuDivider}`,\n      },\n    ],\n    tooltip: getTooltipStyle(theme),\n    svgTooltip: {\n      fill: theme.semanticColors.bodyBackground,\n      [HighContrastSelector]: {\n        fill: 'Canvas',\n      },\n    },\n  };\n};\n"]}

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

@@ -1,9 +1,8 @@
-define(["require", "exports", "@fluentui/react/lib/Styling", "@fluentui/react"], function (require, exports, Styling_1, react_1) {
+define(["require", "exports", "../../utilities/index"], function (require, exports, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var getStyles = function (props) {
-        var _a;
         var className = props.className, width = props.width, height = props.height, theme = props.theme;
         return {
             root: [
@@ -30,21 +29,7 @@ define(["require", "exports", "@fluentui/react/lib/Styling", "@fluentui/react"],
                 paddingTop: '16px',
                 width: "".concat(width, "px"),
             },
-            axisAnnotation: [
-                theme.fonts.small,
-                (_a = {
-                        textAlign: 'center',
-                        fontWeight: Styling_1.FontWeights.semibold,
-                        fontStyle: 'normal',
-                        lineHeight: Styling_1.FontSizes.medium,
-                        color: react_1.NeutralColors.gray160,
-                        fill: theme.semanticColors.bodyText
-                    },
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            ],
+            axisAnnotation: (0, index_1.getAxisTitleStyle)(theme, theme.fonts.small),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"DonutChart.styles.js","sourceRoot":"../src/","sources":["components/DonutChart/DonutChart.styles.ts"],"names":[],"mappings":";;;;IAIO,IAAM,SAAS,GAAG,UAAC,KAA4B;;QAC5C,IAAA,SAAS,GAA2B,KAAK,UAAhC,EAAE,KAAK,GAAoB,KAAK,MAAzB,EAAE,MAAM,GAAY,KAAK,OAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QAClD,OAAO;YACL,IAAI,EAAE;gBACJ,KAAK,CAAC,KAAK,CAAC,MAAM;gBAClB,eAAe;gBACf;oBACE,UAAU,EAAE,QAAQ;oBACpB,OAAO,EAAE,MAAM;oBACf,aAAa,EAAE,QAAQ;oBACvB,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;iBACf;gBACD,SAAS;aACV;YACD,KAAK,EAAE;gBACL,KAAK,OAAA;gBACL,MAAM,QAAA;gBACN,SAAS,EAAE,aAAa;gBACxB,QAAQ,EAAE,SAAS;gBACnB,eAAe,EAAE,QAAQ;gBACzB,OAAO,EAAE,OAAO;aACjB;YACD,eAAe,EAAE;gBACf,UAAU,EAAE,MAAM;gBAClB,KAAK,EAAE,UAAG,KAAK,OAAI;aACpB;YACD,cAAc,EAAE;gBACd,KAAK,CAAC,KAAK,CAAC,KAAK;;wBAEf,SAAS,EAAE,QAAQ;wBACnB,UAAU,EAAE,qBAAW,CAAC,QAAQ;wBAChC,SAAS,EAAE,QAAQ;wBACnB,UAAU,EAAE,mBAAS,CAAC,MAAM;wBAC5B,KAAK,EAAE,qBAAa,CAAC,OAAO;wBAC5B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ;;oBACnC,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,YAAY;qBACnB;;aAEJ;SACF,CAAC;IACJ,CAAC,CAAC;IA1CW,QAAA,SAAS,aA0CpB","sourcesContent":["import { IDonutChartStyleProps, IDonutChartStyles } from './DonutChart.types';\nimport { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { NeutralColors } from '@fluentui/react';\n\nexport const getStyles = (props: IDonutChartStyleProps): IDonutChartStyles => {\n  const { className, width, height, theme } = props;\n  return {\n    root: [\n      theme.fonts.medium,\n      'ms-DonutChart',\n      {\n        alignItems: 'center',\n        display: 'flex',\n        flexDirection: 'column',\n        width: '100%',\n        height: '100%',\n      },\n      className,\n    ],\n    chart: {\n      width,\n      height,\n      boxSizing: 'content-box',\n      overflow: 'visible',\n      alignmentAdjust: 'center',\n      display: 'block',\n    },\n    legendContainer: {\n      paddingTop: '16px',\n      width: `${width}px`,\n    },\n    axisAnnotation: [\n      theme.fonts.small,\n      {\n        textAlign: 'center',\n        fontWeight: FontWeights.semibold,\n        fontStyle: 'normal',\n        lineHeight: FontSizes.medium,\n        color: NeutralColors.gray160,\n        fill: theme.semanticColors.bodyText,\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    ],\n  };\n};\n"]}
+{"version":3,"file":"DonutChart.styles.js","sourceRoot":"../src/","sources":["components/DonutChart/DonutChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAA4B;QAC5C,IAAA,SAAS,GAA2B,KAAK,UAAhC,EAAE,KAAK,GAAoB,KAAK,MAAzB,EAAE,MAAM,GAAY,KAAK,OAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QAClD,OAAO;YACL,IAAI,EAAE;gBACJ,KAAK,CAAC,KAAK,CAAC,MAAM;gBAClB,eAAe;gBACf;oBACE,UAAU,EAAE,QAAQ;oBACpB,OAAO,EAAE,MAAM;oBACf,aAAa,EAAE,QAAQ;oBACvB,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;iBACf;gBACD,SAAS;aACV;YACD,KAAK,EAAE;gBACL,KAAK,OAAA;gBACL,MAAM,QAAA;gBACN,SAAS,EAAE,aAAa;gBACxB,QAAQ,EAAE,SAAS;gBACnB,eAAe,EAAE,QAAQ;gBACzB,OAAO,EAAE,OAAO;aACjB;YACD,eAAe,EAAE;gBACf,UAAU,EAAE,MAAM;gBAClB,KAAK,EAAE,UAAG,KAAK,OAAI;aACpB;YACD,cAAc,EAAE,IAAA,yBAAiB,EAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;SAC5D,CAAC;IACJ,CAAC,CAAC;IA7BW,QAAA,SAAS,aA6BpB","sourcesContent":["import { IDonutChartStyleProps, IDonutChartStyles } from './DonutChart.types';\nimport { getAxisTitleStyle } from '../../utilities/index';\n\nexport const getStyles = (props: IDonutChartStyleProps): IDonutChartStyles => {\n  const { className, width, height, theme } = props;\n  return {\n    root: [\n      theme.fonts.medium,\n      'ms-DonutChart',\n      {\n        alignItems: 'center',\n        display: 'flex',\n        flexDirection: 'column',\n        width: '100%',\n        height: '100%',\n      },\n      className,\n    ],\n    chart: {\n      width,\n      height,\n      boxSizing: 'content-box',\n      overflow: 'visible',\n      alignmentAdjust: 'center',\n      display: 'block',\n    },\n    legendContainer: {\n      paddingTop: '16px',\n      width: `${width}px`,\n    },\n    axisAnnotation: getAxisTitleStyle(theme, theme.fonts.small),\n  };\n};\n"]}

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

@@ -1,25 +1,15 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function (require, exports, tslib_1, Styling_1) {
+define(["require", "exports", "../../utilities/index"], function (require, exports, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var getStyles = function (props) {
-        var _a;
         var theme = props.theme, href = props.href;
         return {
             opacityChangeOnHover: {
                 cursor: href ? 'pointer' : 'default',
             },
-            tooltip: tslib_1.__assign(tslib_1.__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: theme.semanticColors.bodyText }),
-            barLabel: {
-                fontSize: Styling_1.FontSizes.small,
-                fontWeight: Styling_1.FontWeights.semibold,
-                fill: theme.palette.neutralPrimary,
-                selectors: (_a = {},
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            },
+            tooltip: (0, index_1.getTooltipStyle)(theme),
+            barLabel: (0, index_1.getBarLabelStyle)(theme),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"GroupedVerticalBarChart.styles.js","sourceRoot":"../src/","sources":["components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAAyC;;QACzD,IAAA,KAAK,GAAW,KAAK,MAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QAC9B,OAAO;YACL,oBAAoB,EAAE;gBACpB,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;aACrC;YAED,OAAO,wCACF,KAAK,CAAC,KAAK,CAAC,MAAM,KACrB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,EAC/C,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,GACrC;YAED,QAAQ,EAAE;gBACR,QAAQ,EAAE,mBAAS,CAAC,KAAK;gBACzB,UAAU,EAAE,qBAAW,CAAC,QAAQ;gBAChC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;gBAClC,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,YAAY;qBACnB;uBACF;aACF;SACF,CAAC;IACJ,CAAC,CAAC;IAhCW,QAAA,SAAS,aAgCpB","sourcesContent":["import { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { IGroupedVerticalBarChartStyleProps, IGroupedVerticalBarChartStyles } from '../../index';\n\nexport const getStyles = (props: IGroupedVerticalBarChartStyleProps): IGroupedVerticalBarChartStyles => {\n  const { theme, href } = props;\n  return {\n    opacityChangeOnHover: {\n      cursor: href ? 'pointer' : 'default',\n    },\n\n    tooltip: {\n      ...theme.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: theme.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n      color: theme.semanticColors.bodyText,\n    },\n\n    barLabel: {\n      fontSize: FontSizes.small,\n      fontWeight: FontWeights.semibold,\n      fill: theme.palette.neutralPrimary,\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    },\n  };\n};\n"]}
+{"version":3,"file":"GroupedVerticalBarChart.styles.js","sourceRoot":"../src/","sources":["components/GroupedVerticalBarChart/GroupedVerticalBarChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAAyC;QACzD,IAAA,KAAK,GAAW,KAAK,MAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QAC9B,OAAO;YACL,oBAAoB,EAAE;gBACpB,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;aACrC;YACD,OAAO,EAAE,IAAA,uBAAe,EAAC,KAAK,CAAC;YAC/B,QAAQ,EAAE,IAAA,wBAAgB,EAAC,KAAK,CAAC;SAClC,CAAC;IACJ,CAAC,CAAC;IATW,QAAA,SAAS,aASpB","sourcesContent":["import { IGroupedVerticalBarChartStyleProps, IGroupedVerticalBarChartStyles } from '../../index';\nimport { getBarLabelStyle, getTooltipStyle } from '../../utilities/index';\n\nexport const getStyles = (props: IGroupedVerticalBarChartStyleProps): IGroupedVerticalBarChartStyles => {\n  const { theme, href } = props;\n  return {\n    opacityChangeOnHover: {\n      cursor: href ? 'pointer' : 'default',\n    },\n    tooltip: getTooltipStyle(theme),\n    barLabel: getBarLabelStyle(theme),\n  };\n};\n"]}

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

@@ -1,18 +1,11 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function (require, exports, tslib_1, Styling_1) {
+define(["require", "exports", "../../utilities/index"], function (require, exports, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var getStyles = function (props) {
-        var _a;
         return {
-            tooltip: tslib_1.__assign(tslib_1.__assign({}, props.theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: props.theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: props.theme.semanticColors.bodyText }),
-            markerLabel: {
-                selectors: (_a = {},
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            },
+            tooltip: (0, index_1.getTooltipStyle)(props.theme),
+            markerLabel: (0, index_1.getMarkerLabelStyle)(props.theme),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"LineChart.styles.js","sourceRoot":"../src/","sources":["components/LineChart/LineChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAA2B;;QACnD,OAAO;YACL,OAAO,wCACF,KAAK,CAAC,KAAM,CAAC,KAAK,CAAC,MAAM,KAC5B,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,KAAM,CAAC,cAAc,CAAC,cAAc,EACtD,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,KAAM,CAAC,cAAc,CAAC,QAAQ,GAC5C;YACD,WAAW,EAAE;gBACX,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,YAAY;qBACnB;uBACF;aACF;SACF,CAAC;IACJ,CAAC,CAAC;IAvBW,QAAA,SAAS,aAuBpB","sourcesContent":["import { HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { ILineChartStyleProps, ILineChartStyles } from './LineChart.types';\n\nexport const getStyles = (props: ILineChartStyleProps): ILineChartStyles => {\n  return {\n    tooltip: {\n      ...props.theme!.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: props.theme!.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n      color: props.theme!.semanticColors.bodyText,\n    },\n    markerLabel: {\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    },\n  };\n};\n"]}
+{"version":3,"file":"LineChart.styles.js","sourceRoot":"../src/","sources":["components/LineChart/LineChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAA2B;QACnD,OAAO;YACL,OAAO,EAAE,IAAA,uBAAe,EAAC,KAAK,CAAC,KAAM,CAAC;YACtC,WAAW,EAAE,IAAA,2BAAmB,EAAC,KAAK,CAAC,KAAM,CAAC;SAC/C,CAAC;IACJ,CAAC,CAAC;IALW,QAAA,SAAS,aAKpB","sourcesContent":["import { ILineChartStyleProps, ILineChartStyles } from './LineChart.types';\nimport { getMarkerLabelStyle, getTooltipStyle } from '../../utilities/index';\n\nexport const getStyles = (props: ILineChartStyleProps): ILineChartStyles => {\n  return {\n    tooltip: getTooltipStyle(props.theme!),\n    markerLabel: getMarkerLabelStyle(props.theme!),\n  };\n};\n"]}

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

@@ -1,4 +1,4 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function (require, exports, tslib_1, Styling_1) {
+define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "../../utilities/index"], function (require, exports, tslib_1, Styling_1, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
@@ -36,7 +36,7 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function
                     },
                     _b),
             },
-            toolTip: tslib_1.__assign(tslib_1.__assign({}, props.theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: props.theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none' }),
+            toolTip: (0, index_1.getTooltipStyle)(props.theme),
             nodeTextContainer: {
                 selectors: {
                     text: {

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

@@ -1 +1 @@
-{"version":3,"file":"SankeyChart.styles.js","sourceRoot":"../src/","sources":["components/SankeyChart/SankeyChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAA6B;;QAC7C,IAAA,SAAS,GAAqC,KAAK,UAA1C,EAAE,KAAK,GAA8B,KAAK,MAAnC,EAAE,SAAS,GAAmB,KAAK,UAAxB,EAAE,YAAY,GAAK,KAAK,aAAV,CAAW;QACpD,IAAA,OAAO,GAAK,KAAK,QAAV,CAAW;QAC1B,OAAO;YACL,IAAI,EAAE;gBACJ,KAAK,CAAC,KAAK,CAAC,MAAM;gBAClB;oBACE,OAAO,EAAE,MAAM;oBACf,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;oBACd,aAAa,EAAE,QAAQ;oBACvB,QAAQ,EAAE,QAAQ;iBACnB;gBACD,SAAS;aACV;YACD,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK;gBACnD,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS;gBAC7D,WAAW,EAAE,CAAC;gBACd,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,QAAQ;qBACf;uBACF;aACF;YACD,KAAK,EAAE;gBACL,IAAI,EAAE,SAAS;gBACf,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,QAAQ;qBACf;uBACF;aACF;YACD,OAAO,wCACF,KAAK,CAAC,KAAM,CAAC,KAAK,CAAC,MAAM,KAC5B,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,KAAM,CAAC,cAAc,CAAC,cAAc,EACtD,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,GACtB;YACD,iBAAiB,EAAE;gBACjB,SAAS,EAAE;oBACT,IAAI,EAAE;wBACJ,SAAS;4BACP,GAAC,8BAAoB,IAAG;gCACtB,IAAI,EAAE,YAAY;6BACnB;+BACF;qBACF;iBACF;gBAED,SAAS,EAAE,KAAK;gBAChB,UAAU,EAAE,KAAK;gBACjB,YAAY,EAAE,KAAK;gBACnB,WAAW,EAAE,KAAK;aACnB;YACD,kBAAkB,EAAE;gBAClB,SAAS,EAAE,OAAO,CAAC,UAAU;aAC9B;YACD,YAAY,uBACP,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAC9C;SACF,CAAC;IACJ,CAAC,CAAC;IApEW,QAAA,SAAS,aAoEpB","sourcesContent":["import { ISankeyChartStyleProps, ISankeyChartStyles } from './SankeyChart.types';\nimport { HighContrastSelector } from '@fluentui/react/lib/Styling';\n\nexport const getStyles = (props: ISankeyChartStyleProps): ISankeyChartStyles => {\n  const { className, theme, pathColor, enableReflow } = props;\n  const { effects } = theme;\n  return {\n    root: [\n      theme.fonts.medium,\n      {\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden',\n      },\n      className,\n    ],\n    links: {\n      stroke: pathColor ? pathColor : theme.palette.black,\n      fill: theme ? theme.semanticColors.bodyBackground : '#F5F5F5',\n      strokeWidth: 3,\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'Canvas',\n        },\n      },\n    },\n    nodes: {\n      fill: '#F5F5F5',\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'Canvas',\n        },\n      },\n    },\n    toolTip: {\n      ...props.theme!.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: props.theme!.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n    },\n    nodeTextContainer: {\n      selectors: {\n        text: {\n          selectors: {\n            [HighContrastSelector]: {\n              fill: 'CanvasText',\n            },\n          },\n        },\n      },\n\n      marginTop: '4px',\n      marginLeft: '8px',\n      marginBottom: '4px',\n      marginRight: '8px',\n    },\n    calloutContentRoot: {\n      boxShadow: effects.elevation4,\n    },\n    chartWrapper: {\n      ...(enableReflow ? { overflow: 'auto' } : {}),\n    },\n  };\n};\n"]}
+{"version":3,"file":"SankeyChart.styles.js","sourceRoot":"../src/","sources":["components/SankeyChart/SankeyChart.styles.ts"],"names":[],"mappings":";;;;IAIO,IAAM,SAAS,GAAG,UAAC,KAA6B;;QAC7C,IAAA,SAAS,GAAqC,KAAK,UAA1C,EAAE,KAAK,GAA8B,KAAK,MAAnC,EAAE,SAAS,GAAmB,KAAK,UAAxB,EAAE,YAAY,GAAK,KAAK,aAAV,CAAW;QACpD,IAAA,OAAO,GAAK,KAAK,QAAV,CAAW;QAC1B,OAAO;YACL,IAAI,EAAE;gBACJ,KAAK,CAAC,KAAK,CAAC,MAAM;gBAClB;oBACE,OAAO,EAAE,MAAM;oBACf,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,MAAM;oBACd,aAAa,EAAE,QAAQ;oBACvB,QAAQ,EAAE,QAAQ;iBACnB;gBACD,SAAS;aACV;YACD,KAAK,EAAE;gBACL,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK;gBACnD,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS;gBAC7D,WAAW,EAAE,CAAC;gBACd,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,QAAQ;qBACf;uBACF;aACF;YACD,KAAK,EAAE;gBACL,IAAI,EAAE,SAAS;gBACf,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,QAAQ;qBACf;uBACF;aACF;YACD,OAAO,EAAE,IAAA,uBAAe,EAAC,KAAK,CAAC,KAAM,CAAC;YACtC,iBAAiB,EAAE;gBACjB,SAAS,EAAE;oBACT,IAAI,EAAE;wBACJ,SAAS;4BACP,GAAC,8BAAoB,IAAG;gCACtB,IAAI,EAAE,YAAY;6BACnB;+BACF;qBACF;iBACF;gBAED,SAAS,EAAE,KAAK;gBAChB,UAAU,EAAE,KAAK;gBACjB,YAAY,EAAE,KAAK;gBACnB,WAAW,EAAE,KAAK;aACnB;YACD,kBAAkB,EAAE;gBAClB,SAAS,EAAE,OAAO,CAAC,UAAU;aAC9B;YACD,YAAY,uBACP,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAC9C;SACF,CAAC;IACJ,CAAC,CAAC;IAzDW,QAAA,SAAS,aAyDpB","sourcesContent":["import { ISankeyChartStyleProps, ISankeyChartStyles } from './SankeyChart.types';\nimport { HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { getTooltipStyle } from '../../utilities/index';\n\nexport const getStyles = (props: ISankeyChartStyleProps): ISankeyChartStyles => {\n  const { className, theme, pathColor, enableReflow } = props;\n  const { effects } = theme;\n  return {\n    root: [\n      theme.fonts.medium,\n      {\n        display: 'flex',\n        width: '100%',\n        height: '100%',\n        flexDirection: 'column',\n        overflow: 'hidden',\n      },\n      className,\n    ],\n    links: {\n      stroke: pathColor ? pathColor : theme.palette.black,\n      fill: theme ? theme.semanticColors.bodyBackground : '#F5F5F5',\n      strokeWidth: 3,\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'Canvas',\n        },\n      },\n    },\n    nodes: {\n      fill: '#F5F5F5',\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'Canvas',\n        },\n      },\n    },\n    toolTip: getTooltipStyle(props.theme!),\n    nodeTextContainer: {\n      selectors: {\n        text: {\n          selectors: {\n            [HighContrastSelector]: {\n              fill: 'CanvasText',\n            },\n          },\n        },\n      },\n\n      marginTop: '4px',\n      marginLeft: '8px',\n      marginBottom: '4px',\n      marginRight: '8px',\n    },\n    calloutContentRoot: {\n      boxShadow: effects.elevation4,\n    },\n    chartWrapper: {\n      ...(enableReflow ? { overflow: 'auto' } : {}),\n    },\n  };\n};\n"]}

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

@@ -1,21 +1,11 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function (require, exports, tslib_1, Styling_1) {
+define(["require", "exports", "../../utilities/index"], function (require, exports, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var getStyles = function (props) {
-        var _a;
         return {
-            tooltip: tslib_1.__assign(tslib_1.__assign({}, props.theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: props.theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: props.theme.semanticColors.bodyText }),
-            markerLabel: {
-                fontSize: Styling_1.FontSizes.medium,
-                fill: props.theme.semanticColors.bodyText,
-                textAnchor: 'middle',
-                selectors: (_a = {},
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            },
+            tooltip: (0, index_1.getTooltipStyle)(props.theme),
+            markerLabel: (0, index_1.getMarkerLabelStyle)(props.theme),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"ScatterChart.styles.js","sourceRoot":"../src/","sources":["components/ScatterChart/ScatterChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAA8B;;QACtD,OAAO;YACL,OAAO,wCACF,KAAK,CAAC,KAAM,CAAC,KAAK,CAAC,MAAM,KAC5B,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,KAAM,CAAC,cAAc,CAAC,cAAc,EACtD,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,KAAM,CAAC,cAAc,CAAC,QAAQ,GAC5C;YACD,WAAW,EAAE;gBACX,QAAQ,EAAE,mBAAS,CAAC,MAAM;gBAC1B,IAAI,EAAE,KAAK,CAAC,KAAM,CAAC,cAAc,CAAC,QAAQ;gBAC1C,UAAU,EAAE,QAAQ;gBACpB,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,YAAY;qBACnB;uBACF;aACF;SACF,CAAC;IACJ,CAAC,CAAC;IA1BW,QAAA,SAAS,aA0BpB","sourcesContent":["import { FontSizes, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { IScatterChartStyleProps, IScatterChartStyles } from './ScatterChart.types';\n\nexport const getStyles = (props: IScatterChartStyleProps): IScatterChartStyles => {\n  return {\n    tooltip: {\n      ...props.theme!.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: props.theme!.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n      color: props.theme!.semanticColors.bodyText,\n    },\n    markerLabel: {\n      fontSize: FontSizes.medium,\n      fill: props.theme!.semanticColors.bodyText,\n      textAnchor: 'middle',\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    },\n  };\n};\n"]}
+{"version":3,"file":"ScatterChart.styles.js","sourceRoot":"../src/","sources":["components/ScatterChart/ScatterChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAA8B;QACtD,OAAO;YACL,OAAO,EAAE,IAAA,uBAAe,EAAC,KAAK,CAAC,KAAM,CAAC;YACtC,WAAW,EAAE,IAAA,2BAAmB,EAAC,KAAK,CAAC,KAAM,CAAC;SAC/C,CAAC;IACJ,CAAC,CAAC;IALW,QAAA,SAAS,aAKpB","sourcesContent":["import { IScatterChartStyleProps, IScatterChartStyles } from './ScatterChart.types';\nimport { getMarkerLabelStyle, getTooltipStyle } from '../../utilities/index';\n\nexport const getStyles = (props: IScatterChartStyleProps): IScatterChartStyles => {\n  return {\n    tooltip: getTooltipStyle(props.theme!),\n    markerLabel: getMarkerLabelStyle(props.theme!),\n  };\n};\n"]}

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

@@ -1,9 +1,8 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function (require, exports, tslib_1, Styling_1) {
+define(["require", "exports", "../../utilities/index"], function (require, exports, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var getStyles = function (props) {
-        var _a;
         var shouldHighlight = props.shouldHighlight, theme = props.theme;
         return {
             opacityChangeOnHover: {
@@ -20,17 +19,8 @@ define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function
                     transform: 'scaleX(-1)',
                 },
             ],
-            tooltip: tslib_1.__assign(tslib_1.__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: theme.semanticColors.bodyText }),
-            barLabel: {
-                fontSize: Styling_1.FontSizes.small,
-                fontWeight: Styling_1.FontWeights.semibold,
-                fill: theme.palette.neutralPrimary,
-                selectors: (_a = {},
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            },
+            tooltip: (0, index_1.getTooltipStyle)(theme),
+            barLabel: (0, index_1.getBarLabelStyle)(theme),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"VerticalBarChart.styles.js","sourceRoot":"../src/","sources":["components/VerticalBarChart/VerticalBarChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAAkC;;QAClD,IAAA,eAAe,GAAY,KAAK,gBAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QACzC,OAAO;YACL,oBAAoB,EAAE;gBACpB,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;aACtC;YAED,UAAU,EAAE,EAAE;YAEd,UAAU,EAAE;gBACV;oBACE,SAAS,EAAE,YAAY;iBACxB;aACF;YACD,WAAW,EAAE;gBACX;oBACE,SAAS,EAAE,YAAY;iBACxB;aACF;YAED,OAAO,wCACF,KAAK,CAAC,KAAK,CAAC,MAAM,KACrB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,EAC/C,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,GACrC;YAED,QAAQ,EAAE;gBACR,QAAQ,EAAE,mBAAS,CAAC,KAAK;gBACzB,UAAU,EAAE,qBAAW,CAAC,QAAQ;gBAChC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;gBAClC,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,YAAY;qBACnB;uBACF;aACF;SACF,CAAC;IACJ,CAAC,CAAC;IA7CW,QAAA,SAAS,aA6CpB","sourcesContent":["import { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { IVerticalBarChartStyleProps, IVerticalBarChartStyles } from '../../index';\n\nexport const getStyles = (props: IVerticalBarChartStyleProps): IVerticalBarChartStyles => {\n  const { shouldHighlight, theme } = props;\n  return {\n    opacityChangeOnHover: {\n      opacity: shouldHighlight ? '' : '0.1',\n    },\n\n    xAxisTicks: [],\n\n    yAxisTicks: [\n      {\n        transform: 'scaleX(-1)',\n      },\n    ],\n    yAxisDomain: [\n      {\n        transform: 'scaleX(-1)',\n      },\n    ],\n\n    tooltip: {\n      ...theme.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: theme.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n      color: theme.semanticColors.bodyText,\n    },\n\n    barLabel: {\n      fontSize: FontSizes.small,\n      fontWeight: FontWeights.semibold,\n      fill: theme.palette.neutralPrimary,\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    },\n  };\n};\n"]}
+{"version":3,"file":"VerticalBarChart.styles.js","sourceRoot":"../src/","sources":["components/VerticalBarChart/VerticalBarChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAAkC;QAClD,IAAA,eAAe,GAAY,KAAK,gBAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QACzC,OAAO;YACL,oBAAoB,EAAE;gBACpB,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;aACtC;YAED,UAAU,EAAE,EAAE;YAEd,UAAU,EAAE;gBACV;oBACE,SAAS,EAAE,YAAY;iBACxB;aACF;YACD,WAAW,EAAE;gBACX;oBACE,SAAS,EAAE,YAAY;iBACxB;aACF;YACD,OAAO,EAAE,IAAA,uBAAe,EAAC,KAAK,CAAC;YAC/B,QAAQ,EAAE,IAAA,wBAAgB,EAAC,KAAK,CAAC;SAClC,CAAC;IACJ,CAAC,CAAC;IAtBW,QAAA,SAAS,aAsBpB","sourcesContent":["import { IVerticalBarChartStyleProps, IVerticalBarChartStyles } from '../../index';\nimport { getBarLabelStyle, getTooltipStyle } from '../../utilities/index';\n\nexport const getStyles = (props: IVerticalBarChartStyleProps): IVerticalBarChartStyles => {\n  const { shouldHighlight, theme } = props;\n  return {\n    opacityChangeOnHover: {\n      opacity: shouldHighlight ? '' : '0.1',\n    },\n\n    xAxisTicks: [],\n\n    yAxisTicks: [\n      {\n        transform: 'scaleX(-1)',\n      },\n    ],\n    yAxisDomain: [\n      {\n        transform: 'scaleX(-1)',\n      },\n    ],\n    tooltip: getTooltipStyle(theme),\n    barLabel: getBarLabelStyle(theme),\n  };\n};\n"]}

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

@@ -1,26 +1,16 @@
-define(["require", "exports", "tslib", "@fluentui/react/lib/Styling"], function (require, exports, tslib_1, Styling_1) {
+define(["require", "exports", "../../utilities/index"], function (require, exports, index_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getStyles = void 0;
     var getStyles = function (props) {
-        var _a;
         var shouldHighlight = props.shouldHighlight, href = props.href, theme = props.theme;
         return {
             opacityChangeOnHover: {
                 opacity: shouldHighlight ? '' : '0.1',
                 cursor: href ? 'pointer' : 'default',
             },
-            tooltip: tslib_1.__assign(tslib_1.__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: theme.semanticColors.bodyText }),
-            barLabel: {
-                fontSize: Styling_1.FontSizes.small,
-                fontWeight: Styling_1.FontWeights.semibold,
-                fill: theme.palette.neutralPrimary,
-                selectors: (_a = {},
-                    _a[Styling_1.HighContrastSelector] = {
-                        fill: 'CanvasText',
-                    },
-                    _a),
-            },
+            tooltip: (0, index_1.getTooltipStyle)(theme),
+            barLabel: (0, index_1.getBarLabelStyle)(theme),
         };
     };
     exports.getStyles = getStyles;

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

@@ -1 +1 @@
-{"version":3,"file":"VerticalStackedBarChart.styles.js","sourceRoot":"../src/","sources":["components/VerticalStackedBarChart/VerticalStackedBarChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAAyC;;QACzD,IAAA,eAAe,GAAkB,KAAK,gBAAvB,EAAE,IAAI,GAAY,KAAK,KAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QAC/C,OAAO;YACL,oBAAoB,EAAE;gBACpB,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;gBACrC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;aACrC;YAED,OAAO,wCACF,KAAK,CAAC,KAAK,CAAC,MAAM,KACrB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,EAC/C,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,GACrC;YAED,QAAQ,EAAE;gBACR,QAAQ,EAAE,mBAAS,CAAC,KAAK;gBACzB,UAAU,EAAE,qBAAW,CAAC,QAAQ;gBAChC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;gBAClC,SAAS;oBACP,GAAC,8BAAoB,IAAG;wBACtB,IAAI,EAAE,YAAY;qBACnB;uBACF;aACF;SACF,CAAC;IACJ,CAAC,CAAC;IAjCW,QAAA,SAAS,aAiCpB","sourcesContent":["import { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { IVerticalStackedBarChartStyleProps, IVerticalStackedBarChartStyles } from './VerticalStackedBarChart.types';\n\nexport const getStyles = (props: IVerticalStackedBarChartStyleProps): IVerticalStackedBarChartStyles => {\n  const { shouldHighlight, href, theme } = props;\n  return {\n    opacityChangeOnHover: {\n      opacity: shouldHighlight ? '' : '0.1',\n      cursor: href ? 'pointer' : 'default',\n    },\n\n    tooltip: {\n      ...theme.fonts.medium,\n      display: 'flex',\n      flexDirection: 'column',\n      padding: '8px',\n      position: 'absolute',\n      textAlign: 'center',\n      top: '0px',\n      background: theme.semanticColors.bodyBackground,\n      borderRadius: '2px',\n      pointerEvents: 'none',\n      color: theme.semanticColors.bodyText,\n    },\n\n    barLabel: {\n      fontSize: FontSizes.small,\n      fontWeight: FontWeights.semibold,\n      fill: theme.palette.neutralPrimary,\n      selectors: {\n        [HighContrastSelector]: {\n          fill: 'CanvasText',\n        },\n      },\n    },\n  };\n};\n"]}
+{"version":3,"file":"VerticalStackedBarChart.styles.js","sourceRoot":"../src/","sources":["components/VerticalStackedBarChart/VerticalStackedBarChart.styles.ts"],"names":[],"mappings":";;;;IAGO,IAAM,SAAS,GAAG,UAAC,KAAyC;QACzD,IAAA,eAAe,GAAkB,KAAK,gBAAvB,EAAE,IAAI,GAAY,KAAK,KAAjB,EAAE,KAAK,GAAK,KAAK,MAAV,CAAW;QAC/C,OAAO;YACL,oBAAoB,EAAE;gBACpB,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK;gBACrC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;aACrC;YACD,OAAO,EAAE,IAAA,uBAAe,EAAC,KAAK,CAAC;YAC/B,QAAQ,EAAE,IAAA,wBAAgB,EAAC,KAAK,CAAC;SAClC,CAAC;IACJ,CAAC,CAAC;IAVW,QAAA,SAAS,aAUpB","sourcesContent":["import { IVerticalStackedBarChartStyleProps, IVerticalStackedBarChartStyles } from './VerticalStackedBarChart.types';\nimport { getBarLabelStyle, getTooltipStyle } from '../../utilities/index';\n\nexport const getStyles = (props: IVerticalStackedBarChartStyleProps): IVerticalStackedBarChartStyles => {\n  const { shouldHighlight, href, theme } = props;\n  return {\n    opacityChangeOnHover: {\n      opacity: shouldHighlight ? '' : '0.1',\n      cursor: href ? 'pointer' : 'default',\n    },\n    tooltip: getTooltipStyle(theme),\n    barLabel: getBarLabelStyle(theme),\n  };\n};\n"]}

package/lib-amd/utilities/Common.styles.d.ts

@@ -0,0 +1,6 @@
+import { IStyle, ITheme } from '@fluentui/react/lib/Styling';
+import type { IRawStyle } from '@fluentui/merge-styles';
+export declare const getTooltipStyle: (theme: ITheme) => IStyle;
+export declare const getAxisTitleStyle: (theme: ITheme, font: IRawStyle) => IStyle;
+export declare const getBarLabelStyle: (theme: ITheme) => IStyle;
+export declare const getMarkerLabelStyle: (theme: ITheme) => IStyle;

package/lib-amd/utilities/Common.styles.js

@@ -0,0 +1,57 @@
+define(["require", "exports", "tslib", "@fluentui/react/lib/Styling", "@fluentui/react"], function (require, exports, tslib_1, Styling_1, react_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.getMarkerLabelStyle = exports.getBarLabelStyle = exports.getAxisTitleStyle = exports.getTooltipStyle = void 0;
+    var getTooltipStyle = function (theme) {
+        return tslib_1.__assign(tslib_1.__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none', color: theme.semanticColors.bodyText });
+    };
+    exports.getTooltipStyle = getTooltipStyle;
+    var getAxisTitleStyle = function (theme, font) {
+        var _a;
+        return [
+            font,
+            (_a = {
+                    textAlign: 'center',
+                    fontWeight: Styling_1.FontWeights.semibold,
+                    fontStyle: 'normal',
+                    lineHeight: Styling_1.FontSizes.medium,
+                    color: react_1.NeutralColors.gray160,
+                    fill: theme.semanticColors.bodyText
+                },
+                _a[Styling_1.HighContrastSelector] = {
+                    fill: 'CanvasText',
+                },
+                _a),
+        ];
+    };
+    exports.getAxisTitleStyle = getAxisTitleStyle;
+    var getBarLabelStyle = function (theme) {
+        var _a;
+        return {
+            fontSize: Styling_1.FontSizes.small,
+            fontWeight: Styling_1.FontWeights.semibold,
+            fill: theme.palette.neutralPrimary,
+            selectors: (_a = {},
+                _a[Styling_1.HighContrastSelector] = {
+                    fill: 'CanvasText',
+                },
+                _a),
+        };
+    };
+    exports.getBarLabelStyle = getBarLabelStyle;
+    var getMarkerLabelStyle = function (theme) {
+        var _a;
+        return {
+            fontSize: Styling_1.FontSizes.medium,
+            fill: theme.semanticColors.bodyText,
+            textAnchor: 'middle',
+            selectors: (_a = {},
+                _a[Styling_1.HighContrastSelector] = {
+                    fill: 'CanvasText',
+                },
+                _a),
+        };
+    };
+    exports.getMarkerLabelStyle = getMarkerLabelStyle;
+});
+//# sourceMappingURL=Common.styles.js.map

package/lib-amd/utilities/Common.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Common.styles.js","sourceRoot":"../src/","sources":["utilities/Common.styles.ts"],"names":[],"mappings":";;;;IAKO,IAAM,eAAe,GAAG,UAAC,KAAa;QAC3C,6CACK,KAAK,CAAC,KAAK,CAAC,MAAM,KACrB,OAAO,EAAE,MAAM,EACf,aAAa,EAAE,QAAQ,EACvB,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,KAAK,EACV,UAAU,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,EAC/C,YAAY,EAAE,KAAK,EACnB,aAAa,EAAE,MAAM,EACrB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,IACpC;IACJ,CAAC,CAAC;IAdW,QAAA,eAAe,mBAc1B;IAEK,IAAM,iBAAiB,GAAG,UAAC,KAAa,EAAE,IAAe;;QAC9D,OAAO;YACL,IAAI;;oBAEF,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,qBAAW,CAAC,QAAQ;oBAChC,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,mBAAS,CAAC,MAAM;oBAC5B,KAAK,EAAE,qBAAa,CAAC,OAAO;oBAC5B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ;;gBACnC,GAAC,8BAAoB,IAAG;oBACtB,IAAI,EAAE,YAAY;iBACnB;;SAEJ,CAAC;IACJ,CAAC,CAAC;IAfW,QAAA,iBAAiB,qBAe5B;IAEK,IAAM,gBAAgB,GAAG,UAAC,KAAa;;QAC5C,OAAO;YACL,QAAQ,EAAE,mBAAS,CAAC,KAAK;YACzB,UAAU,EAAE,qBAAW,CAAC,QAAQ;YAChC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;YAClC,SAAS;gBACP,GAAC,8BAAoB,IAAG;oBACtB,IAAI,EAAE,YAAY;iBACnB;mBACF;SACF,CAAC;IACJ,CAAC,CAAC;IAXW,QAAA,gBAAgB,oBAW3B;IAEK,IAAM,mBAAmB,GAAG,UAAC,KAAa;;QAC/C,OAAO;YACL,QAAQ,EAAE,mBAAS,CAAC,MAAM;YAC1B,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ;YACnC,UAAU,EAAE,QAAQ;YACpB,SAAS;gBACP,GAAC,8BAAoB,IAAG;oBACtB,IAAI,EAAE,YAAY;iBACnB;mBACF;SACF,CAAC;IACJ,CAAC,CAAC;IAXW,QAAA,mBAAmB,uBAW9B","sourcesContent":["import { IStyle, ITheme } from '@fluentui/react/lib/Styling';\nimport type { IRawStyle } from '@fluentui/merge-styles';\nimport { FontSizes, FontWeights, HighContrastSelector } from '@fluentui/react/lib/Styling';\nimport { NeutralColors } from '@fluentui/react';\n\nexport const getTooltipStyle = (theme: ITheme): IStyle => {\n  return {\n    ...theme.fonts.medium,\n    display: 'flex',\n    flexDirection: 'column',\n    padding: '8px',\n    position: 'absolute',\n    textAlign: 'center',\n    top: '0px',\n    background: theme.semanticColors.bodyBackground,\n    borderRadius: '2px',\n    pointerEvents: 'none',\n    color: theme.semanticColors.bodyText,\n  };\n};\n\nexport const getAxisTitleStyle = (theme: ITheme, font: IRawStyle): IStyle => {\n  return [\n    font,\n    {\n      textAlign: 'center',\n      fontWeight: FontWeights.semibold,\n      fontStyle: 'normal',\n      lineHeight: FontSizes.medium,\n      color: NeutralColors.gray160,\n      fill: theme.semanticColors.bodyText,\n      [HighContrastSelector]: {\n        fill: 'CanvasText',\n      },\n    },\n  ];\n};\n\nexport const getBarLabelStyle = (theme: ITheme): IStyle => {\n  return {\n    fontSize: FontSizes.small,\n    fontWeight: FontWeights.semibold,\n    fill: theme.palette.neutralPrimary,\n    selectors: {\n      [HighContrastSelector]: {\n        fill: 'CanvasText',\n      },\n    },\n  };\n};\n\nexport const getMarkerLabelStyle = (theme: ITheme): IStyle => {\n  return {\n    fontSize: FontSizes.medium,\n    fill: theme.semanticColors.bodyText,\n    textAnchor: 'middle',\n    selectors: {\n      [HighContrastSelector]: {\n        fill: 'CanvasText',\n      },\n    },\n  };\n};\n"]}

package/lib-amd/utilities/SVGTooltipText.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ITooltipHost, ITooltipProps, TooltipDelay } from '@fluentui/react/lib/Tooltip';
 import { ITheme } from '@fluentui/react';
-interface ISVGTooltipTextProps {
+export interface ISVGTooltipTextProps {
     /**
      * Number of milliseconds to delay closing the tooltip, so that the user has time to hover over
      * the tooltip and interact with it. Hovering over the tooltip will count as hovering over the