@fluentui/react-charting 5.24.3 → 5.24.4

package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js

@@ -1,4 +1,4 @@
-define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../../utilities/colors", "../GaugeChart/index", "../../utilities/utilities", "@fluentui/chart-utilities", "d3-shape", "./PlotlyColorAdapter"], function (require, exports, tslib_1, d3_array_1, d3_scale_1, d3_format_1, colors_1, index_1, utilities_1, chart_utilities_1, d3_shape_1, PlotlyColorAdapter_1) {
+define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../../utilities/colors", "../GaugeChart/index", "../../utilities/utilities", "@fluentui/chart-utilities", "d3-shape", "./PlotlyColorAdapter", "d3-color"], function (require, exports, tslib_1, d3_array_1, d3_scale_1, d3_format_1, colors_1, index_1, utilities_1, chart_utilities_1, d3_shape_1, PlotlyColorAdapter_1, d3_color_1) {
     "use strict";
     Object.defineProperty(exports, "__esModule", { value: true });
     exports.getGridProperties = exports.getValidXYRanges = exports.getNumberAtIndexOrDefault = exports.getAllupLegendsProps = exports.findArrayAttributes = exports.projectPolarToCartesian = exports.transformPlotlyJsonToChartTableProps = exports.transformPlotlyJsonToGaugeProps = exports.transformPlotlyJsonToSankeyProps = exports.transformPlotlyJsonToHeatmapProps = exports.transformPlotlyJsonToHorizontalBarWithAxisProps = exports.transformPlotlyJsonToScatterChartProps = exports.transformPlotlyJsonToLineChartProps = exports.transformPlotlyJsonToAreaChartProps = exports.transformPlotlyJsonToVBCProps = exports.transformPlotlyJsonToGVBCProps = exports.transformPlotlyJsonToVSBCProps = exports.transformPlotlyJsonToDonutProps = exports.resolveXAxisPoint = exports._getGaugeAxisColor = exports.correctYearMonth = void 0;
@@ -240,7 +240,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                 var rangeXValues = series.x.slice(rangeStart, rangeEnd);
                 var rangeYValues = series.y.slice(rangeStart, rangeEnd);
                 rangeXValues.forEach(function (x, index2) {
-                    var _a, _b, _c, _d;
+                    var _a, _b, _c, _d, _e, _f;
                     if (!mapXToDataPoints[x]) {
                         mapXToDataPoints[x] = {
                             xAxisPoint: (0, exports.resolveXAxisPoint)(x, isXYearCategory, isXString, isXDate, isXNumber),
@@ -255,12 +255,13 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                             ? (_c = (_b = series.marker) === null || _b === void 0 ? void 0 : _b.color) === null || _c === void 0 ? void 0 : _c[index2 % ((_d = series.marker) === null || _d === void 0 ? void 0 : _d.color).length]
                             : 0)
                         : (0, PlotlyColorAdapter_1.resolveColor)(extractedBarColors, index2, legend, colorMap, isDarkTheme);
+                    var opacity = (0, PlotlyColorAdapter_1.getOpacity)(series, index2);
                     var yVal = rangeYValues[index2];
                     if (series.type === 'bar') {
                         mapXToDataPoints[x].chartData.push({
                             legend: legend,
                             data: yVal,
-                            color: color,
+                            color: (_e = (0, d3_color_1.rgb)(color).copy({ opacity: opacity }).formatHex8()) !== null && _e !== void 0 ? _e : color,
                         });
                         if (typeof yVal === 'number') {
                             yMaxValue = Math.max(yMaxValue, yVal);
@@ -274,7 +275,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                             legend: legend + (validXYRanges.length > 1 ? ".".concat(rangeIdx + 1) : ''),
                             legendShape: legendShape,
                             y: yVal,
-                            color: lineColor,
+                            color: (_f = (0, d3_color_1.rgb)(lineColor).copy({ opacity: opacity }).formatHex8()) !== null && _f !== void 0 ? _f : color,
                             lineOptions: tslib_1.__assign(tslib_1.__assign({}, (lineOptions !== null && lineOptions !== void 0 ? lineOptions : {})), { mode: series.mode }),
                             useSecondaryYScale: usesSecondaryYScale(series, input.layout),
                         });
@@ -287,7 +288,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
             });
         });
         var _e = getTitles(input.layout), chartTitle = _e.chartTitle, xAxisTitle = _e.xAxisTitle, yAxisTitle = _e.yAxisTitle;
-        return tslib_1.__assign(tslib_1.__assign({ data: Object.values(mapXToDataPoints), width: (_a = input.layout) === null || _a === void 0 ? void 0 : _a.width, height: (_c = (_b = input.layout) === null || _b === void 0 ? void 0 : _b.height) !== null && _c !== void 0 ? _c : 350, barWidth: 'auto', yMaxValue: yMaxValue, yMinValue: yMinValue, chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, mode: 'plotly' }, secondaryYAxisValues), { hideTickOverlap: true, hideLegend: hideLegend, roundCorners: true, supportNegativeData: true, barGapMax: 2, showYAxisLables: true, noOfCharsToTruncate: 20, showYAxisLablesTooltip: true });
+        return tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ data: Object.values(mapXToDataPoints), width: (_a = input.layout) === null || _a === void 0 ? void 0 : _a.width, height: (_c = (_b = input.layout) === null || _b === void 0 ? void 0 : _b.height) !== null && _c !== void 0 ? _c : 350, barWidth: 'auto', yMaxValue: yMaxValue, yMinValue: yMinValue, chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, mode: 'plotly' }, secondaryYAxisValues), { hideTickOverlap: true, hideLegend: hideLegend, roundCorners: true, supportNegativeData: true, barGapMax: 2, showYAxisLables: true, noOfCharsToTruncate: 20, showYAxisLablesTooltip: true }), getAxisCategoryOrderProps(input.data, input.layout));
     };
     exports.transformPlotlyJsonToVSBCProps = transformPlotlyJsonToVSBCProps;
     var createColorScale = function (layout, series) {
@@ -323,7 +324,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
             // extract colors for each series only once
             var extractedColors = (0, PlotlyColorAdapter_1.extractColor)((_k = (_j = (_h = input.layout) === null || _h === void 0 ? void 0 : _h.template) === null || _j === void 0 ? void 0 : _j.layout) === null || _k === void 0 ? void 0 : _k.colorway, colorwayType, (_l = series.marker) === null || _l === void 0 ? void 0 : _l.color, colorMap, isDarkTheme);
             (_m = series.x) === null || _m === void 0 ? void 0 : _m.forEach(function (x, xIndex) {
-                var _a, _b, _c, _d, _e;
+                var _a, _b, _c, _d, _e, _f;
                 if ((0, chart_utilities_1.isInvalidValue)(x) || (0, chart_utilities_1.isInvalidValue)((_a = series.y) === null || _a === void 0 ? void 0 : _a[xIndex])) {
                     return;
                 }
@@ -337,12 +338,13 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                         ? colorScale((0, chart_utilities_1.isArrayOrTypedArray)((_b = series.marker) === null || _b === void 0 ? void 0 : _b.color)
                             ? (_d = (_c = series.marker) === null || _c === void 0 ? void 0 : _c.color) === null || _d === void 0 ? void 0 : _d[xIndex % ((_e = series.marker) === null || _e === void 0 ? void 0 : _e.color).length]
                             : 0)
-                        : (0, PlotlyColorAdapter_1.resolveColor)(extractedColors, index1, legend, colorMap, isDarkTheme);
+                        : (0, PlotlyColorAdapter_1.resolveColor)(extractedColors, xIndex, legend, colorMap, isDarkTheme);
+                    var opacity = (0, PlotlyColorAdapter_1.getOpacity)(series, xIndex);
                     mapXToDataPoints[x].series.push({
                         key: legend,
                         data: series.y[xIndex],
                         xAxisCalloutData: x,
-                        color: color,
+                        color: (_f = (0, d3_color_1.rgb)(color).copy({ opacity: opacity }).formatHex8()) !== null && _f !== void 0 ? _f : color,
                         legend: legend,
                         useSecondaryYScale: usesSecondaryYScale(series, input.layout),
                     });
@@ -350,7 +352,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
             });
         });
         var _e = getTitles(input.layout), chartTitle = _e.chartTitle, xAxisTitle = _e.xAxisTitle, yAxisTitle = _e.yAxisTitle;
-        return tslib_1.__assign(tslib_1.__assign({ data: Object.values(mapXToDataPoints), width: (_a = input.layout) === null || _a === void 0 ? void 0 : _a.width, height: (_c = (_b = input.layout) === null || _b === void 0 ? void 0 : _b.height) !== null && _c !== void 0 ? _c : 350, barwidth: 'auto', chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, mode: 'plotly' }, secondaryYAxisValues), { hideTickOverlap: true, hideLegend: hideLegend, roundCorners: true });
+        return tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ data: Object.values(mapXToDataPoints), width: (_a = input.layout) === null || _a === void 0 ? void 0 : _a.width, height: (_c = (_b = input.layout) === null || _b === void 0 ? void 0 : _b.height) !== null && _c !== void 0 ? _c : 350, barwidth: 'auto', chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, mode: 'plotly' }, secondaryYAxisValues), { hideTickOverlap: true, hideLegend: hideLegend, roundCorners: true }), getAxisCategoryOrderProps(input.data, input.layout));
     };
     exports.transformPlotlyJsonToGVBCProps = transformPlotlyJsonToGVBCProps;
     var transformPlotlyJsonToVBCProps = function (input, isMultiPlot, colorMap, colorwayType, isDarkTheme) {
@@ -399,7 +401,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                 return yVal;
             });
             xBins.forEach(function (bin, index) {
-                var _a, _b, _c, _d;
+                var _a, _b, _c, _d, _e;
                 var legend = legends[seriesIdx];
                 // resolve color for each legend's bars from the colorscale or extracted colors
                 var color = colorScale
@@ -407,27 +409,15 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                         ? (_c = (_b = series.marker) === null || _b === void 0 ? void 0 : _b.color) === null || _c === void 0 ? void 0 : _c[index % ((_d = series.marker) === null || _d === void 0 ? void 0 : _d.color).length]
                         : 0)
                     : (0, PlotlyColorAdapter_1.resolveColor)(extractedColors, index, legend, colorMap, isDarkTheme);
+                var opacity = (0, PlotlyColorAdapter_1.getOpacity)(series, index);
                 var yVal = calculateHistNorm(series.histnorm, y[index], total, isXString ? bin.length : getBinSize(bin));
-                vbcData.push(tslib_1.__assign({ x: isXString ? bin.join(', ') : getBinCenter(bin), y: yVal, legend: legend, color: color }, (isXString
+                vbcData.push(tslib_1.__assign({ x: isXString ? bin.join(', ') : getBinCenter(bin), y: yVal, legend: legend, color: (_e = (0, d3_color_1.rgb)(color).copy({ opacity: opacity }).formatHex8()) !== null && _e !== void 0 ? _e : color }, (isXString
                     ? {}
                     : { xAxisCalloutData: "[".concat(bin.x0, " - ").concat(bin.x1, ")") })));
             });
         });
         var _e = getTitles(input.layout), chartTitle = _e.chartTitle, xAxisTitle = _e.xAxisTitle, yAxisTitle = _e.yAxisTitle;
-        return {
-            data: vbcData,
-            width: (_a = input.layout) === null || _a === void 0 ? void 0 : _a.width,
-            height: (_c = (_b = input.layout) === null || _b === void 0 ? void 0 : _b.height) !== null && _c !== void 0 ? _c : 350,
-            supportNegativeData: true,
-            chartTitle: chartTitle,
-            xAxisTitle: xAxisTitle,
-            yAxisTitle: yAxisTitle,
-            mode: 'histogram',
-            hideTickOverlap: true,
-            maxBarWidth: 50,
-            hideLegend: hideLegend,
-            roundCorners: true,
-        };
+        return tslib_1.__assign({ data: vbcData, width: (_a = input.layout) === null || _a === void 0 ? void 0 : _a.width, height: (_c = (_b = input.layout) === null || _b === void 0 ? void 0 : _b.height) !== null && _c !== void 0 ? _c : 350, supportNegativeData: true, chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, mode: 'histogram', hideTickOverlap: true, maxBarWidth: 50, hideLegend: hideLegend, roundCorners: true }, getAxisCategoryOrderProps(input.data, input.layout));
     };
     exports.transformPlotlyJsonToVBCProps = transformPlotlyJsonToVBCProps;
     var transformPlotlyJsonToAreaChartProps = function (input, isMultiPlot, colorMap, colorwayType, isDarkTheme) {
@@ -445,6 +435,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
     var transformPlotlyJsonToScatterTraceProps = function (input, isMultiPlot, chartType, colorMap, colorwayType, isDarkTheme) {
         var _a, _b, _c, _d, _e, _f, _g;
         var isScatterMarkers = [
+            'markers',
             'text+markers',
             'markers+text',
             'lines+markers',
@@ -474,12 +465,13 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
             var legend = legends[index];
             // resolve color for each legend's lines from the extracted colors
             var seriesColor = (0, PlotlyColorAdapter_1.resolveColor)(extractedColors, index, legend, colorMap, isDarkTheme);
+            var seriesOpacity = (0, PlotlyColorAdapter_1.getOpacity)(series, index);
             mode = series.fill === 'tozeroy' ? 'tozeroy' : 'tonexty';
             var lineOptions = getLineOptions(series.line);
             var legendShape = getLegendShape(series);
             var validXYRanges = (0, exports.getValidXYRanges)(series);
             return validXYRanges.map(function (_a, rangeIdx) {
-                var _b;
+                var _b, _c;
                 var rangeStart = _a[0], rangeEnd = _a[1];
                 var rangeXValues = xValues.slice(rangeStart, rangeEnd);
                 var rangeYValues = series.y.slice(rangeStart, rangeEnd);
@@ -498,7 +490,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                                 ? { markerSize: series.marker.size }
                                 : {})), (textValues ? { text: textValues[i] } : {})));
                     }),
-                    color: seriesColor,
+                    color: (_c = (0, d3_color_1.rgb)(seriesColor).copy({ opacity: seriesOpacity }).formatHex8()) !== null && _c !== void 0 ? _c : seriesColor,
                     lineOptions: tslib_1.__assign(tslib_1.__assign({}, (lineOptions !== null && lineOptions !== void 0 ? lineOptions : {})), { mode: series.mode }),
                     useSecondaryYScale: usesSecondaryYScale(series, input.layout),
                 };
@@ -541,7 +533,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
             var legend = legends[index];
             return series.y
                 .map(function (yValue, i) {
-                var _a, _b, _c, _d, _e;
+                var _a, _b, _c, _d, _e, _f;
                 if ((0, chart_utilities_1.isInvalidValue)((_a = series.x) === null || _a === void 0 ? void 0 : _a[i]) || (0, chart_utilities_1.isInvalidValue)(yValue)) {
                     return null;
                 }
@@ -551,19 +543,17 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
                         ? (_d = (_c = series.marker) === null || _c === void 0 ? void 0 : _c.color) === null || _d === void 0 ? void 0 : _d[i % ((_e = series.marker) === null || _e === void 0 ? void 0 : _e.color).length]
                         : 0)
                     : (0, PlotlyColorAdapter_1.resolveColor)(extractedColors, i, legend, colorMap, isDarkTheme);
+                var opacity = (0, PlotlyColorAdapter_1.getOpacity)(series, i);
                 return {
                     x: series.x[i],
                     y: yValue,
                     legend: legend,
-                    color: color,
+                    color: (_f = (0, d3_color_1.rgb)(color).copy({ opacity: opacity }).formatHex8()) !== null && _f !== void 0 ? _f : color,
                 };
             })
                 .filter(function (point) { return point !== null; });
         })
-            .reverse()
-            .flat()
-            //reversing the order to invert the Y bars order as required by plotly.
-            .reverse();
+            .flat();
         var chartHeight = (_b = (_a = input.layout) === null || _a === void 0 ? void 0 : _a.height) !== null && _b !== void 0 ? _b : 450;
         var margin = (_e = (_d = (_c = input.layout) === null || _c === void 0 ? void 0 : _c.margin) === null || _d === void 0 ? void 0 : _d.l) !== null && _e !== void 0 ? _e : 0;
         var padding = (_h = (_g = (_f = input.layout) === null || _f === void 0 ? void 0 : _f.margin) === null || _g === void 0 ? void 0 : _g.pad) !== null && _h !== void 0 ? _h : 0;
@@ -573,24 +563,9 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
         var gapFactor = 1 / (1 + scalingFactor * numberOfRows);
         var barHeight = availableHeight / (numberOfRows * (1 + gapFactor));
         var _t = getTitles(input.layout), chartTitle = _t.chartTitle, xAxisTitle = _t.xAxisTitle, yAxisTitle = _t.yAxisTitle;
-        return {
-            data: chartData,
-            chartTitle: chartTitle,
-            xAxisTitle: xAxisTitle,
-            yAxisTitle: yAxisTitle,
-            secondaryYAxistitle: typeof ((_k = (_j = input.layout) === null || _j === void 0 ? void 0 : _j.yaxis2) === null || _k === void 0 ? void 0 : _k.title) === 'string'
+        return tslib_1.__assign({ data: chartData, chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, secondaryYAxistitle: typeof ((_k = (_j = input.layout) === null || _j === void 0 ? void 0 : _j.yaxis2) === null || _k === void 0 ? void 0 : _k.title) === 'string'
                 ? (_m = (_l = input.layout) === null || _l === void 0 ? void 0 : _l.yaxis2) === null || _m === void 0 ? void 0 : _m.title
-                : ((_q = (_p = (_o = input.layout) === null || _o === void 0 ? void 0 : _o.yaxis2) === null || _p === void 0 ? void 0 : _p.title) === null || _q === void 0 ? void 0 : _q.text) || '',
-            barHeight: barHeight,
-            showYAxisLables: true,
-            height: chartHeight,
-            width: (_r = input.layout) === null || _r === void 0 ? void 0 : _r.width,
-            hideTickOverlap: true,
-            hideLegend: hideLegend,
-            noOfCharsToTruncate: 20,
-            showYAxisLablesTooltip: true,
-            roundCorners: true,
-        };
+                : ((_q = (_p = (_o = input.layout) === null || _o === void 0 ? void 0 : _o.yaxis2) === null || _p === void 0 ? void 0 : _p.title) === null || _q === void 0 ? void 0 : _q.text) || '', barHeight: barHeight, showYAxisLables: true, height: chartHeight, width: (_r = input.layout) === null || _r === void 0 ? void 0 : _r.width, hideTickOverlap: true, hideLegend: hideLegend, noOfCharsToTruncate: 20, showYAxisLablesTooltip: true, roundCorners: true }, getAxisCategoryOrderProps(input.data, input.layout));
     };
     exports.transformPlotlyJsonToHorizontalBarWithAxisProps = transformPlotlyJsonToHorizontalBarWithAxisProps;
     var transformPlotlyJsonToHeatmapProps = function (input, isMultiPlot, colorMap, colorwayType, isDarkTheme) {
@@ -706,22 +681,7 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
             ? colorscale.map(function (arr) { return arr[1]; })
             : defaultRange;
         var _9 = getTitles(input.layout), chartTitle = _9.chartTitle, xAxisTitle = _9.xAxisTitle, yAxisTitle = _9.yAxisTitle;
-        return {
-            data: [heatmapData],
-            domainValuesForColorScale: domainValuesForColorScale,
-            rangeValuesForColorScale: rangeValuesForColorScale,
-            hideLegend: true,
-            showYAxisLables: true,
-            chartTitle: chartTitle,
-            xAxisTitle: xAxisTitle,
-            yAxisTitle: yAxisTitle,
-            sortOrder: 'none',
-            width: (_6 = input.layout) === null || _6 === void 0 ? void 0 : _6.width,
-            height: (_8 = (_7 = input.layout) === null || _7 === void 0 ? void 0 : _7.height) !== null && _8 !== void 0 ? _8 : 350,
-            hideTickOverlap: true,
-            noOfCharsToTruncate: 20,
-            showYAxisLablesTooltip: true,
-        };
+        return tslib_1.__assign({ data: [heatmapData], domainValuesForColorScale: domainValuesForColorScale, rangeValuesForColorScale: rangeValuesForColorScale, hideLegend: true, showYAxisLables: true, chartTitle: chartTitle, xAxisTitle: xAxisTitle, yAxisTitle: yAxisTitle, sortOrder: 'none', width: (_6 = input.layout) === null || _6 === void 0 ? void 0 : _6.width, height: (_8 = (_7 = input.layout) === null || _7 === void 0 ? void 0 : _7.height) !== null && _8 !== void 0 ? _8 : 350, hideTickOverlap: true, noOfCharsToTruncate: 20, showYAxisLablesTooltip: true }, getAxisCategoryOrderProps([firstData], input.layout));
     };
     exports.transformPlotlyJsonToHeatmapProps = transformPlotlyJsonToHeatmapProps;
     var transformPlotlyJsonToSankeyProps = function (input, isMultiPlot, colorMap, colorwayType, isDarkTheme) {
@@ -1415,5 +1375,45 @@ define(["require", "exports", "tslib", "d3-array", "d3-scale", "d3-format", "../
         };
     };
     exports.getGridProperties = getGridProperties;
+    /**
+     * @see {@link https://github.com/plotly/plotly.js/blob/master/src/plots/cartesian/category_order_defaults.js#L50}
+     */
+    var getAxisCategoryOrderProps = function (data, layout) {
+        var result = {};
+        var axesById = {
+            x: layout === null || layout === void 0 ? void 0 : layout.xaxis,
+            y: layout === null || layout === void 0 ? void 0 : layout.yaxis,
+        };
+        Object.keys(axesById).forEach(function (axId) {
+            var ax = axesById[axId];
+            var axLetter = axId[0];
+            var propName = "".concat(axLetter, "AxisCategoryOrder");
+            var values = [];
+            data.forEach(function (series) {
+                var _a;
+                (_a = series[axLetter]) === null || _a === void 0 ? void 0 : _a.forEach(function (val) {
+                    if (!(0, chart_utilities_1.isInvalidValue)(val)) {
+                        values.push(val);
+                    }
+                });
+            });
+            var isAxisTypeCategory = (ax === null || ax === void 0 ? void 0 : ax.type) === 'category' || ((0, chart_utilities_1.isStringArray)(values) && !(0, chart_utilities_1.isNumberArray)(values) && !(0, chart_utilities_1.isDateArray)(values));
+            if (!isAxisTypeCategory) {
+                return;
+            }
+            var isValidArray = (0, chart_utilities_1.isArrayOrTypedArray)(ax === null || ax === void 0 ? void 0 : ax.categoryarray) && ax.categoryarray.length > 0;
+            if (isValidArray && (!(ax === null || ax === void 0 ? void 0 : ax.categoryorder) || ax.categoryorder === 'array')) {
+                result[propName] = ax.categoryarray;
+                return;
+            }
+            if (!(ax === null || ax === void 0 ? void 0 : ax.categoryorder) || ax.categoryorder === 'trace' || ax.categoryorder === 'array') {
+                var categoriesInTraceOrder = Array.from(new Set(values));
+                result[propName] = categoriesInTraceOrder;
+                return;
+            }
+            result[propName] = ax.categoryorder;
+        });
+        return result;
+    };
 });
 //# sourceMappingURL=PlotlySchemaAdapter.js.map