@fluentui/react-charts 0.0.0-nightly-20250826-0412.1 → 0.0.0-nightly-20250827-0407.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/CHANGELOG.md +15 -15
  2. package/lib/components/ChartTable/ChartTable.js +87 -6
  3. package/lib/components/ChartTable/ChartTable.js.map +1 -1
  4. package/lib/components/DeclarativeChart/DeclarativeChart.js +11 -1
  5. package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
  6. package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +19 -0
  7. package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
  8. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +202 -63
  9. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  10. package/lib/components/LineChart/LineChart.js +29 -4
  11. package/lib/components/LineChart/LineChart.js.map +1 -1
  12. package/lib/components/ScatterChart/ScatterChart.js +62 -45
  13. package/lib/components/ScatterChart/ScatterChart.js.map +1 -1
  14. package/lib/utilities/scatterpolar-utils.js +63 -0
  15. package/lib/utilities/scatterpolar-utils.js.map +1 -0
  16. package/lib/utilities/utilities.js +32 -8
  17. package/lib/utilities/utilities.js.map +1 -1
  18. package/lib-commonjs/components/ChartTable/ChartTable.js +87 -6
  19. package/lib-commonjs/components/ChartTable/ChartTable.js.map +1 -1
  20. package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +11 -1
  21. package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
  22. package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js +22 -0
  23. package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
  24. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +201 -62
  25. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  26. package/lib-commonjs/components/LineChart/LineChart.js +28 -3
  27. package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
  28. package/lib-commonjs/components/ScatterChart/ScatterChart.js +61 -44
  29. package/lib-commonjs/components/ScatterChart/ScatterChart.js.map +1 -1
  30. package/lib-commonjs/utilities/scatterpolar-utils.js +78 -0
  31. package/lib-commonjs/utilities/scatterpolar-utils.js.map +1 -0
  32. package/lib-commonjs/utilities/utilities.js +28 -8
  33. package/lib-commonjs/utilities/utilities.js.map +1 -1
  34. package/package.json +12 -12
@@ -349,15 +349,13 @@ const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, colorwayTy
349
349
  const yAxisTickFormat = getYAxisTickFormat(input.data[0], input.layout);
350
350
  let yMinValue = 0;
351
351
  input.data.forEach((series, index1)=>{
352
- var _input_layout_coloraxis_colorscale, _input_layout_coloraxis, _input_layout, _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout1, _series_marker3, _input_layout_template_layout1, _input_layout_template1, _input_layout2, _series_line;
353
- if (((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_coloraxis = _input_layout.coloraxis) === null || _input_layout_coloraxis === void 0 ? void 0 : (_input_layout_coloraxis_colorscale = _input_layout_coloraxis.colorscale) === null || _input_layout_coloraxis_colorscale === void 0 ? void 0 : _input_layout_coloraxis_colorscale.length) && (0, _chartutilities.isArrayOrTypedArray)((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) && ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length > 0 && typeof ((_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[0]) === 'number') {
354
- colorScale = createColorScale(input.layout, series);
355
- }
352
+ var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _input_layout_template_layout1, _input_layout_template1, _input_layout1, _series_line;
353
+ colorScale = (0, _PlotlyColorAdapter.createColorScale)(input.layout, series, colorScale);
356
354
  const isXYearCategory = (0, _chartutilities.isYearArray)(series.x); // Consider year as categorical not numeric continuous axis
357
355
  // extract bar colors for each series only once
358
- const extractedBarColors = (0, _PlotlyColorAdapter.extractColor)((_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, (_series_marker3 = series.marker) === null || _series_marker3 === void 0 ? void 0 : _series_marker3.color, colorMap, isDarkTheme);
356
+ const extractedBarColors = (0, _PlotlyColorAdapter.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);
359
357
  // extract line colors for each series only once
360
- const extractedLineColors = (0, _PlotlyColorAdapter.extractColor)((_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_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);
358
+ const extractedLineColors = (0, _PlotlyColorAdapter.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);
361
359
  const xValues = series.x;
362
360
  const isXDate = (0, _chartutilities.isDateArray)(xValues);
363
361
  const isXString = (0, _chartutilities.isStringArray)(xValues);
@@ -445,23 +443,11 @@ const transformPlotlyJsonToVSBCProps = (input, isMultiPlot, colorMap, colorwayTy
445
443
  ...getTitles(input.layout),
446
444
  ...getXAxisTickFormat(input.data[0], input.layout),
447
445
  ...yAxisTickFormat,
448
- ...getAxisCategoryOrderProps(input.data, input.layout)
446
+ ...getAxisCategoryOrderProps(input.data, input.layout),
447
+ ...getBarProps(input.data, input.layout),
448
+ ...getYMinMaxValues(input.data[0], input.layout)
449
449
  };
450
450
  };
451
- const createColorScale = (layout, series)=>{
452
- var _layout_coloraxis, _series_marker, _layout_coloraxis1, _layout_coloraxis2;
453
- const scale = layout === null || layout === void 0 ? void 0 : (_layout_coloraxis = layout.coloraxis) === null || _layout_coloraxis === void 0 ? void 0 : _layout_coloraxis.colorscale;
454
- const colorValues = (_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color;
455
- var _layout_coloraxis_cmin, _layout_coloraxis_cmax;
456
- const [dMin, dMax] = [
457
- (_layout_coloraxis_cmin = layout === null || layout === void 0 ? void 0 : (_layout_coloraxis1 = layout.coloraxis) === null || _layout_coloraxis1 === void 0 ? void 0 : _layout_coloraxis1.cmin) !== null && _layout_coloraxis_cmin !== void 0 ? _layout_coloraxis_cmin : Math.min(...colorValues),
458
- (_layout_coloraxis_cmax = layout === null || layout === void 0 ? void 0 : (_layout_coloraxis2 = layout.coloraxis) === null || _layout_coloraxis2 === void 0 ? void 0 : _layout_coloraxis2.cmax) !== null && _layout_coloraxis_cmax !== void 0 ? _layout_coloraxis_cmax : Math.max(...colorValues)
459
- ];
460
- // Normalize colorscale domain to actual data domain
461
- const scaleDomain = scale.map(([pos])=>dMin + pos * (dMax - dMin));
462
- const scaleColors = scale.map((item)=>item[1]);
463
- return (0, _d3scale.scaleLinear)().domain(scaleDomain).range(scaleColors);
464
- };
465
451
  const transformPlotlyJsonToGVBCProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
466
452
  var _input_layout, _input_layout1, _gvbcData_;
467
453
  const mapXToDataPoints = {};
@@ -470,12 +456,10 @@ const transformPlotlyJsonToGVBCProps = (input, isMultiPlot, colorMap, colorwayTy
470
456
  let colorScale = undefined;
471
457
  const yAxisTickFormat = getYAxisTickFormat(input.data[0], input.layout);
472
458
  input.data.forEach((series, index1)=>{
473
- var _input_layout_coloraxis_colorscale, _input_layout_coloraxis, _input_layout, _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout1, _series_marker3, _series_x;
474
- if (((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_coloraxis = _input_layout.coloraxis) === null || _input_layout_coloraxis === void 0 ? void 0 : (_input_layout_coloraxis_colorscale = _input_layout_coloraxis.colorscale) === null || _input_layout_coloraxis_colorscale === void 0 ? void 0 : _input_layout_coloraxis_colorscale.length) && (0, _chartutilities.isArrayOrTypedArray)((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) && ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length > 0 && typeof ((_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[0]) === 'number') {
475
- colorScale = createColorScale(input.layout, series);
476
- }
459
+ var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _series_x;
460
+ colorScale = (0, _PlotlyColorAdapter.createColorScale)(input.layout, series, colorScale);
477
461
  // extract colors for each series only once
478
- const extractedColors = (0, _PlotlyColorAdapter.extractColor)((_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, (_series_marker3 = series.marker) === null || _series_marker3 === void 0 ? void 0 : _series_marker3.color, colorMap, isDarkTheme);
462
+ const extractedColors = (0, _PlotlyColorAdapter.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);
479
463
  (_series_x = series.x) === null || _series_x === void 0 ? void 0 : _series_x.forEach((x, index2)=>{
480
464
  var _series_y;
481
465
  if ((0, _chartutilities.isInvalidValue)(x) || (0, _chartutilities.isInvalidValue)((_series_y = series.y) === null || _series_y === void 0 ? void 0 : _series_y[index2])) {
@@ -526,7 +510,8 @@ const transformPlotlyJsonToGVBCProps = (input, isMultiPlot, colorMap, colorwayTy
526
510
  ...getYMinMaxValues(input.data[0], input.layout),
527
511
  ...getXAxisTickFormat(input.data[0], input.layout),
528
512
  ...yAxisTickFormat,
529
- ...getAxisCategoryOrderProps(input.data, input.layout)
513
+ ...getAxisCategoryOrderProps(input.data, input.layout),
514
+ ...getBarProps(input.data, input.layout)
530
515
  };
531
516
  };
532
517
  const transformPlotlyJsonToVBCProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
@@ -535,15 +520,13 @@ const transformPlotlyJsonToVBCProps = (input, isMultiPlot, colorMap, colorwayTyp
535
520
  const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
536
521
  let colorScale = undefined;
537
522
  input.data.forEach((series, seriesIdx)=>{
538
- var _input_layout_coloraxis_colorscale, _input_layout_coloraxis, _input_layout, _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout1, _series_marker3, _series_xbins, _series_xbins1, _series_xbins2;
523
+ var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker, _series_xbins, _series_xbins1, _series_xbins2;
539
524
  if (!series.x) {
540
525
  return;
541
526
  }
542
- if (((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_coloraxis = _input_layout.coloraxis) === null || _input_layout_coloraxis === void 0 ? void 0 : (_input_layout_coloraxis_colorscale = _input_layout_coloraxis.colorscale) === null || _input_layout_coloraxis_colorscale === void 0 ? void 0 : _input_layout_coloraxis_colorscale.length) && (0, _chartutilities.isArrayOrTypedArray)((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) && ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length > 0 && typeof ((_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[0]) === 'number') {
543
- colorScale = createColorScale(input.layout, series);
544
- }
527
+ colorScale = (0, _PlotlyColorAdapter.createColorScale)(input.layout, series, colorScale);
545
528
  // extract colors for each series only once
546
- const extractedColors = (0, _PlotlyColorAdapter.extractColor)((_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, (_series_marker3 = series.marker) === null || _series_marker3 === void 0 ? void 0 : _series_marker3.color, colorMap, isDarkTheme);
529
+ const extractedColors = (0, _PlotlyColorAdapter.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);
547
530
  const xValues = [];
548
531
  const yValues = [];
549
532
  series.x.forEach((xVal, index)=>{
@@ -620,12 +603,14 @@ const transformPlotlyJsonToScatterChartProps = (input, isMultiPlot, colorMap, co
620
603
  const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, colorMap, colorwayType, isDarkTheme)=>{
621
604
  var _input_data_, _input_layout, _input_layout1;
622
605
  const isScatterMarkers = [
606
+ 'text',
623
607
  'markers',
624
608
  'text+markers',
625
609
  'markers+text',
626
610
  'lines+markers',
627
611
  'markers+line',
628
- 'text+lines+markers'
612
+ 'text+lines+markers',
613
+ 'lines+markers+text'
629
614
  ].includes((_input_data_ = input.data[0]) === null || _input_data_ === void 0 ? void 0 : _input_data_.mode);
630
615
  const isAreaChart = chartType === 'area';
631
616
  const isScatterChart = chartType === 'scatter';
@@ -649,11 +634,11 @@ const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, c
649
634
  const seriesOpacity = (0, _PlotlyColorAdapter.getOpacity)(series, index);
650
635
  mode = series.fill === 'tozeroy' ? 'tozeroy' : 'tonexty';
651
636
  // if mode contains 'text', we prioritize showing the text over curving the line
652
- const lineOptions = !((_series_mode1 = series.mode) === null || _series_mode1 === void 0 ? void 0 : _series_mode1.includes('text')) ? getLineOptions(series.line) : undefined;
637
+ const lineOptions = !((_series_mode1 = series.mode) === null || _series_mode1 === void 0 ? void 0 : _series_mode1.includes('text')) && series.type !== 'scatterpolar' ? getLineOptions(series.line) : undefined;
653
638
  const legendShape = getLegendShape(series);
654
639
  const validXYRanges = getValidXYRanges(series);
655
640
  return validXYRanges.map(([rangeStart, rangeEnd], rangeIdx)=>{
656
- var _series_marker;
641
+ var _series_marker, _input_layout, _input_layout_polar_angularaxis, _input_layout_polar, _input_layout1, _input_layout_polar_angularaxis1, _input_layout_polar1, _input_layout2;
657
642
  const rangeXValues = xValues.slice(rangeStart, rangeEnd);
658
643
  const rangeYValues = series.y.slice(rangeStart, rangeEnd);
659
644
  const markerSizes = (0, _chartutilities.isArrayOrTypedArray)((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.size) ? series.marker.size.slice(rangeStart, rangeEnd) : [];
@@ -683,7 +668,14 @@ const transformPlotlyJsonToScatterTraceProps = (input, isMultiPlot, chartType, c
683
668
  }).formatHex8()) !== null && _rgb_copy_formatHex8 !== void 0 ? _rgb_copy_formatHex8 : seriesColor,
684
669
  lineOptions: {
685
670
  ...lineOptions !== null && lineOptions !== void 0 ? lineOptions : {},
686
- mode: series.mode
671
+ mode: series.type !== 'scatterpolar' ? series.mode : 'scatterpolar',
672
+ // originXOffset is not typed on Layout, but may be present in input.layout as a part of projection of
673
+ // scatter polar coordingates to cartesian coordinates
674
+ ...series.type === 'scatterpolar' ? {
675
+ originXOffset: (_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.__polarOriginX,
676
+ 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,
677
+ 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
678
+ } : {}
687
679
  },
688
680
  useSecondaryYScale: usesSecondaryYScale(series, input.layout)
689
681
  };
@@ -736,12 +728,10 @@ const transformPlotlyJsonToHorizontalBarWithAxisProps = (input, isMultiPlot, col
736
728
  const { legends, hideLegend } = getLegendProps(input.data, input.layout, isMultiPlot);
737
729
  let colorScale = undefined;
738
730
  const chartData = input.data.map((series, index)=>{
739
- var _input_layout_coloraxis_colorscale, _input_layout_coloraxis, _input_layout, _series_marker, _series_marker1, _series_marker_color, _series_marker2, _input_layout_template_layout, _input_layout_template, _input_layout1, _series_marker3;
740
- if (((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : (_input_layout_coloraxis = _input_layout.coloraxis) === null || _input_layout_coloraxis === void 0 ? void 0 : (_input_layout_coloraxis_colorscale = _input_layout_coloraxis.colorscale) === null || _input_layout_coloraxis_colorscale === void 0 ? void 0 : _input_layout_coloraxis_colorscale.length) && (0, _chartutilities.isArrayOrTypedArray)((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.color) && ((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.color).length > 0 && typeof ((_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[0]) === 'number') {
741
- colorScale = createColorScale(input.layout, series);
742
- }
731
+ var _input_layout_template_layout, _input_layout_template, _input_layout, _series_marker;
732
+ colorScale = (0, _PlotlyColorAdapter.createColorScale)(input.layout, series, colorScale);
743
733
  // extract colors for each series only once
744
- const extractedColors = (0, _PlotlyColorAdapter.extractColor)((_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, (_series_marker3 = series.marker) === null || _series_marker3 === void 0 ? void 0 : _series_marker3.color, colorMap, isDarkTheme);
734
+ const extractedColors = (0, _PlotlyColorAdapter.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);
745
735
  const legend = legends[index];
746
736
  return series.y.map((yValue, i)=>{
747
737
  var _series_x, _series_marker, _series_marker1, _series_marker_color, _series_marker2;
@@ -786,7 +776,8 @@ const transformPlotlyJsonToHorizontalBarWithAxisProps = (input, isMultiPlot, col
786
776
  hideLegend,
787
777
  roundCorners: true,
788
778
  ...getTitles(input.layout),
789
- ...getAxisCategoryOrderProps(input.data, input.layout)
779
+ ...getAxisCategoryOrderProps(input.data, input.layout),
780
+ ...getBarProps(input.data, input.layout, true)
790
781
  };
791
782
  };
792
783
  const transformPlotlyJsonToHeatmapProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
@@ -1067,7 +1058,7 @@ const formatValue = (value, colIndex, cells)=>{
1067
1058
  return `${prefix !== null && prefix !== void 0 ? prefix : ''}${formatted}${suffix !== null && suffix !== void 0 ? suffix : ''}`;
1068
1059
  };
1069
1060
  const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colorwayType, isDarkTheme)=>{
1070
- var _tableData_cells, _input_layout_template_data, _input_layout_template, _input_layout, _input_layout_font, _input_layout1, _tableData_header, _tableData_header1, _input_layout_template_data1, _input_layout_template1, _input_layout2, _input_layout3, _input_layout4;
1061
+ 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, _tableData_header, _input_layout_template_data1, _input_layout_template1, _input_layout2, _input_layout3, _input_layout4;
1071
1062
  const tableData = input.data[0];
1072
1063
  const normalizeHeaders = (values, header)=>{
1073
1064
  const cleanedValues = Array.isArray(values[0]) ? values.map((row)=>row.map((cell)=>cleanText(cell)).filter(Boolean).join(' ')) : values.map((cell)=>cleanText(cell));
@@ -1076,7 +1067,8 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1076
1067
  const fontColorRaw = header === null || header === void 0 ? void 0 : (_header_font = header.font) === null || _header_font === void 0 ? void 0 : _header_font.color;
1077
1068
  let fontColor;
1078
1069
  if (Array.isArray(fontColorRaw)) {
1079
- const colorEntry = fontColorRaw[colIndex];
1070
+ var _fontColorRaw_colIndex;
1071
+ const colorEntry = (_fontColorRaw_colIndex = fontColorRaw[colIndex]) !== null && _fontColorRaw_colIndex !== void 0 ? _fontColorRaw_colIndex : fontColorRaw[0];
1080
1072
  if (Array.isArray(colorEntry)) {
1081
1073
  fontColor = typeof colorEntry[0] === 'string' ? colorEntry[0] : undefined;
1082
1074
  } else if (typeof colorEntry === 'string') {
@@ -1088,15 +1080,20 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1088
1080
  const fontSizeRaw = header === null || header === void 0 ? void 0 : (_header_font1 = header.font) === null || _header_font1 === void 0 ? void 0 : _header_font1.size;
1089
1081
  let fontSize;
1090
1082
  if (Array.isArray(fontSizeRaw)) {
1091
- fontSize = Array.isArray(fontSizeRaw[0]) ? fontSizeRaw[0][colIndex] : fontSizeRaw[colIndex];
1083
+ var _fontSizeRaw_colIndex;
1084
+ const fontSizeEntry = (_fontSizeRaw_colIndex = fontSizeRaw[colIndex]) !== null && _fontSizeRaw_colIndex !== void 0 ? _fontSizeRaw_colIndex : fontSizeRaw[0];
1085
+ var _fontSizeRaw__colIndex;
1086
+ fontSize = Array.isArray(fontSizeRaw[0]) ? (_fontSizeRaw__colIndex = fontSizeRaw[0][colIndex]) !== null && _fontSizeRaw__colIndex !== void 0 ? _fontSizeRaw__colIndex : fontSizeRaw[0][0] : typeof fontSizeEntry === 'number' ? fontSizeEntry : undefined;
1092
1087
  } else if (typeof fontSizeRaw === 'number') {
1093
1088
  fontSize = fontSizeRaw;
1094
1089
  }
1095
1090
  const updatedColIndex = colIndex >= 1 ? 1 : 0;
1096
1091
  const fillColorRaw = header === null || header === void 0 ? void 0 : (_header_fill = header.fill) === null || _header_fill === void 0 ? void 0 : _header_fill.color;
1097
- const backgroundColor = Array.isArray(fillColorRaw) ? fillColorRaw[updatedColIndex] : fillColorRaw;
1092
+ var _fillColorRaw_updatedColIndex;
1093
+ const backgroundColor = Array.isArray(fillColorRaw) ? (_fillColorRaw_updatedColIndex = fillColorRaw[updatedColIndex]) !== null && _fillColorRaw_updatedColIndex !== void 0 ? _fillColorRaw_updatedColIndex : fillColorRaw[0] : fillColorRaw;
1098
1094
  const textAlignRaw = header === null || header === void 0 ? void 0 : header.align;
1099
- const textAlign = Array.isArray(textAlignRaw) ? textAlignRaw[colIndex] : textAlignRaw;
1095
+ var _textAlignRaw_colIndex;
1096
+ const textAlign = Array.isArray(textAlignRaw) ? (_textAlignRaw_colIndex = textAlignRaw[colIndex]) !== null && _textAlignRaw_colIndex !== void 0 ? _textAlignRaw_colIndex : textAlignRaw[0] : textAlignRaw;
1100
1097
  const style = {
1101
1098
  ...typeof fontColor === 'string' ? {
1102
1099
  color: fontColor
@@ -1119,7 +1116,7 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1119
1116
  };
1120
1117
  var _tableData_cells_values;
1121
1118
  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 : [];
1122
- const cells = tableData.cells.font ? 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[0].cells;
1119
+ const cells = tableData.cells && Object.keys(tableData.cells).length > 0 ? 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;
1123
1120
  const rows = columns[0].map((_, rowIndex)=>columns.map((col, colIndex)=>{
1124
1121
  var _cells_font, _cells_font1, _cells_fill;
1125
1122
  const cellValue = col[rowIndex];
@@ -1128,7 +1125,8 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1128
1125
  const rawFontColor = cells === null || cells === void 0 ? void 0 : (_cells_font = cells.font) === null || _cells_font === void 0 ? void 0 : _cells_font.color;
1129
1126
  let fontColor;
1130
1127
  if (Array.isArray(rawFontColor)) {
1131
- const entry = rawFontColor[colIndex];
1128
+ var _rawFontColor_colIndex;
1129
+ const entry = (_rawFontColor_colIndex = rawFontColor[colIndex]) !== null && _rawFontColor_colIndex !== void 0 ? _rawFontColor_colIndex : rawFontColor[0];
1132
1130
  const colorValue = Array.isArray(entry) ? entry[rowIndex] : entry;
1133
1131
  fontColor = typeof colorValue === 'string' ? colorValue : undefined;
1134
1132
  } else if (typeof rawFontColor === 'string') {
@@ -1137,7 +1135,8 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1137
1135
  const rawFontSize = cells === null || cells === void 0 ? void 0 : (_cells_font1 = cells.font) === null || _cells_font1 === void 0 ? void 0 : _cells_font1.size;
1138
1136
  let fontSize;
1139
1137
  if (Array.isArray(rawFontSize)) {
1140
- const entry = rawFontSize[colIndex];
1138
+ var _rawFontSize_colIndex;
1139
+ const entry = (_rawFontSize_colIndex = rawFontSize[colIndex]) !== null && _rawFontSize_colIndex !== void 0 ? _rawFontSize_colIndex : rawFontSize[0];
1141
1140
  const fontSizeValue = Array.isArray(entry) ? entry[rowIndex] : entry;
1142
1141
  fontSize = typeof fontSizeValue === 'number' ? fontSizeValue : undefined;
1143
1142
  } else if (typeof rawFontSize === 'number') {
@@ -1147,13 +1146,15 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1147
1146
  const rawBackgroundColor = cells === null || cells === void 0 ? void 0 : (_cells_fill = cells.fill) === null || _cells_fill === void 0 ? void 0 : _cells_fill.color;
1148
1147
  let backgroundColor;
1149
1148
  if (Array.isArray(rawBackgroundColor)) {
1150
- const entry = rawBackgroundColor[updatedColIndex];
1149
+ var _rawBackgroundColor_updatedColIndex;
1150
+ const entry = (_rawBackgroundColor_updatedColIndex = rawBackgroundColor[updatedColIndex]) !== null && _rawBackgroundColor_updatedColIndex !== void 0 ? _rawBackgroundColor_updatedColIndex : rawBackgroundColor[0];
1151
1151
  const colorValue = Array.isArray(entry) ? entry[rowIndex] : entry;
1152
1152
  backgroundColor = typeof colorValue === 'string' ? colorValue : undefined;
1153
1153
  } else if (typeof rawBackgroundColor === 'string') {
1154
1154
  backgroundColor = rawBackgroundColor;
1155
1155
  }
1156
- const rawTextAlign = Array.isArray(cells === null || cells === void 0 ? void 0 : cells.align) ? cells.align[colIndex] : cells === null || cells === void 0 ? void 0 : cells.align;
1156
+ var _cells_align_colIndex;
1157
+ const rawTextAlign = Array.isArray(cells === null || cells === void 0 ? void 0 : cells.align) ? (_cells_align_colIndex = cells.align[colIndex]) !== null && _cells_align_colIndex !== void 0 ? _cells_align_colIndex : cells.align[0] : cells === null || cells === void 0 ? void 0 : cells.align;
1157
1158
  const textAlign = rawTextAlign;
1158
1159
  const style = {
1159
1160
  ...fontColor ? {
@@ -1183,7 +1184,7 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1183
1184
  };
1184
1185
  var _tableData_header_values;
1185
1186
  return {
1186
- 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 : [], ((_tableData_header1 = tableData.header) === null || _tableData_header1 === void 0 ? void 0 : _tableData_header1.font) ? tableData.header : (_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_data1.table[0].header),
1187
+ 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 : [], tableData.header && Object.keys(tableData.header).length > 0 ? tableData.header : (_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_data1.table[0].header),
1187
1188
  rows,
1188
1189
  width: (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : _input_layout3.width,
1189
1190
  height: (_input_layout4 = input.layout) === null || _input_layout4 === void 0 ? void 0 : _input_layout4.height,
@@ -1191,27 +1192,133 @@ const transformPlotlyJsonToChartTableProps = (input, isMultiPlot, colorMap, colo
1191
1192
  };
1192
1193
  };
1193
1194
  const projectPolarToCartesian = (input)=>{
1195
+ var _input_layout, _input_layout1;
1194
1196
  const projection = {
1195
1197
  ...input
1196
1198
  };
1199
+ // 1. Find the global min and max radius across all series
1200
+ let minRadius = 0;
1201
+ let maxRadius = 0;
1197
1202
  for(let sindex = 0; sindex < input.data.length; sindex++){
1198
- var _series_r;
1203
+ const rVals = input.data[sindex].r;
1204
+ if (rVals && (0, _chartutilities.isArrayOrTypedArray)(rVals)) {
1205
+ for(let ptindex = 0; ptindex < rVals.length; ptindex++){
1206
+ if (!(0, _chartutilities.isInvalidValue)(rVals[ptindex])) {
1207
+ minRadius = Math.min(minRadius, rVals[ptindex]);
1208
+ maxRadius = Math.max(maxRadius, rVals[ptindex]);
1209
+ }
1210
+ }
1211
+ }
1212
+ }
1213
+ // 2. If there are negative radii, compute the shift
1214
+ const radiusShift = minRadius < 0 ? -minRadius : 0;
1215
+ // 3. Project all points and create a perfect square domain
1216
+ const allX = [];
1217
+ const allY = [];
1218
+ let originX = null;
1219
+ for(let sindex = 0; sindex < input.data.length; sindex++){
1220
+ var _input_layout_polar_angularaxis, _input_layout_polar, _input_layout2, _input_layout_polar_angularaxis1, _input_layout_polar1, _input_layout3;
1199
1221
  const series = input.data[sindex];
1222
+ // If scatterpolar, set text to theta values as strings
1223
+ if (series.type === 'scatterpolar' && Array.isArray(series.theta)) {
1224
+ series.text = series.theta.map((v)=>String(v));
1225
+ }
1200
1226
  series.x = [];
1201
1227
  series.y = [];
1202
- var _series_r_length;
1203
- for(let ptindex = 0; ptindex < ((_series_r_length = (_series_r = series.r) === null || _series_r === void 0 ? void 0 : _series_r.length) !== null && _series_r_length !== void 0 ? _series_r_length : 0); ptindex++){
1204
- var _series_theta, _series_r1;
1205
- if ((0, _chartutilities.isInvalidValue)((_series_theta = series.theta) === null || _series_theta === void 0 ? void 0 : _series_theta[ptindex]) || (0, _chartutilities.isInvalidValue)((_series_r1 = series.r) === null || _series_r1 === void 0 ? void 0 : _series_r1[ptindex])) {
1228
+ const thetas = series.theta;
1229
+ const rVals = series.r;
1230
+ // Skip if rVals or thetas are not arrays
1231
+ if (!(0, _chartutilities.isArrayOrTypedArray)(rVals) || !(0, _chartutilities.isArrayOrTypedArray)(thetas)) {
1232
+ projection.data[sindex] = series;
1233
+ continue;
1234
+ }
1235
+ // retrieve polar axis settings
1236
+ const dirMultiplier = ((_input_layout2 = input.layout) === null || _input_layout2 === void 0 ? void 0 : (_input_layout_polar = _input_layout2.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) === 'clockwise' ? -1 : 1;
1237
+ var _input_layout_polar_angularaxis_rotation;
1238
+ const startAngleInRad = ((_input_layout_polar_angularaxis_rotation = (_input_layout3 = input.layout) === null || _input_layout3 === void 0 ? void 0 : (_input_layout_polar1 = _input_layout3.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) !== null && _input_layout_polar_angularaxis_rotation !== void 0 ? _input_layout_polar_angularaxis_rotation : 0) * Math.PI / 180;
1239
+ // Compute tick positions if categorical
1240
+ let uniqueTheta = [];
1241
+ let categorical = false;
1242
+ if (!(0, _chartutilities.isNumberArray)(thetas)) {
1243
+ uniqueTheta = Array.from(new Set(thetas));
1244
+ categorical = true;
1245
+ }
1246
+ for(let ptindex = 0; ptindex < rVals.length; ptindex++){
1247
+ if ((0, _chartutilities.isInvalidValue)(thetas === null || thetas === void 0 ? void 0 : thetas[ptindex]) || (0, _chartutilities.isInvalidValue)(rVals === null || rVals === void 0 ? void 0 : rVals[ptindex])) {
1206
1248
  continue;
1207
1249
  }
1208
- const thetaRad = series.theta[ptindex] * Math.PI / 180;
1209
- const radius = series.r[ptindex];
1210
- series.x.push(radius * Math.cos(thetaRad));
1211
- series.y.push(radius * Math.sin(thetaRad));
1250
+ // 4. Map theta to angle in radians
1251
+ let thetaRad;
1252
+ if (categorical) {
1253
+ const idx = uniqueTheta.indexOf(thetas[ptindex]);
1254
+ const step = 2 * Math.PI / uniqueTheta.length;
1255
+ thetaRad = startAngleInRad + dirMultiplier * idx * step;
1256
+ } else {
1257
+ thetaRad = startAngleInRad + dirMultiplier * (thetas[ptindex] * Math.PI / 180);
1258
+ }
1259
+ // 5. Shift only the polar origin (not the cartesian)
1260
+ const rawRadius = rVals[ptindex];
1261
+ const polarRadius = rawRadius + radiusShift; // Only for projection
1262
+ // 6. Calculate cartesian coordinates (with shifted polar origin)
1263
+ const x = polarRadius * Math.cos(thetaRad);
1264
+ const y = polarRadius * Math.sin(thetaRad);
1265
+ // Calculate the cartesian coordinates of the original polar origin (0,0)
1266
+ // This is the point that should be mapped to (0,0) in cartesian coordinates
1267
+ if (sindex === 0 && ptindex === 0) {
1268
+ // For polar origin (r=0, θ=0), cartesian coordinates are (0,0)
1269
+ // But since we shifted the radius by radiusShift, the cartesian origin is at (radiusShift, 0)
1270
+ originX = radiusShift;
1271
+ }
1272
+ series.x.push(x);
1273
+ series.y.push(y);
1274
+ allX.push(x);
1275
+ allY.push(y);
1276
+ }
1277
+ // Map text to each data point for downstream chart rendering
1278
+ if (series.x && series.y) {
1279
+ series.data = series.x.map((xVal, idx)=>({
1280
+ x: xVal,
1281
+ y: series.y[idx],
1282
+ ...series.text ? {
1283
+ text: series.text[idx]
1284
+ } : {}
1285
+ }));
1212
1286
  }
1213
1287
  projection.data[sindex] = series;
1214
1288
  }
1289
+ // 7. Recenter all cartesian coordinates
1290
+ if (originX !== null) {
1291
+ for(let sindex = 0; sindex < projection.data.length; sindex++){
1292
+ const series = projection.data[sindex];
1293
+ if (series.x && series.y) {
1294
+ series.x = series.x.map((v)=>v - originX);
1295
+ }
1296
+ }
1297
+ // Also recenter allX for normalization
1298
+ for(let i = 0; i < allX.length; i++){
1299
+ allX[i] = allX[i] - originX;
1300
+ }
1301
+ }
1302
+ // 8. Find the maximum absolute value among all x and y
1303
+ let maxAbs = Math.max(...allX.map(Math.abs), ...allY.map(Math.abs));
1304
+ maxAbs = maxAbs === 0 ? 1 : maxAbs;
1305
+ // 9. Rescale all points so that the largest |x| or |y| is 0.5
1306
+ for(let sindex = 0; sindex < projection.data.length; sindex++){
1307
+ const series = projection.data[sindex];
1308
+ if (series.x && series.y) {
1309
+ series.x = series.x.map((v)=>v / (2 * maxAbs));
1310
+ series.y = series.y.map((v)=>v / (2 * maxAbs));
1311
+ }
1312
+ }
1313
+ // 10. Customize layout for perfect square with absolute positioning
1314
+ const size = ((_input_layout = input.layout) === null || _input_layout === void 0 ? void 0 : _input_layout.width) || ((_input_layout1 = input.layout) === null || _input_layout1 === void 0 ? void 0 : _input_layout1.height) || 500;
1315
+ projection.layout = {
1316
+ ...projection.layout,
1317
+ width: size,
1318
+ height: size
1319
+ };
1320
+ // Attach originX as custom properties
1321
+ projection.layout.__polarOriginX = originX !== null && originX !== void 0 ? originX : undefined;
1215
1322
  return projection;
1216
1323
  };
1217
1324
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -1690,3 +1797,35 @@ const getGridProperties = (schema, isMultiPlot, validTracesInfo)=>{
1690
1797
  });
1691
1798
  return result;
1692
1799
  };
1800
+ const getBarProps = (data, layout, isHorizontal)=>{
1801
+ let padding;
1802
+ if (typeof (layout === null || layout === void 0 ? void 0 : layout.bargap) === 'number') {
1803
+ padding = layout.bargap;
1804
+ }
1805
+ const plotlyBarWidths = data.map((series)=>{
1806
+ if (series.type === 'bar' && ((0, _chartutilities.isArrayOrTypedArray)(series.width) || typeof series.width === 'number')) {
1807
+ return series.width;
1808
+ }
1809
+ return [];
1810
+ }).flat();
1811
+ const maxPlotlyBarWidth = (0, _d3array.max)(plotlyBarWidths);
1812
+ if (typeof maxPlotlyBarWidth === 'number') {
1813
+ padding = 1 - maxPlotlyBarWidth;
1814
+ padding = Math.max(0, Math.min(padding, 1));
1815
+ }
1816
+ if (typeof padding === 'undefined') {
1817
+ return {};
1818
+ }
1819
+ if (isHorizontal) {
1820
+ return {
1821
+ maxBarHeight: 1000,
1822
+ yAxisPadding: padding
1823
+ };
1824
+ }
1825
+ return {
1826
+ barWidth: 'auto',
1827
+ maxBarWidth: 1000,
1828
+ xAxisInnerPadding: padding,
1829
+ xAxisOuterPadding: padding / 2
1830
+ };
1831
+ };