@fluentui/react-charting 5.25.4 → 5.25.6

package/etc/react-charting.api.md

@@ -6,9 +6,11 @@
 
 import { CurveFactory } from 'd3-shape';
 import { FocusZoneDirection } from '@fluentui/react-focus';
+import type { Font } from '@fluentui/chart-utilities';
 import { ICalloutContentStyleProps } from '@fluentui/react/lib/Callout';
 import { ICalloutContentStyles } from '@fluentui/react/lib/Callout';
 import { ICalloutProps } from '@fluentui/react/lib/Callout';
+import { ICalloutProps as ICalloutProps_2 } from '@fluentui/react';
 import { IFocusZoneProps } from '@fluentui/react-focus';
 import { IHoverCardStyleProps } from '@fluentui/react/lib/HoverCard';
 import { IHoverCardStyles } from '@fluentui/react/lib/HoverCard';
@@ -447,10 +449,14 @@ export interface ICartesianChartProps {
     tickPadding?: number;
     tickValues?: number[] | Date[] | string[];
     timeFormatLocale?: TimeLocaleDefinition;
+    // Warning: (ae-forgotten-export) The symbol "ITitleStyles" needs to be exported by the entry point index.d.ts
+    titleStyles?: ITitleStyles;
     useUTC?: boolean;
     width?: number;
     wrapXAxisLables?: boolean;
-    xAxis?: AxisProps;
+    xAxis?: AxisProps & {
+        tickLayout?: 'default' | 'auto';
+    };
     xAxisAnnotation?: string;
     xAxisCategoryOrder?: AxisCategoryOrder;
     xAxisTickCount?: number;
@@ -458,6 +464,7 @@ export interface ICartesianChartProps {
     xAxistickSize?: number;
     xAxisTitle?: string;
     xMaxValue?: number;
+    xMinValue?: number;
     xScaleType?: AxisScaleType;
     yAxis?: AxisProps;
     yAxisAnnotation?: string;
@@ -587,6 +594,7 @@ export interface IChartProps {
 
 // @public
 export interface IChartTableProps {
+    chartTitle?: string;
     className?: string;
     componentRef?: IRefObject<IChart>;
     headers: {
@@ -600,6 +608,7 @@ export interface IChartTableProps {
     }[][];
     styles?: IStyleFunctionOrObject<IChartTableStyleProps, IChartTableStyles>;
     theme?: ITheme;
+    titleStyles?: ITitleStyles;
     width?: string | number;
 }
 
@@ -618,10 +627,14 @@ export interface IChartTableStyles {
     // (undocumented)
     chart?: IStyle;
     // (undocumented)
+    chartTitle?: IStyle;
+    // (undocumented)
     headerCell?: IStyle;
     // (undocumented)
     root?: IStyle;
     // (undocumented)
+    svgTooltip?: IStyle;
+    // (undocumented)
     table?: IStyle;
 }
 
@@ -740,6 +753,7 @@ export interface IDonutChartProps extends ICartesianChartProps {
     roundCorners?: boolean;
     showLabelsInPercent?: boolean;
     styles?: IStyleFunctionOrObject<IDonutChartStyleProps, IDonutChartStyles>;
+    titleStyles?: ITitleStyles;
     valueInsideDonut?: string | number;
 }
 
@@ -751,9 +765,11 @@ export interface IDonutChartStyleProps extends ICartesianChartStyleProps {
 export interface IDonutChartStyles {
     axisAnnotation?: IStyle;
     chart?: IStyle;
+    chartTitle?: IStyle;
     chartWrapper?: IStyle;
     legendContainer: IStyle;
     root?: IStyle;
+    svgTooltip?: IStyle;
 }
 
 // @public (undocumented)
@@ -789,6 +805,7 @@ export interface IFunnelChartProps {
     orientation?: 'horizontal' | 'vertical';
     styles?: IStyleFunctionOrObject<IFunnelChartStyleProps, IFunnelChartStyles>;
     theme?: ITheme;
+    titleStyles?: ITitleStyles;
     width?: number;
 }
 
@@ -803,10 +820,12 @@ export interface IFunnelChartStyleProps {
 // @public
 export interface IFunnelChartStyles {
     chart?: IStyle;
+    chartTitle?: IStyle;
     root?: IStyle;
     subComponentStyles: {
         calloutStyles: IStyleFunctionOrObject<ICalloutContentStyleProps, ICalloutContentStyles>;
     };
+    svgTooltip?: IStyle;
     text?: IStyle;
 }
 
@@ -871,6 +890,7 @@ export interface IGaugeChartProps {
     styles?: IStyleFunctionOrObject<IGaugeChartStyleProps, IGaugeChartStyles>;
     sublabel?: string;
     theme?: ITheme;
+    titleStyles?: ITitleStyles;
     variant?: GaugeChartVariant;
     width?: number;
 }
@@ -920,6 +940,7 @@ export interface IGaugeChartStyles {
     segment?: IStyle;
     shapeStyles?: IStyle;
     sublabel?: IStyle;
+    svgTooltip?: IStyle;
 }
 
 // @public (undocumented)
@@ -970,6 +991,7 @@ export interface IGroupedVerticalBarChartStyles extends ICartesianChartStyles {
 
 // @public (undocumented)
 export interface IGVBarChartSeriesPoint {
+    barLabel?: string;
     callOutAccessibilityData?: IAccessibilityProps;
     color?: string;
     data: number;
@@ -1106,6 +1128,7 @@ export interface IHorizontalBarChartStyles {
 
 // @public (undocumented)
 export interface IHorizontalBarChartWithAxisDataPoint {
+    barLabel?: string;
     callOutAccessibilityData?: IAccessibilityProps;
     color?: string;
     gradient?: [string, string];
@@ -1125,6 +1148,7 @@ export interface IHorizontalBarChartWithAxisProps extends ICartesianChartProps {
     culture?: string;
     data?: IHorizontalBarChartWithAxisDataPoint[];
     enableGradient?: boolean;
+    hideLabels?: boolean;
     onRenderCalloutPerDataPoint?: IRenderFunction<IHorizontalBarChartWithAxisDataPoint>;
     roundCorners?: boolean;
     styles?: IStyleFunctionOrObject<IHorizontalBarChartWithAxisStyleProps, IHorizontalBarChartWithAxisStyles>;
@@ -1139,6 +1163,7 @@ export interface IHorizontalBarChartWithAxisStyleProps extends ICartesianChartSt
 
 // @public
 export interface IHorizontalBarChartWithAxisStyles extends ICartesianChartStyles {
+    barLabel?: IStyle;
     chartLabel?: IStyle;
     opacityChangeOnHover: IStyle;
     xAxisDomain?: IStyle;
@@ -1524,6 +1549,52 @@ export interface IPieChartStyles {
     root?: IStyle;
 }
 
+// @public
+export interface IPolarChartProps {
+    angularAxis?: PolarAxisProps & {
+        unit?: 'radians' | 'degrees';
+    };
+    calloutProps?: Partial<ICalloutProps_2>;
+    chartTitle?: string;
+    componentRef?: React_2.Ref<IChart>;
+    culture?: string;
+    // Warning: (ae-forgotten-export) The symbol "IAreaPolarSeries" needs to be exported by the entry point index.d.ts
+    // Warning: (ae-forgotten-export) The symbol "ILinePolarSeries" needs to be exported by the entry point index.d.ts
+    // Warning: (ae-forgotten-export) The symbol "IScatterPolarSeries" needs to be exported by the entry point index.d.ts
+    data: (IAreaPolarSeries | ILinePolarSeries | IScatterPolarSeries)[];
+    dateLocalizeOptions?: Intl.DateTimeFormatOptions;
+    direction?: 'clockwise' | 'counterclockwise';
+    height?: number;
+    hideLegend?: boolean;
+    hideTooltip?: boolean;
+    hole?: number;
+    // (undocumented)
+    legendProps?: Partial<ILegendsProps>;
+    margins?: IMargins;
+    radialAxis?: PolarAxisProps;
+    shape?: 'circle' | 'polygon';
+    styles?: IStyleFunctionOrObject_2<IPolarChartStyleProps, IPolarChartStyles>;
+    theme?: ITheme_2;
+    useUTC?: boolean;
+    width?: number;
+}
+
+// @public
+export interface IPolarChartStyleProps {
+    theme: ITheme_2;
+}
+
+// @public
+export interface IPolarChartStyles {
+    chart?: IStyle_2;
+    chartWrapper?: IStyle_2;
+    gridLineInner?: IStyle_2;
+    gridLineOuter?: IStyle_2;
+    legendContainer?: IStyle_2;
+    root?: IStyle_2;
+    tickLabel?: IStyle_2;
+}
+
 // @public (undocumented)
 export interface IRefArrayData {
     // (undocumented)
@@ -1583,12 +1654,14 @@ export interface ISankeyChartProps {
     enableReflow?: boolean;
     formatNumberOptions?: Intl.NumberFormatOptions;
     height?: number;
+    hideLegend?: boolean;
     parentRef?: HTMLElement | null;
     pathColor?: string;
     shouldResize?: number;
     strings?: ISankeyChartStrings;
     styles?: IStyleFunctionOrObject<ISankeyChartStyleProps, ISankeyChartStyles>;
     theme?: ITheme;
+    titleStyles?: ITitleStyles;
     width?: number;
 }
 
@@ -1617,11 +1690,13 @@ export interface ISankeyChartStyleProps {
 export interface ISankeyChartStyles {
     calloutContentRoot?: IStyle;
     chart?: IStyle;
+    chartTitle?: IStyle;
     chartWrapper?: IStyle;
     links?: IStyle;
     nodes?: IStyle;
     nodeTextContainer?: IStyle;
     root?: IStyle;
+    svgTooltip?: IStyle;
     toolTip?: IStyle;
 }
 
@@ -1649,6 +1724,7 @@ export interface IScatterChartProps extends ICartesianChartProps {
     data: IChartProps;
     getCalloutDescriptionMessage?: (calloutDataProps: ICustomizedCalloutData) => string | undefined;
     onRenderCalloutPerDataPoint?: IRenderFunction<ICustomizedCalloutData>;
+    onRenderCalloutPerStack?: IRenderFunction<ICustomizedCalloutData>;
     styles?: IScatterChartStyles;
 }
 
@@ -1827,6 +1903,7 @@ export interface ITreeStyles {
 
 // @public (undocumented)
 export interface IVerticalBarChartDataPoint {
+    barLabel?: string;
     callOutAccessibilityData?: IAccessibilityProps;
     color?: string;
     gradient?: [string, string];
@@ -1957,6 +2034,7 @@ export interface IVerticalStackedChartProps {
 
 // @public (undocumented)
 export interface IVSChartDataPoint {
+    barLabel?: string;
     callOutAccessibilityData?: IAccessibilityProps;
     color?: string;
     data: number | string;
@@ -2020,6 +2098,20 @@ export enum NodesComposition {
 // @public
 export const PieChart: React_2.FunctionComponent<IPieChartProps>;
 
+// @public
+export type PolarAxisProps = AxisProps & {
+    tickValues?: number[] | Date[] | string[];
+    tickFormat?: string;
+    tickCount?: number;
+    categoryOrder?: AxisCategoryOrder;
+    scaleType?: AxisScaleType;
+    rangeStart?: number | Date;
+    rangeEnd?: number | Date;
+};
+
+// @public
+export const PolarChart: React_2.FunctionComponent<IPolarChartProps>;
+
 // @public
 export const ResponsiveContainer: React_2.FC<IResponsiveContainerProps>;
 

package/lib/PolarChart.d.ts

@@ -0,0 +1 @@
+export * from './components/PolarChart/index';

package/lib/PolarChart.js

@@ -0,0 +1,2 @@
+export * from './components/PolarChart/index';
+//# sourceMappingURL=PolarChart.js.map

package/lib/PolarChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PolarChart.js","sourceRoot":"../src/","sources":["PolarChart.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC","sourcesContent":["export * from './components/PolarChart/index';\n"]}

package/lib/components/AnnotationOnlyChart/AnnotationOnlyChart.js

@@ -152,7 +152,7 @@ export var AnnotationOnlyChart = function (props) {
             React.createElement("foreignObject", { x: 0, y: 0, width: resolvedWidth, height: svgHeight },
                 React.createElement("div", { ref: contentRef, className: rootClassName, "data-chart-annotation-only": "true", "aria-label": ariaLabel },
                     chartTitle && (React.createElement("span", { className: titleClassName, "aria-hidden": "true" }, chartTitle)),
-                    React.createElement("div", { className: contentClassName, role: "presentation" }, hasAnnotations ? (React.createElement(ChartAnnotationLayer, { annotations: resolvedAnnotations, context: context, theme: theme })) : null))))));
+                    React.createElement("div", { className: contentClassName, role: "presentation" }, hasAnnotations ? (React.createElement(ChartAnnotationLayer, { annotations: resolvedAnnotations, context: context, theme: theme, hideDefaultStyles: true })) : null))))));
 };
 AnnotationOnlyChart.displayName = 'AnnotationOnlyChart';
 //# sourceMappingURL=AnnotationOnlyChart.js.map

package/lib/components/AnnotationOnlyChart/AnnotationOnlyChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnnotationOnlyChart.js","sourceRoot":"../src/","sources":["components/AnnotationOnlyChart/AnnotationOnlyChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,sDAAsD,CAAC;AAC5F,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAKzE,IAAM,cAAc,GAAG,GAAG,CAAC;AAC3B,IAAM,cAAc,GAAG,GAAG,CAAC;AAE3B,IAAM,YAAY,GAAG,UAAC,MAA2C;;IAC/D,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAM,GAAG,GAAG,MAAA,MAAM,CAAC,CAAC,mCAAI,CAAC,CAAC;IAC1B,IAAM,KAAK,GAAG,MAAA,MAAM,CAAC,CAAC,mCAAI,CAAC,CAAC;IAC5B,IAAM,MAAM,GAAG,MAAA,MAAM,CAAC,CAAC,mCAAI,CAAC,CAAC;IAC7B,IAAM,IAAI,GAAG,MAAA,MAAM,CAAC,CAAC,mCAAI,CAAC,CAAC;IAE3B,IAAI,GAAG,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,IAAI,MAAM,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC;QAC3D,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,OAAO,UAAG,GAAG,gBAAM,KAAK,gBAAM,MAAM,gBAAM,IAAI,OAAI,CAAC;AACrD,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,mBAAmB,GAAwC,UAAA,KAAK;IAEzE,IAAA,WAAW,GAWT,KAAK,YAXI,EACX,UAAU,GAUR,KAAK,WAVG,EACV,WAAW,GAST,KAAK,YATI,EACX,KAAK,GAQH,KAAK,MARF,EACL,MAAM,GAOJ,KAAK,OAPD,EACN,oBAAoB,GAMlB,KAAK,qBANa,EACpB,mBAAmB,GAKjB,KAAK,oBALY,EACnB,SAAS,GAIP,KAAK,UAJE,EACT,UAAU,GAGR,KAAK,WAHG,EACV,MAAM,GAEJ,KAAK,OAFD,EACN,YAAY,GACV,KAAK,aADK,CACJ;IAEV,IAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,IAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAwB,IAAI,CAAC,CAAC;IAC/D,IAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAwB,IAAI,CAAC,CAAC;IACvD,IAAA,KAAoC,KAAK,CAAC,QAAQ,CAAS,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,CAAC,CAAC,EAArE,aAAa,QAAA,EAAE,gBAAgB,QAAsC,CAAC;IACvE,IAAA,KAAoC,KAAK,CAAC,QAAQ,CAAS,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,cAAc,CAAC,EAAnF,aAAa,QAAA,EAAE,gBAAgB,QAAoD,CAAC;IAE3F,KAAK,CAAC,SAAS,CAAC;QACd,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;YAC3C,gBAAgB,CAAC,KAAK,CAAC,CAAC;YACxB,OAAO;QACT,CAAC;QAED,IAAM,IAAI,GAAG,YAAY,CAAC,OAAO,CAAC;QAClC,IAAI,CAAC,IAAI,IAAI,OAAO,cAAc,KAAK,WAAW,EAAE,CAAC;YACnD,IAAM,MAAI,GAAG,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,qBAAqB,EAAE,CAAC;YAC3C,IAAI,MAAI,IAAI,MAAI,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC;gBAC3B,gBAAgB,CAAC,MAAI,CAAC,KAAK,CAAC,CAAC;YAC/B,CAAC;iBAAM,CAAC;gBACN,gBAAgB,CAAC,UAAA,IAAI,IAAI,OAAA,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,EAAlC,CAAkC,CAAC,CAAC;YAC/D,CAAC;YACD,OAAO;QACT,CAAC;QAED,IAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,UAAA,OAAO;YACzC,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YACzB,IAAI,CAAC,KAAK,EAAE,CAAC;gBACX,OAAO;YACT,CAAC;YACD,IAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC;YACzC,IAAI,QAAQ,GAAG,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,QAAQ,GAAG,aAAa,CAAC,GAAG,GAAG,EAAE,CAAC;gBAC7D,gBAAgB,CAAC,QAAQ,CAAC,CAAC;YAC7B,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAM,IAAI,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC1C,IAAI,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC;YACnB,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC/B,CAAC;QAED,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QACvB,OAAO,cAAM,OAAA,QAAQ,CAAC,UAAU,EAAE,EAArB,CAAqB,CAAC;IACrC,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;IAE3B,IAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,IAAI,cAAc,EAAE,CAAC,CAAC,CAAC;IACnE,IAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,cAAc,EAAE,CAAC,CAAC,CAAC;IAE7D,KAAK,CAAC,SAAS,CAAC;QACd,IAAM,IAAI,GAAG,UAAU,CAAC,OAAO,CAAC;QAChC,IAAI,CAAC,IAAI,EAAE,CAAC;YACV,gBAAgB,CAAC,UAAA,IAAI,IAAI,OAAA,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,EAAlC,CAAkC,CAAC,CAAC;YAC7D,OAAO;QACT,CAAC;QAED,IAAI,OAAO,cAAc,KAAK,WAAW,EAAE,CAAC;YAC1C,IAAM,MAAI,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;YAC1C,gBAAgB,CAAC,UAAA,IAAI,IAAI,OAAA,CAAC,MAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,EAAlE,CAAkE,CAAC,CAAC;YAC7F,OAAO;QACT,CAAC;QAED,IAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,UAAA,OAAO;YACzC,IAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC;YACzB,IAAI,CAAC,KAAK,EAAE,CAAC;gBACX,OAAO;YACT,CAAC;YAED,IAAM,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC;YAC3C,IAAI,SAAS,GAAG,CAAC,EAAE,CAAC;gBAClB,gBAAgB,CAAC,UAAA,IAAI,IAAI,OAAA,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,SAAS,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,EAArD,CAAqD,CAAC,CAAC;YAClF,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,IAAM,IAAI,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC1C,gBAAgB,CAAC,UAAA,IAAI,IAAI,OAAA,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,cAAc,CAAC,EAAlE,CAAkE,CAAC,CAAC;QAE7F,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QACvB,OAAO,cAAM,OAAA,QAAQ,CAAC,UAAU,EAAE,EAArB,CAAqB,CAAC;IACrC,CAAC,EAAE;QACD,cAAc;QACd,aAAa;QACb,WAAW;QACX,UAAU;QACV,WAAW;QACX,MAAM;QACN,mBAAmB;QACnB,oBAAoB;QACpB,SAAS;QACT,UAAU;QACV,KAAK;KACN,CAAC,CAAC;IAEH,IAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC;IAE1E,IAAM,OAAO,GAA4B;QACvC,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE;QACtE,OAAO,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE;QACzD,KAAK,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG;KAClB,CAAC;IAEF,IAAM,OAAO,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;IAErC,IAAM,aAAa,GAAG,KAAK,CAAC,OAAO,CACjC;QACE,OAAA,WAAW,CAAC;YACV,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,UAAG,KAAK,OAAI,CAAC,CAAC,CAAC,MAAM;YACpC,SAAS,EAAE,cAAc;YACzB,eAAe,EAAE,oBAAoB,aAApB,oBAAoB,cAApB,oBAAoB,GAAI,KAAK,CAAC,cAAc,CAAC,cAAc;YAC5E,KAAK,EAAE,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,KAAK,CAAC,cAAc,CAAC,QAAQ;YACjD,UAAU,EAAE,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU;YACvD,OAAO,SAAA;YACP,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,MAAM,EAAE,KAAK;SACd,CAAC;IAXF,CAWE,EACJ,CAAC,SAAS,EAAE,UAAU,EAAE,oBAAoB,EAAE,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,CAAC,CACrF,CAAC;IAEF,IAAM,gBAAgB,GAAG,KAAK,CAAC,OAAO,CACpC;;QACE,OAAA,WAAW,CAAC;YACV,QAAQ,EAAE,UAAU;YACpB,QAAQ,EAAE,CAAC;YACX,eAAe,EAAE,mBAAmB,aAAnB,mBAAmB,cAAnB,mBAAmB,GAAI,aAAa;YACrD,YAAY,EAAE,MAAA,KAAK,CAAC,OAAO,CAAC,cAAc,mCAAI,CAAC;YAC/C,SAAS,EAAE,YAAY;SACxB,CAAC,CAAA;KAAA,EACJ,CAAC,mBAAmB,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,CACpD,CAAC;IAEF,IAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAClC;QACE,OAAA,WAAW,CAAC;YACV,SAAS,EAAE,QAAQ;SACpB,CAAC;IAFF,CAEE,EACJ,EAAE,CACH,CAAC;IAEF,IAAM,mBAAmB,GAAG,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,EAAE,CAAC;IAC9C,IAAM,cAAc,GAAG,mBAAmB,CAAC,MAAM,GAAG,CAAC,CAAC;IACtD,IAAM,SAAS,GAAG,cAAc,CAAC,CAAC,CAAC,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;IAEzE,KAAK,CAAC,mBAAmB,CACvB,YAAY,EACZ;QACE,IAAM,WAAW,GAAW;YAC1B,cAAc,EAAE,YAAY,CAAC,OAAO;YACpC,OAAO,EAAE,UAAC,IAA0B;gBAClC,OAAO,mBAAmB,CAAC,CAAC,EAAE,SAAS,EAAE,YAAY,CAAC,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,IAAI,CAAC,CAAC;YAC/F,CAAC;SACF,CAAC;QAEF,OAAO,WAAW,CAAC;IACrB,CAAC,EACD,EAAE,CACH,CAAC;IAEF,OAAO,CACL,6BAAK,GAAG,EAAE,YAAY,qCAAkC,MAAM;QAC5D,6BACE,KAAK,EAAE,aAAa,EACpB,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,cAAO,aAAa,cAAI,SAAS,CAAE,EAC5C,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,UAAG,KAAK,OAAI,CAAC,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,UAAG,SAAS,OAAI,EAAE,OAAO,EAAE,OAAO,EAAE,EAC3F,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,gBACvB,SAAS;YAErB,uCAAe,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,SAAS;gBAChE,6BAAK,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,gCAA6B,MAAM,gBAAa,SAAS;oBACpG,UAAU,IAAI,CACb,8BAAM,SAAS,EAAE,cAAc,iBAAc,MAAM,IAChD,UAAU,CACN,CACR;oBACD,6BAAK,SAAS,EAAE,gBAAgB,EAAE,IAAI,EAAC,cAAc,IAClD,cAAc,CAAC,CAAC,CAAC,CAChB,oBAAC,oBAAoB,IAAC,WAAW,EAAE,mBAAmB,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAI,CAC3F,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACQ,CACZ,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,mBAAmB,CAAC,WAAW,GAAG,qBAAqB,CAAC","sourcesContent":["import * as React from 'react';\nimport { getRTL, useTheme } from '@fluentui/react';\nimport { mergeStyles } from '@fluentui/react/lib/Styling';\nimport { ChartAnnotationLayer } from '../CommonComponents/Annotations/ChartAnnotationLayer';\nimport { exportChartsAsImage } from '../../utilities/image-export-utils';\nimport type { IAnnotationOnlyChartProps } from './AnnotationOnlyChart.types';\nimport type { IChart, IImageExportOptions } from '../../types/index';\nimport type { IChartAnnotationContext } from '../CommonComponents/Annotations/ChartAnnotationLayer.types';\n\nconst DEFAULT_HEIGHT = 650;\nconst FALLBACK_WIDTH = 400;\n\nconst buildPadding = (margin: IAnnotationOnlyChartProps['margin']): string | undefined => {\n  if (!margin) {\n    return undefined;\n  }\n\n  const top = margin.t ?? 0;\n  const right = margin.r ?? 0;\n  const bottom = margin.b ?? 0;\n  const left = margin.l ?? 0;\n\n  if (top === 0 && right === 0 && bottom === 0 && left === 0) {\n    return undefined;\n  }\n\n  return `${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nexport const AnnotationOnlyChart: React.FC<IAnnotationOnlyChartProps> = props => {\n  const {\n    annotations,\n    chartTitle,\n    description,\n    width,\n    height,\n    paperBackgroundColor,\n    plotBackgroundColor,\n    fontColor,\n    fontFamily,\n    margin,\n    componentRef,\n  } = props;\n\n  const theme = useTheme();\n  const containerRef = React.useRef<HTMLDivElement | null>(null);\n  const contentRef = React.useRef<HTMLDivElement | null>(null);\n  const [measuredWidth, setMeasuredWidth] = React.useState<number>(width ?? 0);\n  const [contentHeight, setContentHeight] = React.useState<number>(height ?? DEFAULT_HEIGHT);\n\n  React.useEffect(() => {\n    if (typeof width === 'number' && width > 0) {\n      setMeasuredWidth(width);\n      return;\n    }\n\n    const node = containerRef.current;\n    if (!node || typeof ResizeObserver === 'undefined') {\n      const rect = node?.getBoundingClientRect();\n      if (rect && rect.width > 0) {\n        setMeasuredWidth(rect.width);\n      } else {\n        setMeasuredWidth(prev => (prev > 0 ? prev : FALLBACK_WIDTH));\n      }\n      return;\n    }\n\n    const observer = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (!entry) {\n        return;\n      }\n      const newWidth = entry.contentRect.width;\n      if (newWidth > 0 && Math.abs(newWidth - measuredWidth) > 0.5) {\n        setMeasuredWidth(newWidth);\n      }\n    });\n\n    const rect = node.getBoundingClientRect();\n    if (rect.width > 0) {\n      setMeasuredWidth(rect.width);\n    }\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [width, measuredWidth]);\n\n  const resolvedWidth = Math.max(measuredWidth || FALLBACK_WIDTH, 1);\n  const resolvedHeight = Math.max(height ?? DEFAULT_HEIGHT, 1);\n\n  React.useEffect(() => {\n    const node = contentRef.current;\n    if (!node) {\n      setContentHeight(prev => (prev > 0 ? prev : resolvedHeight));\n      return;\n    }\n\n    if (typeof ResizeObserver === 'undefined') {\n      const rect = node.getBoundingClientRect();\n      setContentHeight(prev => (rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight));\n      return;\n    }\n\n    const observer = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (!entry) {\n        return;\n      }\n\n      const newHeight = entry.contentRect.height;\n      if (newHeight > 0) {\n        setContentHeight(prev => (Math.abs(prev - newHeight) > 0.5 ? newHeight : prev));\n      }\n    });\n\n    const rect = node.getBoundingClientRect();\n    setContentHeight(prev => (rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight));\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [\n    resolvedHeight,\n    resolvedWidth,\n    annotations,\n    chartTitle,\n    description,\n    margin,\n    plotBackgroundColor,\n    paperBackgroundColor,\n    fontColor,\n    fontFamily,\n    theme,\n  ]);\n\n  const svgHeight = Math.max(Math.ceil(contentHeight || 0), resolvedHeight);\n\n  const context: IChartAnnotationContext = {\n    plotRect: { x: 0, y: 0, width: resolvedWidth, height: resolvedHeight },\n    svgRect: { width: resolvedWidth, height: resolvedHeight },\n    isRtl: theme?.rtl,\n  };\n\n  const padding = buildPadding(margin);\n\n  const rootClassName = React.useMemo(\n    () =>\n      mergeStyles({\n        position: 'relative',\n        width: width ? `${width}px` : '100%',\n        minHeight: resolvedHeight,\n        backgroundColor: paperBackgroundColor ?? theme.semanticColors.bodyBackground,\n        color: fontColor ?? theme.semanticColors.bodyText,\n        fontFamily: fontFamily ?? theme.fonts.medium.fontFamily,\n        padding,\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '8px',\n      }),\n    [fontColor, fontFamily, paperBackgroundColor, padding, resolvedHeight, theme, width],\n  );\n\n  const contentClassName = React.useMemo(\n    () =>\n      mergeStyles({\n        position: 'relative',\n        flexGrow: 1,\n        backgroundColor: plotBackgroundColor ?? 'transparent',\n        borderRadius: theme.effects.roundedCorner2 ?? 4,\n        boxSizing: 'border-box',\n      }),\n    [plotBackgroundColor, theme.effects.roundedCorner2],\n  );\n\n  const titleClassName = React.useMemo(\n    () =>\n      mergeStyles({\n        textAlign: 'center',\n      }),\n    [],\n  );\n\n  const resolvedAnnotations = annotations ?? [];\n  const hasAnnotations = resolvedAnnotations.length > 0;\n  const ariaLabel = hasAnnotations ? description ?? chartTitle : undefined;\n\n  React.useImperativeHandle(\n    componentRef,\n    () => {\n      const chartHandle: IChart = {\n        chartContainer: containerRef.current,\n        toImage: (opts?: IImageExportOptions) => {\n          return exportChartsAsImage([{ container: containerRef.current }], undefined, getRTL(), opts);\n        },\n      };\n\n      return chartHandle;\n    },\n    [],\n  );\n\n  return (\n    <div ref={containerRef} data-chart-annotation-container=\"true\">\n      <svg\n        width={resolvedWidth}\n        height={svgHeight}\n        viewBox={`0 0 ${resolvedWidth} ${svgHeight}`}\n        style={{ width: width ? `${width}px` : '100%', height: `${svgHeight}px`, display: 'block' }}\n        role={ariaLabel ? 'img' : undefined}\n        aria-label={ariaLabel}\n      >\n        <foreignObject x={0} y={0} width={resolvedWidth} height={svgHeight}>\n          <div ref={contentRef} className={rootClassName} data-chart-annotation-only=\"true\" aria-label={ariaLabel}>\n            {chartTitle && (\n              <span className={titleClassName} aria-hidden=\"true\">\n                {chartTitle}\n              </span>\n            )}\n            <div className={contentClassName} role=\"presentation\">\n              {hasAnnotations ? (\n                <ChartAnnotationLayer annotations={resolvedAnnotations} context={context} theme={theme} />\n              ) : null}\n            </div>\n          </div>\n        </foreignObject>\n      </svg>\n    </div>\n  );\n};\n\nAnnotationOnlyChart.displayName = 'AnnotationOnlyChart';\n"]}
+{"version":3,"file":"AnnotationOnlyChart.js","sourceRoot":"../src/","sources":["components/AnnotationOnlyChart/AnnotationOnlyChart.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getRTL, useTheme } from '@fluentui/react';\nimport { mergeStyles } from '@fluentui/react/lib/Styling';\nimport { ChartAnnotationLayer } from '../CommonComponents/Annotations/ChartAnnotationLayer';\nimport { exportChartsAsImage } from '../../utilities/image-export-utils';\nimport type { IAnnotationOnlyChartProps } from './AnnotationOnlyChart.types';\nimport type { IChart, IImageExportOptions } from '../../types/index';\nimport type { IChartAnnotationContext } from '../CommonComponents/Annotations/ChartAnnotationLayer.types';\n\nconst DEFAULT_HEIGHT = 650;\nconst FALLBACK_WIDTH = 400;\n\nconst buildPadding = (margin: IAnnotationOnlyChartProps['margin']): string | undefined => {\n  if (!margin) {\n    return undefined;\n  }\n\n  const top = margin.t ?? 0;\n  const right = margin.r ?? 0;\n  const bottom = margin.b ?? 0;\n  const left = margin.l ?? 0;\n\n  if (top === 0 && right === 0 && bottom === 0 && left === 0) {\n    return undefined;\n  }\n\n  return `${top}px ${right}px ${bottom}px ${left}px`;\n};\n\nexport const AnnotationOnlyChart: React.FC<IAnnotationOnlyChartProps> = props => {\n  const {\n    annotations,\n    chartTitle,\n    description,\n    width,\n    height,\n    paperBackgroundColor,\n    plotBackgroundColor,\n    fontColor,\n    fontFamily,\n    margin,\n    componentRef,\n  } = props;\n\n  const theme = useTheme();\n  const containerRef = React.useRef<HTMLDivElement | null>(null);\n  const contentRef = React.useRef<HTMLDivElement | null>(null);\n  const [measuredWidth, setMeasuredWidth] = React.useState<number>(width ?? 0);\n  const [contentHeight, setContentHeight] = React.useState<number>(height ?? DEFAULT_HEIGHT);\n\n  React.useEffect(() => {\n    if (typeof width === 'number' && width > 0) {\n      setMeasuredWidth(width);\n      return;\n    }\n\n    const node = containerRef.current;\n    if (!node || typeof ResizeObserver === 'undefined') {\n      const rect = node?.getBoundingClientRect();\n      if (rect && rect.width > 0) {\n        setMeasuredWidth(rect.width);\n      } else {\n        setMeasuredWidth(prev => (prev > 0 ? prev : FALLBACK_WIDTH));\n      }\n      return;\n    }\n\n    const observer = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (!entry) {\n        return;\n      }\n      const newWidth = entry.contentRect.width;\n      if (newWidth > 0 && Math.abs(newWidth - measuredWidth) > 0.5) {\n        setMeasuredWidth(newWidth);\n      }\n    });\n\n    const rect = node.getBoundingClientRect();\n    if (rect.width > 0) {\n      setMeasuredWidth(rect.width);\n    }\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [width, measuredWidth]);\n\n  const resolvedWidth = Math.max(measuredWidth || FALLBACK_WIDTH, 1);\n  const resolvedHeight = Math.max(height ?? DEFAULT_HEIGHT, 1);\n\n  React.useEffect(() => {\n    const node = contentRef.current;\n    if (!node) {\n      setContentHeight(prev => (prev > 0 ? prev : resolvedHeight));\n      return;\n    }\n\n    if (typeof ResizeObserver === 'undefined') {\n      const rect = node.getBoundingClientRect();\n      setContentHeight(prev => (rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight));\n      return;\n    }\n\n    const observer = new ResizeObserver(entries => {\n      const entry = entries[0];\n      if (!entry) {\n        return;\n      }\n\n      const newHeight = entry.contentRect.height;\n      if (newHeight > 0) {\n        setContentHeight(prev => (Math.abs(prev - newHeight) > 0.5 ? newHeight : prev));\n      }\n    });\n\n    const rect = node.getBoundingClientRect();\n    setContentHeight(prev => (rect.height > 0 ? rect.height : prev > 0 ? prev : resolvedHeight));\n\n    observer.observe(node);\n    return () => observer.disconnect();\n  }, [\n    resolvedHeight,\n    resolvedWidth,\n    annotations,\n    chartTitle,\n    description,\n    margin,\n    plotBackgroundColor,\n    paperBackgroundColor,\n    fontColor,\n    fontFamily,\n    theme,\n  ]);\n\n  const svgHeight = Math.max(Math.ceil(contentHeight || 0), resolvedHeight);\n\n  const context: IChartAnnotationContext = {\n    plotRect: { x: 0, y: 0, width: resolvedWidth, height: resolvedHeight },\n    svgRect: { width: resolvedWidth, height: resolvedHeight },\n    isRtl: theme?.rtl,\n  };\n\n  const padding = buildPadding(margin);\n\n  const rootClassName = React.useMemo(\n    () =>\n      mergeStyles({\n        position: 'relative',\n        width: width ? `${width}px` : '100%',\n        minHeight: resolvedHeight,\n        backgroundColor: paperBackgroundColor ?? theme.semanticColors.bodyBackground,\n        color: fontColor ?? theme.semanticColors.bodyText,\n        fontFamily: fontFamily ?? theme.fonts.medium.fontFamily,\n        padding,\n        display: 'flex',\n        flexDirection: 'column',\n        rowGap: '8px',\n      }),\n    [fontColor, fontFamily, paperBackgroundColor, padding, resolvedHeight, theme, width],\n  );\n\n  const contentClassName = React.useMemo(\n    () =>\n      mergeStyles({\n        position: 'relative',\n        flexGrow: 1,\n        backgroundColor: plotBackgroundColor ?? 'transparent',\n        borderRadius: theme.effects.roundedCorner2 ?? 4,\n        boxSizing: 'border-box',\n      }),\n    [plotBackgroundColor, theme.effects.roundedCorner2],\n  );\n\n  const titleClassName = React.useMemo(\n    () =>\n      mergeStyles({\n        textAlign: 'center',\n      }),\n    [],\n  );\n\n  const resolvedAnnotations = annotations ?? [];\n  const hasAnnotations = resolvedAnnotations.length > 0;\n  const ariaLabel = hasAnnotations ? description ?? chartTitle : undefined;\n\n  React.useImperativeHandle(\n    componentRef,\n    () => {\n      const chartHandle: IChart = {\n        chartContainer: containerRef.current,\n        toImage: (opts?: IImageExportOptions) => {\n          return exportChartsAsImage([{ container: containerRef.current }], undefined, getRTL(), opts);\n        },\n      };\n\n      return chartHandle;\n    },\n    [],\n  );\n\n  return (\n    <div ref={containerRef} data-chart-annotation-container=\"true\">\n      <svg\n        width={resolvedWidth}\n        height={svgHeight}\n        viewBox={`0 0 ${resolvedWidth} ${svgHeight}`}\n        style={{ width: width ? `${width}px` : '100%', height: `${svgHeight}px`, display: 'block' }}\n        role={ariaLabel ? 'img' : undefined}\n        aria-label={ariaLabel}\n      >\n        <foreignObject x={0} y={0} width={resolvedWidth} height={svgHeight}>\n          <div ref={contentRef} className={rootClassName} data-chart-annotation-only=\"true\" aria-label={ariaLabel}>\n            {chartTitle && (\n              <span className={titleClassName} aria-hidden=\"true\">\n                {chartTitle}\n              </span>\n            )}\n            <div className={contentClassName} role=\"presentation\">\n              {hasAnnotations ? (\n                <ChartAnnotationLayer\n                  annotations={resolvedAnnotations}\n                  context={context}\n                  theme={theme}\n                  hideDefaultStyles={true}\n                />\n              ) : null}\n            </div>\n          </div>\n        </foreignObject>\n      </svg>\n    </div>\n  );\n};\n\nAnnotationOnlyChart.displayName = 'AnnotationOnlyChart';\n"]}

package/lib/components/AreaChart/AreaChart.base.d.ts

@@ -54,7 +54,6 @@ export declare class AreaChartBase extends React.Component<IAreaChartProps, IAre
     private _rectId;
     private _xAxisRectScale;
     private _isMultiStackChart;
-    private _tooltipId;
     private _highlightedCircleId;
     private _enableComputationOptimization;
     private _firstRenderOptimization;

package/lib/components/AreaChart/AreaChart.base.js

@@ -2,17 +2,15 @@ import { __assign, __extends } from "tslib";
 import * as React from 'react';
 import { max as d3Max, bisector } from 'd3-array';
 import { pointer } from 'd3-selection';
-import { select as d3Select } from 'd3-selection';
 import { area as d3Area, stack as d3Stack, curveMonotoneX as d3CurveBasis, line as d3Line } from 'd3-shape';
-import { classNamesFunction, getId, getRTL, initializeComponentRef, memoizeFunction, } from '@fluentui/react/lib/Utilities';
+import { getId, getRTL, initializeComponentRef, memoizeFunction } from '@fluentui/react/lib/Utilities';
 import { CartesianChart, } from '../../index';
 import { warnDeprecations } from '@fluentui/react/lib/Utilities';
 import { formatDateToLocaleString } from '@fluentui/chart-utilities';
-import { calloutData, getXAxisType, ChartTypes, XAxisTypes, getTypeOfAxis, tooltipOfAxislabels, getNextColor, getColorFromToken, findNumericMinMaxOfY, createNumericYAxis, domainRangeOfNumericForAreaLineScatterCharts, domainRangeOfDateForAreaLineScatterVerticalBarCharts, createStringYAxis, getSecureProps, areArraysEqual, getCurveFactory, findCalloutPoints, } from '../../utilities/index';
+import { calloutData, getXAxisType, ChartTypes, XAxisTypes, getTypeOfAxis, getNextColor, getColorFromToken, findNumericMinMaxOfY, createNumericYAxis, domainRangeOfNumericForAreaLineScatterCharts, domainRangeOfDateForAreaLineScatterVerticalBarCharts, createStringYAxis, getSecureProps, areArraysEqual, getCurveFactory, findCalloutPoints, } from '../../utilities/index';
 import { Legends } from '../Legends/index';
 import { DirectionalHint } from '@fluentui/react/lib/Callout';
 import { exportChartsAsImage } from '../../utilities/image-export-utils';
-var getClassNames = classNamesFunction();
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 var bisect = bisector(function (d) { return d.x; }).left;
 var COMPONENT_NAME = 'AREA CHART';
@@ -536,32 +534,6 @@ var AreaChartBase = /** @class */ (function (_super) {
                 }
             });
             graph.push(React.createElement("line", __assign({ id: _this._verticalLineId, key: _this._verticalLineId, x1: _this.state.lineXValue, y1: 0, x2: _this.state.lineXValue, y2: containerHeight, strokeWidth: 1, strokeDasharray: 5.5, stroke: lineColor, opacity: 0.5, visibility: _this.state.displayOfLine }, getSecureProps(pointLineOptions))));
-            var classNames = getClassNames(_this.props.styles, {
-                theme: _this.props.theme,
-            });
-            // Removing un wanted tooltip div from DOM, when prop not provided.
-            if (!_this.props.showXAxisLablesTooltip) {
-                try {
-                    document.getElementById(_this._tooltipId) && document.getElementById(_this._tooltipId).remove();
-                    // eslint-disable-next-line no-empty
-                }
-                catch (e) { }
-            }
-            // Used to display tooltip at x axis labels.
-            if (!_this.props.wrapXAxisLables && _this.props.showXAxisLablesTooltip) {
-                var xAxisElement = d3Select(xElement).call(xScale);
-                try {
-                    document.getElementById(_this._tooltipId) && document.getElementById(_this._tooltipId).remove();
-                    // eslint-disable-next-line no-empty
-                }
-                catch (e) { }
-                var tooltipProps = {
-                    tooltipCls: classNames.tooltip,
-                    id: _this._tooltipId,
-                    axis: xAxisElement,
-                };
-                xAxisElement && tooltipOfAxislabels(tooltipProps);
-            }
             return graph;
         };
         _this._getOnClickHandler = function (points, index, pointIndex) {
@@ -718,7 +690,6 @@ var AreaChartBase = /** @class */ (function (_super) {
         _this._verticalLineId = getId('verticalLine_');
         _this._circleId = getId('circle');
         _this._rectId = getId('rectangle');
-        _this._tooltipId = getId('AreaChartTooltipID');
         _this._enableComputationOptimization = true;
         _this._firstRenderOptimization = true;
         _this._emptyChartId = getId('_AreaChart_empty');