@fluentui/react-charts 9.2.2 → 9.2.4

package/CHANGELOG.md

@@ -1,12 +1,84 @@
 # Change Log - @fluentui/react-charts
 
-This log was last generated on Thu, 07 Aug 2025 09:59:01 GMT and should not be manually modified.
+This log was last generated on Mon, 08 Sep 2025 12:42:08 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.2.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v9.2.4)
+
+Mon, 08 Sep 2025 12:42:08 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.2.3..@fluentui/react-charts_v9.2.4)
+
+### Patches
+
+- add support for tickmode in declarative chart ([PR #35121](https://github.com/microsoft/fluentui/pull/35121) by anushgupta@microsoft.com)
+- fix svg background alignment issue ([PR #35070](https://github.com/microsoft/fluentui/pull/35070) by anushgupta@microsoft.com)
+- fix a11y bugs ([PR #35127](https://github.com/microsoft/fluentui/pull/35127) by anushgupta@microsoft.com)
+- refactor common styles to reduce bundle size ([PR #35081](https://github.com/microsoft/fluentui/pull/35081) by anushgupta@microsoft.com)
+- add support for declarative multiplot chart - non cartesian ([PR #35069](https://github.com/microsoft/fluentui/pull/35069) by anushgupta@microsoft.com)
+- reduce component size by removing duplicate code ([PR #35094](https://github.com/microsoft/fluentui/pull/35094) by anushgupta@microsoft.com)
+- change foreground color based on contrast ratio in chart table ([PR #35101](https://github.com/microsoft/fluentui/pull/35101) by anushgupta@microsoft.com)
+- handling y object values for bar chart ([PR #35115](https://github.com/microsoft/fluentui/pull/35115) by anushgupta@microsoft.com)
+- fix text mode for scatter polar ([PR #35104](https://github.com/microsoft/fluentui/pull/35104) by anushgupta@microsoft.com)
+- update segment colors of donut chart ([PR #35122](https://github.com/microsoft/fluentui/pull/35122) by anushgupta@microsoft.com)
+- fix: resolve R19 type issues on refs ([PR #35144](https://github.com/microsoft/fluentui/pull/35144) by martinhochel@microsoft.com)
+- add support for marker texts for modes containing text ([PR #35083](https://github.com/microsoft/fluentui/pull/35083) by anushgupta@microsoft.com)
+- fix v9 charts bugs ([PR #35132](https://github.com/microsoft/fluentui/pull/35132) by anushgupta@microsoft.com)
+- align labels and points according to given directions and rotation in schema for scatter polar ([PR #35098](https://github.com/microsoft/fluentui/pull/35098) by anushgupta@microsoft.com)
+- Add Gantt and Funnel chart in declarative charts ([PR #35123](https://github.com/microsoft/fluentui/pull/35123) by anushgupta@microsoft.com)
+- support string y axis in scatter chart ([PR #35120](https://github.com/microsoft/fluentui/pull/35120) by anushgupta@microsoft.com)
+- respect bargap and width properties in plotly bar traces ([PR #35097](https://github.com/microsoft/fluentui/pull/35097) by anushgupta@microsoft.com)
+- support categorical theta values for scatter polar chart ([PR #35092](https://github.com/microsoft/fluentui/pull/35092) by anushgupta@microsoft.com)
+- support single value callout in linechart ([PR #35084](https://github.com/microsoft/fluentui/pull/35084) by anushgupta@microsoft.com)
+- support additional modes ([PR #35096](https://github.com/microsoft/fluentui/pull/35096) by anushgupta@microsoft.com)
+- support tick formatting from plotly output ([PR #35060](https://github.com/microsoft/fluentui/pull/35060) by anushgupta@microsoft.com)
+- log axis support in linechart and scatter chart ([PR #35112](https://github.com/microsoft/fluentui/pull/35112) by anushgupta@microsoft.com)
+- chore: enforce explicit module boundary types ([PR #35080](https://github.com/microsoft/fluentui/pull/35080) by dmytrokirpa@microsoft.com)
+- Bump @fluentui/react-button to v9.6.6 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.2.0 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-overflow to v9.5.6 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-popover to v9.12.6 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.25.1 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-tabster to v9.26.5 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-tooltip to v9.8.5 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+- Bump @fluentui/react-utilities to v9.24.1 ([commit](https://github.com/microsoft/fluentui/commit/17af11b3c9f4cac2beeaf4342a81c1f08e95fd29) by beachball)
+
+## [9.2.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v9.2.3)
+
+Thu, 21 Aug 2025 12:25:29 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.2.2..@fluentui/react-charts_v9.2.3)
+
+### Patches
+
+- add labels for text+markers ([PR #35025](https://github.com/microsoft/fluentui/pull/35025) by anushgupta@microsoft.com)
+- fix scatter chart bugs ([PR #35047](https://github.com/microsoft/fluentui/pull/35047) by anushgupta@microsoft.com)
+- update validation to tolerate invalid traces ([PR #34998](https://github.com/microsoft/fluentui/pull/34998) by anushgupta@microsoft.com)
+- support for ordering tick labels ([PR #35053](https://github.com/microsoft/fluentui/pull/35053) by anushgupta@microsoft.com)
+- colorscale support for bar charts ([PR #35026](https://github.com/microsoft/fluentui/pull/35026) by anushgupta@microsoft.com)
+- pie chart fix ([PR #35013](https://github.com/microsoft/fluentui/pull/35013) by anushgupta@microsoft.com)
+- use piecolorway for donut chart ([PR #34999](https://github.com/microsoft/fluentui/pull/34999) by anushgupta@microsoft.com)
+- enable scatter chart in v9 declatative ([PR #35036](https://github.com/microsoft/fluentui/pull/35036) by anushgupta@microsoft.com)
+- support for using opacity provided in plotly schema ([PR #35045](https://github.com/microsoft/fluentui/pull/35045) by anushgupta@microsoft.com)
+- add date axis support in vsbc ([PR #35018](https://github.com/microsoft/fluentui/pull/35018) by anushgupta@microsoft.com)
+- add support for multiplot declarative chart ([PR #35038](https://github.com/microsoft/fluentui/pull/35038) by anushgupta@microsoft.com)
+- add styles to tables ([PR #35012](https://github.com/microsoft/fluentui/pull/35012) by anushgupta@microsoft.com)
+- remove duplicated legends in line chart ([PR #34991](https://github.com/microsoft/fluentui/pull/34991) by anushgupta@microsoft.com)
+- fix color issue in gvbc ([PR #35050](https://github.com/microsoft/fluentui/pull/35050) by anushgupta@microsoft.com)
+- support for lines+markers ([PR #34997](https://github.com/microsoft/fluentui/pull/34997) by anushgupta@microsoft.com)
+- use schema colorscale for gvbc ([PR #35011](https://github.com/microsoft/fluentui/pull/35011) by anushgupta@microsoft.com)
+- add support for string y axis in VSBC ([PR #35016](https://github.com/microsoft/fluentui/pull/35016) by anushgupta@microsoft.com)
+- Bump @fluentui/react-button to v9.6.5 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.1.6 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-overflow to v9.5.5 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-popover to v9.12.5 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.25.0 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-tabster to v9.26.4 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-tooltip to v9.8.4 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+- Bump @fluentui/react-utilities to v9.24.0 ([commit](https://github.com/microsoft/fluentui/commit/884c695de4f736774c224fa33b2e410bf42752b0) by beachball)
+
 ## [9.2.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v9.2.2)
 
-Thu, 07 Aug 2025 09:59:01 GMT 
+Thu, 07 Aug 2025 10:03:21 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.2.1..@fluentui/react-charts_v9.2.2)
 
 ### Patches

package/dist/index.d.ts

@@ -1,5 +1,3 @@
-/// <reference types="react" />
-
 import { CurveFactory } from 'd3-shape';
 import type { JSXElement } from '@fluentui/react-utilities';
 import * as React_2 from 'react';
@@ -127,6 +125,54 @@ export declare interface AreaChartStyles extends CartesianChartStyles {
  */
 export declare type AxisCategoryOrder = 'default' | 'data' | string[] | 'category ascending' | 'category descending' | 'total ascending' | 'total descending' | 'min ascending' | 'min descending' | 'max ascending' | 'max descending' | 'sum ascending' | 'sum descending' | 'mean ascending' | 'mean descending' | 'median ascending' | 'median descending';
 
+/**
+ * Configuration options for an axis.
+ *
+ * {@docCategory CartesianChart}
+ */
+export declare type AxisProps = {
+    /**
+     * Defines the step between tick marks on the axis.
+     * Works in combination with `tick0`.
+     * Must be a positive number.
+     *
+     * - **Log scale**:
+     *   - Ticks are placed at `10^(n * tickStep)` where `n` is the tick index.
+     *     - Example: `tickStep = 2` → ticks at 1, 100, 10,000...
+     *     - Example: `tickStep = log10(5)` → ticks at 1, 5, 25, 125...
+     *   - Special format `"L<f>"`: Creates ticks that are linearly spaced in value (not position).
+     *     - Example: `tick0 = 0.1`, `tickStep = "L0.5"` → ticks at 0.1, 0.6, 1.1, 1.6...
+     *
+     * - **Date axis**:
+     *   - Must be in milliseconds.
+     *     - Example: one day = `tickStep = 86400000`.
+     *   - Special format `"M<n>"`: Places ticks every `n` months.
+     *     - Example: `tick0 = "2000-01-15"`, `tickStep = "M3"` → ticks on the 15th every third month.
+     *     - Example: `tickStep = "M48"` → ticks every 4 years.
+     */
+    tickStep?: number | string;
+    /**
+     * Sets the reference value for axis ticks.
+     * Works in combination with `tickStep`.
+     *
+     * - **Log scale**:
+     *   - `tick0` must be given as the logarithm of the reference tick.
+     *     - Example: to align ticks with 100, use `tick0 = 2`.
+     *   - Exception: when `tickStep` uses `"L<f>"`, you can specify the raw value directly.
+     */
+    tick0?: number | Date;
+};
+
+/**
+ * Available scale types for axes.
+ *
+ * - `'default'`: Uses an automatic scale (linear, band, or time) based on axis data type.
+ * - `'log'`: Uses a logarithmic scale. Only supported for numeric axes in LineChart and ScatterChart.
+ *
+ * {@docCategory CartesianChart}
+ */
+export declare type AxisScaleType = 'default' | 'log';
+
 /**
  * {@docCategory ChartData}
  */
@@ -157,6 +203,10 @@ declare interface BaseDataPoint {
      * X axis Accessibility data for callout
      */
     xAxisCalloutAccessibilityData?: AccessibilityProps;
+    /**
+     * Marker size of the points
+     */
+    markerSize?: number;
 }
 
 export declare interface Basestate {
@@ -164,14 +214,14 @@ export declare interface Basestate {
     _height?: number;
     activeLegend?: string;
     color?: string;
-    dataForHoverCard?: number;
+    dataForHoverCard?: number | string;
     isCalloutVisible: boolean;
     isLegendSelected?: boolean;
     isLegendHovered?: boolean;
     refSelected?: any;
     YValueHover?: {
         legend?: string;
-        y?: number;
+        y?: number | string;
         color?: string;
     }[];
     hoverYValue?: string | number | null;
@@ -447,6 +497,36 @@ export declare interface CartesianChartProps {
      * @default 'default'
      */
     yAxisCategoryOrder?: AxisCategoryOrder;
+    /**
+     * Defines the scale type for the x-axis.
+     * @default 'default'
+     */
+    xScaleType?: AxisScaleType;
+    /**
+     * Defines the scale type for the primary y-axis.
+     * @default 'default'
+     */
+    yScaleType?: AxisScaleType;
+    /**
+     * Defines the scale type for the secondary y-axis.
+     * @default 'default'
+     */
+    secondaryYScaleType?: AxisScaleType;
+    /**
+     * Explicit set of tick values for the y-axis.
+     * If provided, these values override automatic tick generation.
+     */
+    yAxisTickValues?: number[] | Date[] | string[];
+    /**
+     * Configuration for the x-axis.
+     * Use this to control `tickStep`, `tick0`, etc.
+     */
+    xAxis?: AxisProps;
+    /**
+     * Configuration for the y-axis.
+     * Use this to control `tickStep`, `tick0`, etc.
+     */
+    yAxis?: AxisProps;
 }
 
 /**
@@ -531,9 +611,13 @@ export declare interface CartesianChartStyles {
      */
     tooltip?: string;
     /**
-     * styles for tooltip
+     * styles for axis title
      */
     axisTitle?: string;
+    /**
+     * styles for axis annotation
+     */
+    axisAnnotation?: string;
     /**
      * Style for the chart Title.
      */
@@ -678,6 +762,10 @@ export declare interface ChartProps {
      * data for the points in the line chart
      */
     lineChartData?: LineChartPoints[];
+    /**
+     * data for the points in the scatter chart
+     */
+    scatterChartData?: ScatterChartPoints[];
     /**
      * data for the points in the line chart
      */
@@ -912,7 +1000,7 @@ export declare interface DeclarativeChartProps extends React_2.RefAttributes<HTM
      * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing
      * the public methods and properties of the component.
      */
-    componentRef?: React_2.RefObject<IDeclarativeChart>;
+    componentRef?: React_2.RefObject<IDeclarativeChart | null>;
     /**
      * Optional prop to specify the colorway type of the chart.
      * - 'default': Use Fluent UI color palette aligning with plotly colorway.
@@ -933,7 +1021,7 @@ export declare const DonutChart: React_2.FunctionComponent<DonutChartProps>;
  * Donut Chart properties.
  * {@docCategory DonutChart}
  */
-export declare interface DonutChartProps {
+export declare interface DonutChartProps extends CartesianChartProps {
     /**
      * Data to render in the chart.
      */
@@ -1047,6 +1135,10 @@ export declare interface DonutChartStyles {
      * Style for the legend container.
      */
     legendContainer: string;
+    /**
+     * styles for axis annotation
+     */
+    axisAnnotation?: string;
     /**
      * Styles for the chart wrapper div
      */
@@ -1559,7 +1651,7 @@ export declare type GaugeChartVariant = 'single-segment' | 'multiple-segments';
  */
 export declare type GaugeValueFormat = 'percentage' | 'fraction';
 
-export declare const getChartValueLabel: (chartValue: number, minValue: number, maxValue: number, chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string) | undefined, forCallout?: boolean) => string;
+export declare const getChartValueLabel: (chartValue: number, minValue: number, maxValue: number, chartValueFormat?: GaugeValueFormat | ((sweepFraction: [number, number]) => string), forCallout?: boolean) => string;
 
 export declare const getColorContrast: (c1: string, c2: string) => number;
 
@@ -2325,7 +2417,7 @@ declare interface IMargins {
     bottom?: number;
 }
 
-declare interface IYAxisParams {
+declare interface IYAxisParams extends AxisProps {
     yMinMaxValues?: {
         startValue: number;
         endValue: number;
@@ -2343,6 +2435,7 @@ declare interface IYAxisParams {
     eventAnnotationProps?: EventsAnnotationProps;
     eventLabelHeight?: number;
     yAxisPadding?: number;
+    tickValues?: Date[] | number[] | string[];
 }
 
 /**
@@ -2619,6 +2712,10 @@ export declare interface LineChartDataPoint extends BaseDataPoint {
      * Dependent value of the data point, rendered along the y-axis.
      */
     y: number;
+    /**
+     * text labels of marker points
+     */
+    text?: string;
 }
 
 /**
@@ -2674,6 +2771,10 @@ export declare interface LineChartLineOptions extends SVGProps<SVGPathElement> {
      * @default 'linear'
      */
     curve?: 'linear' | 'natural' | 'step' | 'stepAfter' | 'stepBefore' | CurveFactory;
+    /**
+     * Defines the mode of points to be rendered.
+     */
+    mode?: 'lines' | 'markers' | 'text' | 'lines+markers' | 'text+markers' | 'text+lines' | 'text+lines+markers' | 'none' | 'gauge' | 'number' | 'delta' | 'number+delta' | 'gauge+number' | 'gauge+number+delta' | 'gauge+delta' | 'markers+text' | 'lines+text' | 'lines+markers+text';
 }
 
 /**
@@ -2780,6 +2881,12 @@ export declare interface LineChartProps extends CartesianChartProps {
      * The prop used to enable the perf optimization
      */
     enablePerfOptimization?: boolean;
+    /**
+     * To enable callout for individual line or complete stack.
+     * @default true
+     * @type \{boolean \}
+     */
+    isCalloutForStack?: boolean;
 }
 
 /**
@@ -2798,6 +2905,10 @@ export declare interface LineChartStyles extends CartesianChartStyles {
      * styles for line border
      */
     lineBorder?: string;
+    /**
+     * styles for marker label
+     */
+    markerLabel?: string;
 }
 
 /**
@@ -2821,7 +2932,7 @@ export declare interface LineDataInVerticalBarChart {
  * {@docCategory ChartData}
  */
 export declare interface LineDataInVerticalStackedBarChart {
-    y: number;
+    y: number | string;
     color: string;
     legend: string;
     /**
@@ -2832,7 +2943,7 @@ export declare interface LineDataInVerticalStackedBarChart {
     /**
      * Data to show in callout
      */
-    data?: number;
+    data?: number | string;
     yAxisCalloutData?: string;
     /**
      * Whether to use the secondary y scale or not
@@ -2989,14 +3100,14 @@ export declare interface ModifiedCartesianChartProps extends CartesianChartProps
     /**
      * Get the min and max values of the y-axis
      */
-    getMinMaxOfYAxis: (points: LineChartPoints[] | HorizontalBarChartWithAxisDataPoint[] | VerticalBarChartDataPoint[] | DataPoint[] | ScatterChartDataPoint[] | GanttChartDataPoint[], yAxisType: YAxisType | undefined, useSecondaryYScale?: boolean) => {
+    getMinMaxOfYAxis: (points: LineChartPoints[] | HorizontalBarChartWithAxisDataPoint[] | VerticalBarChartDataPoint[] | DataPoint[] | ScatterChartPoints[] | GanttChartDataPoint[], yAxisType: YAxisType | undefined, useSecondaryYScale?: boolean) => {
         startValue: number;
         endValue: number;
     };
     /**
      * Create the y-axis
      */
-    createYAxis: (yAxisParams: IYAxisParams, isRtl: boolean, axisData: IAxisData, isIntegralDataset: boolean, chartType: ChartTypes, useSecondaryYScale?: boolean, roundedTicks?: boolean) => ScaleLinear<number, number, never>;
+    createYAxis: (yAxisParams: IYAxisParams, isRtl: boolean, axisData: IAxisData, isIntegralDataset: boolean, chartType: ChartTypes, useSecondaryYScale?: boolean, roundedTicks?: boolean, scaleType?: AxisScaleType) => ScaleLinear<number, number, never>;
     /**
      * Get the domain and range values
      */
@@ -3325,6 +3436,50 @@ export declare interface ScatterChartDataPoint extends BaseDataPoint {
      * Marker size of the points
      */
     markerSize?: number;
+    /**
+     * text labels of marker points
+     */
+    text?: string;
+}
+
+/**
+ * {@docCategory IChartData}
+ */
+export declare interface ScatterChartPoints {
+    /**
+     * Legend text for the datapoint in the chart
+     */
+    legend: string;
+    /**
+     * The shape for the legend
+     * default: show the rect legend
+     */
+    legendShape?: LegendShape;
+    /**
+     * dataPoints for the line chart
+     */
+    data: ScatterChartDataPoint[];
+    /**
+     * color for the legend in the chart
+     */
+    color?: string;
+    /**
+     * opacity for chart fill color
+     */
+    opacity?: number;
+    /**
+     * hide dots for points that are not active
+     */
+    hideNonActiveDots?: boolean;
+    /**
+     * Defines the function that is executed on clicking this legend
+     */
+    onLegendClick?: (selectedLegend: string | null | string[]) => void;
+    /**
+     * Whether to use the secondary y scale or not
+     * False by default.
+     */
+    useSecondaryYScale?: boolean;
 }
 
 /**
@@ -3352,6 +3507,10 @@ export declare interface ScatterChartProps extends CartesianChartProps {
      * The prop used to define the culture to localized the numbers
      */
     culture?: string;
+    /**
+     * The prop used to define the y axis labels tooltip visibility
+     */
+    showYAxisLablesTooltip?: boolean;
 }
 
 /**
@@ -3366,6 +3525,10 @@ export declare interface ScatterChartStyleProps extends CartesianChartStyleProps
  * {@docCategory ScatterChart}
  */
 export declare interface ScatterChartStyles extends CartesianChartStyles {
+    /**
+     * Style for the marker label
+     */
+    markerLabel?: string;
 }
 
 /**
@@ -3794,6 +3957,15 @@ export declare interface VerticalStackedBarChartProps extends CartesianChartProp
      * @default 'default'
      */
     mode?: 'default' | 'plotly';
+    /**
+     *@default false
+     *Used for to elipse y axis labes and show tooltip on x axis labels
+     */
+    showYAxisLablesTooltip?: boolean;
+    /**
+     *@default false
+     *Used for showing complete y axis lables   */
+    showYAxisLables?: boolean;
 }
 
 /**
@@ -3865,7 +4037,7 @@ export declare interface VSChartDataPoint {
     /**
      * data the datapoint in the chart
      */
-    data: number;
+    data: number | string;
     /**
      * Legend text for the datapoint in the chart
      */
@@ -3914,7 +4086,7 @@ declare enum YAxisType {
 
 export declare interface YValueHover {
     legend?: string;
-    y?: number;
+    y?: number | string;
     color?: string;
     data?: string | number;
     shouldDrawBorderBottom?: boolean;

package/lib/components/AreaChart/AreaChart.js

@@ -6,7 +6,7 @@ import { select as d3Select } from 'd3-selection';
 import { tokens } from '@fluentui/react-theme';
 import { area as d3Area, stack as d3Stack, curveMonotoneX as d3CurveBasis, line as d3Line } from 'd3-shape';
 import { CartesianChart } from '../../index';
-import { calloutData, getXAxisType, ChartTypes, XAxisTypes, getTypeOfAxis, tooltipOfAxislabels, getNextColor, getColorFromToken, formatDate, getSecureProps, areArraysEqual, getCurveFactory, find, findNumericMinMaxOfY, createNumericYAxis, domainRangeOfNumericForAreaChart, domainRangeOfDateForAreaLineVerticalBarChart, createStringYAxis, useRtl } from '../../utilities/index';
+import { calloutData, getXAxisType, ChartTypes, XAxisTypes, getTypeOfAxis, tooltipOfAxislabels, getNextColor, getColorFromToken, formatDate, getSecureProps, areArraysEqual, getCurveFactory, find, findNumericMinMaxOfY, createNumericYAxis, domainRangeOfNumericForAreaLineScatterCharts, domainRangeOfDateForAreaLineScatterVerticalBarCharts, createStringYAxis, useRtl } from '../../utilities/index';
 import { useId } from '@fluentui/react-utilities';
 import { Legends } from '../Legends/index';
 import { toImage } from '../../utilities/image-export-utils';
@@ -91,12 +91,15 @@ export const AreaChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
         };
     }, []);
     const classes = useAreaChartStyles(props);
+    function _getMinMaxOfYAxis(points, yAxisType, useSecondaryYScale) {
+        return findNumericMinMaxOfY(points, yAxisType, useSecondaryYScale);
+    }
     function _getDomainNRangeValues(points, margins, width, chartType, isRTL, xAxisType, barWidth, tickValues) {
         let domainNRangeValue;
         if (xAxisType === XAxisTypes.NumericAxis) {
-            domainNRangeValue = domainRangeOfNumericForAreaChart(points, margins, width, isRTL);
+            domainNRangeValue = domainRangeOfNumericForAreaLineScatterCharts(points, margins, width, isRTL);
         } else if (xAxisType === XAxisTypes.DateAxis) {
-            domainNRangeValue = domainRangeOfDateForAreaLineVerticalBarChart(points, margins, width, isRTL, tickValues, chartType, barWidth);
+            domainNRangeValue = domainRangeOfDateForAreaLineScatterVerticalBarCharts(points, margins, width, isRTL, tickValues, chartType, barWidth);
         } else {
             domainNRangeValue = {
                 dStartValue: 0,
@@ -788,7 +791,7 @@ export const AreaChart = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
             createStringYAxis: createStringYAxis,
             getmargins: _getMargins,
             onChartMouseLeave: _handleChartMouseLeave,
-            getMinMaxOfYAxis: findNumericMinMaxOfY,
+            getMinMaxOfYAxis: _getMinMaxOfYAxis,
             enableFirstRenderOptimization: props.enablePerfOptimization && _firstRenderOptimization,
             componentRef: cartesianChartRef,
             /* eslint-disable react/jsx-no-bind */ // eslint-disable-next-line react/no-children-prop, @typescript-eslint/no-shadow