@fluentui/react-charts 0.0.0-nightly-20251017-2337.1 → 0.0.0-nightly-20251020-0413.1

package/CHANGELOG.md

@@ -1,28 +1,28 @@
 # Change Log - @fluentui/react-charts
 
-This log was last generated on Fri, 17 Oct 2025 23:52:08 GMT and should not be manually modified.
+This log was last generated on Mon, 20 Oct 2025 04:27:57 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly-20251017-2337.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v0.0.0-nightly-20251017-2337.1)
+## [0.0.0-nightly-20251020-0413.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v0.0.0-nightly-20251020-0413.1)
 
-Fri, 17 Oct 2025 23:52:08 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.3.2..@fluentui/react-charts_v0.0.0-nightly-20251017-2337.1)
+Mon, 20 Oct 2025 04:27:57 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-charts_v9.3.2..@fluentui/react-charts_v0.0.0-nightly-20251020-0413.1)
 
 ### Changes
 
 - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
-- Bump @fluentui/react-button to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-overflow to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-popover to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-tabster to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-theme to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-tooltip to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-utilities to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-conformance to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
-- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20251017-2337.1 ([commit](https://github.com/microsoft/fluentui/commit/af8451522711c0f14434675cb846501aa5f5671e) by beachball)
+- Bump @fluentui/react-button to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-overflow to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-popover to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-tabster to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-theme to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-tooltip to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-utilities to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-conformance to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
+- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20251020-0413.1 ([commit](https://github.com/microsoft/fluentui/commit/5e171976b4197ae060d1c5aede00c3b1b621d1f6) by beachball)
 
 ## [9.3.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-charts_v9.3.2)
 

package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js

@@ -492,7 +492,6 @@ export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, col
     ((_input_layout_shapes = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.shapes) !== null && _input_layout_shapes !== void 0 ? _input_layout_shapes : []).filter((shape)=>shape.type === 'line').forEach((shape, shapeIdx)=>{
         var _shape_line;
         const lineColor = (_shape_line = shape.line) === null || _shape_line === void 0 ? void 0 : _shape_line.color;
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const resolveX = (val)=>{
             if (typeof val === 'number' && Array.isArray(xCategories) && xCategories[val] !== undefined) {
                 return xCategories[val];
@@ -501,7 +500,6 @@ export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, col
         };
         const x0Key = resolveX(shape.x0);
         const x1Key = resolveX(shape.x1);
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const resolveY = (val)=>{
             if (shape.yref === 'paper') {
                 if (val === 0) {
@@ -510,7 +508,10 @@ export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, col
                 if (val === 1) {
                     return yMaxValue;
                 }
-                return yMinValue + val * (yMaxValue - yMinValue);
+                if (typeof val === 'number') {
+                    return yMinValue + val * (yMaxValue - yMinValue);
+                }
+                return val;
             }
             return val;
         };
@@ -773,8 +774,29 @@ export const transformPlotlyJsonToLineChartProps = (input, isMultiPlot, colorMap
 export const transformPlotlyJsonToScatterChartProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
     return transformPlotlyJsonToScatterTraceProps(input, isMultiPlot, 'scatter', colorMap, colorwayType, isDarkTheme);
 };
+const mapColorFillBars = (layout)=>{
+    if (!Array.isArray(layout === null || layout === void 0 ? void 0 : layout.shapes)) {
+        return [];
+    }
+    return layout.shapes.filter((shape)=>shape.type === 'rect').map((shape)=>{
+        //colorFillbars doesn't support string dates or categories
+        if (typeof shape.x0 === 'string' || typeof shape.x1 === 'string') {
+            return null;
+        }
+        return {
+            color: shape.fillcolor,
+            data: [
+                {
+                    startX: shape.x0,
+                    endX: shape.x1
+                }
+            ],
+            applyPattern: false
+        };
+    });
+};
 const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_data_, _input_layout, _input_layout1, _input_layout2;
+    var _input_data_, _chartData__data_, _chartData_, _chartData__data_1, _chartData_1, _chartData__data_2, _chartData_2, _chartData__data_3, _chartData_3, _input_layout, _input_layout1, _input_layout2;
     const isScatterMarkers = [
         'text',
         'markers',
@@ -858,21 +880,55 @@ const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, c
             };
         });
     }).flat();
+    const xMinValue = (_chartData_ = chartData[0]) === null || _chartData_ === void 0 ? void 0 : (_chartData__data_ = _chartData_.data[0]) === null || _chartData__data_ === void 0 ? void 0 : _chartData__data_.x;
+    const xMaxValue = (_chartData_1 = chartData[0]) === null || _chartData_1 === void 0 ? void 0 : (_chartData__data_1 = _chartData_1.data[chartData[0].data.length - 1]) === null || _chartData__data_1 === void 0 ? void 0 : _chartData__data_1.x;
+    const yMinValue = (_chartData_2 = chartData[0]) === null || _chartData_2 === void 0 ? void 0 : (_chartData__data_2 = _chartData_2.data[0]) === null || _chartData__data_2 === void 0 ? void 0 : _chartData__data_2.y;
+    const yMaxValue = (_chartData_3 = chartData[0]) === null || _chartData_3 === void 0 ? void 0 : (_chartData__data_3 = _chartData_3.data[chartData[0].data.length - 1]) === null || _chartData__data_3 === void 0 ? void 0 : _chartData__data_3.y;
     var _input_layout_shapes;
     const lineShape = ((_input_layout_shapes = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.shapes) !== null && _input_layout_shapes !== void 0 ? _input_layout_shapes : []).filter((shape)=>shape.type === 'line').map((shape, shapeIdx)=>{
         var _shape_line;
         const lineColor = (_shape_line = shape.line) === null || _shape_line === void 0 ? void 0 : _shape_line.color;
+        const resolveX = (val)=>{
+            if (shape.xref === 'paper') {
+                if (val === 0) {
+                    return xMinValue;
+                }
+                if (val === 1) {
+                    return xMaxValue;
+                }
+                if (typeof val === 'number' && typeof xMinValue === 'number' && typeof xMaxValue === 'number') {
+                    return xMinValue + val * (xMaxValue - xMinValue);
+                }
+                return val;
+            }
+            return val;
+        };
+        const resolveY = (val)=>{
+            if (shape.yref === 'paper') {
+                if (val === 0) {
+                    return yMinValue;
+                }
+                if (val === 1) {
+                    return yMaxValue;
+                }
+                if (typeof val === 'number') {
+                    return yMinValue + val * (yMaxValue - yMinValue);
+                }
+                return val;
+            }
+            return val;
+        };
         var _rgb_formatHex8;
         return {
             legend: `Reference_${shapeIdx}`,
             data: [
                 {
-                    x: shape.x0,
-                    y: shape.y0
+                    x: resolveX(shape.x0),
+                    y: resolveY(shape.y0)
                 },
                 {
-                    x: shape.x1,
-                    y: shape.y1
+                    x: resolveX(shape.x1),
+                    y: resolveY(shape.y1)
                 }
             ],
             color: (_rgb_formatHex8 = rgb(lineColor).formatHex8()) !== null && _rgb_formatHex8 !== void 0 ? _rgb_formatHex8 : lineColor,
@@ -928,7 +984,13 @@ const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, c
             ...isScatterChart ? {
                 showYAxisLablesTooltip: true,
                 ...getAxisCategoryOrderProps(input.data, input.layout)
-            } : {}
+            } : {},
+            ...!isScatterChart && (()=>{
+                const bars = mapColorFillBars(input.layout);
+                return bars && !bars.includes(null) ? {
+                    colorFillBars: bars
+                } : {};
+            })()
         };
     }
 };