@fluentui/react-charting 5.21.28 → 5.21.30

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

@@ -0,0 +1,122 @@
+define(["require", "exports", "tslib", "@fluentui/react"], function (require, exports, tslib_1, react_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.getStyles = void 0;
+    var getStyles = function (props) {
+        var _a, _b, _c, _d;
+        var theme = props.theme, chartValueSize = props.chartValueSize, chartWidth = props.chartWidth, chartHeight = props.chartHeight, className = props.className, lineColor = props.lineColor, toDrawShape = props.toDrawShape;
+        return {
+            root: [
+                theme.fonts.medium,
+                'ms-GaugeChart',
+                {
+                    width: '100%',
+                    height: '100%',
+                },
+                className,
+            ],
+            chart: {
+                display: 'block',
+                width: chartWidth,
+                height: chartHeight,
+            },
+            limits: {
+                fontSize: react_1.FontSizes.small,
+                fontWeight: react_1.FontWeights.semibold,
+                fill: theme.palette.neutralPrimary,
+            },
+            chartValue: {
+                fontSize: chartValueSize,
+                fontWeight: react_1.FontWeights.semibold,
+                fill: theme.palette.neutralPrimary,
+            },
+            sublabel: {
+                fontSize: react_1.FontSizes.small,
+                fontWeight: react_1.FontWeights.semibold,
+                fill: theme.palette.neutralPrimary,
+            },
+            needle: {
+                fill: theme.palette.black,
+                stroke: theme.semanticColors.bodyBackground,
+            },
+            chartTitle: {
+                fontSize: react_1.FontSizes.small,
+                fill: theme.palette.neutralPrimary,
+            },
+            segment: {
+                outline: 'none',
+                stroke: theme.semanticColors.focusBorder,
+            },
+            legendsContainer: {
+                width: chartWidth,
+            },
+            calloutContentRoot: [
+                {
+                    display: 'grid',
+                    overflow: 'hidden',
+                    padding: '11px 16px 10px 16px',
+                    backgroundColor: theme.semanticColors.bodyBackground,
+                    backgroundBlendMode: 'normal, luminosity',
+                },
+            ],
+            calloutDateTimeContainer: {
+                display: 'flex',
+                flexDirection: 'row',
+                justifyContent: 'space-between',
+            },
+            calloutContentX: [
+                tslib_1.__assign(tslib_1.__assign({}, theme.fonts.small), { lineHeight: '16px', opacity: '0.85', color: theme.semanticColors.bodySubtext }),
+            ],
+            calloutBlockContainer: [
+                theme.fonts.mediumPlus,
+                {
+                    marginTop: '13px',
+                    color: theme.semanticColors.bodyText,
+                },
+                !toDrawShape && {
+                    selectors: (_a = {},
+                        _a[react_1.HighContrastSelector] = {
+                            forcedColorAdjust: 'none',
+                        },
+                        _a),
+                    borderLeft: "4px solid ".concat(lineColor),
+                    paddingLeft: '8px',
+                },
+                toDrawShape && {
+                    display: 'flex',
+                },
+            ],
+            shapeStyles: {
+                marginRight: '8px',
+            },
+            calloutlegendText: tslib_1.__assign(tslib_1.__assign({}, theme.fonts.small), { lineHeight: '16px', selectors: (_b = {},
+                    _b[react_1.HighContrastSelectorBlack] = {
+                        color: 'rgb(255, 255, 255)',
+                    },
+                    _b), color: theme.semanticColors.bodySubtext }),
+            calloutContentY: [
+                tslib_1.__assign(tslib_1.__assign({}, theme.fonts.mediumPlus), { fontWeight: 'bold', lineHeight: '22px', selectors: (_c = {},
+                        _c[react_1.HighContrastSelectorBlack] = {
+                            color: 'rgb(255, 255, 255)',
+                        },
+                        _c) }),
+            ],
+            descriptionMessage: [
+                theme.fonts.small,
+                {
+                    selectors: (_d = {},
+                        _d[react_1.HighContrastSelectorBlack] = {
+                            color: 'rgb(255, 255, 255)',
+                        },
+                        _d),
+                    color: theme.semanticColors.bodyText,
+                    marginTop: '10px',
+                    paddingTop: '10px',
+                    borderTop: "1px solid ".concat(theme.semanticColors.menuDivider),
+                },
+            ],
+        };
+    };
+    exports.getStyles = getStyles;
+});
+//# sourceMappingURL=GaugeChart.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GaugeChart.styles.js","sourceRoot":"../src/","sources":["components/GaugeChart/GaugeChart.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { FontSizes, FontWeights, HighContrastSelector, HighContrastSelectorBlack } from '@fluentui/react';\nimport { IGaugeChartStyleProps, IGaugeChartStyles } from './GaugeChart.types';\n\nexport const getStyles = (props: IGaugeChartStyleProps): IGaugeChartStyles => {\n  const { theme, chartValueSize, chartWidth, chartHeight, className, lineColor, toDrawShape } = props;\n\n  return {\n    root: [\n      theme.fonts.medium,\n      'ms-GaugeChart',\n      {\n        width: '100%',\n        height: '100%',\n      },\n      className,\n    ],\n\n    chart: {\n      display: 'block',\n      width: chartWidth,\n      height: chartHeight,\n    },\n\n    limits: {\n      fontSize: FontSizes.small,\n      fontWeight: FontWeights.semibold,\n      fill: theme.palette.neutralPrimary,\n    },\n\n    chartValue: {\n      fontSize: chartValueSize,\n      fontWeight: FontWeights.semibold,\n      fill: theme.palette.neutralPrimary,\n    },\n\n    sublabel: {\n      fontSize: FontSizes.small,\n      fontWeight: FontWeights.semibold,\n      fill: theme.palette.neutralPrimary,\n    },\n\n    needle: {\n      fill: theme.palette.black,\n      stroke: theme.semanticColors.bodyBackground,\n    },\n\n    chartTitle: {\n      fontSize: FontSizes.small,\n      fill: theme.palette.neutralPrimary,\n    },\n\n    segment: {\n      outline: 'none',\n      stroke: theme.semanticColors.focusBorder,\n    },\n\n    legendsContainer: {\n      width: chartWidth,\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        ...theme.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      ...theme.fonts.small,\n      lineHeight: '16px',\n      selectors: {\n        [HighContrastSelectorBlack]: {\n          color: 'rgb(255, 255, 255)',\n        },\n      },\n      color: theme.semanticColors.bodySubtext,\n    },\n    calloutContentY: [\n      {\n        ...theme.fonts.mediumPlus,\n        fontWeight: 'bold',\n        lineHeight: '22px',\n        selectors: {\n          [HighContrastSelectorBlack]: {\n            color: 'rgb(255, 255, 255)',\n          },\n        },\n      },\n    ],\n    descriptionMessage: [\n      theme.fonts.small,\n      {\n        selectors: {\n          [HighContrastSelectorBlack]: {\n            color: 'rgb(255, 255, 255)',\n          },\n        },\n        color: theme.semanticColors.bodyText,\n        marginTop: '10px',\n        paddingTop: '10px',\n        borderTop: `1px solid ${theme.semanticColors.menuDivider}`,\n      },\n    ],\n  };\n};\n"]}

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

@@ -0,0 +1,238 @@
+import { IStyle, ITheme } from '@fluentui/react/lib/Styling';
+import { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';
+import { ILegendsProps } from '../Legends/index';
+import { IAccessibilityProps } from '../../types/index';
+import { ICalloutProps } from '@fluentui/react/lib/Callout';
+/**
+ * Gauge Chart segment interface.
+ * {@docCategory GaugeChart}
+ */
+export interface IGaugeChartSegment {
+    /**
+     * Legend text for a segment
+     */
+    legend: string;
+    /**
+     * Size of the segment
+     */
+    size: number;
+    /**
+     * Color of the segment
+     */
+    color?: string;
+    /**
+     * Accessibility data for the segment
+     */
+    accessibilityData?: IAccessibilityProps;
+}
+/**
+ * {@docCategory GaugeChart}
+ */
+export declare enum GaugeValueFormat {
+    Percentage = "percentage",
+    Fraction = "fraction"
+}
+/**
+ * {@docCategory GaugeChart}
+ */
+export declare enum GaugeChartVariant {
+    SingleSegment = "single-segment",
+    MultipleSegments = "multiple-segments"
+}
+/**
+ * Gauge Chart properties
+ * {@docCategory GaugeChart}
+ */
+export interface IGaugeChartProps {
+    /**
+     * Width of the chart
+     */
+    width?: number;
+    /**
+     * Height of the chart
+     */
+    height?: number;
+    /**
+     * Title of the chart
+     */
+    chartTitle?: string;
+    /**
+     * Current value of the gauge
+     */
+    chartValue: number;
+    /**
+     * Sections of the gauge
+     */
+    segments: IGaugeChartSegment[];
+    /**
+     * Minimum value of the gauge
+     * @defaultvalue 0
+     */
+    minValue?: number;
+    /**
+     * Maximum value of the gauge
+     */
+    maxValue?: number;
+    /**
+     * Additional text to display below the chart value
+     */
+    sublabel?: string;
+    /**
+     * Hide the min and max values of the gauge
+     * @defaultvalue false
+     */
+    hideMinMax?: boolean;
+    /**
+     * Format of the chart value
+     * @defaultvalue GaugeValueFormat.Percentage
+     */
+    chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string);
+    /**
+     * Decides whether to show/hide legends
+     * @defaultvalue false
+     */
+    hideLegend?: boolean;
+    legendProps?: Partial<ILegendsProps>;
+    /**
+     * Do not show tooltips in chart
+     * @defaultvalue false
+     */
+    hideTooltip?: boolean;
+    /**
+     * Additional CSS class(es) to apply to the chart
+     */
+    className?: string;
+    /**
+     * Theme (provided through customization)
+     */
+    theme?: ITheme;
+    /**
+     * Call to provide customized styling that will layer on top of the variant rules
+     */
+    styles?: IStyleFunctionOrObject<IGaugeChartStyleProps, IGaugeChartStyles>;
+    /**
+     * Defines the culture to localize the numbers and dates
+     */
+    culture?: string;
+    /**
+     * Props for the callout in the chart
+     */
+    calloutProps?: Partial<ICalloutProps>;
+    /**
+     * Specifies the variant of GaugeChart to be rendered
+     * @defaultvalue GaugeChartVariant.MultipleSegments
+     */
+    variant?: GaugeChartVariant;
+}
+/**
+ * Gauge Chart style properties
+ * {@docCategory GaugeChart}
+ */
+export interface IGaugeChartStyleProps {
+    /**
+     * Theme (provided through customization)
+     */
+    theme: ITheme;
+    /**
+     * Font size of the chart value
+     */
+    chartValueSize?: number;
+    /**
+     * Width of the chart
+     */
+    chartWidth?: number;
+    /**
+     * Height of the chart
+     */
+    chartHeight?: number;
+    /**
+     * Additional CSS class(es) to apply to the chart
+     */
+    className?: string;
+    /**
+     * Color of the line
+     */
+    lineColor?: string;
+    /**
+     * Boolean flag which determines if shape is drawn in callout
+     */
+    toDrawShape?: boolean;
+}
+/**
+ * Gauge Chart styles
+ * {@docCategory GaugeChart}
+ */
+export interface IGaugeChartStyles {
+    /**
+     * Styles for the root element
+     */
+    root?: IStyle;
+    /**
+     * Styles for the chart
+     */
+    chart?: IStyle;
+    /**
+     * Styles for the min and max values
+     */
+    limits?: IStyle;
+    /**
+     * Styles for the chart value
+     */
+    chartValue?: IStyle;
+    /**
+     * Styles for the sublabel
+     */
+    sublabel?: IStyle;
+    /**
+     * Styles for the needle
+     */
+    needle?: IStyle;
+    /**
+     * Styles for the chart title
+     */
+    chartTitle?: IStyle;
+    /**
+     * Styles for the segments
+     */
+    segment?: IStyle;
+    /**
+     * Styles for the legends container
+     */
+    legendsContainer?: IStyle;
+    /**
+     * Styles for callout root-content
+     */
+    calloutContentRoot?: IStyle;
+    /**
+     * Styles for callout x-content
+     */
+    calloutContentX?: IStyle;
+    /**
+     * Styles for callout y-content
+     */
+    calloutContentY?: IStyle;
+    /**
+     * Styles for description message
+     */
+    descriptionMessage?: IStyle;
+    /**
+     * Styles for callout Date time container
+     */
+    calloutDateTimeContainer?: IStyle;
+    /**
+     * Styles for callout info container
+     */
+    calloutInfoContainer?: IStyle;
+    /**
+     * Styles for callout block container
+     */
+    calloutBlockContainer?: IStyle;
+    /**
+     * Styles for callout legend text
+     */
+    calloutlegendText?: IStyle;
+    /**
+     * Styles for the shape object in the callout
+     */
+    shapeStyles?: IStyle;
+}

package/lib-amd/components/GaugeChart/GaugeChart.types.js

@@ -0,0 +1,22 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.GaugeChartVariant = exports.GaugeValueFormat = void 0;
+    /**
+     * {@docCategory GaugeChart}
+     */
+    var GaugeValueFormat;
+    (function (GaugeValueFormat) {
+        GaugeValueFormat["Percentage"] = "percentage";
+        GaugeValueFormat["Fraction"] = "fraction";
+    })(GaugeValueFormat = exports.GaugeValueFormat || (exports.GaugeValueFormat = {}));
+    /**
+     * {@docCategory GaugeChart}
+     */
+    var GaugeChartVariant;
+    (function (GaugeChartVariant) {
+        GaugeChartVariant["SingleSegment"] = "single-segment";
+        GaugeChartVariant["MultipleSegments"] = "multiple-segments";
+    })(GaugeChartVariant = exports.GaugeChartVariant || (exports.GaugeChartVariant = {}));
+});
+//# sourceMappingURL=GaugeChart.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GaugeChart.types.js","sourceRoot":"../src/","sources":["components/GaugeChart/GaugeChart.types.ts"],"names":[],"mappings":";;;;IAgCA;;OAEG;IACH,IAAY,gBAGX;IAHD,WAAY,gBAAgB;QAC1B,6CAAyB,CAAA;QACzB,yCAAqB,CAAA;IACvB,CAAC,EAHW,gBAAgB,GAAhB,wBAAgB,KAAhB,wBAAgB,QAG3B;IAED;;OAEG;IACH,IAAY,iBAGX;IAHD,WAAY,iBAAiB;QAC3B,qDAAgC,CAAA;QAChC,2DAAsC,CAAA;IACxC,CAAC,EAHW,iBAAiB,GAAjB,yBAAiB,KAAjB,yBAAiB,QAG5B","sourcesContent":["import { IStyle, ITheme } from '@fluentui/react/lib/Styling';\nimport { IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { ILegendsProps } from '../Legends/index';\nimport { IAccessibilityProps } from '../../types/index';\nimport { ICalloutProps } from '@fluentui/react/lib/Callout';\n\n/**\n * Gauge Chart segment interface.\n * {@docCategory GaugeChart}\n */\nexport interface IGaugeChartSegment {\n  /**\n   * Legend text for a segment\n   */\n  legend: string;\n\n  /**\n   * Size of the segment\n   */\n  size: number;\n\n  /**\n   * Color of the segment\n   */\n  color?: string;\n\n  /**\n   * Accessibility data for the segment\n   */\n  accessibilityData?: IAccessibilityProps;\n}\n\n/**\n * {@docCategory GaugeChart}\n */\nexport enum GaugeValueFormat {\n  Percentage = 'percentage',\n  Fraction = 'fraction',\n}\n\n/**\n * {@docCategory GaugeChart}\n */\nexport enum GaugeChartVariant {\n  SingleSegment = 'single-segment',\n  MultipleSegments = 'multiple-segments',\n}\n\n/**\n * Gauge Chart properties\n * {@docCategory GaugeChart}\n */\nexport interface IGaugeChartProps {\n  /**\n   * Width of the chart\n   */\n  width?: number;\n\n  /**\n   * Height of the chart\n   */\n  height?: number;\n\n  /**\n   * Title of the chart\n   */\n  chartTitle?: string;\n\n  /**\n   * Current value of the gauge\n   */\n  chartValue: number;\n\n  /**\n   * Sections of the gauge\n   */\n  segments: IGaugeChartSegment[];\n\n  /**\n   * Minimum value of the gauge\n   * @defaultvalue 0\n   */\n  minValue?: number;\n\n  /**\n   * Maximum value of the gauge\n   */\n  maxValue?: number;\n\n  /**\n   * Additional text to display below the chart value\n   */\n  sublabel?: string;\n\n  /**\n   * Hide the min and max values of the gauge\n   * @defaultvalue false\n   */\n  hideMinMax?: boolean;\n\n  /**\n   * Format of the chart value\n   * @defaultvalue GaugeValueFormat.Percentage\n   */\n  chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string);\n\n  /**\n   * Decides whether to show/hide legends\n   * @defaultvalue false\n   */\n  hideLegend?: boolean;\n\n  /*\n   * Props for the legends in the chart\n   */\n  legendProps?: Partial<ILegendsProps>;\n\n  /**\n   * Do not show tooltips in chart\n   * @defaultvalue false\n   */\n  hideTooltip?: boolean;\n\n  /**\n   * Additional CSS class(es) to apply to the chart\n   */\n  className?: string;\n\n  /**\n   * Theme (provided through customization)\n   */\n  theme?: ITheme;\n\n  /**\n   * Call to provide customized styling that will layer on top of the variant rules\n   */\n  styles?: IStyleFunctionOrObject<IGaugeChartStyleProps, IGaugeChartStyles>;\n\n  /**\n   * Defines the culture to localize the numbers and dates\n   */\n  culture?: string;\n\n  /**\n   * Props for the callout in the chart\n   */\n  calloutProps?: Partial<ICalloutProps>;\n\n  /**\n   * Specifies the variant of GaugeChart to be rendered\n   * @defaultvalue GaugeChartVariant.MultipleSegments\n   */\n  variant?: GaugeChartVariant;\n}\n\n/**\n * Gauge Chart style properties\n * {@docCategory GaugeChart}\n */\nexport interface IGaugeChartStyleProps {\n  /**\n   * Theme (provided through customization)\n   */\n  theme: ITheme;\n\n  /**\n   * Font size of the chart value\n   */\n  chartValueSize?: number;\n\n  /**\n   * Width of the chart\n   */\n  chartWidth?: number;\n\n  /**\n   * Height of the chart\n   */\n  chartHeight?: number;\n\n  /**\n   * Additional CSS class(es) to apply to the chart\n   */\n  className?: string;\n\n  /**\n   * Color of the line\n   */\n  lineColor?: string;\n\n  /**\n   * Boolean flag which determines if shape is drawn in callout\n   */\n  toDrawShape?: boolean;\n}\n\n/**\n * Gauge Chart styles\n * {@docCategory GaugeChart}\n */\nexport interface IGaugeChartStyles {\n  /**\n   * Styles for the root element\n   */\n  root?: IStyle;\n\n  /**\n   * Styles for the chart\n   */\n  chart?: IStyle;\n\n  /**\n   * Styles for the min and max values\n   */\n  limits?: IStyle;\n\n  /**\n   * Styles for the chart value\n   */\n  chartValue?: IStyle;\n\n  /**\n   * Styles for the sublabel\n   */\n  sublabel?: IStyle;\n\n  /**\n   * Styles for the needle\n   */\n  needle?: IStyle;\n\n  /**\n   * Styles for the chart title\n   */\n  chartTitle?: IStyle;\n\n  /**\n   * Styles for the segments\n   */\n  segment?: IStyle;\n\n  /**\n   * Styles for the legends container\n   */\n  legendsContainer?: IStyle;\n\n  /**\n   * Styles for callout root-content\n   */\n  calloutContentRoot?: IStyle;\n\n  /**\n   * Styles for callout x-content\n   */\n  calloutContentX?: IStyle;\n\n  /**\n   * Styles for callout y-content\n   */\n  calloutContentY?: IStyle;\n\n  /**\n   * Styles for description message\n   */\n  descriptionMessage?: IStyle;\n\n  /**\n   * Styles for callout Date time container\n   */\n  calloutDateTimeContainer?: IStyle;\n\n  /**\n   * Styles for callout info container\n   */\n  calloutInfoContainer?: IStyle;\n\n  /**\n   * Styles for callout block container\n   */\n  calloutBlockContainer?: IStyle;\n\n  /**\n   * Styles for callout legend text\n   */\n  calloutlegendText?: IStyle;\n\n  /**\n   * Styles for the shape object in the callout\n   */\n  shapeStyles?: IStyle;\n}\n"]}

package/lib-amd/components/GaugeChart/index.d.ts

@@ -0,0 +1,2 @@
+export * from './GaugeChart';
+export * from './GaugeChart.types';

package/lib-amd/components/GaugeChart/index.js

@@ -0,0 +1,7 @@
+define(["require", "exports", "tslib", "./GaugeChart", "./GaugeChart.types"], function (require, exports, tslib_1, GaugeChart_1, GaugeChart_types_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(GaugeChart_1, exports);
+    tslib_1.__exportStar(GaugeChart_types_1, exports);
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/components/GaugeChart/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/GaugeChart/index.ts"],"names":[],"mappings":";;;IAAA,4CAA6B;IAC7B,kDAAmC","sourcesContent":["export * from './GaugeChart';\nexport * from './GaugeChart.types';\n"]}

package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.d.ts

@@ -0,0 +1,72 @@
+import * as React from 'react';
+import { IAccessibilityProps, IGroupedVerticalBarChartProps, IGVBarChartSeriesPoint, IBasestate } from '../../index';
+export interface IGroupedVerticalBarChartState extends IBasestate {
+    dataPointCalloutProps?: IGVBarChartSeriesPoint;
+    callOutAccessibilityData?: IAccessibilityProps;
+    calloutLegend: string;
+}
+export declare class GroupedVerticalBarChartBase extends React.Component<IGroupedVerticalBarChartProps, IGroupedVerticalBarChartState> {
+    static defaultProps: Partial<IGroupedVerticalBarChartProps>;
+    private _createSet;
+    private _dataset;
+    private _keys;
+    private _xAxisLabels;
+    private _datasetForBars;
+    private margins;
+    private _groupedVerticalBarGraph;
+    private _classNames;
+    private _refArray;
+    private _yMax;
+    private _calloutId;
+    private _tooltipId;
+    private _xAxisType;
+    private _isRtl;
+    private _calloutAnchorPoint;
+    private _barWidth;
+    private _domainMargin;
+    private _emptyChartId;
+    private _groupWidth;
+    private _xAxisInnerPadding;
+    private _xAxisOuterPadding;
+    constructor(props: IGroupedVerticalBarChartProps);
+    render(): React.ReactNode;
+    private _getMinMaxOfYAxis;
+    private _getDomainNRangeValues;
+    private _getGraphData;
+    private _getMargins;
+    private _createDataSetOfGVBC;
+    private _getCustomizedCallout;
+    private _getOpacity;
+    private _onBarHover;
+    private _onBarLeave;
+    private _handleChartMouseLeave;
+    private _onBarFocus;
+    private _redirectToUrl;
+    private _refCallback;
+    private _buildGraph;
+    private _createDataset;
+    private _createX0Scale;
+    private _createX1Scale;
+    private _closeCallout;
+    private _onLegendClick;
+    private _onLegendHover;
+    private _onLegendLeave;
+    private _getLegendData;
+    private _getAxisData;
+    /**
+     * This function checks if the given legend is highlighted or not.
+     * A legend can be highlighted in 2 ways:
+     * 1. selection: if the user clicks on it
+     * 2. hovering: if there is no selected legend and the user hovers over it
+     */
+    private _legendHighlighted;
+    /**
+     * This function checks if none of the legends is selected or hovered.
+     */
+    private _noLegendHighlighted;
+    private _getAriaLabel;
+    private _getDomainMargins;
+    private _isChartEmpty;
+    private _adjustProps;
+    private _getChartTitle;
+}