@fluentui/react-charts 9.3.21 → 9.74.3-experimental.esm.20260709-49ee7a20cf.0

package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js

@@ -1,3490 +0,0 @@
-'use client';
-import { bin as d3Bin, extent as d3Extent, sum as d3Sum, min as d3Min, max as d3Max, range as d3Range } from 'd3-array';
-import { scaleLinear as d3ScaleLinear } from 'd3-scale';
-import { format as d3Format } from 'd3-format';
-import { DataVizPalette, getColorFromToken } from '../../utilities/colors';
-import { DEFAULT_DATE_STRING, findNumericMinMaxOfY, formatScientificLimitWidth, MIN_DONUT_RADIUS, calculatePrecision, precisionRound } from '../../utilities/utilities';
-import { isArrayOrTypedArray, isDate, isDateArray, isNumberArray, isStringArray, isYearArray, isInvalidValue, formatToLocaleString, isNumber, isObjectArray, getAxisIds, getAxisKey, isScatterAreaChart } from '@fluentui/chart-utilities';
-import { curveCardinal as d3CurveCardinal } from 'd3-shape';
-import { getOpacity, extractColor, resolveColor, createColorScale } from './PlotlyColorAdapter';
-import { rgb } from 'd3-color';
-export const NON_PLOT_KEY_PREFIX = 'nonplot_';
-export const SINGLE_REPEAT = 'repeat(1, 1fr)';
-const dashOptions = {
-    dot: {
-        strokeDasharray: '1, 5',
-        strokeLinecap: 'round',
-        strokeWidth: '2',
-        lineBorderWidth: '4'
-    },
-    dash: {
-        strokeDasharray: '5, 5',
-        strokeLinecap: 'butt',
-        strokeWidth: '2',
-        lineBorderWidth: '4'
-    },
-    longdash: {
-        strokeDasharray: '10, 5',
-        strokeLinecap: 'butt',
-        strokeWidth: '2',
-        lineBorderWidth: '4'
-    },
-    dashdot: {
-        strokeDasharray: '5, 5, 1, 5',
-        strokeLinecap: 'butt',
-        strokeWidth: '2',
-        lineBorderWidth: '4'
-    },
-    longdashdot: {
-        strokeDasharray: '10, 5, 1, 5',
-        strokeLinecap: 'butt',
-        strokeWidth: '2',
-        lineBorderWidth: '4'
-    },
-    solid: {
-        strokeDasharray: '0',
-        strokeLinecap: 'butt',
-        strokeWidth: '2',
-        lineBorderWidth: '4'
-    }
-};
-function getTitles(layout) {
-    var _layout_xaxis, _layout_xaxis1, _layout_xaxis_title, _layout_xaxis2, _layout_yaxis, _layout_yaxis1, _layout_yaxis_title, _layout_yaxis2;
-    const titleObj = layout === null || layout === void 0 ? void 0 : layout.title;
-    var _titleObj_text;
-    const chartTitle = typeof titleObj === 'string' ? titleObj : (_titleObj_text = titleObj === null || titleObj === void 0 ? void 0 : titleObj.text) !== null && _titleObj_text !== void 0 ? _titleObj_text : '';
-    const titleFont = typeof titleObj === 'object' ? titleObj === null || titleObj === void 0 ? void 0 : titleObj.font : undefined;
-    const titleXAnchor = typeof titleObj === 'object' ? titleObj === null || titleObj === void 0 ? void 0 : titleObj.xanchor : undefined;
-    const titleYAnchor = typeof titleObj === 'object' ? titleObj === null || titleObj === void 0 ? void 0 : titleObj.yanchor : undefined;
-    const titlePad = typeof titleObj === 'object' ? titleObj === null || titleObj === void 0 ? void 0 : titleObj.pad : undefined;
-    const titleStyles = {
-        ...titleFont ? {
-            titleFont
-        } : {},
-        ...titleXAnchor ? {
-            titleXAnchor
-        } : {},
-        ...titleYAnchor ? {
-            titleYAnchor
-        } : {},
-        ...titlePad ? {
-            titlePad
-        } : {}
-    };
-    var _layout_xaxis_title_text, _layout_yaxis_title_text;
-    const titles = {
-        chartTitle,
-        ...Object.keys(titleStyles).length > 0 ? {
-            titleStyles
-        } : {},
-        xAxisTitle: typeof (layout === null || layout === void 0 ? void 0 : (_layout_xaxis = layout.xaxis) === null || _layout_xaxis === void 0 ? void 0 : _layout_xaxis.title) === 'string' ? layout === null || layout === void 0 ? void 0 : (_layout_xaxis1 = layout.xaxis) === null || _layout_xaxis1 === void 0 ? void 0 : _layout_xaxis1.title : (_layout_xaxis_title_text = layout === null || layout === void 0 ? void 0 : (_layout_xaxis2 = layout.xaxis) === null || _layout_xaxis2 === void 0 ? void 0 : (_layout_xaxis_title = _layout_xaxis2.title) === null || _layout_xaxis_title === void 0 ? void 0 : _layout_xaxis_title.text) !== null && _layout_xaxis_title_text !== void 0 ? _layout_xaxis_title_text : '',
-        yAxisTitle: typeof (layout === null || layout === void 0 ? void 0 : (_layout_yaxis = layout.yaxis) === null || _layout_yaxis === void 0 ? void 0 : _layout_yaxis.title) === 'string' ? layout === null || layout === void 0 ? void 0 : (_layout_yaxis1 = layout.yaxis) === null || _layout_yaxis1 === void 0 ? void 0 : _layout_yaxis1.title : (_layout_yaxis_title_text = layout === null || layout === void 0 ? void 0 : (_layout_yaxis2 = layout.yaxis) === null || _layout_yaxis2 === void 0 ? void 0 : (_layout_yaxis_title = _layout_yaxis2.title) === null || _layout_yaxis_title === void 0 ? void 0 : _layout_yaxis_title.text) !== null && _layout_yaxis_title_text !== void 0 ? _layout_yaxis_title_text : '',
-        xAxisAnnotation: chartTitle
-    };
-    return titles;
-}
-const getXAxisTickFormat = (series, layout)=>{
-    const xAxis = getXAxisProperties(series, layout);
-    if (xAxis === null || xAxis === void 0 ? void 0 : xAxis.tickformat) {
-        return {
-            tickFormat: xAxis === null || xAxis === void 0 ? void 0 : xAxis.tickformat
-        };
-    }
-    return {};
-};
-const getYAxisTickFormat = (series, layout)=>{
-    const yAxis = getYAxisProperties(series, layout);
-    if (yAxis === null || yAxis === void 0 ? void 0 : yAxis.tickformat) {
-        return {
-            yAxisTickFormat: d3Format(yAxis === null || yAxis === void 0 ? void 0 : yAxis.tickformat)
-        };
-    }
-    return {};
-};
-const getYMinMaxValues = (series, layout)=>{
-    var _getYAxisProperties;
-    const range = (_getYAxisProperties = getYAxisProperties(series, layout)) === null || _getYAxisProperties === void 0 ? void 0 : _getYAxisProperties.range;
-    if (range && range.length === 2) {
-        return {
-            yMinValue: range[0],
-            yMaxValue: range[1]
-        };
-    }
-    return {};
-};
-const getXMinMaxValues = (series, layout)=>{
-    var _getXAxisProperties;
-    const range = (_getXAxisProperties = getXAxisProperties(series, layout)) === null || _getXAxisProperties === void 0 ? void 0 : _getXAxisProperties.range;
-    if (range && range.length === 2) {
-        return {
-            xMinValue: range[0],
-            xMaxValue: range[1],
-            showRoundOffXTickValues: false
-        };
-    }
-    return {};
-};
-const getYAxisProperties = (series, layout)=>{
-    return layout === null || layout === void 0 ? void 0 : layout.yaxis;
-};
-const getXAxisProperties = (series, layout)=>{
-    return layout === null || layout === void 0 ? void 0 : layout.xaxis;
-};
-const getFormattedCalloutYData = (yVal, yAxisFormat)=>{
-    if (typeof (yAxisFormat === null || yAxisFormat === void 0 ? void 0 : yAxisFormat.yAxisTickFormat) === 'function' && typeof yVal === 'number') {
-        return yAxisFormat.yAxisTickFormat(yVal);
-    }
-    return formatToLocaleString(yVal);
-};
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const correctYearMonth = (xValues)=>{
-    const presentYear = new Date().getFullYear();
-    if (xValues.length > 0 && Array.isArray(xValues[0])) {
-        throw new Error('updateXValues:: 2D array not supported');
-    }
-    const dates = xValues.map((possiblyMonthValue)=>{
-        const parsedDate = `${possiblyMonthValue} 01, ${presentYear}`;
-        return isDate(parsedDate) ? new Date(parsedDate) : null;
-    });
-    const filteredDateIndexPairs = dates.map((date, index)=>[
-            date,
-            index
-        ]).filter(([date])=>date !== null);
-    for(let i = filteredDateIndexPairs.length - 1; i > 0; i--){
-        const currentDate = filteredDateIndexPairs[i][0];
-        const previousDate = filteredDateIndexPairs[i - 1][0];
-        const currentMonth = currentDate.getMonth();
-        const previousMonth = previousDate.getMonth();
-        const currentYear = currentDate.getFullYear();
-        const previousYear = previousDate.getFullYear();
-        if (previousMonth >= currentMonth) {
-            filteredDateIndexPairs[i - 1][0].setFullYear(currentYear - 1);
-        } else if (previousYear > currentYear) {
-            filteredDateIndexPairs[i - 1][0].setFullYear(currentYear);
-        }
-        dates[filteredDateIndexPairs[i - 1][1]] = filteredDateIndexPairs[i - 1][0];
-    }
-    xValues = xValues.map((month, index)=>{
-        if (dates[index] === null) {
-            return null;
-        }
-        return `${month} 01, ${dates[index].getFullYear()}`;
-    });
-    return xValues;
-};
-const usesSecondaryYScale = (series, layout)=>{
-    var _layout_yaxis2, _layout_yaxis21;
-    return series.yaxis === 'y2' && ((layout === null || layout === void 0 ? void 0 : (_layout_yaxis2 = layout.yaxis2) === null || _layout_yaxis2 === void 0 ? void 0 : _layout_yaxis2.anchor) === 'x' || (layout === null || layout === void 0 ? void 0 : (_layout_yaxis21 = layout.yaxis2) === null || _layout_yaxis21 === void 0 ? void 0 : _layout_yaxis21.side) === 'right');
-};
-const getSecondaryYAxisValues = (data, layout)=>{
-    var _layout_yaxis2, _layout_yaxis21, _layout_yaxis2_title, _layout_yaxis22;
-    let containsSecondaryYAxis = false;
-    let yMinValue;
-    let yMaxValue;
-    let allLineSeries = true;
-    data.forEach((series)=>{
-        if (usesSecondaryYScale(series, layout)) {
-            containsSecondaryYAxis = true;
-            const yValues = series.y;
-            if (yValues) {
-                yMinValue = Math.min(...yValues);
-                yMaxValue = Math.max(...yValues);
-            }
-            if (series.type !== 'scatter' || isScatterAreaChart(series)) {
-                allLineSeries = false;
-            }
-        }
-    });
-    if (!containsSecondaryYAxis) {
-        return {};
-    }
-    if (!allLineSeries) {
-        if (typeof yMinValue === 'number') {
-            yMinValue = Math.min(yMinValue, 0);
-        }
-        if (typeof yMaxValue === 'number') {
-            yMaxValue = Math.max(yMaxValue, 0);
-        }
-    }
-    if (layout === null || layout === void 0 ? void 0 : (_layout_yaxis2 = layout.yaxis2) === null || _layout_yaxis2 === void 0 ? void 0 : _layout_yaxis2.range) {
-        yMinValue = layout.yaxis2.range[0];
-        yMaxValue = layout.yaxis2.range[1];
-    }
-    return {
-        secondaryYAxistitle: typeof (layout === null || layout === void 0 ? void 0 : (_layout_yaxis21 = layout.yaxis2) === null || _layout_yaxis21 === void 0 ? void 0 : _layout_yaxis21.title) === 'string' ? layout.yaxis2.title : typeof (layout === null || layout === void 0 ? void 0 : (_layout_yaxis22 = layout.yaxis2) === null || _layout_yaxis22 === void 0 ? void 0 : (_layout_yaxis2_title = _layout_yaxis22.title) === null || _layout_yaxis2_title === void 0 ? void 0 : _layout_yaxis2_title.text) === 'string' ? layout.yaxis2.title.text : undefined,
-        secondaryYScaleOptions: {
-            yMinValue,
-            yMaxValue
-        }
-    };
-};
-export const _getGaugeAxisColor = (colorway, colorwayType, color, colorMap, isDarkTheme)=>{
-    const extractedColors = extractColor(colorway, colorwayType, color, colorMap, isDarkTheme);
-    return resolveColor(extractedColors, 0, '', colorMap, colorway, isDarkTheme);
-};
-export const resolveXAxisPoint = (x, isXYearCategory, isXString, isXDate, isXNumber)=>{
-    if (x === null || x === undefined) {
-        return '';
-    }
-    if (isXYearCategory) {
-        return x.toString();
-    }
-    if (isXString) {
-        if (isXDate) {
-            const date = new Date(x);
-            return date;
-        }
-        if (isXNumber) {
-            return parseFloat(x);
-        }
-        return x;
-    }
-    return x;
-};
-/**
- * Formats text values according to the texttemplate specification
- * Supports D3 format specifiers within %{text:format} patterns
- * @param textValue The raw text value to format
- * @param textTemplate The template string (e.g., "%{text:.1f}%", "%{text:.2%}", "%{text:,.0f}")
- * @param index Optional index for array-based templates
- * @returns Formatted text string
- *
- * Examples:
- * - "%{text:.1f}%" → Formats number with 1 decimal place and adds % suffix
- * - "%{text:.2%}" → Formats as percentage with 2 decimal places
- * - "%{text:,.0f}" → Formats with thousands separator and no decimals
- * - "%{text:$,.2f}" → Formats as currency with thousands separator and 2 decimals
- */ const formatTextWithTemplate = (textValue, textTemplate, index)=>{
-    if (!textTemplate) {
-        return String(textValue);
-    }
-    const numVal = typeof textValue === 'number' ? textValue : parseFloat(String(textValue));
-    if (isNaN(numVal)) {
-        return String(textValue);
-    }
-    const template = typeof textTemplate === 'string' ? textTemplate : textTemplate[index || 0] || '';
-    // Match Plotly's texttemplate pattern: %{text:format} or %{text}
-    // Can be followed by any literal text like %, $, etc.
-    const plotlyPattern = /%\{text(?::([^}]+))?\}(.*)$/;
-    const match = template.match(plotlyPattern);
-    if (match) {
-        const formatSpec = match[1]; // The format specifier (e.g., ".1f", ".2%", ",.0f") or undefined
-        const suffix = match[2]; // Any text after the closing brace (e.g., "%", " units")
-        // If no format specifier is provided (e.g., %{text}%), try to infer from suffix
-        if (!formatSpec) {
-            // Check if suffix starts with % - assume simple percentage with 1 decimal
-            if (suffix.startsWith('%')) {
-                return `${numVal.toFixed(1)}${suffix}`;
-            }
-            // No format specifier, just return the number with the suffix
-            return `${numVal}${suffix}`;
-        }
-        try {
-            // Use D3 format function to apply the format specifier
-            const formatter = d3Format(formatSpec);
-            const formattedValue = formatter(numVal);
-            return `${formattedValue}${suffix}`;
-        } catch (error) {
-            // Try to extract precision for basic fallback
-            const precisionMatch = formatSpec.match(/\.(\d+)[f%]/);
-            const precision = precisionMatch ? parseInt(precisionMatch[1], 10) : 2;
-            // Check if it's a percentage format
-            if (formatSpec.includes('%')) {
-                return `${(numVal * 100).toFixed(precision)}%${suffix}`;
-            }
-            return `${numVal.toFixed(precision)}${suffix}`;
-        }
-    }
-    return String(textValue);
-};
-/**
- * Extracts unique X-axis categories from Plotly data traces
- * @param data Array of Plotly data traces
- * @returns Array of unique x values
- */ const extractXCategories = (data)=>{
-    return Array.from(new Set((data !== null && data !== void 0 ? data : []).flatMap((trace)=>{
-        const xData = trace.x;
-        if (!xData) {
-            return [];
-        }
-        if (Array.isArray(xData)) {
-            return xData.flat().map((x)=>{
-                return x;
-            });
-        }
-        return [];
-    }).filter((x)=>x !== undefined && x !== null)));
-};
-/**
- * Checks if a key should be ignored during normalization
- * @param key The key to check
- * @returns true if the key should be ignored
- */ const shouldIgnoreKey = (key)=>{
-    const lowerKey = key.toLowerCase();
-    if (lowerKey.includes('style') || lowerKey === 'style') {
-        return true;
-    }
-    // Use regex to match common CSS property patterns
-    // (color, fill, stroke, border, background, font, shadow, outline, etc.)
-    const cssKeyRegex = new RegExp('^(color|fill|stroke|border|background|font|shadow|outline|margin|padding|gap|align|justify|display|flex|grid|' + 'text|line|letter|word|vertical|horizontal|overflow|position|top|right|bottom|left|zindex|z-index|opacity|' + 'filter|clip|cursor|resize|transition|animation|transform|box|column|row|direction|visibility|' + 'content|width|height|aspect|image|user|pointer|caret|scroll|%)|(-webkit-|-moz-|-ms-|-o-)', 'i');
-    if (cssKeyRegex.test(lowerKey)) {
-        return true;
-    }
-    return false;
-};
-/**
- * Flattens a nested object into a single level object with dot notation keys
- * @param obj Object to flatten
- * @param prefix Optional prefix for keys
- * @returns Flattened object
- */ const flattenObject = (obj, prefix = '')=>{
-    const flattened = {};
-    for(const key in obj){
-        if (Object.prototype.hasOwnProperty.call(obj, key)) {
-            const newKey = prefix ? `${prefix}.${key}` : key;
-            const value = obj[key];
-            if (typeof value === 'object' && value !== null && !Array.isArray(value) && !(value instanceof Date)) {
-                // Recursively flatten nested objects
-                Object.assign(flattened, flattenObject(value, newKey));
-            } else {
-                flattened[newKey] = value;
-            }
-        }
-    }
-    return flattened;
-};
-const encodeHtmlEntities = (value)=>value.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
-const toFiniteNumber = (value)=>{
-    if (value === undefined || value === null) {
-        return undefined;
-    }
-    const numeric = typeof value === 'number' ? value : Number(value);
-    return Number.isFinite(numeric) ? numeric : undefined;
-};
-/**
- * Parses Plotly axis references (e.g. `x`, `x2`, `xaxis2`, `paper`, `pixel`, `x domain`) into a ref type + axis id.
- */ const parseAxisRef = (ref, axis)=>{
-    if (!ref) {
-        return {
-            refType: 'axis',
-            axisId: 1
-        };
-    }
-    const normalized = ref.toLowerCase().trim();
-    if (normalized === 'pixel') {
-        return {
-            refType: 'pixel',
-            axisId: 1
-        };
-    }
-    if (normalized === 'paper') {
-        return {
-            refType: 'relative',
-            axisId: 1
-        };
-    }
-    if (normalized.endsWith(' domain')) {
-        return normalized.startsWith(axis) ? {
-            refType: 'relative',
-            axisId: 1
-        } : {
-            refType: undefined,
-            axisId: 1
-        };
-    }
-    const match = normalized.match(/^([xy])(axis)?(\d*)$/);
-    if (!match || match[1] !== axis) {
-        return {
-            refType: undefined,
-            axisId: 1
-        };
-    }
-    const suffix = match[3];
-    if (!suffix || suffix === '1') {
-        return {
-            refType: 'axis',
-            axisId: 1
-        };
-    }
-    const parsed = Number(suffix);
-    return {
-        refType: 'axis',
-        axisId: Number.isFinite(parsed) && parsed >= 1 ? parsed : 1
-    };
-};
-/**
- * Converts Plotly's bottom-origin relative Y coordinate into the SVG top-origin space used by our overlay.
- */ const transformRelativeYForChart = (value)=>{
-    if (value === undefined) {
-        return undefined;
-    }
-    if (!Number.isFinite(value)) {
-        return undefined;
-    }
-    return 1 - value;
-};
-const mapHorizontalAlign = (anchor)=>{
-    switch((anchor !== null && anchor !== void 0 ? anchor : '').toLowerCase()){
-        case 'left':
-            return 'start';
-        case 'center':
-            return 'center';
-        case 'right':
-            return 'end';
-        default:
-            return undefined;
-    }
-};
-const mapVerticalAlign = (anchor)=>{
-    switch((anchor !== null && anchor !== void 0 ? anchor : '').toLowerCase()){
-        case 'top':
-            return 'top';
-        case 'middle':
-            return 'middle';
-        case 'bottom':
-            return 'bottom';
-        default:
-            return undefined;
-    }
-};
-const appendPx = (value)=>{
-    if (value === undefined || value === null) {
-        return undefined;
-    }
-    if (typeof value === 'string') {
-        return value;
-    }
-    if (typeof value === 'number' && Number.isFinite(value)) {
-        return `${value}px`;
-    }
-    return undefined;
-};
-/**
- * Maps Plotly's axis reference string to one of our coordinate interpretation modes (axis, relative, or pixel).
- */ const resolveRefType = (ref, axis)=>{
-    if (!ref) {
-        return 'axis';
-    }
-    const parsed = parseAxisRef(ref, axis);
-    if (parsed.refType !== 'axis') {
-        return parsed.refType;
-    }
-    const normalized = (ref !== null && ref !== void 0 ? ref : '').toLowerCase().trim();
-    const match = normalized.match(/^([xy])(\d*)$/);
-    return match && match[1] === axis ? 'axis' : undefined;
-};
-/**
- * Retrieves the appropriate axis layout section from Plotly's layout given an axis reference alias.
- */ const getAxisLayoutByRef = (layout, ref, axis)=>{
-    if (!layout) {
-        return undefined;
-    }
-    const defaultAxisKey = `${axis}axis`;
-    const { refType, axisId } = parseAxisRef(ref, axis);
-    if (refType !== 'axis' || axisId === 1) {
-        return layout[defaultAxisKey];
-    }
-    const axisKey = `${axis}axis${axisId}`;
-    return layout[axisKey];
-};
-const convertAnnotationDataValue = (value, axisType)=>{
-    if (value === undefined || value === null) {
-        return undefined;
-    }
-    if (axisType === 'date') {
-        const dateValue = value instanceof Date ? value : new Date(value);
-        return Number.isNaN(dateValue.getTime()) ? undefined : dateValue;
-    }
-    if (axisType === 'linear' || axisType === 'log') {
-        if (typeof value === 'number') {
-            return Number.isFinite(value) ? value : undefined;
-        }
-        const numeric = Number(value);
-        return Number.isFinite(numeric) ? numeric : undefined;
-    }
-    // For category-like axes, preserve raw strings (and avoid date parsing heuristics).
-    if (value instanceof Date) {
-        return value;
-    }
-    if (typeof value === 'number' || typeof value === 'string') {
-        return value;
-    }
-    return undefined;
-};
-const createAnnotationId = (text, index)=>{
-    const normalized = text.replace(/\s+/g, ' ').trim();
-    if (normalized) {
-        const slug = normalized.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-+|-+$/g, '').slice(0, 32);
-        if (slug) {
-            return `annotation-${index}-${slug}`;
-        }
-    }
-    return `annotation-${index}`;
-};
-const DEFAULT_ARROW_OFFSET = -40;
-const mapArrowsideToArrow = (annotation)=>{
-    let includeStart = false;
-    let includeEnd = false;
-    const arrowSide = typeof (annotation === null || annotation === void 0 ? void 0 : annotation.arrowside) === 'string' ? annotation === null || annotation === void 0 ? void 0 : annotation.arrowside.toLowerCase() : undefined;
-    if (arrowSide) {
-        includeStart = arrowSide.includes('start');
-        includeEnd = arrowSide.includes('end');
-    }
-    const endHead = toFiniteNumber(annotation === null || annotation === void 0 ? void 0 : annotation.arrowhead);
-    const startHead = toFiniteNumber(annotation.startarrowhead);
-    if (endHead !== undefined && endHead > 0) {
-        includeEnd = true;
-    }
-    if (startHead !== undefined && startHead > 0) {
-        includeStart = true;
-    }
-    if (includeStart && includeEnd) {
-        return 'both';
-    }
-    if (includeStart) {
-        return 'start';
-    }
-    if (includeEnd) {
-        return 'end';
-    }
-    return 'none';
-};
-const mapArrowDashToPattern = (value)=>{
-    if (!value) {
-        return undefined;
-    }
-    const normalized = value.trim().toLowerCase();
-    switch(normalized){
-        case 'solid':
-            return undefined;
-        case 'dot':
-            return '1, 5';
-        case 'dash':
-            return '5, 5';
-        case 'longdash':
-            return '10, 5';
-        case 'dashdot':
-            return '5, 5, 1, 5';
-        case 'longdashdot':
-            return '10, 5, 1, 5';
-        default:
-            if (/^\d+(\s|,)*\d*$/.test(normalized.replace(/\s+/g, ' '))) {
-                return normalized.replace(/\s+/g, ' ');
-            }
-            return value;
-    }
-};
-const mapRefTypeToCoordinateType = (refType)=>{
-    return refType === 'axis' ? 'data' : refType;
-};
-const normalizeCoordinateValueForType = (coordinateType, value)=>{
-    if (coordinateType === 'data') {
-        return value;
-    }
-    return typeof value === 'number' && Number.isFinite(value) ? value : undefined;
-};
-const getAnnotationCoordinateValue = (axis, refType, annotation, layout)=>{
-    if (refType === 'axis') {
-        const axisRef = axis === 'x' ? annotation === null || annotation === void 0 ? void 0 : annotation.xref : annotation === null || annotation === void 0 ? void 0 : annotation.yref;
-        const axisLayout = getAxisLayoutByRef(layout, axisRef, axis);
-        const rawValue = axis === 'x' ? annotation === null || annotation === void 0 ? void 0 : annotation.x : annotation === null || annotation === void 0 ? void 0 : annotation.y;
-        var _axisLayout_type;
-        const axisType = (_axisLayout_type = axisLayout === null || axisLayout === void 0 ? void 0 : axisLayout.type) !== null && _axisLayout_type !== void 0 ? _axisLayout_type : 'category';
-        return convertAnnotationDataValue(rawValue, axisType);
-    }
-    const numericValue = toFiniteNumber(axis === 'x' ? annotation === null || annotation === void 0 ? void 0 : annotation.x : annotation === null || annotation === void 0 ? void 0 : annotation.y);
-    if (numericValue === undefined) {
-        return undefined;
-    }
-    if (refType === 'relative') {
-        return axis === 'y' ? transformRelativeYForChart(numericValue) : numericValue;
-    }
-    return numericValue;
-};
-/**
- * Converts a Plotly annotation definition into the internal `ChartAnnotation` format, translating coordinates,
- * layout alignment, styling, and connector metadata while skipping unsupported configurations.
- */ const convertPlotlyAnnotation = (annotation, layout, index)=>{
-    if (!annotation || annotation.visible === false) {
-        return undefined;
-    }
-    const xRefType = resolveRefType(annotation.xref, 'x');
-    const yRefType = resolveRefType(annotation.yref, 'y');
-    if (!xRefType || !yRefType) {
-        return undefined;
-    }
-    const xValue = getAnnotationCoordinateValue('x', xRefType, annotation, layout);
-    const yValue = getAnnotationCoordinateValue('y', yRefType, annotation, layout);
-    if (xValue === undefined || yValue === undefined) {
-        return undefined;
-    }
-    const xCoordinateType = mapRefTypeToCoordinateType(xRefType);
-    const yCoordinateType = mapRefTypeToCoordinateType(yRefType);
-    const normalizedX = normalizeCoordinateValueForType(xCoordinateType, xValue);
-    const normalizedY = normalizeCoordinateValueForType(yCoordinateType, yValue);
-    if (normalizedX === undefined || normalizedY === undefined) {
-        return undefined;
-    }
-    const yRefNormalized = typeof annotation.yref === 'string' ? annotation.yref.toLowerCase() : undefined;
-    const yAxisProps = yCoordinateType === 'data' && yRefNormalized === 'y2' ? {
-        yAxis: 'secondary'
-    } : undefined;
-    let coordinates;
-    if (xCoordinateType === 'data' && yCoordinateType === 'data') {
-        coordinates = {
-            type: 'data',
-            x: normalizedX,
-            y: normalizedY,
-            ...yAxisProps !== null && yAxisProps !== void 0 ? yAxisProps : {}
-        };
-    } else if (xCoordinateType === 'relative' && yCoordinateType === 'relative') {
-        coordinates = {
-            type: 'relative',
-            x: normalizedX,
-            y: normalizedY
-        };
-    } else if (xCoordinateType === 'pixel' && yCoordinateType === 'pixel') {
-        coordinates = {
-            type: 'pixel',
-            x: normalizedX,
-            y: normalizedY
-        };
-    } else {
-        coordinates = {
-            type: 'mixed',
-            xCoordinateType,
-            yCoordinateType,
-            x: normalizedX,
-            y: normalizedY,
-            ...yAxisProps !== null && yAxisProps !== void 0 ? yAxisProps : {}
-        };
-    }
-    const textValue = annotation.text;
-    const rawText = textValue === undefined || textValue === null ? '' : String(textValue);
-    const encodedText = encodeHtmlEntities(rawText);
-    const chartAnnotation = {
-        id: createAnnotationId(encodedText, index),
-        text: encodedText,
-        coordinates
-    };
-    const layoutProps = {};
-    const styleProps = {};
-    const showArrow = annotation.showarrow === undefined ? false : !!annotation.showarrow;
-    const clipOnAxis = annotation.cliponaxis;
-    if (clipOnAxis !== undefined) {
-        layoutProps.clipToBounds = !!clipOnAxis;
-    } else if (coordinates.type === 'data') {
-        layoutProps.clipToBounds = true;
-    }
-    const horizontalAlign = mapHorizontalAlign(annotation.xanchor);
-    if (horizontalAlign) {
-        layoutProps.align = horizontalAlign;
-    }
-    if (!layoutProps.align) {
-        const alignProp = mapHorizontalAlign(annotation.align);
-        if (alignProp) {
-            layoutProps.align = alignProp;
-        }
-    }
-    const verticalAlign = mapVerticalAlign(annotation.yanchor);
-    if (verticalAlign) {
-        layoutProps.verticalAlign = verticalAlign;
-    }
-    if (!layoutProps.verticalAlign) {
-        const valignProp = mapVerticalAlign(annotation.valign);
-        if (valignProp) {
-            layoutProps.verticalAlign = valignProp;
-        }
-    }
-    const offsetXComponents = [];
-    let hasExplicitOffset = false;
-    const ax = toFiniteNumber(annotation.ax);
-    const axRef = typeof annotation.axref === 'string' ? annotation.axref.toLowerCase() : undefined;
-    if (ax !== undefined && (axRef === undefined || axRef === 'pixel')) {
-        offsetXComponents.push(ax);
-        hasExplicitOffset = true;
-    }
-    const xShift = toFiniteNumber(annotation.xshift);
-    if (xShift !== undefined) {
-        offsetXComponents.push(xShift);
-        hasExplicitOffset = true;
-    }
-    if (offsetXComponents.length > 0) {
-        const offsetX = offsetXComponents.reduce((sum, value)=>sum + value, 0);
-        if (offsetX !== 0) {
-            layoutProps.offsetX = offsetX;
-        }
-    }
-    const offsetYComponents = [];
-    const ay = toFiniteNumber(annotation.ay);
-    const ayRef = typeof annotation.ayref === 'string' ? annotation.ayref.toLowerCase() : undefined;
-    if (ay !== undefined && (ayRef === undefined || ayRef === 'pixel')) {
-        offsetYComponents.push(ay);
-        hasExplicitOffset = true;
-    }
-    const yShift = toFiniteNumber(annotation.yshift);
-    if (yShift !== undefined) {
-        offsetYComponents.push(yShift);
-        hasExplicitOffset = true;
-    }
-    if (offsetYComponents.length > 0) {
-        const offsetY = offsetYComponents.reduce((sum, value)=>sum + value, 0);
-        if (offsetY !== 0) {
-            layoutProps.offsetY = offsetY;
-        }
-    }
-    if (showArrow && !hasExplicitOffset && layoutProps.offsetY === undefined) {
-        layoutProps.offsetY = DEFAULT_ARROW_OFFSET;
-    }
-    const maxWidth = toFiniteNumber(annotation.width);
-    if (maxWidth !== undefined) {
-        layoutProps.maxWidth = maxWidth;
-    }
-    if (annotation.bgcolor) {
-        styleProps.backgroundColor = annotation.bgcolor;
-    }
-    if (annotation.bordercolor) {
-        styleProps.borderColor = annotation.bordercolor;
-    }
-    const borderWidth = toFiniteNumber(annotation.borderwidth);
-    if (borderWidth !== undefined) {
-        styleProps.borderWidth = borderWidth;
-    }
-    const borderPad = appendPx(annotation.borderpad);
-    if (borderPad) {
-        styleProps.padding = borderPad;
-    }
-    const opacity = toFiniteNumber(annotation.opacity);
-    if (opacity !== undefined) {
-        styleProps.opacity = opacity;
-    }
-    if (annotation.font) {
-        const font = annotation.font;
-        if (font === null || font === void 0 ? void 0 : font.color) {
-            styleProps.textColor = font.color;
-        }
-        const fontSize = appendPx(font === null || font === void 0 ? void 0 : font.size);
-        if (fontSize) {
-            styleProps.fontSize = fontSize;
-        }
-        if (font === null || font === void 0 ? void 0 : font.weight) {
-            styleProps.fontWeight = font.weight;
-        }
-    }
-    const textAngle = annotation === null || annotation === void 0 ? void 0 : annotation.textangle;
-    if (typeof textAngle === 'number' && !Number.isNaN(textAngle)) {
-        styleProps.rotation = textAngle;
-    } else if (typeof textAngle === 'string' && textAngle.toLowerCase() !== 'auto') {
-        const parsedAngle = Number(textAngle);
-        if (!Number.isNaN(parsedAngle)) {
-            styleProps.rotation = parsedAngle;
-        }
-    }
-    if (Object.keys(layoutProps).length > 0) {
-        chartAnnotation.layout = layoutProps;
-    }
-    if (Object.keys(styleProps).length > 0) {
-        chartAnnotation.style = styleProps;
-    }
-    if (showArrow) {
-        var _annotation_arrowcolor;
-        const arrowColor = (_annotation_arrowcolor = annotation.arrowcolor) !== null && _annotation_arrowcolor !== void 0 ? _annotation_arrowcolor : styleProps.textColor;
-        const arrowWidth = toFiniteNumber(annotation.arrowwidth);
-        const endPadding = toFiniteNumber(annotation.standoff);
-        const startPadding = toFiniteNumber(annotation.startstandoff);
-        const dashPattern = mapArrowDashToPattern(annotation.arrowdash);
-        chartAnnotation.connector = {
-            ...arrowColor ? {
-                strokeColor: arrowColor
-            } : {},
-            ...arrowWidth !== undefined ? {
-                strokeWidth: arrowWidth
-            } : {},
-            ...endPadding !== undefined ? {
-                endPadding: Math.max(endPadding, 0)
-            } : {},
-            ...startPadding !== undefined ? {
-                startPadding: Math.max(startPadding, 0)
-            } : {},
-            ...dashPattern ? {
-                dashArray: dashPattern
-            } : {},
-            arrow: mapArrowsideToArrow(annotation)
-        };
-    }
-    return chartAnnotation;
-};
-const getChartAnnotationsFromLayout = (data, layout, isMultiPlot)=>{
-    if (isMultiPlot || !(layout === null || layout === void 0 ? void 0 : layout.annotations)) {
-        return undefined;
-    }
-    // Infer axis types when they are not explicitly set.
-    // This is needed so annotation coordinate parsing can correctly treat values as 'date' vs 'category'
-    // (for example, bar chart category axes with date-like strings).
-    const inferredLayout = (()=>{
-        if (!data || !isArrayOrTypedArray(data) || data.length === 0) {
-            return layout;
-        }
-        const valuesByAxisKey = new Map();
-        const axesExpectingCategories = new Set();
-        data.forEach((series)=>{
-            const trace = series;
-            const axisIds = getAxisIds(trace);
-            if (trace.type === 'bar') {
-                const categoryAxisLetter = trace.orientation === 'h' ? 'y' : 'x';
-                axesExpectingCategories.add(getAxisKey(categoryAxisLetter, axisIds[categoryAxisLetter]));
-            }
-            [
-                'x',
-                'y'
-            ].forEach((axLetter)=>{
-                const coords = trace[axLetter];
-                if (!coords || !isArrayOrTypedArray(coords)) {
-                    return;
-                }
-                const axisKey = getAxisKey(axLetter, axisIds[axLetter]);
-                var _valuesByAxisKey_get;
-                const existing = (_valuesByAxisKey_get = valuesByAxisKey.get(axisKey)) !== null && _valuesByAxisKey_get !== void 0 ? _valuesByAxisKey_get : [];
-                coords.forEach((val)=>{
-                    if (!isInvalidValue(val)) {
-                        existing.push(val);
-                    }
-                });
-                valuesByAxisKey.set(axisKey, existing);
-            });
-        });
-        let nextLayout;
-        valuesByAxisKey.forEach((values, axisKey)=>{
-            const currentAxis = layout === null || layout === void 0 ? void 0 : layout[axisKey];
-            const currentType = currentAxis === null || currentAxis === void 0 ? void 0 : currentAxis.type;
-            if ([
-                'linear',
-                'log',
-                'date',
-                'category'
-            ].includes(currentType !== null && currentType !== void 0 ? currentType : '')) {
-                return;
-            }
-            let inferredType;
-            if (axesExpectingCategories.has(axisKey) || isYearArray(values)) {
-                inferredType = 'category';
-            } else if (isDateArray(values)) {
-                inferredType = 'date';
-            }
-            if (!inferredType) {
-                return;
-            }
-            if (!nextLayout) {
-                nextLayout = {
-                    ...layout
-                };
-            }
-            nextLayout[axisKey] = {
-                ...currentAxis !== null && currentAxis !== void 0 ? currentAxis : {},
-                type: inferredType
-            };
-        });
-        return nextLayout !== null && nextLayout !== void 0 ? nextLayout : layout;
-    })();
-    const annotationsArray = Array.isArray(layout.annotations) ? layout.annotations : [
-        layout.annotations
-    ];
-    const converted = annotationsArray.map((annotation, index)=>convertPlotlyAnnotation(annotation, inferredLayout, index)).filter((annotation)=>annotation !== undefined);
-    return converted.length > 0 ? converted : undefined;
-};
-/**
- * Normalizes an array of objects by flattening nested structures and creating grouped data
- * Uses json_normalize approach with D3 color detection and filtering
- * @param data Array of objects to normalize
- * @returns Object containing traces for grouped vertical bar chart
- */ export const normalizeObjectArrayForGVBC = (data, xLabels)=>{
-    if (!data || data.length === 0) {
-        return {
-            traces: [],
-            x: []
-        };
-    }
-    // Use provided xLabels if available, otherwise default to Item 1, Item 2, ...
-    const x = xLabels && xLabels.length === data.length ? xLabels : data.map((_, index)=>`Item ${index + 1}`);
-    // First, flatten all objects and collect all unique keys, excluding style keys
-    const flattenedObjects = data.map((item, index)=>{
-        if (typeof item === 'object' && item !== null) {
-            const flattened = flattenObject(item);
-            // Only keep keys where the value is numeric (number or numeric string) and not a style key
-            const filtered = {};
-            Object.keys(flattened).forEach((key)=>{
-                const value = flattened[key];
-                if (!shouldIgnoreKey(key) && (typeof value === 'number' || typeof value === 'string' && isNumber(value))) {
-                    filtered[key] = value;
-                }
-            });
-            return filtered;
-        } else if (typeof item === 'number' || typeof item === 'string' && isNumber(item)) {
-            // Only keep primitive numeric values
-            return {
-                [x[index] || `item_${index}`]: item
-            };
-        } else {
-            // Non-numeric primitive, ignore by returning empty object
-            return {};
-        }
-    });
-    // Collect all unique keys across all objects
-    const allKeys = new Set();
-    flattenedObjects.forEach((obj)=>{
-        Object.keys(obj).forEach((key)=>allKeys.add(key));
-    });
-    // Create traces for each key (property)
-    const traces = [];
-    allKeys.forEach((key)=>{
-        const yValues = [];
-        let hasValidData = false;
-        let isNumericData = false;
-        flattenedObjects.forEach((obj, index)=>{
-            const value = obj[key];
-            if (typeof value === 'number') {
-                yValues.push(value);
-                hasValidData = true;
-                isNumericData = true;
-            } else if (typeof value === 'string' && isNumber(value)) {
-                yValues.push(parseFloat(value));
-                hasValidData = true;
-                isNumericData = true;
-            }
-        });
-        // Only create trace if we have valid numeric data
-        if (hasValidData && isNumericData) {
-            const trace = {
-                type: 'bar',
-                name: key,
-                x,
-                y: yValues
-            };
-            traces.push(trace);
-        }
-    });
-    return {
-        traces,
-        x
-    };
-};
-export const transformPlotlyJsonToAnnotationChartProps = (input, isMultiPlot, _colorMap, _colorwayType, _isDarkTheme)=>{
-    var _layoutWithMeta_meta, _input_layout, _input_layout1, _input_layout2, _input_layout3, _input_layout_font, _input_layout4, _input_layout_font1, _input_layout5, _input_layout6;
-    var _getChartAnnotationsFromLayout;
-    const annotations = (_getChartAnnotationsFromLayout = getChartAnnotationsFromLayout(input.data, input.layout, isMultiPlot)) !== null && _getChartAnnotationsFromLayout !== void 0 ? _getChartAnnotationsFromLayout : [];
-    const titles = getTitles(input.layout);
-    const layoutTitle = titles.chartTitle || undefined;
-    const layoutWithMeta = input.layout;
-    const description = typeof (layoutWithMeta === null || layoutWithMeta === void 0 ? void 0 : (_layoutWithMeta_meta = layoutWithMeta.meta) === null || _layoutWithMeta_meta === void 0 ? void 0 : _layoutWithMeta_meta.description) === 'string' ? layoutWithMeta.meta.description : undefined;
-    const width = typeof ((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.width) === 'number' ? input.layout.width : undefined;
-    const height = typeof ((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.height) === 'number' ? input.layout.height : undefined;
-    const paperBackgroundColor = typeof ((_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.paper_bgcolor) === 'string' ? input.layout.paper_bgcolor : undefined;
-    const plotBackgroundColor = typeof ((_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : _input_layout3.plot_bgcolor) === 'string' ? input.layout.plot_bgcolor : undefined;
-    const fontColor = typeof ((_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : (_input_layout_font = _input_layout4.font) === null || _input_layout_font === void 0 ? void 0 : _input_layout_font.color) === 'string' ? input.layout.font.color : undefined;
-    const fontFamily = typeof ((_input_layout5 = input.layout) === null || _input_layout5 === void 0 ? void 0 : (_input_layout_font1 = _input_layout5.font) === null || _input_layout_font1 === void 0 ? void 0 : _input_layout_font1.family) === 'string' ? input.layout.font.family : undefined;
-    const margin = (_input_layout6 = input.layout) === null || _input_layout6 === void 0 ? void 0 : _input_layout6.margin;
-    return {
-        annotations,
-        chartTitle: layoutTitle,
-        description,
-        width,
-        height,
-        paperBackgroundColor,
-        plotBackgroundColor,
-        fontColor,
-        fontFamily,
-        margin
-    };
-};
-export const transformPlotlyJsonToDonutProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout_template_layout, _input_layout_template, _input_layout1, _input_layout2, _firstData_marker, _input_layout3, _input_layout4, _input_layout5, _input_layout6;
-    const firstData = input.data[0];
-    var _input_layout_piecolorway, _input_layout_piecolorway1;
-    // extract colors for each series only once
-    // use piecolorway if available
-    // otherwise, default to colorway from template
-    const colors = extractColor((_input_layout_piecolorway = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.piecolorway) !== null && _input_layout_piecolorway !== void 0 ? _input_layout_piecolorway : (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template = _input_layout1.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_input_layout_piecolorway1 = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.piecolorway) !== null && _input_layout_piecolorway1 !== void 0 ? _input_layout_piecolorway1 : firstData === null || firstData === void 0 ? void 0 : (_firstData_marker = firstData.marker) === null || _firstData_marker === void 0 ? void 0 : _firstData_marker.colors, colorMap, isDarkTheme, true);
-    const mapLegendToDataPoint = {};
-    // clear colorMap for donut chart to reassign colors as the colorMap initially gets assigned by
-    // getAllupLegendsProps function without sorting labels by value
-    colorMap.current.clear();
-    // Sort labels by value descending before mapping
-    if (firstData.labels && firstData.values) {
-        var _firstData_marker1;
-        const markerColors = ((_firstData_marker1 = firstData.marker) === null || _firstData_marker1 === void 0 ? void 0 : _firstData_marker1.colors) || undefined;
-        const hasMarkerColors = Array.isArray(markerColors) && markerColors.length >= firstData.labels.length;
-        const labelValuePairs = firstData.labels.map((label, index)=>({
-                label,
-                value: getNumberAtIndexOrDefault(firstData.values, index),
-                index,
-                color: hasMarkerColors ? markerColors[index] : undefined
-            }));
-        // Filter out invalid values
-        const validPairs = labelValuePairs.filter((pair)=>!isInvalidValue(pair.value));
-        // Sort descending by value; when marker colors are present, keep color attached to the label
-        validPairs.sort((a, b)=>b.value - a.value);
-        validPairs.forEach((pair, sortedIdx)=>{
-            var _input_layout, _input_layout_template_layout, _input_layout_template, _input_layout1;
-            const legend = `${pair.label}`;
-            var _input_layout_piecolorway, _pair_color;
-            const color = (_pair_color = pair.color) !== null && _pair_color !== void 0 ? _pair_color : resolveColor(colors, sortedIdx, legend, colorMap, (_input_layout_piecolorway = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.piecolorway) !== null && _input_layout_piecolorway !== void 0 ? _input_layout_piecolorway : (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template = _input_layout1.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme, true);
-            if (!mapLegendToDataPoint[legend]) {
-                mapLegendToDataPoint[legend] = {
-                    legend,
-                    data: pair.value,
-                    color
-                };
-            } else {
-                mapLegendToDataPoint[legend].data += pair.value;
-            }
-        });
-    }
-    var _input_layout_width;
-    const width = (_input_layout_width = (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : _input_layout3.width) !== null && _input_layout_width !== void 0 ? _input_layout_width : 440;
-    var _input_layout_height;
-    const height = (_input_layout_height = (_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : _input_layout4.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 220;
-    const hideLabels = firstData.textinfo ? ![
-        'value',
-        'percent',
-        'label+percent',
-        'percent+label'
-    ].includes(firstData.textinfo) : false;
-    const donutMarginHorizontal = hideLabels ? 0 : 80;
-    const donutMarginVertical = 40 + (hideLabels ? 0 : 40);
-    const innerRadius = firstData.hole ? firstData.hole * (Math.min(width - donutMarginHorizontal, height - donutMarginVertical) / 2) : MIN_DONUT_RADIUS;
-    const { chartTitle, titleStyles } = getTitles(input.layout);
-    // Build anticlockwise order by keeping the first item, reversing the rest
-    const legends = Object.keys(mapLegendToDataPoint);
-    const reorderedEntries = legends.length > 1 ? [
-        [
-            legends[0],
-            mapLegendToDataPoint[legends[0]]
-        ],
-        ...legends.slice(1).reverse().map((key)=>[
-                key,
-                mapLegendToDataPoint[key]
-            ])
-    ] : legends.map((key)=>[
-            key,
-            mapLegendToDataPoint[key]
-        ]);
-    return {
-        data: {
-            chartTitle,
-            chartData: reorderedEntries.map(([, v])=>v)
-        },
-        hideLegend: isMultiPlot || ((_input_layout5 = input.layout) === null || _input_layout5 === void 0 ? void 0 : _input_layout5.showlegend) === false,
-        width: (_input_layout6 = input.layout) === null || _input_layout6 === void 0 ? void 0 : _input_layout6.width,
-        height,
-        innerRadius,
-        hideLabels,
-        showLabelsInPercent: firstData.textinfo ? [
-            'percent',
-            'label+percent',
-            'percent+label'
-        ].includes(firstData.textinfo) : true,
-        roundCorners: true,
-        order: 'sorted',
-        ...titleStyles ? {
-            titleStyles
-        } : {}
-    };
-};
-export const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme, fallbackVSBC)=>{
-    var _input_layout, _input_layout1, _input_layout2;
-    const mapXToDataPoints = {};
-    let yMaxValue = 0;
-    let yMinValue = 0;
-    const secondaryYAxisValues = getSecondaryYAxisValues(input.data, input.layout);
-    const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
-    let colorScale = undefined;
-    const yAxisTickFormat = getYAxisTickFormat(input.data[0], input.layout);
-    const resolveXValue = getAxisValueResolver(getAxisType(input.data, getAxisObjects(input.data, input.layout).x));
-    input.data.forEach((series, index1)=>{
-        var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _series_line;
-        colorScale = createColorScale(input.layout, series, colorScale);
-        // extract bar colors for each series only once
-        const extractedBarColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color, colorMap, isDarkTheme);
-        // extract line colors for each series only once
-        const extractedLineColors = extractColor((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, colorwayType, (_series_line = series.line) === null || _series_line === void 0 ? void 0 : _series_line.color, colorMap, isDarkTheme);
-        const validXYRanges = getValidXYRanges(series, resolveXValue);
-        validXYRanges.forEach(([rangeStart, rangeEnd], rangeIdx)=>{
-            const rangeXValues = series.x.slice(rangeStart, rangeEnd);
-            const rangeYValues = series.y.slice(rangeStart, rangeEnd);
-            const textValues = Array.isArray(series.text) ? series.text.slice(rangeStart, rangeEnd) : typeof series.text === 'string' ? series.text : undefined;
-            rangeXValues.forEach((x, index2)=>{
-                var _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout;
-                if (!mapXToDataPoints[x]) {
-                    mapXToDataPoints[x] = {
-                        xAxisPoint: resolveXValue(x),
-                        chartData: [],
-                        lineData: []
-                    };
-                }
-                const legend = legends[index1];
-                // resolve color for each legend's bars from the colorscale or extracted colors
-                const color = colorScale ? colorScale(isArrayOrTypedArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) ? (_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : (_series_marker_color = _series_marker2.color) === null || _series_marker_color === void 0 ? void 0 : _series_marker_color[index2 % ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length] : 0) : resolveColor(extractedBarColors, index2, legend, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-                const opacity = getOpacity(series, index2);
-                const yVal = rangeYValues[index2];
-                const yAxisCalloutData = getFormattedCalloutYData(yVal, yAxisTickFormat);
-                let barLabel = Array.isArray(textValues) ? textValues[index2] : textValues;
-                // Apply texttemplate formatting if specified
-                if (barLabel && series.texttemplate) {
-                    barLabel = formatTextWithTemplate(barLabel, series.texttemplate, index2);
-                }
-                if (series.type === 'bar') {
-                    var _rgb_copy_formatHex8;
-                    mapXToDataPoints[x].chartData.push({
-                        legend,
-                        data: yVal,
-                        color: (_rgb_copy_formatHex8 = rgb(color).copy({
-                            opacity
-                        }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : color,
-                        yAxisCalloutData,
-                        ...barLabel ? {
-                            barLabel: String(barLabel)
-                        } : {}
-                    });
-                    if (typeof yVal === 'number') {
-                        yMaxValue = Math.max(yMaxValue, yVal);
-                    }
-                } else if (series.type === 'scatter' || !!fallbackVSBC) {
-                    var _input_layout_template_layout1, _input_layout_template1, _input_layout1, _series_mode;
-                    const lineColor = resolveColor(extractedLineColors, index1, legend, colorMap, (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, isDarkTheme);
-                    const lineOptions = !((_series_mode = series.mode) === null || _series_mode === void 0 ? void 0 : _series_mode.includes('text')) ? getLineOptions(series.line) : undefined;
-                    const legendShape = getLegendShape(series);
-                    var _rgb_copy_formatHex81;
-                    mapXToDataPoints[x].lineData.push({
-                        legend: legend + (validXYRanges.length > 1 ? `.${rangeIdx + 1}` : ''),
-                        legendShape,
-                        y: yVal,
-                        color: (_rgb_copy_formatHex81 = rgb(lineColor).copy({
-                            opacity
-                        }).formatHex8()) !== null && _rgb_copy_formatHex81 !== void 0 ? _rgb_copy_formatHex81 : color,
-                        lineOptions: {
-                            ...lineOptions !== null && lineOptions !== void 0 ? lineOptions : {},
-                            mode: series.mode
-                        },
-                        useSecondaryYScale: usesSecondaryYScale(series, input.layout),
-                        yAxisCalloutData
-                    });
-                    if (!usesSecondaryYScale(series, input.layout) && typeof yVal === 'number') {
-                        yMaxValue = Math.max(yMaxValue, yVal);
-                        yMinValue = Math.min(yMinValue, yVal);
-                    }
-                }
-                yMaxValue = Math.max(yMaxValue, yVal);
-            });
-        });
-    });
-    const xCategories = extractXCategories(input.data);
-    var _input_layout_shapes;
-    ((_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;
-        const resolveX = (val)=>{
-            if (shape.xref === 'x domain') {
-                if (val === 0) {
-                    return xCategories[0];
-                }
-                if (val === 1) {
-                    return xCategories[xCategories.length - 1];
-                }
-            }
-            if (typeof val === 'number' && Array.isArray(xCategories)) {
-                if (xCategories[val] !== undefined) {
-                    return xCategories[val];
-                } else {
-                    return xCategories[shapeIdx];
-                }
-            }
-            return val;
-        };
-        const x0Key = resolveX(shape.x0);
-        const x1Key = resolveX(shape.x1);
-        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;
-        };
-        const y0Val = resolveY(shape.y0);
-        const y1Val = resolveY(shape.y1);
-        if (mapXToDataPoints[x0Key]) {
-            var _rgb_formatHex8;
-            mapXToDataPoints[x0Key].lineData.push({
-                legend: `Reference_${shapeIdx}`,
-                y: y0Val,
-                color: (_rgb_formatHex8 = rgb(lineColor).formatHex8()) !== null && _rgb_formatHex8 !== void 0 ? _rgb_formatHex8 : lineColor,
-                lineOptions: getLineOptions(shape.line),
-                useSecondaryYScale: false
-            });
-        }
-        if (mapXToDataPoints[x1Key]) {
-            var _rgb_formatHex81;
-            mapXToDataPoints[x1Key].lineData.push({
-                legend: `Reference_${shapeIdx}`,
-                y: y1Val,
-                color: (_rgb_formatHex81 = rgb(lineColor).formatHex8()) !== null && _rgb_formatHex81 !== void 0 ? _rgb_formatHex81 : lineColor,
-                lineOptions: getLineOptions(shape.line),
-                useSecondaryYScale: false
-            });
-        }
-    });
-    const vsbcData = Object.values(mapXToDataPoints);
-    const annotations = getChartAnnotationsFromLayout(input.data, input.layout, isMultiPlot);
-    var _input_layout_height;
-    return {
-        data: vsbcData,
-        width: (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.width,
-        height: (_input_layout_height = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 350,
-        barWidth: 'auto',
-        yMaxValue,
-        yMinValue,
-        mode: 'plotly',
-        ...secondaryYAxisValues,
-        hideTickOverlap: true,
-        barGapMax: 2,
-        hideLegend,
-        roundCorners: true,
-        showYAxisLables: true,
-        noOfCharsToTruncate: 20,
-        showYAxisLablesTooltip: true,
-        roundedTicks: true,
-        ...getXMinMaxValues(input.data[0], input.layout),
-        ...getTitles(input.layout),
-        ...getXAxisTickFormat(input.data[0], input.layout),
-        ...yAxisTickFormat,
-        ...getAxisCategoryOrderProps(input.data, input.layout),
-        ...getBarProps(input.data, input.layout),
-        ...getYMinMaxValues(input.data[0], input.layout),
-        ...getAxisTickProps(input.data, input.layout),
-        ...annotations ? {
-            annotations
-        } : {}
-    };
-};
-export const transformPlotlyJsonToGVBCProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _processedInput_layout, _processedInput_layout1;
-    // Handle object arrays in y values by normalizing the data first
-    let processedInput = {
-        ...input
-    };
-    // Check if any bar traces have object arrays as y values
-    const hasObjectArrayData = input.data.some((series)=>series.type === 'bar' && isObjectArray(series.y));
-    if (hasObjectArrayData) {
-        // Process each trace that has object array y values
-        const processedData = input.data.map((series, index)=>{
-            if (series.type === 'bar' && isObjectArray(series.y)) {
-                // Normalize the object array to create multiple traces for GVBC
-                const { traces } = normalizeObjectArrayForGVBC(series.y, Array.isArray(series.x) ? series.x : undefined);
-                // Return all the new traces, each representing a property from the objects
-                return traces.map((trace)=>({
-                        ...trace,
-                        // Copy other properties from the original series if needed
-                        marker: series.marker
-                    }));
-            }
-            return [
-                series
-            ];
-        }).flat();
-        processedInput = {
-            ...input,
-            data: processedData
-        };
-    }
-    const gvbcDataV2 = [];
-    const secondaryYAxisValues = getSecondaryYAxisValues(processedInput.data, processedInput.layout);
-    const { legends, hideLegend } = getLegendProps(processedInput.data, processedInput.layout, isMultiPlot);
-    let colorScale = undefined;
-    const yAxisTickFormat = getYAxisTickFormat(processedInput.data[0], processedInput.layout);
-    processedInput.data.forEach((series, index1)=>{
-        colorScale = createColorScale(processedInput.layout, series, colorScale);
-        const legend = legends[index1];
-        const legendShape = getLegendShape(series);
-        if (series.type === 'bar') {
-            var _processedInput_layout_template_layout, _processedInput_layout_template, _processedInput_layout, _series_marker;
-            // extract bar colors for each series only once
-            const extractedBarColors = extractColor((_processedInput_layout = processedInput.layout) === null || _processedInput_layout === void 0 ? void 0 : (_processedInput_layout_template = _processedInput_layout.template) === null || _processedInput_layout_template === void 0 ? void 0 : (_processedInput_layout_template_layout = _processedInput_layout_template.layout) === null || _processedInput_layout_template_layout === void 0 ? void 0 : _processedInput_layout_template_layout.colorway, colorwayType, (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color, colorMap, isDarkTheme);
-            gvbcDataV2.push({
-                type: 'bar',
-                legend,
-                key: legend,
-                data: series.x.map((x, xIndex)=>{
-                    var _series_y, _series_marker, _series_marker1, _series_marker_color, _series_marker2, _processedInput_layout_template_layout, _processedInput_layout_template, _processedInput_layout;
-                    if (isInvalidValue(x) || isInvalidValue((_series_y = series.y) === null || _series_y === void 0 ? void 0 : _series_y[xIndex])) {
-                        return;
-                    }
-                    // resolve color for each legend's bars from the colorscale or extracted colors
-                    const color = colorScale ? colorScale(isArrayOrTypedArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) ? (_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : (_series_marker_color = _series_marker2.color) === null || _series_marker_color === void 0 ? void 0 : _series_marker_color[xIndex % ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length] : 0) : resolveColor(extractedBarColors, xIndex, legend, colorMap, (_processedInput_layout = processedInput.layout) === null || _processedInput_layout === void 0 ? void 0 : (_processedInput_layout_template = _processedInput_layout.template) === null || _processedInput_layout_template === void 0 ? void 0 : (_processedInput_layout_template_layout = _processedInput_layout_template.layout) === null || _processedInput_layout_template_layout === void 0 ? void 0 : _processedInput_layout_template_layout.colorway, isDarkTheme);
-                    const opacity = getOpacity(series, xIndex);
-                    const yVal = series.y[xIndex];
-                    // Extract text value for barLabel
-                    let barLabel = Array.isArray(series.text) ? series.text[xIndex] : series.text;
-                    // Apply texttemplate formatting if specified
-                    if (barLabel && series.texttemplate) {
-                        barLabel = formatTextWithTemplate(barLabel, series.texttemplate, xIndex);
-                    }
-                    var _rgb_copy_formatHex8;
-                    return {
-                        x: x.toString(),
-                        y: yVal,
-                        yAxisCalloutData: getFormattedCalloutYData(yVal, yAxisTickFormat),
-                        color: (_rgb_copy_formatHex8 = rgb(color).copy({
-                            opacity
-                        }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : color,
-                        ...barLabel ? {
-                            barLabel: String(barLabel)
-                        } : {}
-                    };
-                }).filter((item)=>typeof item !== 'undefined'),
-                useSecondaryYScale: usesSecondaryYScale(series, processedInput.layout)
-            });
-        } else if (series.type === 'scatter') {
-            var _processedInput_layout_template_layout1, _processedInput_layout_template1, _processedInput_layout1, _series_line, _processedInput_layout_template_layout2, _processedInput_layout_template2, _processedInput_layout2;
-            // extract line colors for each series only once
-            const extractedLineColors = extractColor((_processedInput_layout1 = processedInput.layout) === null || _processedInput_layout1 === void 0 ? void 0 : (_processedInput_layout_template1 = _processedInput_layout1.template) === null || _processedInput_layout_template1 === void 0 ? void 0 : (_processedInput_layout_template_layout1 = _processedInput_layout_template1.layout) === null || _processedInput_layout_template_layout1 === void 0 ? void 0 : _processedInput_layout_template_layout1.colorway, colorwayType, (_series_line = series.line) === null || _series_line === void 0 ? void 0 : _series_line.color, colorMap, isDarkTheme);
-            const lineColor = resolveColor(extractedLineColors, index1, legend, colorMap, (_processedInput_layout2 = processedInput.layout) === null || _processedInput_layout2 === void 0 ? void 0 : (_processedInput_layout_template2 = _processedInput_layout2.template) === null || _processedInput_layout_template2 === void 0 ? void 0 : (_processedInput_layout_template_layout2 = _processedInput_layout_template2.layout) === null || _processedInput_layout_template_layout2 === void 0 ? void 0 : _processedInput_layout_template_layout2.colorway, isDarkTheme);
-            const lineOptions = getLineOptions(series.line);
-            const opacity = getOpacity(series, index1);
-            const validXYRanges = getValidXYRanges(series);
-            validXYRanges.forEach(([rangeStart, rangeEnd])=>{
-                const rangeXValues = series.x.slice(rangeStart, rangeEnd);
-                const rangeYValues = series.y.slice(rangeStart, rangeEnd);
-                var _rgb_copy_formatHex8;
-                gvbcDataV2.push({
-                    type: 'line',
-                    legend,
-                    legendShape,
-                    data: rangeXValues.map((x, i)=>{
-                        const yVal = rangeYValues[i];
-                        return {
-                            x: x.toString(),
-                            y: yVal,
-                            yAxisCalloutData: getFormattedCalloutYData(yVal, yAxisTickFormat)
-                        };
-                    }),
-                    color: (_rgb_copy_formatHex8 = rgb(lineColor).copy({
-                        opacity
-                    }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : lineColor,
-                    lineOptions: {
-                        ...lineOptions !== null && lineOptions !== void 0 ? lineOptions : {},
-                        mode: series.mode
-                    },
-                    useSecondaryYScale: usesSecondaryYScale(series, processedInput.layout)
-                });
-            });
-        }
-    });
-    const annotations = getChartAnnotationsFromLayout(processedInput.data, processedInput.layout, isMultiPlot);
-    var _processedInput_layout_height;
-    return {
-        dataV2: gvbcDataV2,
-        width: (_processedInput_layout = processedInput.layout) === null || _processedInput_layout === void 0 ? void 0 : _processedInput_layout.width,
-        height: (_processedInput_layout_height = (_processedInput_layout1 = processedInput.layout) === null || _processedInput_layout1 === void 0 ? void 0 : _processedInput_layout1.height) !== null && _processedInput_layout_height !== void 0 ? _processedInput_layout_height : 350,
-        barWidth: 'auto',
-        mode: 'plotly',
-        ...secondaryYAxisValues,
-        hideTickOverlap: true,
-        hideLegend,
-        roundCorners: true,
-        showYAxisLables: true,
-        roundedTicks: true,
-        ...getXMinMaxValues(processedInput.data[0], processedInput.layout),
-        ...getTitles(processedInput.layout),
-        ...getAxisCategoryOrderProps(processedInput.data, processedInput.layout),
-        ...getYMinMaxValues(processedInput.data[0], processedInput.layout),
-        ...getXAxisTickFormat(processedInput.data[0], processedInput.layout),
-        ...yAxisTickFormat,
-        ...getBarProps(processedInput.data, processedInput.layout),
-        ...getAxisTickProps(processedInput.data, processedInput.layout),
-        ...annotations ? {
-            annotations
-        } : {}
-    };
-};
-export const transformPlotlyJsonToVBCProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout1;
-    const vbcData = [];
-    const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
-    let colorScale = undefined;
-    input.data.forEach((series, seriesIdx)=>{
-        var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _series_xbins, _series_xbins1, _series_xbins2;
-        if (!series.x) {
-            return;
-        }
-        colorScale = createColorScale(input.layout, series, colorScale);
-        // extract colors for each series only once
-        const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color, colorMap, isDarkTheme);
-        const xValues = [];
-        const yValues = [];
-        series.x.forEach((xVal, index)=>{
-            var _getNumberAtIndexOrDefault;
-            const yVal = (_getNumberAtIndexOrDefault = getNumberAtIndexOrDefault(series.y, index)) !== null && _getNumberAtIndexOrDefault !== void 0 ? _getNumberAtIndexOrDefault : 0;
-            if (isInvalidValue(xVal)) {
-                return;
-            }
-            xValues.push(xVal);
-            yValues.push(yVal);
-        });
-        const isXString = isStringArray(xValues);
-        // TODO: In case of a single bin, add an empty bin of the same size to prevent the
-        // default bar width from being used and ensure the bar spans the full intended range.
-        const xBins = createBins(xValues, (_series_xbins = series.xbins) === null || _series_xbins === void 0 ? void 0 : _series_xbins.start, (_series_xbins1 = series.xbins) === null || _series_xbins1 === void 0 ? void 0 : _series_xbins1.end, (_series_xbins2 = series.xbins) === null || _series_xbins2 === void 0 ? void 0 : _series_xbins2.size);
-        const yBins = xBins.map(()=>[]);
-        let total = 0;
-        xValues.forEach((xVal, index)=>{
-            const binIdx = findBinIndex(xBins, xVal, isXString);
-            if (binIdx !== -1) {
-                yBins[binIdx].push(yValues[index]);
-            }
-        });
-        const y = yBins.map((bin)=>{
-            const yVal = calculateHistFunc(series.histfunc, bin);
-            total += yVal;
-            return yVal;
-        });
-        xBins.forEach((bin, index)=>{
-            var _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout;
-            const legend = legends[seriesIdx];
-            // resolve color for each legend's bars from the colorscale or extracted colors
-            const color = colorScale ? colorScale(isArrayOrTypedArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) ? (_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : (_series_marker_color = _series_marker2.color) === null || _series_marker_color === void 0 ? void 0 : _series_marker_color[index % ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length] : 0) : resolveColor(extractedColors, index, legend, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-            const opacity = getOpacity(series, index);
-            const yVal = calculateHistNorm(series.histnorm, y[index], total, isXString ? bin.length : getBinSize(bin));
-            // Handle text values and texttemplate formatting for histogram bins
-            let barLabel = Array.isArray(series.text) ? series.text[index] : series.text;
-            if (barLabel && series.texttemplate) {
-                barLabel = formatTextWithTemplate(barLabel, series.texttemplate, index);
-            }
-            var _rgb_copy_formatHex8;
-            vbcData.push({
-                x: isXString ? bin.join(', ') : getBinCenter(bin),
-                y: yVal,
-                legend,
-                color: (_rgb_copy_formatHex8 = rgb(color).copy({
-                    opacity
-                }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : color,
-                ...isXString ? {} : {
-                    xAxisCalloutData: `[${bin.x0} - ${bin.x1})`
-                },
-                ...barLabel ? {
-                    barLabel: String(barLabel)
-                } : {}
-            });
-        });
-    });
-    const annotations = getChartAnnotationsFromLayout(input.data, input.layout, isMultiPlot);
-    var _input_layout_height;
-    return {
-        data: vbcData,
-        width: (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.width,
-        height: (_input_layout_height = (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 350,
-        mode: 'histogram',
-        hideTickOverlap: true,
-        maxBarWidth: 50,
-        hideLegend,
-        roundCorners: true,
-        showYAxisLables: true,
-        roundedTicks: true,
-        ...getXMinMaxValues(input.data[0], input.layout),
-        ...getTitles(input.layout),
-        ...getYMinMaxValues(input.data[0], input.layout),
-        ...getAxisCategoryOrderProps(input.data, input.layout),
-        ...annotations ? {
-            annotations
-        } : {}
-    };
-};
-export const transformPlotlyJsonToAreaChartProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    return transformPlotlyJsonToScatterTraceProps(input, isMultiPlot, 'area', colorMap, colorwayType, isDarkTheme);
-};
-export const transformPlotlyJsonToLineChartProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    return transformPlotlyJsonToScatterTraceProps(input, isMultiPlot, 'line', colorMap, colorwayType, isDarkTheme);
-};
-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_, _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',
-        'text+markers',
-        'markers+text',
-        'lines+markers',
-        'markers+line',
-        'text+lines+markers',
-        'lines+markers+text'
-    ].includes((_input_data_ = input.data[0]) === null || _input_data_ === void 0 ? void 0 : _input_data_.mode);
-    const isAreaChart = chartType === 'area';
-    const isScatterChart = chartType === 'scatter';
-    const secondaryYAxisValues = getSecondaryYAxisValues(input.data, input.layout);
-    let mode = 'tonexty';
-    const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
-    const yAxisTickFormat = getYAxisTickFormat(input.data[0], input.layout);
-    const resolveXValue = getAxisValueResolver(getAxisType(input.data, getAxisObjects(input.data, input.layout).x));
-    const chartData = input.data.map((series, index)=>{
-        var _series_mode, _series_line, _series_marker, _series_line1, _input_layout_template_layout, _input_layout_template, _input_layout, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _series_mode1;
-        const colors = isScatterMarkers ? (series === null || series === void 0 ? void 0 : (_series_mode = series.mode) === null || _series_mode === void 0 ? void 0 : _series_mode.includes('line')) ? (_series_line = series.line) === null || _series_line === void 0 ? void 0 : _series_line.color : (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color : (_series_line1 = series.line) === null || _series_line1 === void 0 ? void 0 : _series_line1.color;
-        // extract colors for each series only once
-        const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, colors, colorMap, isDarkTheme);
-        const xValues = series.x;
-        const legend = legends[index];
-        // resolve color for each legend's lines from the extracted colors
-        const seriesColor = resolveColor(extractedColors, index, legend, colorMap, (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, isDarkTheme);
-        const seriesOpacity = getOpacity(series, index);
-        mode = series.fill === 'tozeroy' ? 'tozeroy' : 'tonexty';
-        // if mode contains 'text', we prioritize showing the text over curving the line
-        const lineOptions = !((_series_mode1 = series.mode) === null || _series_mode1 === void 0 ? void 0 : _series_mode1.includes('text')) && series.type !== 'scatterpolar' ? getLineOptions(series.line) : undefined;
-        const legendShape = getLegendShape(series);
-        const validXYRanges = getValidXYRanges(series, resolveXValue);
-        return validXYRanges.map(([rangeStart, rangeEnd], rangeIdx)=>{
-            var _series_marker, _series_marker1, _series_marker2, _input_layout, _input_layout_polar_angularaxis, _input_layout_polar, _input_layout1, _input_layout_polar_angularaxis1, _input_layout_polar1, _input_layout2;
-            const rangeXValues = xValues.slice(rangeStart, rangeEnd);
-            const rangeYValues = series.y.slice(rangeStart, rangeEnd);
-            const markerSizes = isArrayOrTypedArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.size) ? series.marker.size.slice(rangeStart, rangeEnd) : [];
-            const markerColors = isArrayOrTypedArray((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color) ? series.marker.color.slice(rangeStart, rangeEnd) : Array.isArray((_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : _series_marker2.color) ? series.marker.color.slice(rangeStart, rangeEnd) : undefined;
-            const textValues = Array.isArray(series.text) ? series.text.slice(rangeStart, rangeEnd) : undefined;
-            var _rgb_copy_formatHex8;
-            return {
-                legend,
-                legendShape,
-                data: rangeXValues.map((x, i)=>{
-                    var _series_marker, _series_marker1;
-                    return {
-                        x: resolveXValue(x),
-                        y: rangeYValues[i],
-                        ...Array.isArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.size) ? {
-                            markerSize: markerSizes[i]
-                        } : typeof ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.size) === 'number' ? {
-                            markerSize: series.marker.size
-                        } : {},
-                        ...markerColors ? {
-                            markerColor: markerColors[i]
-                        } : {},
-                        ...textValues ? {
-                            text: textValues[i]
-                        } : {},
-                        yAxisCalloutData: getFormattedCalloutYData(rangeYValues[i], yAxisTickFormat)
-                    };
-                }),
-                color: (_rgb_copy_formatHex8 = rgb(seriesColor).copy({
-                    opacity: seriesOpacity
-                }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : seriesColor,
-                lineOptions: {
-                    ...lineOptions !== null && lineOptions !== void 0 ? lineOptions : {},
-                    mode: series.type !== 'scatterpolar' ? series.mode : 'scatterpolar',
-                    // originXOffset is not typed on Layout, but may be present in input.layout as a part of projection of
-                    // scatter polar coordingates to cartesian coordinates
-                    ...series.type === 'scatterpolar' ? {
-                        originXOffset: (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.__polarOriginX,
-                        direction: (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_polar = _input_layout1.polar) === null || _input_layout_polar === void 0 ? void 0 : (_input_layout_polar_angularaxis = _input_layout_polar.angularaxis) === null || _input_layout_polar_angularaxis === void 0 ? void 0 : _input_layout_polar_angularaxis.direction,
-                        rotation: (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : (_input_layout_polar1 = _input_layout2.polar) === null || _input_layout_polar1 === void 0 ? void 0 : (_input_layout_polar_angularaxis1 = _input_layout_polar1.angularaxis) === null || _input_layout_polar_angularaxis1 === void 0 ? void 0 : _input_layout_polar_angularaxis1.rotation,
-                        axisLabel: series.__axisLabel ? series.__axisLabel : {},
-                        fill: series.fill
-                    } : {}
-                },
-                useSecondaryYScale: usesSecondaryYScale(series, input.layout)
-            };
-        });
-    }).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;
-    const xCategories = extractXCategories(input.data);
-    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 (typeof val === 'number' && Array.isArray(xCategories)) {
-                if (xCategories[val] !== undefined) {
-                    return xCategories[val];
-                } else {
-                    return xCategories[shapeIdx];
-                }
-            }
-            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: resolveXValue(resolveX(shape.x0)),
-                    y: resolveY(shape.y0)
-                },
-                {
-                    x: resolveXValue(resolveX(shape.x1)),
-                    y: resolveY(shape.y1)
-                }
-            ],
-            color: (_rgb_formatHex8 = rgb(lineColor).formatHex8()) !== null && _rgb_formatHex8 !== void 0 ? _rgb_formatHex8 : lineColor,
-            lineOptions: getLineOptions(shape.line),
-            useSecondaryYScale: false
-        };
-    });
-    const yMinMax = getYMinMaxValues(input.data[0], input.layout);
-    if (yMinMax.yMinValue === undefined && yMinMax.yMaxValue === undefined) {
-        const yMinMaxValues = findNumericMinMaxOfY(chartData);
-        yMinMax.yMinValue = yMinMaxValues.startValue;
-        yMinMax.yMaxValue = yMinMaxValues.endValue;
-    }
-    const numDataPoints = chartData.reduce((total, lineChartPoints)=>total + lineChartPoints.data.length, 0);
-    const chartProps = {
-        lineChartData: [
-            ...chartData,
-            ...lineShape
-        ]
-    };
-    const scatterChartProps = {
-        scatterChartData: [
-            ...chartData,
-            ...lineShape
-        ]
-    };
-    const annotations = getChartAnnotationsFromLayout(input.data, input.layout, isMultiPlot);
-    var _input_layout_height;
-    const commonProps = {
-        supportNegativeData: true,
-        ...secondaryYAxisValues,
-        width: (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.width,
-        height: (_input_layout_height = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 350,
-        hideTickOverlap: true,
-        hideLegend,
-        useUTC: false,
-        optimizeLargeData: numDataPoints > 1000,
-        showYAxisLables: true,
-        roundedTicks: true,
-        ...getXMinMaxValues(input.data[0], input.layout),
-        ...getTitles(input.layout),
-        ...getXAxisTickFormat(input.data[0], input.layout),
-        ...yAxisTickFormat,
-        ...getAxisScaleTypeProps(input.data, input.layout),
-        ...getAxisTickProps(input.data, input.layout),
-        ...annotations ? {
-            annotations
-        } : {}
-    };
-    if (isAreaChart) {
-        return {
-            data: chartProps,
-            mode,
-            ...commonProps
-        };
-    } else {
-        return {
-            data: isScatterChart ? scatterChartProps : chartProps,
-            ...commonProps,
-            ...yMinMax,
-            ...isScatterChart ? {
-                showYAxisLablesTooltip: true,
-                ...getAxisCategoryOrderProps(input.data, input.layout)
-            } : {},
-            ...!isScatterChart && (()=>{
-                const bars = mapColorFillBars(input.layout);
-                return bars && !bars.includes(null) ? {
-                    colorFillBars: bars
-                } : {};
-            })()
-        };
-    }
-};
-export const transformPlotlyJsonToHorizontalBarWithAxisProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout_margin, _input_layout1, _input_layout_margin1, _input_layout2, _input_layout_yaxis2, _input_layout3, _input_layout_yaxis21, _input_layout4, _input_layout_yaxis2_title, _input_layout_yaxis22, _input_layout5, _input_layout6;
-    const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
-    let colorScale = undefined;
-    const chartData = input.data.map((series, index)=>{
-        var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker;
-        colorScale = createColorScale(input.layout, series, colorScale);
-        // extract colors for each series only once
-        const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color, colorMap, isDarkTheme);
-        const legend = legends[index];
-        return series.y.map((yValue, i)=>{
-            var _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout, _series_x, _series_text;
-            if (isInvalidValue(yValue)) {
-                return null;
-            }
-            // resolve color for each legend's bars from the colorscale or extracted colors
-            const color = colorScale ? colorScale(isArrayOrTypedArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) ? (_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : (_series_marker_color = _series_marker2.color) === null || _series_marker_color === void 0 ? void 0 : _series_marker_color[i % ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length] : 0) : resolveColor(extractedColors, i, legend, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-            const opacity = getOpacity(series, i);
-            var _rgb_copy_formatHex8;
-            return {
-                x: isInvalidValue((_series_x = series.x) === null || _series_x === void 0 ? void 0 : _series_x[i]) ? 0 : series.x[i],
-                y: yValue,
-                legend,
-                color: (_rgb_copy_formatHex8 = rgb(color).copy({
-                    opacity
-                }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : color,
-                ...((_series_text = series.text) === null || _series_text === void 0 ? void 0 : _series_text[i]) ? {
-                    barLabel: series.text[i].toString()
-                } : {}
-            };
-        }).filter((point)=>point !== null);
-    }).flat();
-    var _input_layout_height;
-    const chartHeight = (_input_layout_height = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 450;
-    var _input_layout_margin_l;
-    const margin = (_input_layout_margin_l = (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_margin = _input_layout1.margin) === null || _input_layout_margin === void 0 ? void 0 : _input_layout_margin.l) !== null && _input_layout_margin_l !== void 0 ? _input_layout_margin_l : 0;
-    var _input_layout_margin_pad;
-    const padding = (_input_layout_margin_pad = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : (_input_layout_margin1 = _input_layout2.margin) === null || _input_layout_margin1 === void 0 ? void 0 : _input_layout_margin1.pad) !== null && _input_layout_margin_pad !== void 0 ? _input_layout_margin_pad : 0;
-    const availableHeight = chartHeight - margin - padding;
-    const numberOfRows = new Set(chartData.map((d)=>d.y)).size || 1;
-    const scalingFactor = 0.01;
-    const gapFactor = 1 / (1 + scalingFactor * numberOfRows);
-    const barHeight = availableHeight / (numberOfRows * (1 + gapFactor));
-    return {
-        data: chartData,
-        secondaryYAxistitle: typeof ((_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : (_input_layout_yaxis2 = _input_layout3.yaxis2) === null || _input_layout_yaxis2 === void 0 ? void 0 : _input_layout_yaxis2.title) === 'string' ? (_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : (_input_layout_yaxis21 = _input_layout4.yaxis2) === null || _input_layout_yaxis21 === void 0 ? void 0 : _input_layout_yaxis21.title : ((_input_layout5 = input.layout) === null || _input_layout5 === void 0 ? void 0 : (_input_layout_yaxis22 = _input_layout5.yaxis2) === null || _input_layout_yaxis22 === void 0 ? void 0 : (_input_layout_yaxis2_title = _input_layout_yaxis22.title) === null || _input_layout_yaxis2_title === void 0 ? void 0 : _input_layout_yaxis2_title.text) || '',
-        barHeight,
-        showYAxisLables: true,
-        height: chartHeight,
-        width: (_input_layout6 = input.layout) === null || _input_layout6 === void 0 ? void 0 : _input_layout6.width,
-        hideTickOverlap: true,
-        noOfCharsToTruncate: 20,
-        showYAxisLablesTooltip: true,
-        hideLegend,
-        roundCorners: true,
-        roundedTicks: true,
-        ...getXMinMaxValues(input.data[0], input.layout),
-        ...getTitles(input.layout),
-        ...getAxisCategoryOrderProps(input.data, input.layout),
-        ...getBarProps(input.data, input.layout, true),
-        ...getAxisTickProps(input.data, input.layout)
-    };
-};
-export const transformPlotlyJsonToGanttChartProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout1;
-    const data = input.data.filter((series)=>series.type !== 'scatter' || series.mode !== 'markers');
-    const { legends, hideLegend } = getLegendProps(data, input.layout, isMultiPlot);
-    let colorScale = undefined;
-    const xAxisType = getAxisType(data, getAxisObjects(data, input.layout).x);
-    const resolveXValue = getAxisValueResolver(xAxisType, parseLocalDate);
-    const resolveGanttXValue = (value)=>{
-        const resolvedValue = resolveXValue(value);
-        return typeof resolvedValue === 'string' ? 0 : resolvedValue !== null && resolvedValue !== void 0 ? resolvedValue : 0;
-    };
-    const isXDate = xAxisType === 'date';
-    const ganttData = [];
-    data.forEach((series, index)=>{
-        const legend = legends[index];
-        if (series.type === 'bar') {
-            var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker;
-            colorScale = createColorScale(input.layout, series, colorScale);
-            // extract colors for each series only once
-            const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color, colorMap, isDarkTheme);
-            series.y.forEach((yVal, i)=>{
-                var _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout, _series_x;
-                if (isInvalidValue(yVal)) {
-                    return;
-                }
-                // resolve color for each legend's bars from the colorscale or extracted colors
-                const color = colorScale ? colorScale(isArrayOrTypedArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) ? (_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : (_series_marker_color = _series_marker2.color) === null || _series_marker_color === void 0 ? void 0 : _series_marker_color[i % ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length] : 0) : resolveColor(extractedColors, i, legend, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-                const opacity = getOpacity(series, i);
-                const base = +resolveGanttXValue(isArrayOrTypedArray(series.base) ? series.base[i] : series.base);
-                const xVal = +resolveGanttXValue((_series_x = series.x) === null || _series_x === void 0 ? void 0 : _series_x[i]);
-                var _rgb_copy_formatHex8;
-                ganttData.push({
-                    x: {
-                        start: isXDate ? new Date(base) : base,
-                        end: isXDate ? new Date(base + xVal) : base + xVal
-                    },
-                    y: yVal,
-                    legend,
-                    color: (_rgb_copy_formatHex8 = rgb(color).copy({
-                        opacity
-                    }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : color
-                });
-            });
-        } else if (series.type === 'scatter' && series.mode === 'none' && series.fill === 'toself') {
-            for(let i = 0; i < series.y.length; i += 5){
-                if (isInvalidValue(series.y[i]) || isInvalidValue(series.y[i + 3])) {
-                    continue;
-                }
-                const x0 = resolveGanttXValue(series.x[i]);
-                const x1 = resolveGanttXValue(series.x[i + 1]);
-                const y0 = series.y[i];
-                const y1 = series.y[i + 3];
-                ganttData.push({
-                    x: {
-                        start: x0,
-                        end: x1
-                    },
-                    y: Math.round((y0 + y1) / 2),
-                    legend,
-                    color: series.fillcolor
-                });
-            }
-        }
-    });
-    var _input_layout_height;
-    return {
-        data: ganttData,
-        showYAxisLables: true,
-        height: (_input_layout_height = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 350,
-        width: (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.width,
-        hideTickOverlap: true,
-        hideLegend,
-        noOfCharsToTruncate: 20,
-        showYAxisLablesTooltip: true,
-        roundCorners: true,
-        useUTC: false,
-        ...getTitles(input.layout),
-        ...getAxisCategoryOrderProps(data, input.layout),
-        ...getBarProps(data, input.layout, true),
-        ...getAxisTickProps(data, input.layout)
-    };
-};
-export const transformPlotlyJsonToHeatmapProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout1, _input_layout_coloraxis, _input_layout2, _input_layout_template_layout, _input_layout_template, _input_layout3, _input_layout_template_data_histogram2d_, _input_layout_template_data_histogram2d, _input_layout_template_data, _input_layout_template1, _input_layout4, _input_layout_template_data_heatmap_, _input_layout_template_data_heatmap, _input_layout_template_data1, _input_layout_template2, _input_layout5, _input_layout6, _input_layout7;
-    const firstData = input.data[0];
-    const heatmapDataPoints = [];
-    let zMin = Number.POSITIVE_INFINITY;
-    let zMax = Number.NEGATIVE_INFINITY;
-    // Build a 2D array of annotations based on their grid position
-    const annotationGrid = [];
-    const rawAnnotations = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.annotations;
-    if (rawAnnotations) {
-        const annotationsArray = Array.isArray(rawAnnotations) ? rawAnnotations : [
-            rawAnnotations
-        ];
-        // Collect all unique x and y values from valid annotations
-        const xSet = new Set();
-        const ySet = new Set();
-        const validAnnotations = [];
-        annotationsArray.forEach((a)=>{
-            if (a && typeof a.x === 'number' && typeof a.y === 'number' && typeof a.text === 'string' && (a.xref === 'x' || a.xref === undefined) && (a.yref === 'y' || a.yref === undefined)) {
-                xSet.add(a.x);
-                ySet.add(a.y);
-                validAnnotations.push({
-                    x: a.x,
-                    y: a.y,
-                    text: cleanText(a.text)
-                });
-            }
-        });
-        if (validAnnotations.length > 0) {
-            // Get sorted unique x and y values
-            const xValues = Array.from(xSet).sort((a, b)=>a - b);
-            const yValues = Array.from(ySet).sort((a, b)=>a - b);
-            // Initialize 2D grid and populate
-            validAnnotations.forEach((annotation)=>{
-                const xIdx = xValues.indexOf(annotation.x);
-                const yIdx = yValues.indexOf(annotation.y);
-                if (!annotationGrid[yIdx]) {
-                    annotationGrid[yIdx] = [];
-                }
-                annotationGrid[yIdx][xIdx] = annotation.text;
-            });
-        }
-    }
-    // Helper function to get annotation from 2D grid by index
-    const getAnnotationByIndex = (xIdx, yIdx)=>{
-        var _annotationGrid_yIdx;
-        return (_annotationGrid_yIdx = annotationGrid[yIdx]) === null || _annotationGrid_yIdx === void 0 ? void 0 : _annotationGrid_yIdx[xIdx];
-    };
-    if (firstData.type === 'histogram2d') {
-        var _firstData_x, _firstData_xbins, _firstData_xbins1, _firstData_xbins2, _firstData_ybins, _firstData_ybins1, _firstData_ybins2;
-        const xValues = [];
-        const yValues = [];
-        const zValues = [];
-        (_firstData_x = firstData.x) === null || _firstData_x === void 0 ? void 0 : _firstData_x.forEach((xVal, index)=>{
-            var _firstData_y;
-            var _getNumberAtIndexOrDefault;
-            const zVal = (_getNumberAtIndexOrDefault = getNumberAtIndexOrDefault(firstData.z, index)) !== null && _getNumberAtIndexOrDefault !== void 0 ? _getNumberAtIndexOrDefault : 0;
-            if (isInvalidValue(xVal) || isInvalidValue((_firstData_y = firstData.y) === null || _firstData_y === void 0 ? void 0 : _firstData_y[index])) {
-                return;
-            }
-            xValues.push(xVal);
-            yValues.push(firstData.y[index]);
-            zValues.push(zVal);
-        });
-        const isXString = isStringArray(xValues);
-        const isYString = isStringArray(yValues);
-        const xBins = createBins(xValues, (_firstData_xbins = firstData.xbins) === null || _firstData_xbins === void 0 ? void 0 : _firstData_xbins.start, (_firstData_xbins1 = firstData.xbins) === null || _firstData_xbins1 === void 0 ? void 0 : _firstData_xbins1.end, (_firstData_xbins2 = firstData.xbins) === null || _firstData_xbins2 === void 0 ? void 0 : _firstData_xbins2.size);
-        const yBins = createBins(yValues, (_firstData_ybins = firstData.ybins) === null || _firstData_ybins === void 0 ? void 0 : _firstData_ybins.start, (_firstData_ybins1 = firstData.ybins) === null || _firstData_ybins1 === void 0 ? void 0 : _firstData_ybins1.end, (_firstData_ybins2 = firstData.ybins) === null || _firstData_ybins2 === void 0 ? void 0 : _firstData_ybins2.size);
-        const zBins = yBins.map(()=>xBins.map(()=>[]));
-        let total = 0;
-        xValues.forEach((xVal, index)=>{
-            const xBinIdx = findBinIndex(xBins, xVal, isXString);
-            const yBinIdx = findBinIndex(yBins, yValues[index], isYString);
-            if (xBinIdx !== -1 && yBinIdx !== -1) {
-                zBins[yBinIdx][xBinIdx].push(zValues[index]);
-            }
-        });
-        const z = zBins.map((row)=>{
-            return row.map((bin)=>{
-                const zVal = calculateHistFunc(firstData.histfunc, bin);
-                total += zVal;
-                return zVal;
-            });
-        });
-        xBins.forEach((xBin, xIdx)=>{
-            yBins.forEach((yBin, yIdx)=>{
-                const zVal = calculateHistNorm(firstData.histnorm, z[yIdx][xIdx], total, isXString ? xBin.length : getBinSize(xBin), isYString ? yBin.length : getBinSize(yBin));
-                const annotationText = getAnnotationByIndex(xIdx, yIdx);
-                heatmapDataPoints.push({
-                    x: isXString ? xBin.join(', ') : getBinCenter(xBin),
-                    y: isYString ? yBin.join(', ') : getBinCenter(yBin),
-                    value: zVal,
-                    rectText: annotationText || zVal
-                });
-                if (typeof zVal === 'number') {
-                    zMin = Math.min(zMin, zVal);
-                    zMax = Math.max(zMax, zVal);
-                }
-            });
-        });
-    } else {
-        var _zArray_;
-        // If x and y are not provided, generate indices based on z dimensions
-        const zArray = firstData.z;
-        const xValues = firstData.x;
-        const yValues = firstData.y;
-        var _zArray_length;
-        // Determine the dimensions from z array
-        const yLength = (_zArray_length = zArray === null || zArray === void 0 ? void 0 : zArray.length) !== null && _zArray_length !== void 0 ? _zArray_length : 0;
-        var _zArray__length;
-        const xLength = (_zArray__length = zArray === null || zArray === void 0 ? void 0 : (_zArray_ = zArray[0]) === null || _zArray_ === void 0 ? void 0 : _zArray_.length) !== null && _zArray__length !== void 0 ? _zArray__length : 0;
-        // Use provided x/y values or generate indices
-        const xData = xValues !== null && xValues !== void 0 ? xValues : Array.from({
-            length: xLength
-        }, (_, i)=>i);
-        const yData = yValues !== null && yValues !== void 0 ? yValues : Array.from({
-            length: yLength
-        }, (_, i)=>yLength - 1 - i);
-        xData.forEach((xVal, xIdx)=>{
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            yData.forEach((yVal, yIdx)=>{
-                var _zArray_yIdx, _input_layout_xaxis, _input_layout, _input_layout_yaxis, _input_layout1;
-                const zVal = zArray === null || zArray === void 0 ? void 0 : (_zArray_yIdx = zArray[yIdx]) === null || _zArray_yIdx === void 0 ? void 0 : _zArray_yIdx[xIdx];
-                const annotationText = getAnnotationByIndex(xIdx, yIdx);
-                heatmapDataPoints.push({
-                    x: ((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_xaxis = _input_layout.xaxis) === null || _input_layout_xaxis === void 0 ? void 0 : _input_layout_xaxis.type) === 'date' ? xVal : xVal !== null && xVal !== void 0 ? xVal : 0,
-                    y: ((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_yaxis = _input_layout1.yaxis) === null || _input_layout_yaxis === void 0 ? void 0 : _input_layout_yaxis.type) === 'date' ? yVal : yVal,
-                    value: zVal,
-                    rectText: annotationText || zVal
-                });
-                if (typeof zVal === 'number') {
-                    zMin = Math.min(zMin, zVal);
-                    zMax = Math.max(zMax, zVal);
-                }
-            });
-        });
-    }
-    var _firstData_name;
-    const heatmapData = {
-        legend: (_firstData_name = firstData.name) !== null && _firstData_name !== void 0 ? _firstData_name : '',
-        data: heatmapDataPoints,
-        value: 0
-    };
-    // Initialize domain and range to default values
-    const defaultDomain = [
-        zMin,
-        (zMax + zMin) / 2,
-        zMax
-    ];
-    const defaultRange = [
-        getColorFromToken(DataVizPalette.color1),
-        getColorFromToken(DataVizPalette.color2),
-        getColorFromToken(DataVizPalette.color3)
-    ];
-    var _firstData_colorscale, _ref, _ref1, _ref2, _ref3;
-    let colorscale = (_ref3 = (_ref2 = (_ref1 = (_ref = (_firstData_colorscale = firstData === null || firstData === void 0 ? void 0 : firstData.colorscale) !== null && _firstData_colorscale !== void 0 ? _firstData_colorscale : (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.colorscale) !== null && _ref !== void 0 ? _ref : (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : (_input_layout_coloraxis = _input_layout2.coloraxis) === null || _input_layout_coloraxis === void 0 ? void 0 : _input_layout_coloraxis.colorscale) !== null && _ref1 !== void 0 ? _ref1 : (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : (_input_layout_template = _input_layout3.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorscale) !== null && _ref2 !== void 0 ? _ref2 : firstData.type === 'histogram2d' && ((_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : (_input_layout_template1 = _input_layout4.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_data = _input_layout_template1.data) === null || _input_layout_template_data === void 0 ? void 0 : (_input_layout_template_data_histogram2d = _input_layout_template_data.histogram2d) === null || _input_layout_template_data_histogram2d === void 0 ? void 0 : (_input_layout_template_data_histogram2d_ = _input_layout_template_data_histogram2d[0]) === null || _input_layout_template_data_histogram2d_ === void 0 ? void 0 : _input_layout_template_data_histogram2d_.colorscale)) !== null && _ref3 !== void 0 ? _ref3 : (_input_layout5 = input.layout) === null || _input_layout5 === void 0 ? void 0 : (_input_layout_template2 = _input_layout5.template) === null || _input_layout_template2 === void 0 ? void 0 : (_input_layout_template_data1 = _input_layout_template2.data) === null || _input_layout_template_data1 === void 0 ? void 0 : (_input_layout_template_data_heatmap = _input_layout_template_data1.heatmap) === null || _input_layout_template_data_heatmap === void 0 ? void 0 : (_input_layout_template_data_heatmap_ = _input_layout_template_data_heatmap[0]) === null || _input_layout_template_data_heatmap_ === void 0 ? void 0 : _input_layout_template_data_heatmap_.colorscale;
-    // determine if the types diverging, sequential or sequentialminus are present in colorscale
-    if (colorscale && typeof colorscale === 'object' && ('diverging' in colorscale || 'sequential' in colorscale || 'sequentialminus' in colorscale)) {
-        const isDivergent = zMin < 0 && zMax > 0; // Data spans both positive and negative values
-        const isSequential = zMin >= 0; // Data is entirely positive
-        const isSequentialMinus = zMax <= 0; // Data is entirely negative
-        if (isDivergent) {
-            colorscale = colorscale === null || colorscale === void 0 ? void 0 : colorscale.diverging;
-        } else if (isSequential) {
-            colorscale = colorscale === null || colorscale === void 0 ? void 0 : colorscale.sequential;
-        } else if (isSequentialMinus) {
-            colorscale = colorscale === null || colorscale === void 0 ? void 0 : colorscale.sequentialminus;
-        }
-    }
-    const domainValuesForColorScale = Array.isArray(colorscale) ? colorscale.map((arr)=>arr[0] * (zMax - zMin) + zMin) : defaultDomain;
-    const rangeValuesForColorScale = Array.isArray(colorscale) ? colorscale.map((arr)=>arr[1]) : defaultRange;
-    var _input_layout_height;
-    return {
-        data: [
-            heatmapData
-        ],
-        domainValuesForColorScale,
-        rangeValuesForColorScale,
-        hideLegend: true,
-        showYAxisLables: true,
-        sortOrder: 'none',
-        width: (_input_layout6 = input.layout) === null || _input_layout6 === void 0 ? void 0 : _input_layout6.width,
-        height: (_input_layout_height = (_input_layout7 = input.layout) === null || _input_layout7 === void 0 ? void 0 : _input_layout7.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 350,
-        hideTickOverlap: true,
-        noOfCharsToTruncate: 20,
-        showYAxisLablesTooltip: true,
-        ...getTitles(input.layout),
-        ...getAxisCategoryOrderProps([
-            firstData
-        ], input.layout),
-        ...getAxisTickProps(input.data, input.layout)
-    };
-};
-export const transformPlotlyJsonToSankeyProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout_template_layout, _input_layout_template, _input_layout, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _node_label, _input_layout2, _input_layout3, _input_layout4;
-    const { link, node } = input.data[0];
-    var _link_value;
-    const validLinks = ((_link_value = link === null || link === void 0 ? void 0 : link.value) !== null && _link_value !== void 0 ? _link_value : []).map((val, index)=>{
-        var _link_source, _link_target;
-        if (isInvalidValue(val) || isInvalidValue(link === null || link === void 0 ? void 0 : (_link_source = link.source) === null || _link_source === void 0 ? void 0 : _link_source[index]) || isInvalidValue(link === null || link === void 0 ? void 0 : (_link_target = link.target) === null || _link_target === void 0 ? void 0 : _link_target[index])) {
-            return null;
-        }
-        return {
-            value: val,
-            source: link === null || link === void 0 ? void 0 : link.source[index],
-            target: link === null || link === void 0 ? void 0 : link.target[index]
-        };
-    })// Filter out negative nodes, unequal nodes and self-references (circular links)
-    .filter((x)=>x !== null && x.source >= 0 && x.target >= 0 && x.source !== x.target);
-    const extractedNodeColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, node === null || node === void 0 ? void 0 : node.color, colorMap, isDarkTheme);
-    const extractedLinkColors = extractColor((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, colorwayType, link === null || link === void 0 ? void 0 : link.color, colorMap, isDarkTheme);
-    const sankeyChartData = {
-        nodes: (_node_label = node.label) === null || _node_label === void 0 ? void 0 : _node_label.map((label, index)=>{
-            var _input_layout_template_layout, _input_layout_template, _input_layout;
-            const color = resolveColor(extractedNodeColors, index, label, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-            return {
-                nodeId: index,
-                name: label,
-                color
-            };
-        }),
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        links: validLinks.map((validLink, index)=>{
-            var _input_layout_template_layout, _input_layout_template, _input_layout;
-            const color = resolveColor(extractedLinkColors, index, validLink.target, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-            return {
-                ...validLink,
-                color
-            };
-        })
-    };
-    // const styles: SankeyChartProps['styles'] = {
-    //   root: {
-    //     ...(input.layout?.font?.size ? { fontSize: input.layout.font?.size } : {}),
-    //   },
-    // };
-    const { chartTitle, titleStyles } = getTitles(input.layout);
-    var _input_layout_height;
-    return {
-        data: {
-            chartTitle,
-            SankeyChartData: sankeyChartData
-        },
-        width: (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.width,
-        height: (_input_layout_height = (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : _input_layout3.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 468,
-        // TODO
-        // styles,
-        hideLegend: isMultiPlot || ((_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : _input_layout4.showlegend) === false,
-        ...titleStyles ? {
-            titleStyles
-        } : {}
-    };
-};
-export const transformPlotlyJsonToGaugeProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _firstData_gauge, _input_layout_template_layout, _input_layout_template, _input_layout, _firstData_gauge_steps, _firstData_gauge1, _firstData_gauge_axis_range, _firstData_gauge_axis, _firstData_gauge2, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _firstData_gauge_axis1, _firstData_gauge3, _firstData_gauge_axis_range1, _firstData_gauge_axis2, _firstData_gauge4, _firstData_delta, _firstData_gauge_axis_range2, _firstData_gauge_axis3, _firstData_gauge5, _firstData_gauge_axis_range3, _firstData_gauge_axis4, _firstData_gauge6, _firstData_gauge_axis_range4, _firstData_gauge_axis5, _firstData_gauge7, _firstData_gauge_axis_range5, _firstData_gauge_axis6, _firstData_gauge8, _input_layout2, _input_layout3, _firstData_gauge_steps1, _firstData_gauge9;
-    const firstData = input.data[0];
-    const stepsColors = ((_firstData_gauge = firstData.gauge) === null || _firstData_gauge === void 0 ? void 0 : _firstData_gauge.steps) ? firstData.gauge.steps.map((step)=>step.color) : undefined;
-    const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, stepsColors, colorMap, isDarkTheme);
-    var _firstData_gauge_axis_range_, _firstData_value, _firstData_gauge_axis_range_1, _firstData_value1;
-    const segments = ((_firstData_gauge1 = firstData.gauge) === null || _firstData_gauge1 === void 0 ? void 0 : (_firstData_gauge_steps = _firstData_gauge1.steps) === null || _firstData_gauge_steps === void 0 ? void 0 : _firstData_gauge_steps.length) ? firstData.gauge.steps.map((step, index)=>{
-        var _input_layout_template_layout, _input_layout_template, _input_layout, _step_range, _step_range1;
-        const legend = step.name || `Segment ${index + 1}`;
-        const color = resolveColor(extractedColors, index, legend, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-        return {
-            legend,
-            size: ((_step_range = step.range) === null || _step_range === void 0 ? void 0 : _step_range[1]) - ((_step_range1 = step.range) === null || _step_range1 === void 0 ? void 0 : _step_range1[0]),
-            color
-        };
-    }) : [
-        {
-            legend: 'Current',
-            size: (_firstData_value = firstData.value) !== null && _firstData_value !== void 0 ? _firstData_value : 0 - ((_firstData_gauge_axis_range_ = (_firstData_gauge2 = firstData.gauge) === null || _firstData_gauge2 === void 0 ? void 0 : (_firstData_gauge_axis = _firstData_gauge2.axis) === null || _firstData_gauge_axis === void 0 ? void 0 : (_firstData_gauge_axis_range = _firstData_gauge_axis.range) === null || _firstData_gauge_axis_range === void 0 ? void 0 : _firstData_gauge_axis_range[0]) !== null && _firstData_gauge_axis_range_ !== void 0 ? _firstData_gauge_axis_range_ : 0),
-            color: _getGaugeAxisColor((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, colorwayType, (_firstData_gauge3 = firstData.gauge) === null || _firstData_gauge3 === void 0 ? void 0 : (_firstData_gauge_axis1 = _firstData_gauge3.axis) === null || _firstData_gauge_axis1 === void 0 ? void 0 : _firstData_gauge_axis1.color, colorMap, isDarkTheme)
-        },
-        {
-            legend: 'Target',
-            size: ((_firstData_gauge_axis_range_1 = (_firstData_gauge4 = firstData.gauge) === null || _firstData_gauge4 === void 0 ? void 0 : (_firstData_gauge_axis2 = _firstData_gauge4.axis) === null || _firstData_gauge_axis2 === void 0 ? void 0 : (_firstData_gauge_axis_range1 = _firstData_gauge_axis2.range) === null || _firstData_gauge_axis_range1 === void 0 ? void 0 : _firstData_gauge_axis_range1[1]) !== null && _firstData_gauge_axis_range_1 !== void 0 ? _firstData_gauge_axis_range_1 : 100) - ((_firstData_value1 = firstData.value) !== null && _firstData_value1 !== void 0 ? _firstData_value1 : 0),
-            color: DataVizPalette.disabled
-        }
-    ];
-    let sublabel;
-    let sublabelColor;
-    if ((_firstData_delta = firstData.delta) === null || _firstData_delta === void 0 ? void 0 : _firstData_delta.reference) {
-        const diff = firstData.value - firstData.delta.reference;
-        if (diff >= 0) {
-            var _input_layout_template_layout2, _input_layout_template2, _input_layout4, _firstData_delta_increasing, _firstData_delta1, _input_layout_template_layout3, _input_layout_template3, _input_layout5;
-            sublabel = `\u25B2 ${diff}`;
-            const extractedIncreasingDeltaColors = extractColor((_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : (_input_layout_template2 = _input_layout4.template) === null || _input_layout_template2 === void 0 ? void 0 : (_input_layout_template_layout2 = _input_layout_template2.layout) === null || _input_layout_template_layout2 === void 0 ? void 0 : _input_layout_template_layout2.colorway, colorwayType, (_firstData_delta1 = firstData.delta) === null || _firstData_delta1 === void 0 ? void 0 : (_firstData_delta_increasing = _firstData_delta1.increasing) === null || _firstData_delta_increasing === void 0 ? void 0 : _firstData_delta_increasing.color, colorMap, isDarkTheme);
-            const color = resolveColor(extractedIncreasingDeltaColors, 0, '', colorMap, (_input_layout5 = input.layout) === null || _input_layout5 === void 0 ? void 0 : (_input_layout_template3 = _input_layout5.template) === null || _input_layout_template3 === void 0 ? void 0 : (_input_layout_template_layout3 = _input_layout_template3.layout) === null || _input_layout_template_layout3 === void 0 ? void 0 : _input_layout_template_layout3.colorway, isDarkTheme);
-            sublabelColor = color;
-        } else {
-            var _input_layout_template_layout4, _input_layout_template4, _input_layout6, _firstData_delta_decreasing, _firstData_delta2, _input_layout_template_layout5, _input_layout_template5, _input_layout7;
-            sublabel = `\u25BC ${Math.abs(diff)}`;
-            const extractedDecreasingDeltaColors = extractColor((_input_layout6 = input.layout) === null || _input_layout6 === void 0 ? void 0 : (_input_layout_template4 = _input_layout6.template) === null || _input_layout_template4 === void 0 ? void 0 : (_input_layout_template_layout4 = _input_layout_template4.layout) === null || _input_layout_template_layout4 === void 0 ? void 0 : _input_layout_template_layout4.colorway, colorwayType, (_firstData_delta2 = firstData.delta) === null || _firstData_delta2 === void 0 ? void 0 : (_firstData_delta_decreasing = _firstData_delta2.decreasing) === null || _firstData_delta_decreasing === void 0 ? void 0 : _firstData_delta_decreasing.color, colorMap, isDarkTheme);
-            const color = resolveColor(extractedDecreasingDeltaColors, 0, '', colorMap, (_input_layout7 = input.layout) === null || _input_layout7 === void 0 ? void 0 : (_input_layout_template5 = _input_layout7.template) === null || _input_layout_template5 === void 0 ? void 0 : (_input_layout_template_layout5 = _input_layout_template5.layout) === null || _input_layout_template_layout5 === void 0 ? void 0 : _input_layout_template_layout5.colorway, isDarkTheme);
-            sublabelColor = color;
-        }
-    }
-    const styles = {
-        sublabel: sublabelColor
-    };
-    const { chartTitle, titleStyles } = getTitles(input.layout);
-    var _firstData_value2, _input_layout_height;
-    return {
-        segments,
-        chartValue: (_firstData_value2 = firstData.value) !== null && _firstData_value2 !== void 0 ? _firstData_value2 : 0,
-        chartTitle,
-        sublabel,
-        // range values can be null
-        minValue: typeof ((_firstData_gauge5 = firstData.gauge) === null || _firstData_gauge5 === void 0 ? void 0 : (_firstData_gauge_axis3 = _firstData_gauge5.axis) === null || _firstData_gauge_axis3 === void 0 ? void 0 : (_firstData_gauge_axis_range2 = _firstData_gauge_axis3.range) === null || _firstData_gauge_axis_range2 === void 0 ? void 0 : _firstData_gauge_axis_range2[0]) === 'number' ? (_firstData_gauge6 = firstData.gauge) === null || _firstData_gauge6 === void 0 ? void 0 : (_firstData_gauge_axis4 = _firstData_gauge6.axis) === null || _firstData_gauge_axis4 === void 0 ? void 0 : (_firstData_gauge_axis_range3 = _firstData_gauge_axis4.range) === null || _firstData_gauge_axis_range3 === void 0 ? void 0 : _firstData_gauge_axis_range3[0] : undefined,
-        maxValue: typeof ((_firstData_gauge7 = firstData.gauge) === null || _firstData_gauge7 === void 0 ? void 0 : (_firstData_gauge_axis5 = _firstData_gauge7.axis) === null || _firstData_gauge_axis5 === void 0 ? void 0 : (_firstData_gauge_axis_range4 = _firstData_gauge_axis5.range) === null || _firstData_gauge_axis_range4 === void 0 ? void 0 : _firstData_gauge_axis_range4[1]) === 'number' ? (_firstData_gauge8 = firstData.gauge) === null || _firstData_gauge8 === void 0 ? void 0 : (_firstData_gauge_axis6 = _firstData_gauge8.axis) === null || _firstData_gauge_axis6 === void 0 ? void 0 : (_firstData_gauge_axis_range5 = _firstData_gauge_axis6.range) === null || _firstData_gauge_axis_range5 === void 0 ? void 0 : _firstData_gauge_axis_range5[1] : undefined,
-        chartValueFormat: ()=>{
-            var _firstData_value;
-            var _firstData_value_toString;
-            return (_firstData_value_toString = (_firstData_value = firstData.value) === null || _firstData_value === void 0 ? void 0 : _firstData_value.toString()) !== null && _firstData_value_toString !== void 0 ? _firstData_value_toString : '';
-        },
-        width: (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.width,
-        height: (_input_layout_height = (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : _input_layout3.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 220,
-        // TODO
-        // styles,
-        variant: ((_firstData_gauge9 = firstData.gauge) === null || _firstData_gauge9 === void 0 ? void 0 : (_firstData_gauge_steps1 = _firstData_gauge9.steps) === null || _firstData_gauge_steps1 === void 0 ? void 0 : _firstData_gauge_steps1.length) ? 'multiple-segments' : 'single-segment',
-        styles,
-        roundCorners: true,
-        ...titleStyles ? {
-            titleStyles
-        } : {}
-    };
-};
-const cleanText = (text)=>{
-    return text.replace(/&lt;[^&]*?&gt;/g, '').replace(/<[^>]*>/g, '').replace(/&lt;br&gt;|\\u003cbr\\u003e|<br>/gi, '').replace(/\$[^$]*\$/g, '$').trim();
-};
-const formatValue = (value, colIndex, cells)=>{
-    if (value === null || typeof value === 'boolean') {
-        return value;
-    }
-    const formatStr = Array.isArray(cells.format) ? cells.format[colIndex] : cells.format;
-    const prefix = Array.isArray(cells.prefix) ? cells.prefix[colIndex] : cells.prefix;
-    const suffix = Array.isArray(cells.suffix) ? cells.suffix[colIndex] : cells.suffix;
-    let formatted = value;
-    if (typeof value === 'number') {
-        if (typeof formatStr === 'string') {
-            try {
-                formatted = d3Format(formatStr)(value);
-            } catch  {
-                formatted = formatScientificLimitWidth(value);
-            }
-        } else {
-            formatted = formatScientificLimitWidth(value);
-        }
-    }
-    return `${prefix !== null && prefix !== void 0 ? prefix : ''}${formatted}${suffix !== null && suffix !== void 0 ? suffix : ''}`;
-};
-function resolveCellStyle(raw, rowIndex, colIndex) {
-    if (Array.isArray(raw)) {
-        var _raw_colIndex;
-        const rowEntry = (_raw_colIndex = raw[colIndex]) !== null && _raw_colIndex !== void 0 ? _raw_colIndex : raw[0];
-        if (Array.isArray(rowEntry)) {
-            var _rowEntry_rowIndex;
-            return (_rowEntry_rowIndex = rowEntry[rowIndex]) !== null && _rowEntry_rowIndex !== void 0 ? _rowEntry_rowIndex : rowEntry[0];
-        }
-        return rowEntry;
-    }
-    return raw;
-}
-function mergeCells(tableCells, templateCells) {
-    var _tableCells_values, _ref, _tableCells_align, _templateCells_fill, _tableCells_fill, _templateCells_font, _tableCells_font, _tableCells_format, _tableCells_prefix, _tableCells_suffix;
-    return {
-        values: (_ref = (_tableCells_values = tableCells === null || tableCells === void 0 ? void 0 : tableCells.values) !== null && _tableCells_values !== void 0 ? _tableCells_values : templateCells === null || templateCells === void 0 ? void 0 : templateCells.values) !== null && _ref !== void 0 ? _ref : [],
-        align: (_tableCells_align = tableCells === null || tableCells === void 0 ? void 0 : tableCells.align) !== null && _tableCells_align !== void 0 ? _tableCells_align : templateCells === null || templateCells === void 0 ? void 0 : templateCells.align,
-        fill: {
-            ...(_templateCells_fill = templateCells === null || templateCells === void 0 ? void 0 : templateCells.fill) !== null && _templateCells_fill !== void 0 ? _templateCells_fill : {},
-            ...(_tableCells_fill = tableCells === null || tableCells === void 0 ? void 0 : tableCells.fill) !== null && _tableCells_fill !== void 0 ? _tableCells_fill : {}
-        },
-        font: {
-            ...(_templateCells_font = templateCells === null || templateCells === void 0 ? void 0 : templateCells.font) !== null && _templateCells_font !== void 0 ? _templateCells_font : {},
-            ...(_tableCells_font = tableCells === null || tableCells === void 0 ? void 0 : tableCells.font) !== null && _tableCells_font !== void 0 ? _tableCells_font : {}
-        },
-        format: (_tableCells_format = tableCells === null || tableCells === void 0 ? void 0 : tableCells.format) !== null && _tableCells_format !== void 0 ? _tableCells_format : templateCells === null || templateCells === void 0 ? void 0 : templateCells.format,
-        prefix: (_tableCells_prefix = tableCells === null || tableCells === void 0 ? void 0 : tableCells.prefix) !== null && _tableCells_prefix !== void 0 ? _tableCells_prefix : templateCells === null || templateCells === void 0 ? void 0 : templateCells.prefix,
-        suffix: (_tableCells_suffix = tableCells === null || tableCells === void 0 ? void 0 : tableCells.suffix) !== null && _tableCells_suffix !== void 0 ? _tableCells_suffix : templateCells === null || templateCells === void 0 ? void 0 : templateCells.suffix
-    };
-}
-export const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _tableData_cells, _input_layout_template_data_table_, _input_layout_template_data_table, _input_layout_template_data, _input_layout_template, _input_layout, _input_layout_font, _input_layout1, _input_layout_template_data_table_1, _input_layout_template_data_table1, _input_layout_template_data1, _input_layout_template1, _input_layout2, _tableData_header, _input_layout3, _input_layout4;
-    const tableData = input.data[0];
-    const normalizeHeaders = (values, header)=>{
-        const cleanedValues = Array.isArray(values[0]) ? values.map((row)=>row.map((cell)=>cleanText(cell)).filter(Boolean).join(' ')) : values.map((cell)=>cleanText(cell));
-        return cleanedValues.map((value, colIndex)=>{
-            var _header_font, _header_font1, _header_fill;
-            //headers are at first row only
-            const rowIndex = 0;
-            const fontColor = resolveCellStyle(header === null || header === void 0 ? void 0 : (_header_font = header.font) === null || _header_font === void 0 ? void 0 : _header_font.color, rowIndex, colIndex);
-            const fontSize = resolveCellStyle(header === null || header === void 0 ? void 0 : (_header_font1 = header.font) === null || _header_font1 === void 0 ? void 0 : _header_font1.size, rowIndex, colIndex);
-            const backgroundColor = resolveCellStyle(header === null || header === void 0 ? void 0 : (_header_fill = header.fill) === null || _header_fill === void 0 ? void 0 : _header_fill.color, rowIndex, colIndex);
-            const textAlign = resolveCellStyle(header === null || header === void 0 ? void 0 : header.align, rowIndex, colIndex);
-            const style = {
-                ...typeof fontColor === 'string' ? {
-                    color: fontColor
-                } : {},
-                ...typeof fontSize === 'number' ? {
-                    fontSize
-                } : {},
-                ...typeof backgroundColor === 'string' ? {
-                    backgroundColor
-                } : {},
-                ...textAlign ? {
-                    textAlign
-                } : {}
-            };
-            return {
-                value,
-                style
-            };
-        });
-    };
-    var _tableData_cells_values;
-    const columns = (_tableData_cells_values = (_tableData_cells = tableData.cells) === null || _tableData_cells === void 0 ? void 0 : _tableData_cells.values) !== null && _tableData_cells_values !== void 0 ? _tableData_cells_values : [];
-    const cells = mergeCells(tableData.cells, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_data = _input_layout_template.data) === null || _input_layout_template_data === void 0 ? void 0 : (_input_layout_template_data_table = _input_layout_template_data.table) === null || _input_layout_template_data_table === void 0 ? void 0 : (_input_layout_template_data_table_ = _input_layout_template_data_table[0]) === null || _input_layout_template_data_table_ === void 0 ? void 0 : _input_layout_template_data_table_.cells);
-    const rows = columns[0].map((_, rowIndex)=>columns.map((col, colIndex)=>{
-            var _cells_font, _cells_font1, _cells_fill;
-            const cellValue = col[rowIndex];
-            const cleanValue = typeof cellValue === 'string' ? cleanText(cellValue) : cellValue;
-            const formattedValue = typeof cleanValue === 'string' || typeof cleanValue === 'number' ? formatValue(cleanValue, colIndex, cells) : cleanValue;
-            const fontColor = resolveCellStyle(cells === null || cells === void 0 ? void 0 : (_cells_font = cells.font) === null || _cells_font === void 0 ? void 0 : _cells_font.color, rowIndex, colIndex);
-            const fontSize = resolveCellStyle(cells === null || cells === void 0 ? void 0 : (_cells_font1 = cells.font) === null || _cells_font1 === void 0 ? void 0 : _cells_font1.size, rowIndex, colIndex);
-            const backgroundColor = resolveCellStyle(cells === null || cells === void 0 ? void 0 : (_cells_fill = cells.fill) === null || _cells_fill === void 0 ? void 0 : _cells_fill.color, rowIndex, colIndex);
-            const textAlign = resolveCellStyle(cells === null || cells === void 0 ? void 0 : cells.align, rowIndex, colIndex);
-            const style = {
-                ...fontColor ? {
-                    color: fontColor
-                } : {},
-                ...typeof fontSize === 'number' ? {
-                    fontSize
-                } : {},
-                ...backgroundColor ? {
-                    backgroundColor
-                } : {},
-                ...textAlign ? {
-                    textAlign
-                } : {}
-            };
-            return {
-                value: formattedValue,
-                style
-            };
-        }));
-    const styles = {
-        root: {
-            ...((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_font = _input_layout1.font) === null || _input_layout_font === void 0 ? void 0 : _input_layout_font.size) ? {
-                fontSize: input.layout.font.size
-            } : {}
-        }
-    };
-    const templateHeader = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : (_input_layout_template1 = _input_layout2.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_data1 = _input_layout_template1.data) === null || _input_layout_template_data1 === void 0 ? void 0 : (_input_layout_template_data_table1 = _input_layout_template_data1.table) === null || _input_layout_template_data_table1 === void 0 ? void 0 : (_input_layout_template_data_table_1 = _input_layout_template_data_table1[0]) === null || _input_layout_template_data_table_1 === void 0 ? void 0 : _input_layout_template_data_table_1.header;
-    const tableHeader = tableData.header;
-    var _tableHeader_align, _templateHeader_fill, _tableHeader_fill, _templateHeader_font, _tableHeader_font, _tableHeader_values, _ref;
-    const header = {
-        align: (_tableHeader_align = tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.align) !== null && _tableHeader_align !== void 0 ? _tableHeader_align : templateHeader === null || templateHeader === void 0 ? void 0 : templateHeader.align,
-        fill: {
-            ...(_templateHeader_fill = templateHeader === null || templateHeader === void 0 ? void 0 : templateHeader.fill) !== null && _templateHeader_fill !== void 0 ? _templateHeader_fill : {},
-            ...(_tableHeader_fill = tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.fill) !== null && _tableHeader_fill !== void 0 ? _tableHeader_fill : {}
-        },
-        font: {
-            ...(_templateHeader_font = templateHeader === null || templateHeader === void 0 ? void 0 : templateHeader.font) !== null && _templateHeader_font !== void 0 ? _templateHeader_font : {},
-            ...(_tableHeader_font = tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.font) !== null && _tableHeader_font !== void 0 ? _tableHeader_font : {}
-        },
-        values: (_ref = (_tableHeader_values = tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.values) !== null && _tableHeader_values !== void 0 ? _tableHeader_values : templateHeader === null || templateHeader === void 0 ? void 0 : templateHeader.values) !== null && _ref !== void 0 ? _ref : []
-    };
-    const { chartTitle, titleStyles } = getTitles(input.layout);
-    var _tableData_header_values;
-    return {
-        headers: normalizeHeaders((_tableData_header_values = (_tableData_header = tableData.header) === null || _tableData_header === void 0 ? void 0 : _tableData_header.values) !== null && _tableData_header_values !== void 0 ? _tableData_header_values : [], header),
-        rows,
-        width: (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : _input_layout3.width,
-        height: (_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : _input_layout4.height,
-        styles,
-        chartTitle,
-        ...titleStyles ? {
-            titleStyles
-        } : {}
-    };
-};
-function getCategoriesAndValues(series) {
-    const orientation = series.orientation || 'h';
-    var _series_labels, _ref;
-    const y = (_ref = (_series_labels = series.labels) !== null && _series_labels !== void 0 ? _series_labels : series.y) !== null && _ref !== void 0 ? _ref : series.stage;
-    var _series_values, _ref1;
-    const x = (_ref1 = (_series_values = series.values) !== null && _series_values !== void 0 ? _series_values : series.x) !== null && _ref1 !== void 0 ? _ref1 : series.value;
-    const xIsString = isStringArray(x);
-    const yIsString = isStringArray(y);
-    const xIsNumber = isNumberArray(x);
-    const yIsNumber = isNumberArray(y);
-    // Helper to ensure array of (string | number)
-    const toArray = (arr)=>{
-        if (Array.isArray(arr)) {
-            return arr;
-        }
-        if (typeof arr === 'string' || typeof arr === 'number') {
-            return [
-                arr
-            ];
-        }
-        return [];
-    };
-    if (orientation === 'h') {
-        if (yIsString && xIsNumber) {
-            return {
-                categories: toArray(y),
-                values: toArray(x)
-            };
-        } else if (xIsString && yIsNumber) {
-            return {
-                categories: toArray(x),
-                values: toArray(y)
-            };
-        } else {
-            return {
-                categories: yIsString ? toArray(y) : toArray(x),
-                values: yIsString ? toArray(x) : toArray(y)
-            };
-        }
-    } else {
-        if (xIsString && yIsNumber) {
-            return {
-                categories: toArray(x),
-                values: toArray(y)
-            };
-        } else if (yIsString && xIsNumber) {
-            return {
-                categories: toArray(y),
-                values: toArray(x)
-            };
-        } else {
-            return {
-                categories: xIsString ? toArray(x) : toArray(y),
-                values: xIsString ? toArray(y) : toArray(x)
-            };
-        }
-    }
-}
-export const transformPlotlyJsonToFunnelChartProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout1, _input_data_, _input_layout2;
-    const funnelData = [];
-    // Determine if data is stacked based on multiple series with multiple values per series
-    const isStacked = input.data.length > 1 && input.data.every((series)=>{
-        var _series_values, _ref;
-        const values = (_ref = (_series_values = series.values) !== null && _series_values !== void 0 ? _series_values : series.x) !== null && _ref !== void 0 ? _ref : series.value;
-        var _series_labels, _ref1;
-        const labels = (_ref1 = (_series_labels = series.labels) !== null && _series_labels !== void 0 ? _series_labels : series.y) !== null && _ref1 !== void 0 ? _ref1 : series.stage;
-        return Array.isArray(labels) && Array.isArray(values) && values.length > 1 && labels.length > 1;
-    });
-    if (isStacked) {
-        // Assign a color per series/category and use it for all subValues of that category
-        const seriesColors = {};
-        input.data.forEach((series, seriesIdx)=>{
-            var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _series_marker1, _input_layout_template_layout1, _input_layout_template1, _input_layout1;
-            const category = series.name || `Category ${seriesIdx + 1}`;
-            var _series_marker_colors;
-            // Use the same color for this category across all stages
-            const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_series_marker_colors = (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.colors) !== null && _series_marker_colors !== void 0 ? _series_marker_colors : (_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color, colorMap, isDarkTheme);
-            // Always use the first color for the series/category
-            const color = resolveColor(extractedColors, 0, category, colorMap, (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, isDarkTheme);
-            seriesColors[category] = color;
-            var _series_labels, _ref;
-            const labels = (_ref = (_series_labels = series.labels) !== null && _series_labels !== void 0 ? _series_labels : series.y) !== null && _ref !== void 0 ? _ref : series.stage;
-            var _series_values, _ref1;
-            const values = (_ref1 = (_series_values = series.values) !== null && _series_values !== void 0 ? _series_values : series.x) !== null && _ref1 !== void 0 ? _ref1 : series.value;
-            if (!isArrayOrTypedArray(labels) || !isArrayOrTypedArray(values)) {
-                return;
-            }
-            if (labels && isArrayOrTypedArray(labels) && labels.length > 0) {
-                labels.forEach((label, i)=>{
-                    const stageIndex = funnelData.findIndex((stage)=>stage.stage === label);
-                    const valueNum = Number(values[i]);
-                    if (isNaN(valueNum)) {
-                        return;
-                    }
-                    if (stageIndex === -1) {
-                        funnelData.push({
-                            stage: label,
-                            subValues: [
-                                {
-                                    category,
-                                    value: valueNum,
-                                    color
-                                }
-                            ]
-                        });
-                    } else {
-                        funnelData[stageIndex].subValues.push({
-                            category,
-                            value: valueNum,
-                            color
-                        });
-                    }
-                });
-            }
-        });
-    } else {
-        // Non-stacked data handling (multiple series with single-value arrays)
-        input.data.forEach((series, seriesIdx)=>{
-            var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _series_marker1;
-            const { categories, values } = getCategoriesAndValues(series);
-            if (!isArrayOrTypedArray(categories) || !isArrayOrTypedArray(values)) {
-                return;
-            }
-            var _series_marker_colors;
-            const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_series_marker_colors = (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.colors) !== null && _series_marker_colors !== void 0 ? _series_marker_colors : (_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color, colorMap, isDarkTheme);
-            categories.forEach((label, i)=>{
-                var _input_layout_template_layout, _input_layout_template, _input_layout;
-                const color = resolveColor(extractedColors, i, label, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-                const valueNum = Number(values[i]);
-                if (isNaN(valueNum)) {
-                    return;
-                }
-                funnelData.push({
-                    stage: label,
-                    value: valueNum,
-                    color
-                });
-            });
-        });
-    }
-    const { chartTitle, titleStyles } = getTitles(input.layout);
-    return {
-        data: funnelData,
-        chartTitle,
-        width: (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.width,
-        height: (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.height,
-        orientation: ((_input_data_ = input.data[0]) === null || _input_data_ === void 0 ? void 0 : _input_data_.orientation) === 'v' ? 'horizontal' : 'vertical',
-        hideLegend: isMultiPlot || ((_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.showlegend) === false,
-        ...titleStyles ? {
-            titleStyles
-        } : {}
-    };
-};
-export const transformPlotlyJsonToPolarChartProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
-    var _input_layout, _input_layout1;
-    const polarData = [];
-    const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
-    const resolveRValue = getAxisValueResolver(getPolarAxis(input.data, 'r', input.layout)._type);
-    input.data.forEach((series, index)=>{
-        const legend = legends[index];
-        if (series.type === 'scatterpolar') {
-            var _series_line, _series_marker, _input_layout_template_layout, _input_layout_template, _input_layout, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _series_r;
-            const isAreaTrace = series.fill === 'toself' || series.fill === 'tonext';
-            const isLineTrace = typeof series.mode === 'undefined' ? true : series.mode.includes('lines');
-            const colors = isAreaTrace ? series.fillcolor : isLineTrace ? (_series_line = series.line) === null || _series_line === void 0 ? void 0 : _series_line.color : (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color;
-            const extractedColors = extractColor((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, colors, colorMap, isDarkTheme);
-            const seriesColor = resolveColor(extractedColors, index, legend, colorMap, (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template1 = _input_layout1.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, isDarkTheme);
-            const seriesOpacity = getOpacity(series, index);
-            const finalSeriesColor = rgb(seriesColor).copy({
-                opacity: seriesOpacity
-            }).formatHex8();
-            const lineOptions = getLineOptions(series.line);
-            const thetaUnit = series.thetaunit;
-            const commonProps = {
-                legend,
-                legendShape: getLegendShape(series),
-                color: finalSeriesColor,
-                data: ((_series_r = series.r) === null || _series_r === void 0 ? void 0 : _series_r.map((r, rIndex)=>{
-                    var _series_theta, _series_marker, _series_marker1, _input_layout_template_layout, _input_layout_template, _input_layout;
-                    const theta = (_series_theta = series.theta) === null || _series_theta === void 0 ? void 0 : _series_theta[rIndex];
-                    const markerSize = Array.isArray((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.size) ? series.marker.size[rIndex] : (_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.size;
-                    const text = Array.isArray(series.text) ? series.text[rIndex] : series.text;
-                    const markerColor = resolveColor(extractedColors, rIndex, legend, colorMap, (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_template = _input_layout.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme);
-                    const markerOpacity = getOpacity(series, rIndex);
-                    if (isInvalidValue(resolveRValue(r)) || isInvalidValue(theta)) {
-                        return;
-                    }
-                    return {
-                        r: resolveRValue(r),
-                        theta: typeof theta === 'number' ? thetaUnit === 'radians' ? theta * 180 / Math.PI : thetaUnit === 'gradians' ? theta * 0.9 : theta : theta,
-                        color: markerColor ? rgb(markerColor).copy({
-                            opacity: markerOpacity
-                        }).formatHex8() : finalSeriesColor,
-                        ...typeof markerSize !== 'undefined' ? {
-                            markerSize
-                        } : {},
-                        ...typeof text !== 'undefined' ? {
-                            text
-                        } : {}
-                    };
-                }).filter((item)=>typeof item !== 'undefined')) || []
-            };
-            if (isAreaTrace || isLineTrace) {
-                polarData.push({
-                    type: isAreaTrace ? 'areapolar' : 'linepolar',
-                    ...commonProps,
-                    lineOptions
-                });
-            } else {
-                polarData.push({
-                    type: 'scatterpolar',
-                    ...commonProps
-                });
-            }
-        }
-    });
-    var _input_layout_height;
-    return {
-        data: polarData,
-        width: (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.width,
-        height: (_input_layout_height = (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.height) !== null && _input_layout_height !== void 0 ? _input_layout_height : 400,
-        hideLegend,
-        ...getPolarAxisProps(input.data, input.layout)
-    };
-};
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function isPlainObject(obj) {
-    return Object.prototype.toString.call(obj) === '[object Object]' && Object.getPrototypeOf(obj).hasOwnProperty('hasOwnProperty');
-}
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-var arrayAttributes = [];
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-var stack = [];
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-var isArrayStack = [];
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-var baseContainer, baseAttrName;
-/**
- * Interate iteratively through the trace object and find all the array attributes.
- * 1 trace record = 1 series of data
- * @param trace
- */ // eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function findArrayAttributes(trace) {
-    // Init basecontainer and baseAttrName
-    crawlIntoTrace(baseContainer, 0, '');
-}
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function crawlIntoTrace(container, i, astrPartial) {
-    var item = container[stack[i]];
-    var newAstrPartial = astrPartial + stack[i];
-    if (i === stack.length - 1) {
-        if (isArrayOrTypedArray(item)) {
-            arrayAttributes.push(baseAttrName + newAstrPartial);
-        }
-    } else {
-        if (isArrayStack[i]) {
-            if (Array.isArray(item)) {
-                for(var j = 0; j < item.length; j++){
-                    if (isPlainObject(item[j])) {
-                        crawlIntoTrace(item[j], i + 1, newAstrPartial + '[' + j + '].');
-                    }
-                }
-            }
-        } else if (isPlainObject(item)) {
-            crawlIntoTrace(item, i + 1, newAstrPartial + '.');
-        }
-    }
-}
-function getLineOptions(line) {
-    if (!line) {
-        return;
-    }
-    let lineOptions = {};
-    if (line.dash) {
-        lineOptions = {
-            ...lineOptions,
-            ...dashOptions[line.dash]
-        };
-    }
-    switch(line.shape){
-        case 'spline':
-            const smoothing = typeof line.smoothing === 'number' ? line.smoothing : 1;
-            lineOptions.curve = d3CurveCardinal.tension(1 - smoothing / 1.3);
-            break;
-        case 'hv':
-            lineOptions.curve = 'stepAfter';
-            break;
-        case 'vh':
-            lineOptions.curve = 'stepBefore';
-            break;
-        case 'hvh':
-            lineOptions.curve = 'step';
-            break;
-        default:
-            lineOptions.curve = 'linear';
-    }
-    return Object.keys(lineOptions).length > 0 ? lineOptions : undefined;
-}
-// TODO: Use binary search to find the appropriate bin for numeric value.
-const findBinIndex = (bins, value, isString)=>{
-    if (typeof value === 'undefined' || value === null) {
-        return -1;
-    }
-    return isString ? bins.findIndex((bin)=>bin.includes(value)) : bins.findIndex((bin, index)=>value >= bin.x0 && (index === bins.length - 1 ? value <= bin.x1 : value < bin.x1));
-};
-const getBinSize = (bin)=>{
-    return bin.x1 - bin.x0;
-};
-const getBinCenter = (bin)=>{
-    return (bin.x1 + bin.x0) / 2;
-};
-// TODO: Add support for date axes
-const createBins = (data, binStart, binEnd, binSize)=>{
-    if (!data || data.length === 0) {
-        return [];
-    }
-    if (isStringArray(data)) {
-        const categories = Array.from(new Set(data));
-        const start = typeof binStart === 'number' ? Math.ceil(binStart) : 0;
-        const stop = typeof binEnd === 'number' ? Math.floor(binEnd) + 1 : categories.length;
-        const step = typeof binSize === 'number' ? binSize : 1;
-        return d3Range(start, stop, step).map((i)=>categories.slice(i, i + step));
-    }
-    const scale = d3ScaleLinear().domain(d3Extent(data)).nice();
-    let [minVal, maxVal] = scale.domain();
-    minVal = typeof binStart === 'number' ? binStart : minVal;
-    maxVal = typeof binEnd === 'number' ? binEnd : maxVal;
-    const binGenerator = d3Bin().domain([
-        minVal,
-        maxVal
-    ]);
-    if (typeof binSize === 'number' && binSize > 0) {
-        const thresholds = [];
-        const precision = Math.max(calculatePrecision(minVal), calculatePrecision(binSize));
-        let th = precisionRound(minVal, precision);
-        while(th < precisionRound(maxVal + binSize, precision)){
-            thresholds.push(th);
-            th = precisionRound(th + binSize, precision);
-        }
-        minVal = thresholds[0];
-        maxVal = thresholds[thresholds.length - 1];
-        binGenerator.domain([
-            minVal,
-            maxVal
-        ]).thresholds(thresholds);
-        // When the domain ends at the last threshold (maxVal), d3Bin creates an extra final bin where
-        // both x0 and x1 are equal to maxVal and inclusive. The previous bin also has x1 equal to maxVal,
-        // but it is exclusive. To maintain consistent bin widths, remove the final bin,
-        // making the previous bin the last one, with both x0 and x1 inclusive.
-        return binGenerator(data).slice(0, -1);
-    }
-    return binGenerator(data);
-};
-const calculateHistFunc = (histfunc, bin)=>{
-    switch(histfunc){
-        case 'sum':
-            return d3Sum(bin);
-        case 'avg':
-            return bin.length === 0 ? 0 : d3Sum(bin) / bin.length;
-        case 'min':
-            var _d3Min;
-            return (_d3Min = d3Min(bin)) !== null && _d3Min !== void 0 ? _d3Min : 0;
-        case 'max':
-            var _d3Max;
-            return (_d3Max = d3Max(bin)) !== null && _d3Max !== void 0 ? _d3Max : 0;
-        default:
-            return bin.length;
-    }
-};
-const calculateHistNorm = (histnorm, value, total, dx, dy = 1)=>{
-    switch(histnorm){
-        case 'percent':
-            return total === 0 ? 0 : value / total * 100;
-        case 'probability':
-            return total === 0 ? 0 : value / total;
-        case 'density':
-            return dx * dy === 0 ? 0 : value / (dx * dy);
-        case 'probability density':
-            return total * dx * dy === 0 ? 0 : value / (total * dx * dy);
-        default:
-            return value;
-    }
-};
-const getLegendShape = (series)=>{
-    var _series_line, _series_mode;
-    const dashType = ((_series_line = series.line) === null || _series_line === void 0 ? void 0 : _series_line.dash) || 'solid';
-    if (dashType === 'dot' || dashType === 'dash' || dashType === 'dashdot') {
-        return 'dottedLine';
-    } else if ((_series_mode = series.mode) === null || _series_mode === void 0 ? void 0 : _series_mode.includes('markers')) {
-        return 'circle';
-    }
-    return 'default';
-};
-export const getAllupLegendsProps = (input, colorMap, colorwayType, traceInfo, isDarkTheme)=>{
-    const allupLegends = [];
-    // reduce on showlegend boolean propperty. reduce should return true if at least one series has showlegend true
-    const toShowLegend = input.data.reduce((acc, series)=>{
-        return acc || series.showlegend === true || series.showlegend === undefined;
-    }, false);
-    if (toShowLegend) {
-        input.data.forEach((series, index)=>{
-            if (traceInfo[index].type === 'donut') {
-                var _input_layout, _input_layout_template_layout, _input_layout_template, _input_layout1, _input_layout2, _pieSeries_marker;
-                const pieSeries = series;
-                var _input_layout_piecolorway, _input_layout_piecolorway1;
-                const colors = extractColor((_input_layout_piecolorway = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.piecolorway) !== null && _input_layout_piecolorway !== void 0 ? _input_layout_piecolorway : (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template = _input_layout1.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, colorwayType, (_input_layout_piecolorway1 = (_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : _input_layout2.piecolorway) !== null && _input_layout_piecolorway1 !== void 0 ? _input_layout_piecolorway1 : pieSeries === null || pieSeries === void 0 ? void 0 : (_pieSeries_marker = pieSeries.marker) === null || _pieSeries_marker === void 0 ? void 0 : _pieSeries_marker.colors, colorMap, isDarkTheme, true);
-                if (isArrayOrTypedArray(pieSeries.labels)) {
-                    pieSeries.labels.forEach((label, labelIndex)=>{
-                        var _input_layout, _input_layout_template_layout, _input_layout_template, _input_layout1;
-                        const legend = `${label}`;
-                        var _input_layout_piecolorway;
-                        // resolve color for each legend from the extracted colors
-                        const color = resolveColor(colors, labelIndex, legend, colorMap, (_input_layout_piecolorway = (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.piecolorway) !== null && _input_layout_piecolorway !== void 0 ? _input_layout_piecolorway : (_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : (_input_layout_template = _input_layout1.template) === null || _input_layout_template === void 0 ? void 0 : (_input_layout_template_layout = _input_layout_template.layout) === null || _input_layout_template_layout === void 0 ? void 0 : _input_layout_template_layout.colorway, isDarkTheme, true);
-                        if (legend !== '' && allupLegends.some((group)=>group.title === legend) === false) {
-                            allupLegends.push({
-                                title: legend,
-                                color
-                            });
-                        }
-                    });
-                }
-            } else if (isNonPlotType(traceInfo[index].type) === false) {
-                var _plotSeries_line, _plotSeries_marker, _input_layout_template_layout1, _input_layout_template1, _input_layout3;
-                const plotSeries = series;
-                const name = plotSeries.legendgroup;
-                const color = ((_plotSeries_line = plotSeries.line) === null || _plotSeries_line === void 0 ? void 0 : _plotSeries_line.color) || ((_plotSeries_marker = plotSeries.marker) === null || _plotSeries_marker === void 0 ? void 0 : _plotSeries_marker.color);
-                const legendShape = getLegendShape(plotSeries);
-                const resolvedColor = extractColor((_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : (_input_layout_template1 = _input_layout3.template) === null || _input_layout_template1 === void 0 ? void 0 : (_input_layout_template_layout1 = _input_layout_template1.layout) === null || _input_layout_template_layout1 === void 0 ? void 0 : _input_layout_template_layout1.colorway, colorwayType, color, colorMap, isDarkTheme);
-                if (name !== undefined && name !== '' && allupLegends.some((group)=>group.title === name) === false) {
-                    allupLegends.push({
-                        title: name,
-                        color: resolvedColor,
-                        shape: legendShape
-                    });
-                }
-            }
-        });
-    }
-    return {
-        legends: allupLegends,
-        centerLegends: true,
-        enabledWrapLines: true,
-        canSelectMultipleLegends: true
-    };
-};
-const getLegendProps = (data, layout, isMultiPlot)=>{
-    const legends = [];
-    if (data.length === 1) {
-        legends.push(data[0].name || '');
-    } else {
-        data.forEach((series, index)=>{
-            legends.push(series.name || `Series ${index + 1}`);
-        });
-    }
-    const hideLegendsData = data.every((series)=>series.showlegend === false);
-    const hideLegendsInferred = (layout === null || layout === void 0 ? void 0 : layout.showlegend) === false || (layout === null || layout === void 0 ? void 0 : layout.showlegend) !== true && legends.length < 2;
-    return {
-        legends,
-        hideLegend: isMultiPlot || hideLegendsInferred || hideLegendsData
-    };
-};
-export const getNumberAtIndexOrDefault = (data, index)=>{
-    if (isArrayOrTypedArray(data)) {
-        if (typeof data[index] !== 'number' || !isFinite(data[index])) {
-            return;
-        }
-        return data[index];
-    }
-    return 1;
-};
-export const getValidXYRanges = (series, resolveX, resolveY)=>{
-    if (!isArrayOrTypedArray(series.x) || !isArrayOrTypedArray(series.y)) {
-        return [];
-    }
-    const ranges = [];
-    let start = 0;
-    let end = 0;
-    for(; end < series.x.length; end++){
-        if (isInvalidValue(series.x[end]) || typeof resolveX === 'function' && isInvalidValue(resolveX(series.x[end])) || isInvalidValue(series.y[end]) || typeof resolveY === 'function' && isInvalidValue(resolveY(series.y[end]))) {
-            if (end - start > 0) {
-                ranges.push([
-                    start,
-                    end
-                ]);
-            }
-            start = end + 1;
-        }
-    }
-    if (end - start > 0) {
-        ranges.push([
-            start,
-            end
-        ]);
-    }
-    return ranges;
-};
-const getIndexFromKey = (key, pattern)=>{
-    const normalizedKey = key.replace(pattern, '') === '' ? '1' : key.replace(pattern, '');
-    return parseInt(normalizedKey, 10) - 1;
-};
-export const isNonPlotType = (chartType)=>{
-    return [
-        'donut',
-        'sankey',
-        'pie',
-        'annotation',
-        'table',
-        'gauge',
-        'funnel'
-    ].includes(chartType);
-};
-export const getGridProperties = (schema, isMultiPlot, validTracesInfo)=>{
-    const domainX = [];
-    const domainY = [];
-    let cartesianDomains = 0;
-    const annotations = {};
-    let templateRows = '1fr';
-    let templateColumns = '1fr';
-    const gridLayout = {};
-    if (!isMultiPlot) {
-        return {
-            templateRows,
-            templateColumns,
-            layout: gridLayout
-        };
-    }
-    const layout = schema === null || schema === void 0 ? void 0 : schema.layout;
-    if (layout !== undefined && layout !== null && Object.keys(layout).length > 0) {
-        Object.keys(layout !== null && layout !== void 0 ? layout : {}).forEach((key)=>{
-            if (key.startsWith('xaxis')) {
-                var _layout_key;
-                const index = getIndexFromKey(key, 'xaxis');
-                var _layout_key_anchor;
-                const anchor = (_layout_key_anchor = (_layout_key = layout[key]) === null || _layout_key === void 0 ? void 0 : _layout_key.anchor) !== null && _layout_key_anchor !== void 0 ? _layout_key_anchor : 'y';
-                const anchorIndex = getIndexFromKey(anchor, 'y');
-                if (index !== anchorIndex) {
-                    throw new Error(`Invalid layout: xaxis ${index + 1} anchor should be y${anchorIndex + 1}`);
-                }
-                const xAxisLayout = layout[key];
-                const domainXInfo = {
-                    start: (xAxisLayout === null || xAxisLayout === void 0 ? void 0 : xAxisLayout.domain) ? xAxisLayout.domain[0] : 0,
-                    end: (xAxisLayout === null || xAxisLayout === void 0 ? void 0 : xAxisLayout.domain) ? xAxisLayout.domain[1] : 1,
-                    cellName: `x${domainX.length === 0 ? '' : domainX.length + 1}`
-                };
-                domainX.push(domainXInfo);
-            } else if (key.startsWith('yaxis')) {
-                var _layout_key1;
-                const index = getIndexFromKey(key, 'yaxis');
-                var _layout_key_anchor1;
-                const anchor = (_layout_key_anchor1 = (_layout_key1 = layout[key]) === null || _layout_key1 === void 0 ? void 0 : _layout_key1.anchor) !== null && _layout_key_anchor1 !== void 0 ? _layout_key_anchor1 : 'x';
-                const anchorIndex = getIndexFromKey(anchor, 'x');
-                if (index !== anchorIndex) {
-                    var _layout_yaxis2;
-                    if (index === 1 && anchorIndex === 0 || ((_layout_yaxis2 = layout.yaxis2) === null || _layout_yaxis2 === void 0 ? void 0 : _layout_yaxis2.side) === 'right') {
-                        // Special case for secondary y axis where yaxis2 can anchor to x1
-                        return {
-                            templateRows,
-                            templateColumns
-                        };
-                    }
-                    throw new Error(`Invalid layout: yaxis ${index + 1} anchor should be x${anchorIndex + 1}`);
-                }
-                const yAxisLayout = layout[key];
-                const domainYInfo = {
-                    start: (yAxisLayout === null || yAxisLayout === void 0 ? void 0 : yAxisLayout.domain) ? yAxisLayout.domain[0] : 0,
-                    end: (yAxisLayout === null || yAxisLayout === void 0 ? void 0 : yAxisLayout.domain) ? yAxisLayout.domain[1] : 1,
-                    cellName: `x${domainY.length === 0 ? '' : domainY.length + 1}`
-                };
-                domainY.push(domainYInfo);
-            }
-        });
-    }
-    cartesianDomains = domainX.length; // Assuming that the number of x and y axes is the same
-    validTracesInfo.forEach((trace, index)=>{
-        if (isNonPlotType(trace.type)) {
-            var _schema_data, _series_domain, _series_domain1, _series_domain2, _series_domain3;
-            const series = schema === null || schema === void 0 ? void 0 : (_schema_data = schema.data) === null || _schema_data === void 0 ? void 0 : _schema_data[index];
-            const domainXInfo = {
-                start: ((_series_domain = series.domain) === null || _series_domain === void 0 ? void 0 : _series_domain.x) ? series.domain.x[0] : 0,
-                end: ((_series_domain1 = series.domain) === null || _series_domain1 === void 0 ? void 0 : _series_domain1.x) ? series.domain.x[1] : 1,
-                cellName: `${NON_PLOT_KEY_PREFIX}${domainX.length - cartesianDomains + 1}`
-            };
-            const domainYInfo = {
-                start: ((_series_domain2 = series.domain) === null || _series_domain2 === void 0 ? void 0 : _series_domain2.y) ? series.domain.y[0] : 0,
-                end: ((_series_domain3 = series.domain) === null || _series_domain3 === void 0 ? void 0 : _series_domain3.y) ? series.domain.y[1] : 1,
-                cellName: `${NON_PLOT_KEY_PREFIX}${domainY.length - cartesianDomains + 1}`
-            };
-            domainX.push(domainXInfo);
-            domainY.push(domainYInfo);
-        }
-    });
-    if (layout !== undefined && layout !== null && Object.keys(layout).length > 0) {
-        var _layout_annotations;
-        Object.keys(layout !== null && layout !== void 0 ? layout : {}).forEach((key)=>{
-            if (key.startsWith('polar')) {
-                var _polarLayout_domain, _polarLayout_domain1, _polarLayout_domain2, _polarLayout_domain3;
-                const polarLayout = layout[key];
-                const domainXInfo = {
-                    start: ((_polarLayout_domain = polarLayout.domain) === null || _polarLayout_domain === void 0 ? void 0 : _polarLayout_domain.x) ? polarLayout.domain.x[0] : 0,
-                    end: ((_polarLayout_domain1 = polarLayout.domain) === null || _polarLayout_domain1 === void 0 ? void 0 : _polarLayout_domain1.x) ? polarLayout.domain.x[1] : 1,
-                    cellName: key
-                };
-                const domainYInfo = {
-                    start: ((_polarLayout_domain2 = polarLayout.domain) === null || _polarLayout_domain2 === void 0 ? void 0 : _polarLayout_domain2.y) ? polarLayout.domain.y[0] : 0,
-                    end: ((_polarLayout_domain3 = polarLayout.domain) === null || _polarLayout_domain3 === void 0 ? void 0 : _polarLayout_domain3.y) ? polarLayout.domain.y[1] : 1,
-                    cellName: key
-                };
-                domainX.push(domainXInfo);
-                domainY.push(domainYInfo);
-            }
-        });
-        (_layout_annotations = layout.annotations) === null || _layout_annotations === void 0 ? void 0 : _layout_annotations.forEach((annotation)=>{
-            const xMatches = domainX.flatMap((interval, idx)=>(annotation === null || annotation === void 0 ? void 0 : annotation.x) >= interval.start && (annotation === null || annotation === void 0 ? void 0 : annotation.x) <= interval.end ? [
-                    idx
-                ] : []);
-            const yMatch = domainY.findIndex((interval, yIndex)=>xMatches.includes(yIndex) && (annotation === null || annotation === void 0 ? void 0 : annotation.y) >= interval.start && (annotation === null || annotation === void 0 ? void 0 : annotation.y) <= interval.end);
-            if (yMatch !== -1) {
-                if (annotations[yMatch] === undefined) {
-                    annotations[yMatch] = {};
-                }
-                if ((annotation === null || annotation === void 0 ? void 0 : annotation.textangle) === 90) {
-                    annotations[yMatch].yAnnotation = annotation.text;
-                } else {
-                    annotations[yMatch].xAnnotation = annotation.text;
-                }
-            }
-        });
-    }
-    if (domainX.length > 0) {
-        const uniqueXIntervals = new Map();
-        domainX.forEach((interval)=>{
-            const key = `${interval.start}-${interval.end}`;
-            if (!uniqueXIntervals.has(key)) {
-                uniqueXIntervals.set(key, interval);
-            }
-        });
-        const sortedXStart = Array.from(uniqueXIntervals.values()).map((interval)=>interval.start).sort();
-        templateColumns = `repeat(${sortedXStart.length}, 1fr)`;
-        domainX.forEach((interval, index)=>{
-            const columnIndex = sortedXStart.findIndex((start)=>start === interval.start);
-            const columnNumber = columnIndex + 1; // Column numbers are 1-based
-            const annotationProps = annotations[index];
-            const xAnnotation = annotationProps === null || annotationProps === void 0 ? void 0 : annotationProps.xAnnotation;
-            const row = {
-                row: -1,
-                column: columnNumber,
-                xAnnotation,
-                xDomain: interval,
-                yDomain: {
-                    start: 0,
-                    end: 1
-                }
-            };
-            gridLayout[interval.cellName] = row;
-        });
-    }
-    if (domainY.length > 0) {
-        const uniqueYIntervals = new Map();
-        domainY.forEach((interval)=>{
-            const key = `${interval.start}-${interval.end}`;
-            if (!uniqueYIntervals.has(key)) {
-                uniqueYIntervals.set(key, interval);
-            }
-        });
-        const sortedYStart = Array.from(uniqueYIntervals.values()).map((interval)=>interval.start).sort();
-        const numberOfRows = sortedYStart.length;
-        templateRows = `repeat(${numberOfRows}, 1fr)`;
-        domainY.forEach((interval, index)=>{
-            const rowIndex = sortedYStart.findIndex((start)=>start === interval.start);
-            const rowNumber = numberOfRows - rowIndex; // Rows are 1-based and we need to reverse the order for CSS grid
-            const annotationProps = annotations[index];
-            const yAnnotation = annotationProps === null || annotationProps === void 0 ? void 0 : annotationProps.yAnnotation;
-            const cell = gridLayout[interval.cellName];
-            if (cell !== undefined) {
-                cell.row = rowNumber;
-                cell.yAnnotation = yAnnotation;
-                cell.yDomain = interval;
-            }
-        });
-    }
-    return {
-        templateRows,
-        templateColumns,
-        layout: gridLayout
-    };
-};
-/**
- * @see {@link https://github.com/plotly/plotly.js/blob/master/src/plots/cartesian/category_order_defaults.js#L50}
- */ const getAxisCategoryOrderProps = (data, layout)=>{
-    const result = {};
-    const 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((axId)=>{
-        const ax = axesById[axId];
-        const axLetter = axId[0];
-        const propName = `${axLetter}AxisCategoryOrder`;
-        const values = [];
-        data.forEach((series)=>{
-            var _series_axLetter;
-            (_series_axLetter = series[axLetter]) === null || _series_axLetter === void 0 ? void 0 : _series_axLetter.forEach((val)=>{
-                if (!isInvalidValue(val)) {
-                    values.push(val);
-                }
-            });
-        });
-        const isAxisTypeCategory = (ax === null || ax === void 0 ? void 0 : ax.type) === 'category' || isStringArray(values) && !isNumberArray(values) && !isDateArray(values);
-        if (!isAxisTypeCategory) {
-            result[propName] = 'data';
-            return;
-        }
-        const isValidArray = 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 === null || ax === void 0 ? void 0 : ax.autorange) === 'reversed' ? ax.categoryarray.slice().reverse() : ax.categoryarray;
-            return;
-        }
-        if (!(ax === null || ax === void 0 ? void 0 : ax.categoryorder) || ax.categoryorder === 'trace' || ax.categoryorder === 'array') {
-            const categoriesInTraceOrder = Array.from(new Set(values));
-            result[propName] = (ax === null || ax === void 0 ? void 0 : ax.autorange) === 'reversed' ? categoriesInTraceOrder.reverse() : categoriesInTraceOrder;
-            return;
-        }
-        result[propName] = ax.categoryorder;
-    });
-    return result;
-};
-const getBarProps = (data, layout, isHorizontal)=>{
-    let padding;
-    if (typeof (layout === null || layout === void 0 ? void 0 : layout.bargap) === 'number') {
-        if (layout.bargap >= 0 && layout.bargap <= 1) {
-            padding = layout.bargap;
-        } else {
-            // Plotly uses a default bargap of 0.2, as noted here: https://github.com/plotly/plotly.js/blob/1d5a249e43dd31ae50acf02117a19e5ac97387e9/src/traces/bar/layout_defaults.js#L58.
-            // However, we don't use this value as our default padding because it causes the bars to
-            // appear disproportionately wide in large containers.
-            padding = 0.2;
-        }
-    }
-    const plotlyBarWidths = data.map((series)=>{
-        if (series.type === 'bar' && (isArrayOrTypedArray(series.width) || typeof series.width === 'number')) {
-            return series.width;
-        }
-        return [];
-    }).flat();
-    const maxPlotlyBarWidth = d3Max(plotlyBarWidths);
-    if (typeof maxPlotlyBarWidth === 'number') {
-        padding = 1 - maxPlotlyBarWidth;
-        padding = Math.max(0, Math.min(padding, 1));
-    }
-    if (typeof padding === 'undefined') {
-        return {};
-    }
-    if (isHorizontal) {
-        return {
-            maxBarHeight: 1000,
-            yAxisPadding: padding
-        };
-    }
-    return {
-        barWidth: 'auto',
-        maxBarWidth: 1000,
-        xAxisInnerPadding: padding,
-        xAxisOuterPadding: padding / 2
-    };
-};
-const getAxisScaleTypeProps = (data, layout)=>{
-    var _axisObjects_x, _axisObjects_y, _axisObjects_y2;
-    const result = {};
-    const axisObjects = getAxisObjects(data, layout);
-    if (((_axisObjects_x = axisObjects.x) === null || _axisObjects_x === void 0 ? void 0 : _axisObjects_x.type) === 'log') {
-        result.xScaleType = 'log';
-    }
-    if (((_axisObjects_y = axisObjects.y) === null || _axisObjects_y === void 0 ? void 0 : _axisObjects_y.type) === 'log') {
-        result.yScaleType = 'log';
-    }
-    if (((_axisObjects_y2 = axisObjects.y2) === null || _axisObjects_y2 === void 0 ? void 0 : _axisObjects_y2.type) === 'log') {
-        result.secondaryYScaleType = 'log';
-    }
-    return result;
-};
-/**
- * @see {@link https://github.com/plotly/plotly.js/blob/master/src/plots/cartesian/tick_value_defaults.js#L8}
- */ const getAxisTickProps = (data, layout)=>{
-    const props = {};
-    const axisObjects = getAxisObjects(data, layout);
-    Object.keys(axisObjects).forEach((axId)=>{
-        const ax = axisObjects[axId];
-        if (!ax) {
-            return;
-        }
-        const axType = getAxisType(data, ax);
-        if (axId === 'x' && axType === 'category') {
-            props.xAxis = {
-                tickLayout: 'auto'
-            };
-        }
-        if ((!ax.tickmode || ax.tickmode === 'array') && isArrayOrTypedArray(ax.tickvals)) {
-            const tickValues = axType === 'date' ? ax.tickvals.map((v)=>new Date(v)) : ax.tickvals;
-            if (axId === 'x') {
-                props.tickValues = tickValues;
-                props.xAxis = {
-                    ...props.xAxis,
-                    tickText: ax.ticktext
-                };
-            } else if (axId === 'y') {
-                props.yAxisTickValues = tickValues;
-                props.yAxis = {
-                    ...props.yAxis,
-                    tickText: ax.ticktext
-                };
-            }
-            return;
-        }
-        if ((!ax.tickmode || ax.tickmode === 'linear') && ax.dtick) {
-            const dtick = plotlyDtick(ax.dtick, axType);
-            const tick0 = plotlyTick0(ax.tick0, axType, dtick);
-            if (axId === 'x') {
-                props.xAxis = {
-                    ...props.xAxis,
-                    tickStep: dtick,
-                    tick0
-                };
-            } else if (axId === 'y') {
-                props.yAxis = {
-                    ...props.yAxis,
-                    tickStep: dtick,
-                    tick0
-                };
-            }
-            return;
-        }
-        if ((!ax.tickmode || ax.tickmode === 'auto') && typeof ax.nticks === 'number' && ax.nticks >= 0) {
-            if (axId === 'x') {
-                props.xAxisTickCount = ax.nticks;
-            } else if (axId === 'y') {
-                props.yAxisTickCount = ax.nticks;
-            }
-        }
-    });
-    return props;
-};
-/**
- * @see {@link https://github.com/plotly/plotly.js/blob/master/src/plots/cartesian/clean_ticks.js#L16}
- */ const plotlyDtick = (dtick, axType)=>{
-    const isLogAx = axType === 'log';
-    const isDateAx = axType === 'date';
-    const isCatAx = axType === 'category';
-    const dtickDflt = isDateAx ? 86400000 : 1;
-    if (!dtick) {
-        return dtickDflt;
-    }
-    if (isNumber(dtick)) {
-        dtick = Number(dtick);
-        if (dtick <= 0) {
-            return dtickDflt;
-        }
-        if (isCatAx) {
-            // category dtick must be positive integers
-            return Math.max(1, Math.round(dtick));
-        }
-        if (isDateAx) {
-            // date dtick must be at least 0.1ms (our current precision)
-            return Math.max(0.1, dtick);
-        }
-        return dtick;
-    }
-    if (typeof dtick !== 'string' || !(isDateAx || isLogAx)) {
-        return dtickDflt;
-    }
-    const prefix = dtick.charAt(0);
-    const dtickNum = isNumber(dtick.slice(1)) ? Number(dtick.slice(1)) : 0;
-    if (dtickNum <= 0 || !// "M<n>" gives ticks every (integer) n months
-    (isDateAx && prefix === 'M' && dtickNum === Math.round(dtickNum) || // "L<f>" gives ticks linearly spaced in data (not in position) every (float) f
-    isLogAx && prefix === 'L' || // "D1" gives powers of 10 with all small digits between, "D2" gives only 2 and 5
-    isLogAx && prefix === 'D' && (dtickNum === 1 || dtickNum === 2))) {
-        return dtickDflt;
-    }
-    return dtick;
-};
-/**
- * @see {@link https://github.com/plotly/plotly.js/blob/master/src/plots/cartesian/clean_ticks.js#L70}
- */ const plotlyTick0 = (tick0, axType, dtick)=>{
-    if (axType === 'date') {
-        return isDate(tick0) ? new Date(tick0) : new Date(DEFAULT_DATE_STRING);
-    }
-    if (dtick === 'D1' || dtick === 'D2') {
-        // D1 and D2 modes ignore tick0 entirely
-        return undefined;
-    }
-    // Aside from date axes, tick0 must be numeric
-    return isNumber(tick0) ? Number(tick0) : 0;
-};
-const getAxisObjects = (data, layout)=>{
-    // Traces are grouped by their xaxis property, and for each group/subplot, the adapter functions
-    // are called with the corresponding filtered data. As a result, all traces passed to an adapter
-    // function share the same xaxis.
-    let xAxisId;
-    const yAxisIds = new Set();
-    data.forEach((series)=>{
-        const axisIds = getAxisIds(series);
-        xAxisId = axisIds.x;
-        yAxisIds.add(axisIds.y);
-    });
-    const makeAxisObject = (axLetter, axId)=>({
-            ...layout === null || layout === void 0 ? void 0 : layout[getAxisKey(axLetter, axId)],
-            _id: `${axLetter}${axId > 1 ? axId : ''}`
-        });
-    const axisObjects = {};
-    if (typeof xAxisId === 'number') {
-        axisObjects.x = makeAxisObject('x', xAxisId);
-    }
-    const sortedYAxisIds = Array.from(yAxisIds).sort();
-    if (sortedYAxisIds.length > 0) {
-        axisObjects.y = makeAxisObject('y', sortedYAxisIds[0]);
-    }
-    if (sortedYAxisIds.length > 1) {
-        axisObjects.y2 = makeAxisObject('y', sortedYAxisIds[1]);
-    }
-    return axisObjects;
-};
-const getAxisType = (data, ax)=>{
-    if (!ax) {
-        return 'category';
-    }
-    var _ax_type;
-    if ([
-        'linear',
-        'log',
-        'date',
-        'category'
-    ].includes((_ax_type = ax.type) !== null && _ax_type !== void 0 ? _ax_type : '')) {
-        return ax.type;
-    }
-    const axLetter = ax._id[0];
-    const values = [];
-    data.forEach((series)=>{
-        const axId = series[`${axLetter}axis`];
-        if ((axId === ax._id || !axId && ax._id === axLetter) && isArrayOrTypedArray(series[axLetter])) {
-            series[axLetter].forEach((val)=>{
-                if (!isInvalidValue(val)) {
-                    values.push(val);
-                }
-            });
-        }
-    });
-    if (isNumberArray(values) && !isYearArray(values)) {
-        return 'linear';
-    }
-    if (isDateArray(values)) {
-        return 'date';
-    }
-    return 'category';
-};
-const getAxisValueResolver = (axType, dateParser)=>{
-    const toDate = (value)=>{
-        const date = dateParser ? dateParser(value) : new Date(value);
-        return isNaN(date.getTime()) ? null : date;
-    };
-    return (value)=>{
-        if (isInvalidValue(value)) {
-            return null;
-        }
-        switch(axType){
-            case 'linear':
-            case 'log':
-                return isNumber(value) ? +value : null;
-            case 'date':
-                if (isNumber(value)) {
-                    return toDate(+value);
-                }
-                if (typeof value === 'string') {
-                    return toDate(value);
-                }
-                return null;
-            case 'category':
-                return `${value}`;
-            default:
-                return null;
-        }
-    };
-};
-/**
- * This is experimental. Use it only with valid datetime strings to verify if they conform to the ISO 8601 format.
- */ const isoDateRegex = /^\d{4}(-\d{2}(-\d{2})?)?(T\d{2}:\d{2}(:\d{2}(\.\d{1,9})?)?(Z)?)?$/;
-/**
- * We want to display localized date and time in the charts, so the useUTC prop is set to false.
- * But this can sometimes cause the formatters to display the datetime incorrectly.
- * To work around this issue, we use this function to adjust datetime strings so that they are always interpreted
- * as local time, allowing the formatters to produce the correct output.
- *
- * FIXME: The formatters should always produce a clear and accurate localized output, regardless of the
- * format used to create the date object.
- */ const parseLocalDate = (value)=>{
-    if (typeof value === 'string') {
-        const match = value.match(isoDateRegex);
-        if (match) {
-            if (!match[3]) {
-                value += 'T00:00';
-            } else if (match[6]) {
-                value = value.replace('Z', '');
-            }
-        }
-    }
-    return new Date(value);
-};
-const POLAR_AXIS_BY_DATA_KEY = {
-    r: 'radialAxis',
-    theta: 'angularAxis'
-};
-export const DEFAULT_POLAR_SUBPLOT = 'polar';
-const getPolarLayout = (trace, layout)=>{
-    const subplotId = (trace === null || trace === void 0 ? void 0 : trace.subplot) || DEFAULT_POLAR_SUBPLOT;
-    return layout === null || layout === void 0 ? void 0 : layout[subplotId];
-};
-const getValidAxisValues = (data, dataKey)=>{
-    const values = [];
-    data.forEach((series)=>{
-        if (isArrayOrTypedArray(series[dataKey])) {
-            series[dataKey].forEach((val)=>{
-                if (!isInvalidValue(val)) {
-                    values.push(val);
-                }
-            });
-        }
-    });
-    return values;
-};
-const getPolarAxisType = (data, dataKey, declaredType)=>{
-    if ([
-        'linear',
-        'log',
-        'date',
-        'category'
-    ].includes(declaredType !== null && declaredType !== void 0 ? declaredType : '')) {
-        return declaredType;
-    }
-    const values = getValidAxisValues(data, dataKey);
-    if (isNumberArray(values) && !isYearArray(values)) {
-        return 'linear';
-    }
-    if (isDateArray(values)) {
-        return 'date';
-    }
-    return 'category';
-};
-const getPolarAxis = (data, dataKey, layout)=>{
-    const polarLayout = getPolarLayout(data[0], layout);
-    const ax = polarLayout === null || polarLayout === void 0 ? void 0 : polarLayout[POLAR_AXIS_BY_DATA_KEY[dataKey].toLowerCase()];
-    return {
-        ...ax,
-        _dataKey: dataKey,
-        _type: getPolarAxisType(data, dataKey, ax === null || ax === void 0 ? void 0 : ax.type)
-    };
-};
-const getPolarAxisTickProps = (data, ax)=>{
-    const props = {};
-    if ((!ax.tickmode || ax.tickmode === 'array') && isArrayOrTypedArray(ax.tickvals)) {
-        const tickValues = ax._type === 'date' ? ax.tickvals.map((v)=>new Date(v)) : ax.tickvals;
-        props.tickValues = tickValues;
-        props.tickText = ax.ticktext;
-        return props;
-    }
-    if ((!ax.tickmode || ax.tickmode === 'linear') && ax.dtick) {
-        const dtick = plotlyDtick(ax.dtick, ax._type);
-        const tick0 = plotlyTick0(ax.tick0, ax._type, dtick);
-        props.tickStep = dtick;
-        props.tick0 = tick0;
-        return props;
-    }
-    if ((!ax.tickmode || ax.tickmode === 'auto') && typeof ax.nticks === 'number' && ax.nticks >= 0) {
-        props.tickCount = ax.nticks;
-    }
-    return props;
-};
-const getPolarAxisCategoryOrder = (data, ax)=>{
-    if (ax._type !== 'category') {
-        return 'data';
-    }
-    const isValidArray = isArrayOrTypedArray(ax.categoryarray) && ax.categoryarray.length > 0;
-    if (isValidArray && (!ax.categoryorder || ax.categoryorder === 'array')) {
-        return ax.categoryarray;
-    }
-    if (!ax.categoryorder || ax.categoryorder === 'trace' || ax.categoryorder === 'array') {
-        const values = getValidAxisValues(data, ax._dataKey);
-        const categoriesInTraceOrder = Array.from(new Set(values));
-        return ax.autorange === 'reversed' ? categoriesInTraceOrder.reverse() : categoriesInTraceOrder;
-    }
-    return ax.categoryorder;
-};
-const getPolarAxisProps = (data, layout)=>{
-    const props = {};
-    Object.keys(POLAR_AXIS_BY_DATA_KEY).forEach((dataKey)=>{
-        const propName = POLAR_AXIS_BY_DATA_KEY[dataKey];
-        const ax = getPolarAxis(data, dataKey, layout);
-        props[propName] = {
-            scaleType: ax._type === 'log' ? 'log' : 'default',
-            categoryOrder: getPolarAxisCategoryOrder(data, ax),
-            tickFormat: ax.tickformat,
-            ...getPolarAxisTickProps(data, ax),
-            ...isArrayOrTypedArray(ax.range) ? {
-                rangeStart: ax.range[0],
-                rangeEnd: ax.range[1]
-            } : {}
-        };
-        if (propName === 'angularAxis') {
-            props[propName].unit = ax.thetaunit;
-            props.direction = ax.direction;
-        }
-    });
-    return props;
-};