@fluentui/react-charts 9.2.2 → 9.2.4

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 (229) hide show
  1. package/CHANGELOG.md +74 -2
  2. package/dist/index.d.ts +187 -15
  3. package/lib/components/AreaChart/AreaChart.js +7 -4
  4. package/lib/components/AreaChart/AreaChart.js.map +1 -1
  5. package/lib/components/AreaChart/useAreaChartStyles.styles.js +4 -3
  6. package/lib/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
  7. package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js +5 -16
  8. package/lib/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
  9. package/lib/components/ChartTable/ChartTable.js +90 -6
  10. package/lib/components/ChartTable/ChartTable.js.map +1 -1
  11. package/lib/components/CommonComponents/CartesianChart.js +83 -38
  12. package/lib/components/CommonComponents/CartesianChart.js.map +1 -1
  13. package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
  14. package/lib/components/CommonComponents/useCartesianChartStyles.styles.js +19 -3
  15. package/lib/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
  16. package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js +8 -23
  17. package/lib/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
  18. package/lib/components/DeclarativeChart/DeclarativeChart.js +214 -107
  19. package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
  20. package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +25 -1
  21. package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
  22. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +1618 -259
  23. package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  24. package/lib/components/DonutChart/Arc/useArcStyles.styles.js +8 -3
  25. package/lib/components/DonutChart/Arc/useArcStyles.styles.js.map +1 -1
  26. package/lib/components/DonutChart/Arc/useArcStyles.styles.raw.js +6 -2
  27. package/lib/components/DonutChart/Arc/useArcStyles.styles.raw.js.map +1 -1
  28. package/lib/components/DonutChart/DonutChart.js +8 -3
  29. package/lib/components/DonutChart/DonutChart.js.map +1 -1
  30. package/lib/components/DonutChart/DonutChart.types.js.map +1 -1
  31. package/lib/components/DonutChart/useDonutChartStyles.styles.js +21 -4
  32. package/lib/components/DonutChart/useDonutChartStyles.styles.js.map +1 -1
  33. package/lib/components/DonutChart/useDonutChartStyles.styles.raw.js +8 -4
  34. package/lib/components/DonutChart/useDonutChartStyles.styles.raw.js.map +1 -1
  35. package/lib/components/FunnelChart/FunnelChart.js +4 -2
  36. package/lib/components/FunnelChart/FunnelChart.js.map +1 -1
  37. package/lib/components/FunnelChart/funnelGeometry.js.map +1 -1
  38. package/lib/components/GanttChart/useGanttChartStyles.styles.js +2 -1
  39. package/lib/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
  40. package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
  41. package/lib/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
  42. package/lib/components/GaugeChart/GaugeChart.js +1 -2
  43. package/lib/components/GaugeChart/GaugeChart.js.map +1 -1
  44. package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +31 -10
  45. package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
  46. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +6 -18
  47. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
  48. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +6 -22
  49. package/lib/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
  50. package/lib/components/HeatMapChart/HeatMapChart.js +175 -114
  51. package/lib/components/HeatMapChart/HeatMapChart.js.map +1 -1
  52. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
  53. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
  54. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
  55. package/lib/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
  56. package/lib/components/HorizontalBarChart/HorizontalBarChart.js +1 -1
  57. package/lib/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
  58. package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js +7 -3
  59. package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js.map +1 -1
  60. package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js +5 -2
  61. package/lib/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js.map +1 -1
  62. package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +26 -6
  63. package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -1
  64. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
  65. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
  66. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
  67. package/lib/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
  68. package/lib/components/LineChart/LineChart.js +349 -176
  69. package/lib/components/LineChart/LineChart.js.map +1 -1
  70. package/lib/components/LineChart/LineChart.types.js.map +1 -1
  71. package/lib/components/LineChart/useLineChartStyles.styles.js +28 -8
  72. package/lib/components/LineChart/useLineChartStyles.styles.js.map +1 -1
  73. package/lib/components/LineChart/useLineChartStyles.styles.raw.js +9 -14
  74. package/lib/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
  75. package/lib/components/ResponsiveContainer/withResponsiveContainer.js.map +1 -1
  76. package/lib/components/SankeyChart/SankeyChart.js.map +1 -1
  77. package/lib/components/SankeyChart/useSankeyChartStyles.styles.js +12 -25
  78. package/lib/components/SankeyChart/useSankeyChartStyles.styles.js.map +1 -1
  79. package/lib/components/SankeyChart/useSankeyChartStyles.styles.raw.js +2 -12
  80. package/lib/components/SankeyChart/useSankeyChartStyles.styles.raw.js.map +1 -1
  81. package/lib/components/ScatterChart/ScatterChart.js +139 -81
  82. package/lib/components/ScatterChart/ScatterChart.js.map +1 -1
  83. package/lib/components/ScatterChart/ScatterChart.types.js.map +1 -1
  84. package/lib/components/ScatterChart/useScatterChartStyles.styles.js +29 -8
  85. package/lib/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
  86. package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js +10 -15
  87. package/lib/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
  88. package/lib/components/VerticalBarChart/VerticalBarChart.js +28 -5
  89. package/lib/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
  90. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +10 -7
  91. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
  92. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +7 -20
  93. package/lib/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
  94. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js +159 -47
  95. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
  96. package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
  97. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +9 -7
  98. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
  99. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +6 -20
  100. package/lib/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
  101. package/lib/types/DataPoint.js +3 -1
  102. package/lib/types/DataPoint.js.map +1 -1
  103. package/lib/utilities/Common.styles.js +47 -0
  104. package/lib/utilities/Common.styles.js.map +1 -0
  105. package/lib/utilities/Common.styles.raw.js +47 -0
  106. package/lib/utilities/Common.styles.raw.js.map +1 -0
  107. package/lib/utilities/SVGTooltipText.js.map +1 -1
  108. package/lib/utilities/image-export-utils.js.map +1 -1
  109. package/lib/utilities/index.js +1 -0
  110. package/lib/utilities/index.js.map +1 -1
  111. package/lib/utilities/scatterpolar-utils.js +52 -0
  112. package/lib/utilities/scatterpolar-utils.js.map +1 -0
  113. package/lib/utilities/utilities.js +324 -147
  114. package/lib/utilities/utilities.js.map +1 -1
  115. package/lib/utilities/vbc-utils.js.map +1 -1
  116. package/lib-commonjs/components/AreaChart/AreaChart.js +6 -3
  117. package/lib-commonjs/components/AreaChart/AreaChart.js.map +1 -1
  118. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js +2 -1
  119. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.js.map +1 -1
  120. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js +4 -15
  121. package/lib-commonjs/components/AreaChart/useAreaChartStyles.styles.raw.js.map +1 -1
  122. package/lib-commonjs/components/ChartTable/ChartTable.js +90 -6
  123. package/lib-commonjs/components/ChartTable/ChartTable.js.map +1 -1
  124. package/lib-commonjs/components/CommonComponents/CartesianChart.js +83 -37
  125. package/lib-commonjs/components/CommonComponents/CartesianChart.js.map +1 -1
  126. package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
  127. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js +17 -2
  128. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.js.map +1 -1
  129. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js +6 -22
  130. package/lib-commonjs/components/CommonComponents/useCartesianChartStyles.styles.raw.js.map +1 -1
  131. package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +212 -107
  132. package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
  133. package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js +31 -1
  134. package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
  135. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +1652 -260
  136. package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
  137. package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.js +12 -3
  138. package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.js.map +1 -1
  139. package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.raw.js +6 -2
  140. package/lib-commonjs/components/DonutChart/Arc/useArcStyles.styles.raw.js.map +1 -1
  141. package/lib-commonjs/components/DonutChart/DonutChart.js +7 -2
  142. package/lib-commonjs/components/DonutChart/DonutChart.js.map +1 -1
  143. package/lib-commonjs/components/DonutChart/DonutChart.types.js.map +1 -1
  144. package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.js +32 -4
  145. package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.js.map +1 -1
  146. package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.raw.js +8 -4
  147. package/lib-commonjs/components/DonutChart/useDonutChartStyles.styles.raw.js.map +1 -1
  148. package/lib-commonjs/components/FunnelChart/FunnelChart.js +4 -2
  149. package/lib-commonjs/components/FunnelChart/FunnelChart.js.map +1 -1
  150. package/lib-commonjs/components/FunnelChart/funnelGeometry.js.map +1 -1
  151. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js +2 -1
  152. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.js.map +1 -1
  153. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js +2 -1
  154. package/lib-commonjs/components/GanttChart/useGanttChartStyles.styles.raw.js.map +1 -1
  155. package/lib-commonjs/components/GaugeChart/GaugeChart.js +1 -2
  156. package/lib-commonjs/components/GaugeChart/GaugeChart.js.map +1 -1
  157. package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js +30 -9
  158. package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.js.map +1 -1
  159. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js +4 -20
  160. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.js.map +1 -1
  161. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js +5 -21
  162. package/lib-commonjs/components/GroupedVerticalBarChart/useGroupedVerticalBarChartStyles.styles.raw.js.map +1 -1
  163. package/lib-commonjs/components/HeatMapChart/HeatMapChart.js +174 -113
  164. package/lib-commonjs/components/HeatMapChart/HeatMapChart.js.map +1 -1
  165. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js +2 -1
  166. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.js.map +1 -1
  167. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js +2 -1
  168. package/lib-commonjs/components/HeatMapChart/useHeatMapChartStyles.styles.raw.js.map +1 -1
  169. package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js +1 -1
  170. package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.js.map +1 -1
  171. package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js +10 -3
  172. package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.js.map +1 -1
  173. package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js +5 -2
  174. package/lib-commonjs/components/HorizontalBarChart/useHorizontalBarChartStyles.styles.raw.js.map +1 -1
  175. package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +25 -5
  176. package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -1
  177. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js +2 -1
  178. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.js.map +1 -1
  179. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js +2 -1
  180. package/lib-commonjs/components/HorizontalBarChartWithAxis/useHorizontalBarChartWithAxisStyles.styles.raw.js.map +1 -1
  181. package/lib-commonjs/components/LineChart/LineChart.js +347 -175
  182. package/lib-commonjs/components/LineChart/LineChart.js.map +1 -1
  183. package/lib-commonjs/components/LineChart/LineChart.types.js.map +1 -1
  184. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js +35 -5
  185. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.js.map +1 -1
  186. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js +7 -13
  187. package/lib-commonjs/components/LineChart/useLineChartStyles.styles.raw.js.map +1 -1
  188. package/lib-commonjs/components/ResponsiveContainer/withResponsiveContainer.js.map +1 -1
  189. package/lib-commonjs/components/SankeyChart/SankeyChart.js.map +1 -1
  190. package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.js +23 -33
  191. package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.js.map +1 -1
  192. package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.raw.js +1 -12
  193. package/lib-commonjs/components/SankeyChart/useSankeyChartStyles.styles.raw.js.map +1 -1
  194. package/lib-commonjs/components/ScatterChart/ScatterChart.js +137 -79
  195. package/lib-commonjs/components/ScatterChart/ScatterChart.js.map +1 -1
  196. package/lib-commonjs/components/ScatterChart/ScatterChart.types.js.map +1 -1
  197. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js +39 -6
  198. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.js.map +1 -1
  199. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js +9 -14
  200. package/lib-commonjs/components/ScatterChart/useScatterChartStyles.styles.raw.js.map +1 -1
  201. package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js +27 -4
  202. package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.js.map +1 -1
  203. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js +7 -4
  204. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.js.map +1 -1
  205. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js +5 -18
  206. package/lib-commonjs/components/VerticalBarChart/useVerticalBarChartStyles.styles.raw.js.map +1 -1
  207. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js +158 -46
  208. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.js.map +1 -1
  209. package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
  210. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js +7 -4
  211. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.js.map +1 -1
  212. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js +5 -19
  213. package/lib-commonjs/components/VerticalStackedBarChart/useVerticalStackedBarChartStyles.styles.raw.js.map +1 -1
  214. package/lib-commonjs/types/DataPoint.js +3 -1
  215. package/lib-commonjs/types/DataPoint.js.map +1 -1
  216. package/lib-commonjs/utilities/Common.styles.js +71 -0
  217. package/lib-commonjs/utilities/Common.styles.js.map +1 -0
  218. package/lib-commonjs/utilities/Common.styles.raw.js +71 -0
  219. package/lib-commonjs/utilities/Common.styles.raw.js.map +1 -0
  220. package/lib-commonjs/utilities/SVGTooltipText.js.map +1 -1
  221. package/lib-commonjs/utilities/image-export-utils.js.map +1 -1
  222. package/lib-commonjs/utilities/index.js +1 -0
  223. package/lib-commonjs/utilities/index.js.map +1 -1
  224. package/lib-commonjs/utilities/scatterpolar-utils.js +67 -0
  225. package/lib-commonjs/utilities/scatterpolar-utils.js.map +1 -0
  226. package/lib-commonjs/utilities/utilities.js +337 -137
  227. package/lib-commonjs/utilities/utilities.js.map +1 -1
  228. package/lib-commonjs/utilities/vbc-utils.js.map +1 -1
  229. package/package.json +10 -10
@@ -27,8 +27,11 @@ const _index6 = require("../GaugeChart/index");
27
27
  const _index7 = require("../GroupedVerticalBarChart/index");
28
28
  const _index8 = require("../VerticalBarChart/index");
29
29
  const _index9 = require("../ScatterChart/index");
30
+ const _FunnelChart = require("../FunnelChart/FunnelChart");
31
+ const _index10 = require("../GanttChart/index");
30
32
  const _withResponsiveContainer = require("../ResponsiveContainer/withResponsiveContainer");
31
- const _index10 = require("../ChartTable/index");
33
+ const _index11 = require("../ChartTable/index");
34
+ const _index12 = require("../Legends/index");
32
35
  const ResponsiveDonutChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index.DonutChart);
33
36
  const ResponsiveVerticalStackedBarChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index1.VerticalStackedBarChart);
34
37
  const ResponsiveLineChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index2.LineChart);
@@ -40,11 +43,116 @@ const ResponsiveGaugeChart = (0, _withResponsiveContainer.withResponsiveContaine
40
43
  const ResponsiveGroupedVerticalBarChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index7.GroupedVerticalBarChart);
41
44
  const ResponsiveVerticalBarChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index8.VerticalBarChart);
42
45
  const ResponsiveScatterChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index9.ScatterChart);
43
- const ResponsiveChartTable = (0, _withResponsiveContainer.withResponsiveContainer)(_index10.ChartTable);
46
+ const ResponsiveChartTable = (0, _withResponsiveContainer.withResponsiveContainer)(_index11.ChartTable);
47
+ const ResponsiveGanttChart = (0, _withResponsiveContainer.withResponsiveContainer)(_index10.GanttChart);
48
+ // Removing responsive wrapper for FunnelChart as responsive container is not working with FunnelChart
49
+ //const ResponsiveFunnelChart = withResponsiveContainer(FunnelChart);
50
+ // Default x-axis key for grouping traces. Also applicable for PieData and SankeyData where x-axis is not defined.
51
+ const DEFAULT_XAXIS = 'x';
52
+ const FALLBACK_TYPE = 'fallback';
44
53
  const useColorMapping = ()=>{
45
54
  const colorMap = _react.useRef(new Map());
46
55
  return colorMap;
47
56
  };
57
+ function renderChart(Renderer, transformer, transformerArgs, commonProps, cellRow, cellColumn) {
58
+ const chartProps = transformer(...transformerArgs);
59
+ return /*#__PURE__*/ _react.createElement("div", {
60
+ key: `${cellRow}_${cellColumn}`,
61
+ style: {
62
+ gridRowStart: cellRow,
63
+ gridRowEnd: cellRow + 1,
64
+ gridColumnStart: cellColumn,
65
+ gridColumnEnd: cellColumn + 1
66
+ }
67
+ }, /*#__PURE__*/ _react.createElement(Renderer, {
68
+ ...chartProps,
69
+ ...commonProps
70
+ }));
71
+ }
72
+ const LineAreaPreTransformOp = (plotlyInput)=>{
73
+ const xValues = plotlyInput.data[0].x;
74
+ const isXMonth = (0, _chartutilities.isMonthArray)(xValues);
75
+ let renderData = plotlyInput.data;
76
+ if (isXMonth) {
77
+ renderData = plotlyInput.data.map((dataPoint)=>({
78
+ ...dataPoint,
79
+ x: (0, _PlotlySchemaAdapter.correctYearMonth)(dataPoint.x)
80
+ }));
81
+ }
82
+ return {
83
+ data: renderData,
84
+ layout: plotlyInput.layout
85
+ };
86
+ };
87
+ const chartMap = {
88
+ // PieData category charts
89
+ donut: {
90
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToDonutProps,
91
+ renderer: ResponsiveDonutChart
92
+ },
93
+ // SankeyData category charts
94
+ sankey: {
95
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToSankeyProps,
96
+ renderer: ResponsiveSankeyChart
97
+ },
98
+ // TableData category charts
99
+ table: {
100
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToChartTableProps,
101
+ renderer: ResponsiveChartTable
102
+ },
103
+ // PlotData category charts
104
+ horizontalbar: {
105
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToHorizontalBarWithAxisProps,
106
+ renderer: ResponsiveHorizontalBarChartWithAxis
107
+ },
108
+ groupedverticalbar: {
109
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToGVBCProps,
110
+ renderer: ResponsiveGroupedVerticalBarChart
111
+ },
112
+ verticalstackedbar: {
113
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToVSBCProps,
114
+ renderer: ResponsiveVerticalStackedBarChart
115
+ },
116
+ heatmap: {
117
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToHeatmapProps,
118
+ renderer: ResponsiveHeatMapChart
119
+ },
120
+ gauge: {
121
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToGaugeProps,
122
+ renderer: ResponsiveGaugeChart
123
+ },
124
+ verticalbar: {
125
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToVBCProps,
126
+ renderer: ResponsiveVerticalBarChart
127
+ },
128
+ area: {
129
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToAreaChartProps,
130
+ renderer: ResponsiveAreaChart,
131
+ preTransformOperation: LineAreaPreTransformOp
132
+ },
133
+ line: {
134
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToLineChartProps,
135
+ renderer: ResponsiveLineChart,
136
+ preTransformOperation: LineAreaPreTransformOp
137
+ },
138
+ scatter: {
139
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToScatterChartProps,
140
+ renderer: ResponsiveScatterChart,
141
+ preTransformOperation: LineAreaPreTransformOp
142
+ },
143
+ gantt: {
144
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToGanttChartProps,
145
+ renderer: ResponsiveGanttChart
146
+ },
147
+ funnel: {
148
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToFunnelChartProps,
149
+ renderer: _FunnelChart.FunnelChart
150
+ },
151
+ fallback: {
152
+ transformer: _PlotlySchemaAdapter.transformPlotlyJsonToVSBCProps,
153
+ renderer: ResponsiveVerticalStackedBarChart
154
+ }
155
+ };
48
156
  const useIsDarkTheme = ()=>{
49
157
  const parentV9Theme = _react.useContext(_reactsharedcontexts.ThemeContext_unstable);
50
158
  const v9Theme = parentV9Theme ? parentV9Theme : _tokens.webLightTheme;
@@ -70,10 +178,15 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>
70
178
  ...plotlyInput,
71
179
  data: chart.validTracesInfo.map((trace)=>plotlyInput.data[trace.index])
72
180
  };
181
+ const validTracesFilteredIndex = chart.validTracesInfo.map((trace, index)=>({
182
+ index,
183
+ type: trace.type
184
+ }));
73
185
  let { selectedLegends } = plotlySchema;
74
186
  const colorMap = useColorMapping();
75
187
  const isDarkTheme = useIsDarkTheme();
76
188
  const chartRef = _react.useRef(null);
189
+ const isMultiPlot = _react.useRef(false);
77
190
  if (!(0, _chartutilities.isArrayOrTypedArray)(selectedLegends)) {
78
191
  selectedLegends = [];
79
192
  }
@@ -107,54 +220,20 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>
107
220
  legendProps: multiSelectLegendProps,
108
221
  componentRef: chartRef
109
222
  };
110
- const renderLineAreaScatter = (plotlyData, isAreaChart)=>{
111
- var _plotlyData_;
112
- const isScatterMarkers = ((_plotlyData_ = plotlyData[0]) === null || _plotlyData_ === void 0 ? void 0 : _plotlyData_.mode) === 'markers';
113
- const chartProps = {
114
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToScatterChartProps)({
115
- data: plotlyData,
116
- layout: plotlyInput.layout
117
- }, isAreaChart, isScatterMarkers, colorMap, props.colorwayType, isDarkTheme),
118
- ...commonProps
119
- };
120
- if (isAreaChart) {
121
- return /*#__PURE__*/ _react.createElement(ResponsiveAreaChart, chartProps);
122
- }
123
- if (isScatterMarkers) {
124
- return /*#__PURE__*/ _react.createElement(ResponsiveScatterChart, chartProps);
125
- }
126
- return /*#__PURE__*/ _react.createElement(ResponsiveLineChart, chartProps);
127
- };
128
- const checkAndRenderChart = (isAreaChart = false)=>{
129
- let fallbackVSBC = false;
130
- const xValues = plotlyInputWithValidData.data[0].x;
131
- const isXDate = (0, _chartutilities.isDateArray)(xValues);
132
- const isXNumber = (0, _chartutilities.isNumberArray)(xValues);
133
- const isXMonth = (0, _chartutilities.isMonthArray)(xValues);
134
- // Consider year as categorical variable not numeric continuous variable
135
- // Also year is not considered a date variable as it is represented as a point
136
- // in time and brings additional complexity of handling timezone and locale
137
- // formatting given the current design of the charting library
138
- const isXYear = (0, _chartutilities.isYearArray)(xValues);
139
- if ((isXDate || isXNumber) && !isXYear) {
140
- return renderLineAreaScatter(plotlyInputWithValidData.data, isAreaChart);
141
- } else if (isXMonth) {
142
- const updatedData = plotlyInputWithValidData.data.map((dataPoint)=>({
143
- ...dataPoint,
144
- x: (0, _PlotlySchemaAdapter.correctYearMonth)(dataPoint.x)
145
- }));
146
- return renderLineAreaScatter(updatedData, isAreaChart);
147
- }
148
- // Unsupported schema, render as VerticalStackedBarChart
149
- fallbackVSBC = true;
150
- return /*#__PURE__*/ _react.createElement(ResponsiveVerticalStackedBarChart, {
151
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToVSBCProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme, fallbackVSBC),
152
- ...commonProps
223
+ function createLegends(legendProps) {
224
+ // eslint-disable-next-line react/jsx-no-bind
225
+ return /*#__PURE__*/ _react.createElement(_index12.Legends, {
226
+ ...legendProps,
227
+ selectedLegends: activeLegends,
228
+ onChange: onActiveLegendsChange
153
229
  });
154
- };
230
+ }
155
231
  // TODO
156
232
  const exportAsImage = _react.useCallback((opts)=>{
157
233
  return new Promise((resolve, reject)=>{
234
+ if (isMultiPlot.current) {
235
+ return reject(Error('Exporting multi plot charts as image is not supported'));
236
+ }
158
237
  if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {
159
238
  return reject(Error('Chart cannot be exported as image'));
160
239
  }
@@ -170,69 +249,95 @@ const DeclarativeChart = /*#__PURE__*/ _react.forwardRef((props, forwardedRef)=>
170
249
  }), [
171
250
  exportAsImage
172
251
  ]);
173
- switch(chart.type){
174
- case 'donut':
175
- return /*#__PURE__*/ _react.createElement(ResponsiveDonutChart, {
176
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToDonutProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
177
- ...commonProps
178
- });
179
- case 'horizontalbar':
180
- return /*#__PURE__*/ _react.createElement(ResponsiveHorizontalBarChartWithAxis, {
181
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToHorizontalBarWithAxisProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
182
- ...commonProps
183
- });
184
- case 'groupedverticalbar':
185
- return /*#__PURE__*/ _react.createElement(ResponsiveGroupedVerticalBarChart, {
186
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToGVBCProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
187
- ...commonProps
188
- });
189
- case 'verticalstackedbar':
190
- return /*#__PURE__*/ _react.createElement(ResponsiveVerticalStackedBarChart, {
191
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToVSBCProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
192
- ...commonProps
193
- });
194
- case 'heatmap':
195
- return /*#__PURE__*/ _react.createElement(ResponsiveHeatMapChart, {
196
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToHeatmapProps)(plotlyInputWithValidData),
197
- ...commonProps,
198
- legendProps: {}
199
- });
200
- case 'sankey':
201
- return /*#__PURE__*/ _react.createElement(ResponsiveSankeyChart, {
202
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToSankeyProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
203
- ...commonProps
204
- });
205
- case 'gauge':
206
- return /*#__PURE__*/ _react.createElement(ResponsiveGaugeChart, {
207
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToGaugeProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
208
- ...commonProps
209
- });
210
- case 'verticalbar':
211
- return /*#__PURE__*/ _react.createElement(ResponsiveVerticalBarChart, {
212
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToVBCProps)(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme),
213
- ...commonProps
214
- });
215
- case 'table':
216
- return /*#__PURE__*/ _react.createElement(ResponsiveChartTable, {
217
- ...(0, _PlotlySchemaAdapter.transformPlotlyJsonToChartTableProps)(plotlyInputWithValidData, colorMap, isDarkTheme),
218
- ...commonProps
219
- });
220
- // TODO: Add 'scatter' as a separate chart type
221
- case 'area':
222
- case 'line':
223
- case 'fallback':
224
- case 'scatterpolar':
225
- if (chart.type === 'scatterpolar') {
226
- const cartesianProjection = (0, _PlotlySchemaAdapter.projectPolarToCartesian)(plotlyInputWithValidData);
227
- plotlyInputWithValidData.data = cartesianProjection.data;
252
+ if (chart.type === 'scatterpolar') {
253
+ const cartesianProjection = (0, _PlotlySchemaAdapter.projectPolarToCartesian)(plotlyInputWithValidData);
254
+ plotlyInputWithValidData.data = cartesianProjection.data;
255
+ plotlyInputWithValidData.layout = cartesianProjection.layout;
256
+ validTracesFilteredIndex.forEach((trace, index)=>{
257
+ if (trace.type === 'scatterpolar') {
258
+ var _plotlyInputWithValidData_data_index;
259
+ var _plotlyInputWithValidData_data_index_mode;
260
+ const mode = (_plotlyInputWithValidData_data_index_mode = (_plotlyInputWithValidData_data_index = plotlyInputWithValidData.data[index]) === null || _plotlyInputWithValidData_data_index === void 0 ? void 0 : _plotlyInputWithValidData_data_index.mode) !== null && _plotlyInputWithValidData_data_index_mode !== void 0 ? _plotlyInputWithValidData_data_index_mode : '';
261
+ if (mode.includes('line')) {
262
+ validTracesFilteredIndex[index].type = 'line';
263
+ } else if (mode.includes('markers') || mode === 'text') {
264
+ validTracesFilteredIndex[index].type = 'scatter';
265
+ } else {
266
+ validTracesFilteredIndex[index].type = 'line';
267
+ }
228
268
  }
229
- // Need recheck for area chart as we don't have ability to check for valid months in previous step
230
- const isAreaChart = plotlyInputWithValidData.data.some((series)=>series.fill === 'tonexty' || series.fill === 'tozeroy' || !!series.stackgroup);
231
- return checkAndRenderChart(isAreaChart);
232
- default:
233
- var _plotlyInputWithValidData_data_;
234
- throw new Error(`Unsupported chart type :${(_plotlyInputWithValidData_data_ = plotlyInputWithValidData.data[0]) === null || _plotlyInputWithValidData_data_ === void 0 ? void 0 : _plotlyInputWithValidData_data_.type}`);
269
+ });
235
270
  }
271
+ const groupedTraces = {};
272
+ let nonCartesianTraceCount = 0;
273
+ plotlyInputWithValidData.data.forEach((trace, index)=>{
274
+ let traceKey = '';
275
+ if ((0, _PlotlySchemaAdapter.isNonPlotType)(chart.validTracesInfo[index].type)) {
276
+ traceKey = `${_PlotlySchemaAdapter.NON_PLOT_KEY_PREFIX}${nonCartesianTraceCount + 1}`;
277
+ nonCartesianTraceCount++;
278
+ } else {
279
+ var _trace_xaxis;
280
+ traceKey = (_trace_xaxis = trace.xaxis) !== null && _trace_xaxis !== void 0 ? _trace_xaxis : DEFAULT_XAXIS;
281
+ }
282
+ if (!groupedTraces[traceKey]) {
283
+ groupedTraces[traceKey] = [];
284
+ }
285
+ groupedTraces[traceKey].push(index);
286
+ });
287
+ isMultiPlot.current = Object.keys(groupedTraces).length > 1;
288
+ const gridProperties = (0, _PlotlySchemaAdapter.getGridProperties)(plotlyInputWithValidData, isMultiPlot.current, chart.validTracesInfo);
289
+ // Render only one plot if the grid properties cannot determine positioning of multiple plots.
290
+ if (isMultiPlot.current && gridProperties.templateRows === _PlotlySchemaAdapter.SINGLE_REPEAT && gridProperties.templateColumns === _PlotlySchemaAdapter.SINGLE_REPEAT) {
291
+ Object.keys(groupedTraces).forEach((key, index)=>{
292
+ if (index > 0) {
293
+ delete groupedTraces[key];
294
+ }
295
+ });
296
+ isMultiPlot.current = false;
297
+ }
298
+ const allupLegendsProps = (0, _PlotlySchemaAdapter.getAllupLegendsProps)(plotlyInputWithValidData, colorMap, props.colorwayType, chart.validTracesInfo, isDarkTheme);
299
+ // map through the grouped traces and render the appropriate chart
300
+ return /*#__PURE__*/ _react.createElement(_react.Fragment, null, /*#__PURE__*/ _react.createElement("div", {
301
+ style: {
302
+ display: 'grid',
303
+ gridTemplateRows: gridProperties.templateRows,
304
+ gridTemplateColumns: gridProperties.templateColumns
305
+ }
306
+ }, Object.entries(groupedTraces).map(([xAxisKey, index])=>{
307
+ const plotlyInputForGroup = {
308
+ ...plotlyInputWithValidData,
309
+ data: index.map((idx)=>plotlyInputWithValidData.data[idx])
310
+ };
311
+ const filteredTracesInfo = validTracesFilteredIndex.filter((trace)=>index.includes(trace.index));
312
+ let chartType = validTracesFilteredIndex.some((trace)=>trace.type === FALLBACK_TYPE) || chart.type === FALLBACK_TYPE ? FALLBACK_TYPE : filteredTracesInfo[0].type;
313
+ if (validTracesFilteredIndex.some((trace)=>trace.type === 'line') && validTracesFilteredIndex.some((trace)=>trace.type === 'scatter')) {
314
+ chartType = 'line';
315
+ }
316
+ const chartEntry = chartMap[chartType];
317
+ if (chartEntry) {
318
+ const { transformer, renderer, preTransformCondition, preTransformOperation } = chartEntry;
319
+ if (preTransformCondition === undefined || preTransformCondition(plotlyInputForGroup)) {
320
+ const transformedInput = preTransformOperation ? preTransformOperation(plotlyInputForGroup) : plotlyInputForGroup;
321
+ const cellProperties = gridProperties.layout[xAxisKey];
322
+ var _cellProperties_row, _cellProperties_column;
323
+ return renderChart(renderer, transformer, [
324
+ transformedInput,
325
+ isMultiPlot.current,
326
+ colorMap,
327
+ props.colorwayType,
328
+ isDarkTheme
329
+ ], {
330
+ ...commonProps,
331
+ xAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.xAnnotation,
332
+ yAxisAnnotation: cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.yAnnotation
333
+ }, (_cellProperties_row = cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.row) !== null && _cellProperties_row !== void 0 ? _cellProperties_row : 1, (_cellProperties_column = cellProperties === null || cellProperties === void 0 ? void 0 : cellProperties.column) !== null && _cellProperties_column !== void 0 ? _cellProperties_column : 1);
334
+ }
335
+ return /*#__PURE__*/ _react.createElement(_react.Fragment, null);
336
+ } else {
337
+ var _plotlyInputForGroup_data_;
338
+ throw new Error(`Unsupported chart type :${(_plotlyInputForGroup_data_ = plotlyInputForGroup.data[0]) === null || _plotlyInputForGroup_data_ === void 0 ? void 0 : _plotlyInputForGroup_data_.type}`);
339
+ }
340
+ })), isMultiPlot.current && createLegends(allupLegendsProps));
236
341
  });
237
342
  DeclarativeChart.displayName = 'DeclarativeChart';
238
343
  DeclarativeChart.defaultProps = {
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/DeclarativeChart/DeclarativeChart.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { Data, PlotData, PlotlySchema, OutputChartType } from '@fluentui/chart-utilities';\nimport {\n decodeBase64Fields,\n isArrayOrTypedArray,\n isDateArray,\n isMonthArray,\n isNumberArray,\n isYearArray,\n mapFluentChart,\n sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport { tokens } from '@fluentui/react-theme';\nimport { ThemeContext_unstable as V9ThemeContext } from '@fluentui/react-shared-contexts';\nimport { Theme, webLightTheme } from '@fluentui/tokens';\nimport * as d3Color from 'd3-color';\n\nimport {\n correctYearMonth,\n transformPlotlyJsonToDonutProps,\n transformPlotlyJsonToVSBCProps,\n transformPlotlyJsonToScatterChartProps,\n transformPlotlyJsonToHorizontalBarWithAxisProps,\n transformPlotlyJsonToHeatmapProps,\n transformPlotlyJsonToSankeyProps,\n transformPlotlyJsonToGaugeProps,\n transformPlotlyJsonToGVBCProps,\n transformPlotlyJsonToVBCProps,\n transformPlotlyJsonToChartTableProps,\n projectPolarToCartesian,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { LineChart, LineChartProps } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart, AreaChartProps } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { Chart, ImageExportOptions } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\n\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ChartTable } from '../ChartTable/index';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\nconst ResponsiveScatterChart = withResponsiveContainer(ScatterChart);\nconst ResponsiveChartTable = withResponsiveContainer(ChartTable);\n\n/**\n * DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n */\nexport interface Schema {\n /**\n * Plotly schema represented as JSON object\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n plotlySchema: any;\n}\n\n/**\n * DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n */\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n /**\n * The schema representing the chart data, layout and configuration\n */\n chartSchema: Schema;\n\n /**\n * Callback when an event occurs\n */\n onSchemaChange?: (eventData: Schema) => void;\n\n /**\n * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: React.RefObject<IDeclarativeChart>;\n\n /**\n * Optional prop to specify the colorway type of the chart.\n * - 'default': Use Fluent UI color palette aligning with plotly colorway.\n * - 'builtin': Use Fluent UI colorway.\n * - 'others': Reserved for future colorways.\n * @default 'default'\n */\n colorwayType?: ColorwayType;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n exportAsImage: (opts?: ImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n const colorMap = React.useRef(new Map<string, string>());\n return colorMap;\n};\n\nconst useIsDarkTheme = (): boolean => {\n const parentV9Theme = React.useContext(V9ThemeContext) as Theme;\n const v9Theme: Theme = parentV9Theme ? parentV9Theme : webLightTheme;\n\n // Get background and foreground colors\n const backgroundColor = d3Color.hsl(v9Theme.colorNeutralBackground1);\n const foregroundColor = d3Color.hsl(v9Theme.colorNeutralForeground1);\n\n const isDarkTheme = backgroundColor.l < foregroundColor.l;\n\n return isDarkTheme;\n};\n\n/**\n * DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n HTMLDivElement,\n DeclarativeChartProps\n>((props, forwardedRef) => {\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n const chart: OutputChartType = mapFluentChart(plotlySchema);\n if (!chart.isValid) {\n throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n }\n let plotlyInput = plotlySchema as PlotlySchema;\n try {\n plotlyInput = decodeBase64Fields(plotlyInput);\n } catch (error) {\n throw new Error(`Failed to decode plotly schema: ${error}`);\n }\n const plotlyInputWithValidData: PlotlySchema = {\n ...plotlyInput,\n data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace.index]),\n };\n\n let { selectedLegends } = plotlySchema;\n const colorMap = useColorMapping();\n const isDarkTheme = useIsDarkTheme();\n const chartRef = React.useRef<Chart>(null);\n\n if (!isArrayOrTypedArray(selectedLegends)) {\n selectedLegends = [];\n }\n\n const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n const onActiveLegendsChange = (keys: string[]) => {\n setActiveLegends(keys);\n if (props.onSchemaChange) {\n props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n }\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { selectedLegends } = plotlySchema;\n setActiveLegends(selectedLegends ?? []);\n }, [props.chartSchema]);\n\n const multiSelectLegendProps = {\n canSelectMultipleLegends: true,\n onChange: onActiveLegendsChange,\n selectedLegends: activeLegends,\n };\n\n const commonProps = {\n legendProps: multiSelectLegendProps,\n componentRef: chartRef,\n };\n\n const renderLineAreaScatter = (plotlyData: Data[], isAreaChart: boolean): JSXElement => {\n const isScatterMarkers = (plotlyData[0] as PlotData)?.mode === 'markers';\n const chartProps: LineChartProps | AreaChartProps = {\n ...transformPlotlyJsonToScatterChartProps(\n { data: plotlyData, layout: plotlyInput.layout },\n isAreaChart,\n isScatterMarkers,\n colorMap,\n props.colorwayType,\n isDarkTheme,\n ),\n ...commonProps,\n };\n if (isAreaChart) {\n return <ResponsiveAreaChart {...chartProps} />;\n }\n if (isScatterMarkers) {\n return <ResponsiveScatterChart {...chartProps} />;\n }\n return <ResponsiveLineChart {...chartProps} />;\n };\n\n const checkAndRenderChart = (isAreaChart: boolean = false) => {\n let fallbackVSBC = false;\n const xValues = (plotlyInputWithValidData.data[0] as PlotData).x;\n const isXDate = isDateArray(xValues);\n const isXNumber = isNumberArray(xValues);\n const isXMonth = isMonthArray(xValues);\n\n // Consider year as categorical variable not numeric continuous variable\n // Also year is not considered a date variable as it is represented as a point\n // in time and brings additional complexity of handling timezone and locale\n // formatting given the current design of the charting library\n const isXYear = isYearArray(xValues);\n\n if ((isXDate || isXNumber) && !isXYear) {\n return renderLineAreaScatter(plotlyInputWithValidData.data, isAreaChart);\n } else if (isXMonth) {\n const updatedData = plotlyInputWithValidData.data.map((dataPoint: PlotData) => ({\n ...dataPoint,\n x: correctYearMonth(dataPoint.x),\n }));\n return renderLineAreaScatter(updatedData, isAreaChart);\n }\n // Unsupported schema, render as VerticalStackedBarChart\n fallbackVSBC = true;\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(\n plotlyInputWithValidData,\n colorMap,\n props.colorwayType,\n isDarkTheme,\n fallbackVSBC,\n )}\n {...commonProps}\n />\n );\n };\n\n // TODO\n const exportAsImage = React.useCallback((opts?: ImageExportOptions): Promise<string> => {\n return new Promise((resolve, reject) => {\n if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {\n return reject(Error('Chart cannot be exported as image'));\n }\n\n chartRef.current\n .toImage({\n background: tokens.colorNeutralBackground1,\n scale: 5,\n ...opts,\n })\n .then(resolve)\n .catch(reject);\n });\n }, []);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n exportAsImage,\n }),\n [exportAsImage],\n );\n\n switch (chart.type) {\n case 'donut':\n return (\n <ResponsiveDonutChart\n {...transformPlotlyJsonToDonutProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'horizontalbar':\n return (\n <ResponsiveHorizontalBarChartWithAxis\n {...transformPlotlyJsonToHorizontalBarWithAxisProps(\n plotlyInputWithValidData,\n colorMap,\n props.colorwayType,\n isDarkTheme,\n )}\n {...commonProps}\n />\n );\n case 'groupedverticalbar':\n return (\n <ResponsiveGroupedVerticalBarChart\n {...transformPlotlyJsonToGVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalstackedbar':\n return (\n <ResponsiveVerticalStackedBarChart\n {...transformPlotlyJsonToVSBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'heatmap':\n return (\n <ResponsiveHeatMapChart\n {...transformPlotlyJsonToHeatmapProps(plotlyInputWithValidData)}\n {...commonProps}\n legendProps={{}}\n />\n );\n case 'sankey':\n return (\n <ResponsiveSankeyChart\n {...transformPlotlyJsonToSankeyProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'gauge':\n return (\n <ResponsiveGaugeChart\n {...transformPlotlyJsonToGaugeProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'verticalbar':\n return (\n <ResponsiveVerticalBarChart\n {...transformPlotlyJsonToVBCProps(plotlyInputWithValidData, colorMap, props.colorwayType, isDarkTheme)}\n {...commonProps}\n />\n );\n case 'table':\n return (\n <ResponsiveChartTable\n {...transformPlotlyJsonToChartTableProps(plotlyInputWithValidData, colorMap, isDarkTheme)}\n {...commonProps}\n />\n );\n // TODO: Add 'scatter' as a separate chart type\n case 'area':\n case 'line':\n case 'fallback':\n case 'scatterpolar':\n if (chart.type === 'scatterpolar') {\n const cartesianProjection = projectPolarToCartesian(plotlyInputWithValidData);\n plotlyInputWithValidData.data = cartesianProjection.data;\n }\n // Need recheck for area chart as we don't have ability to check for valid months in previous step\n const isAreaChart = plotlyInputWithValidData.data.some(\n (series: PlotData) => series.fill === 'tonexty' || series.fill === 'tozeroy' || !!series.stackgroup,\n );\n return checkAndRenderChart(isAreaChart);\n default:\n throw new Error(`Unsupported chart type :${plotlyInputWithValidData.data[0]?.type}`);\n }\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\nDeclarativeChart.defaultProps = {\n colorwayType: 'default',\n};\n"],"names":["React","decodeBase64Fields","isArrayOrTypedArray","isDateArray","isMonthArray","isNumberArray","isYearArray","mapFluentChart","sanitizeJson","tokens","ThemeContext_unstable","V9ThemeContext","webLightTheme","d3Color","correctYearMonth","transformPlotlyJsonToDonutProps","transformPlotlyJsonToVSBCProps","transformPlotlyJsonToScatterChartProps","transformPlotlyJsonToHorizontalBarWithAxisProps","transformPlotlyJsonToHeatmapProps","transformPlotlyJsonToSankeyProps","transformPlotlyJsonToGaugeProps","transformPlotlyJsonToGVBCProps","transformPlotlyJsonToVBCProps","transformPlotlyJsonToChartTableProps","projectPolarToCartesian","DonutChart","VerticalStackedBarChart","LineChart","HorizontalBarChartWithAxis","AreaChart","HeatMapChart","SankeyChart","GaugeChart","GroupedVerticalBarChart","VerticalBarChart","ScatterChart","withResponsiveContainer","ChartTable","ResponsiveDonutChart","ResponsiveVerticalStackedBarChart","ResponsiveLineChart","ResponsiveHorizontalBarChartWithAxis","ResponsiveAreaChart","ResponsiveHeatMapChart","ResponsiveSankeyChart","ResponsiveGaugeChart","ResponsiveGroupedVerticalBarChart","ResponsiveVerticalBarChart","ResponsiveScatterChart","ResponsiveChartTable","useColorMapping","colorMap","useRef","Map","useIsDarkTheme","parentV9Theme","useContext","v9Theme","backgroundColor","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","DeclarativeChart","forwardRef","props","forwardedRef","plotlySchema","chartSchema","chart","isValid","Error","errorMessage","plotlyInput","error","plotlyInputWithValidData","data","validTracesInfo","map","trace","index","selectedLegends","chartRef","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","commonProps","legendProps","componentRef","renderLineAreaScatter","plotlyData","isAreaChart","isScatterMarkers","mode","chartProps","layout","colorwayType","checkAndRenderChart","fallbackVSBC","xValues","x","isXDate","isXNumber","isXMonth","isXYear","updatedData","dataPoint","exportAsImage","useCallback","opts","Promise","resolve","reject","current","toImage","background","scale","then","catch","useImperativeHandle","type","cartesianProjection","some","series","fill","stackgroup","displayName","defaultProps"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/DeclarativeChart/DeclarativeChart.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\nimport * as React from 'react';\nimport type { Data, PlotData, PlotlySchema, OutputChartType, TraceInfo } from '@fluentui/chart-utilities';\nimport {\n decodeBase64Fields,\n isArrayOrTypedArray,\n isMonthArray,\n mapFluentChart,\n sanitizeJson,\n} from '@fluentui/chart-utilities';\nimport type { GridProperties } from './PlotlySchemaAdapter';\nimport { tokens } from '@fluentui/react-theme';\nimport { ThemeContext_unstable as V9ThemeContext } from '@fluentui/react-shared-contexts';\nimport { Theme, webLightTheme } from '@fluentui/tokens';\nimport * as d3Color from 'd3-color';\n\nimport {\n correctYearMonth,\n getGridProperties,\n isNonPlotType,\n transformPlotlyJsonToDonutProps,\n transformPlotlyJsonToVSBCProps,\n transformPlotlyJsonToAreaChartProps,\n transformPlotlyJsonToLineChartProps,\n transformPlotlyJsonToHorizontalBarWithAxisProps,\n transformPlotlyJsonToHeatmapProps,\n transformPlotlyJsonToSankeyProps,\n transformPlotlyJsonToGaugeProps,\n transformPlotlyJsonToGVBCProps,\n transformPlotlyJsonToVBCProps,\n transformPlotlyJsonToChartTableProps,\n transformPlotlyJsonToScatterChartProps,\n projectPolarToCartesian,\n getAllupLegendsProps,\n NON_PLOT_KEY_PREFIX,\n SINGLE_REPEAT,\n transformPlotlyJsonToFunnelChartProps,\n transformPlotlyJsonToGanttChartProps,\n} from './PlotlySchemaAdapter';\nimport type { ColorwayType } from './PlotlyColorAdapter';\nimport { DonutChart } from '../DonutChart/index';\nimport { VerticalStackedBarChart } from '../VerticalStackedBarChart/index';\nimport { LineChart } from '../LineChart/index';\nimport { HorizontalBarChartWithAxis } from '../HorizontalBarChartWithAxis/index';\nimport { AreaChart } from '../AreaChart/index';\nimport { HeatMapChart } from '../HeatMapChart/index';\nimport { SankeyChart } from '../SankeyChart/SankeyChart';\nimport { GaugeChart } from '../GaugeChart/index';\nimport { GroupedVerticalBarChart } from '../GroupedVerticalBarChart/index';\nimport { VerticalBarChart } from '../VerticalBarChart/index';\nimport { Chart, ImageExportOptions } from '../../types/index';\nimport { ScatterChart } from '../ScatterChart/index';\nimport { FunnelChart } from '../FunnelChart/FunnelChart';\nimport { GanttChart } from '../GanttChart/index';\n\nimport { withResponsiveContainer } from '../ResponsiveContainer/withResponsiveContainer';\nimport { ChartTable } from '../ChartTable/index';\nimport { LegendsProps, Legends } from '../Legends/index';\nimport { JSXElement } from '@fluentui/react-utilities/src/index';\n\nconst ResponsiveDonutChart = withResponsiveContainer(DonutChart);\nconst ResponsiveVerticalStackedBarChart = withResponsiveContainer(VerticalStackedBarChart);\nconst ResponsiveLineChart = withResponsiveContainer(LineChart);\nconst ResponsiveHorizontalBarChartWithAxis = withResponsiveContainer(HorizontalBarChartWithAxis);\nconst ResponsiveAreaChart = withResponsiveContainer(AreaChart);\nconst ResponsiveHeatMapChart = withResponsiveContainer(HeatMapChart);\nconst ResponsiveSankeyChart = withResponsiveContainer(SankeyChart);\nconst ResponsiveGaugeChart = withResponsiveContainer(GaugeChart);\nconst ResponsiveGroupedVerticalBarChart = withResponsiveContainer(GroupedVerticalBarChart);\nconst ResponsiveVerticalBarChart = withResponsiveContainer(VerticalBarChart);\nconst ResponsiveScatterChart = withResponsiveContainer(ScatterChart);\nconst ResponsiveChartTable = withResponsiveContainer(ChartTable);\nconst ResponsiveGanttChart = withResponsiveContainer(GanttChart);\n// Removing responsive wrapper for FunnelChart as responsive container is not working with FunnelChart\n//const ResponsiveFunnelChart = withResponsiveContainer(FunnelChart);\n\n// Default x-axis key for grouping traces. Also applicable for PieData and SankeyData where x-axis is not defined.\nconst DEFAULT_XAXIS = 'x';\nconst FALLBACK_TYPE = 'fallback';\n\n/**\n * DeclarativeChart schema.\n * {@docCategory DeclarativeChart}\n */\nexport interface Schema {\n /**\n * Plotly schema represented as JSON object\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n plotlySchema: any;\n}\n\n/**\n * DeclarativeChart props.\n * {@docCategory DeclarativeChart}\n */\nexport interface DeclarativeChartProps extends React.RefAttributes<HTMLDivElement> {\n /**\n * The schema representing the chart data, layout and configuration\n */\n chartSchema: Schema;\n\n /**\n * Callback when an event occurs\n */\n onSchemaChange?: (eventData: Schema) => void;\n\n /**\n * Optional callback to access the IDeclarativeChart interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: React.RefObject<IDeclarativeChart | null>;\n\n /**\n * Optional prop to specify the colorway type of the chart.\n * - 'default': Use Fluent UI color palette aligning with plotly colorway.\n * - 'builtin': Use Fluent UI colorway.\n * - 'others': Reserved for future colorways.\n * @default 'default'\n */\n colorwayType?: ColorwayType;\n}\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IDeclarativeChart {\n exportAsImage: (opts?: ImageExportOptions) => Promise<string>;\n}\n\nconst useColorMapping = () => {\n const colorMap = React.useRef(new Map<string, string>());\n return colorMap;\n};\n\nfunction renderChart<TProps>(\n Renderer: React.ComponentType<TProps>,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n transformer: (...args: any[]) => TProps,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n transformerArgs: any[],\n commonProps: Partial<TProps>,\n cellRow: number,\n cellColumn: number,\n): JSXElement {\n const chartProps = transformer(...transformerArgs);\n return (\n <div\n key={`${cellRow}_${cellColumn}`}\n style={{\n gridRowStart: cellRow,\n gridRowEnd: cellRow + 1,\n gridColumnStart: cellColumn,\n gridColumnEnd: cellColumn + 1,\n }}\n >\n <Renderer {...chartProps} {...commonProps} />\n </div>\n );\n}\n\ntype PreTransformHooks = {\n preTransformCondition?: (plotlySchema: PlotlySchema) => boolean;\n preTransformOperation?: (plotlySchema: PlotlySchema) => PlotlySchema;\n};\n\nconst LineAreaPreTransformOp = (plotlyInput: PlotlySchema) => {\n const xValues = (plotlyInput.data[0] as PlotData).x;\n const isXMonth = isMonthArray(xValues);\n let renderData = plotlyInput.data;\n if (isXMonth) {\n renderData = plotlyInput.data.map((dataPoint: PlotData) => ({\n ...dataPoint,\n x: correctYearMonth(dataPoint.x),\n }));\n }\n return { data: renderData, layout: plotlyInput.layout };\n};\n\ntype ChartTypeMap = {\n donut: {\n transformer: typeof transformPlotlyJsonToDonutProps;\n renderer: typeof ResponsiveDonutChart;\n } & PreTransformHooks;\n sankey: {\n transformer: typeof transformPlotlyJsonToSankeyProps;\n renderer: typeof ResponsiveSankeyChart;\n } & PreTransformHooks;\n table: {\n transformer: typeof transformPlotlyJsonToChartTableProps;\n renderer: typeof ResponsiveChartTable;\n } & PreTransformHooks;\n horizontalbar: {\n transformer: typeof transformPlotlyJsonToHorizontalBarWithAxisProps;\n renderer: typeof ResponsiveHorizontalBarChartWithAxis;\n } & PreTransformHooks;\n groupedverticalbar: {\n transformer: typeof transformPlotlyJsonToGVBCProps;\n renderer: typeof ResponsiveGroupedVerticalBarChart;\n } & PreTransformHooks;\n verticalstackedbar: {\n transformer: typeof transformPlotlyJsonToVSBCProps;\n renderer: typeof ResponsiveVerticalStackedBarChart;\n } & PreTransformHooks;\n heatmap: {\n transformer: typeof transformPlotlyJsonToHeatmapProps;\n renderer: typeof ResponsiveHeatMapChart;\n } & PreTransformHooks;\n gauge: {\n transformer: typeof transformPlotlyJsonToGaugeProps;\n renderer: typeof ResponsiveGaugeChart;\n } & PreTransformHooks;\n verticalbar: {\n transformer: typeof transformPlotlyJsonToVBCProps;\n renderer: typeof ResponsiveVerticalBarChart;\n } & PreTransformHooks;\n area: {\n transformer: typeof transformPlotlyJsonToAreaChartProps;\n renderer: typeof ResponsiveAreaChart;\n } & PreTransformHooks;\n line: {\n transformer: typeof transformPlotlyJsonToLineChartProps;\n renderer: typeof ResponsiveLineChart;\n } & PreTransformHooks;\n scatter: {\n transformer: typeof transformPlotlyJsonToScatterChartProps;\n renderer: typeof ResponsiveScatterChart;\n } & PreTransformHooks;\n gantt: {\n transformer: typeof transformPlotlyJsonToGanttChartProps;\n renderer: typeof ResponsiveGanttChart;\n } & PreTransformHooks;\n funnel: {\n transformer: typeof transformPlotlyJsonToFunnelChartProps;\n renderer: typeof FunnelChart;\n } & PreTransformHooks;\n fallback: {\n transformer: typeof transformPlotlyJsonToVSBCProps;\n renderer: typeof ResponsiveVerticalStackedBarChart;\n } & PreTransformHooks;\n};\n\nconst chartMap: ChartTypeMap = {\n // PieData category charts\n donut: {\n transformer: transformPlotlyJsonToDonutProps,\n renderer: ResponsiveDonutChart,\n },\n // SankeyData category charts\n sankey: {\n transformer: transformPlotlyJsonToSankeyProps,\n renderer: ResponsiveSankeyChart,\n },\n // TableData category charts\n table: {\n transformer: transformPlotlyJsonToChartTableProps,\n renderer: ResponsiveChartTable,\n },\n // PlotData category charts\n horizontalbar: {\n transformer: transformPlotlyJsonToHorizontalBarWithAxisProps,\n renderer: ResponsiveHorizontalBarChartWithAxis,\n },\n groupedverticalbar: {\n transformer: transformPlotlyJsonToGVBCProps,\n renderer: ResponsiveGroupedVerticalBarChart,\n },\n verticalstackedbar: {\n transformer: transformPlotlyJsonToVSBCProps,\n renderer: ResponsiveVerticalStackedBarChart,\n },\n heatmap: {\n transformer: transformPlotlyJsonToHeatmapProps,\n renderer: ResponsiveHeatMapChart,\n },\n gauge: {\n transformer: transformPlotlyJsonToGaugeProps,\n renderer: ResponsiveGaugeChart,\n },\n verticalbar: {\n transformer: transformPlotlyJsonToVBCProps,\n renderer: ResponsiveVerticalBarChart,\n },\n area: {\n transformer: transformPlotlyJsonToAreaChartProps,\n renderer: ResponsiveAreaChart,\n preTransformOperation: LineAreaPreTransformOp,\n },\n line: {\n transformer: transformPlotlyJsonToLineChartProps,\n renderer: ResponsiveLineChart,\n preTransformOperation: LineAreaPreTransformOp,\n },\n scatter: {\n transformer: transformPlotlyJsonToScatterChartProps,\n renderer: ResponsiveScatterChart,\n preTransformOperation: LineAreaPreTransformOp,\n },\n gantt: {\n transformer: transformPlotlyJsonToGanttChartProps,\n renderer: ResponsiveGanttChart,\n },\n funnel: {\n transformer: transformPlotlyJsonToFunnelChartProps,\n renderer: FunnelChart,\n },\n fallback: {\n transformer: transformPlotlyJsonToVSBCProps,\n renderer: ResponsiveVerticalStackedBarChart,\n },\n};\n\nconst useIsDarkTheme = (): boolean => {\n const parentV9Theme = React.useContext(V9ThemeContext) as Theme;\n const v9Theme: Theme = parentV9Theme ? parentV9Theme : webLightTheme;\n\n // Get background and foreground colors\n const backgroundColor = d3Color.hsl(v9Theme.colorNeutralBackground1);\n const foregroundColor = d3Color.hsl(v9Theme.colorNeutralForeground1);\n\n const isDarkTheme = backgroundColor.l < foregroundColor.l;\n\n return isDarkTheme;\n};\n\n/**\n * DeclarativeChart component.\n * {@docCategory DeclarativeChart}\n */\nexport const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> = React.forwardRef<\n HTMLDivElement,\n DeclarativeChartProps\n>((props, forwardedRef) => {\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n const chart: OutputChartType = mapFluentChart(plotlySchema);\n if (!chart.isValid) {\n throw new Error(`Invalid chart schema: ${chart.errorMessage}`);\n }\n let plotlyInput = plotlySchema as PlotlySchema;\n try {\n plotlyInput = decodeBase64Fields(plotlyInput);\n } catch (error) {\n throw new Error(`Failed to decode plotly schema: ${error}`);\n }\n const plotlyInputWithValidData: PlotlySchema = {\n ...plotlyInput,\n data: chart.validTracesInfo!.map(trace => plotlyInput.data[trace.index]),\n };\n\n const validTracesFilteredIndex: TraceInfo[] = chart.validTracesInfo!.map((trace, index) => ({\n index,\n type: trace.type,\n }));\n\n let { selectedLegends } = plotlySchema;\n const colorMap = useColorMapping();\n const isDarkTheme = useIsDarkTheme();\n const chartRef = React.useRef<Chart>(null);\n const isMultiPlot = React.useRef(false);\n\n if (!isArrayOrTypedArray(selectedLegends)) {\n selectedLegends = [];\n }\n\n const [activeLegends, setActiveLegends] = React.useState<string[]>(selectedLegends);\n const onActiveLegendsChange = (keys: string[]) => {\n setActiveLegends(keys);\n if (props.onSchemaChange) {\n props.onSchemaChange({ plotlySchema: { plotlyInput, selectedLegends: keys } });\n }\n };\n\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { plotlySchema } = sanitizeJson(props.chartSchema);\n // eslint-disable-next-line @typescript-eslint/no-shadow\n const { selectedLegends } = plotlySchema;\n setActiveLegends(selectedLegends ?? []);\n }, [props.chartSchema]);\n\n const multiSelectLegendProps = {\n canSelectMultipleLegends: true,\n onChange: onActiveLegendsChange,\n selectedLegends: activeLegends,\n };\n\n const commonProps = {\n legendProps: multiSelectLegendProps,\n componentRef: chartRef,\n };\n\n function createLegends(legendProps: LegendsProps): JSXElement {\n // eslint-disable-next-line react/jsx-no-bind\n return <Legends {...legendProps} selectedLegends={activeLegends} onChange={onActiveLegendsChange} />;\n }\n\n // TODO\n const exportAsImage = React.useCallback((opts?: ImageExportOptions): Promise<string> => {\n return new Promise((resolve, reject) => {\n if (isMultiPlot.current) {\n return reject(Error('Exporting multi plot charts as image is not supported'));\n }\n if (!chartRef.current || typeof chartRef.current.toImage !== 'function') {\n return reject(Error('Chart cannot be exported as image'));\n }\n\n chartRef.current\n .toImage({\n background: tokens.colorNeutralBackground1,\n scale: 5,\n ...opts,\n })\n .then(resolve)\n .catch(reject);\n });\n }, []);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n exportAsImage,\n }),\n [exportAsImage],\n );\n\n if (chart.type === 'scatterpolar') {\n const cartesianProjection = projectPolarToCartesian(plotlyInputWithValidData);\n plotlyInputWithValidData.data = cartesianProjection.data;\n plotlyInputWithValidData.layout = cartesianProjection.layout;\n validTracesFilteredIndex.forEach((trace, index) => {\n if (trace.type === 'scatterpolar') {\n const mode = (plotlyInputWithValidData.data[index] as PlotData)?.mode ?? '';\n if (mode.includes('line')) {\n validTracesFilteredIndex[index].type = 'line';\n } else if (mode.includes('markers') || mode === 'text') {\n validTracesFilteredIndex[index].type = 'scatter';\n } else {\n validTracesFilteredIndex[index].type = 'line';\n }\n }\n });\n }\n const groupedTraces: Record<string, number[]> = {};\n let nonCartesianTraceCount = 0;\n plotlyInputWithValidData.data.forEach((trace: Data, index: number) => {\n let traceKey = '';\n if (isNonPlotType(chart.validTracesInfo![index].type)) {\n traceKey = `${NON_PLOT_KEY_PREFIX}${nonCartesianTraceCount + 1}`;\n nonCartesianTraceCount++;\n } else {\n traceKey = (trace as PlotData).xaxis ?? DEFAULT_XAXIS;\n }\n if (!groupedTraces[traceKey]) {\n groupedTraces[traceKey] = [];\n }\n groupedTraces[traceKey].push(index);\n });\n\n isMultiPlot.current = Object.keys(groupedTraces).length > 1;\n const gridProperties: GridProperties = getGridProperties(\n plotlyInputWithValidData,\n isMultiPlot.current,\n chart.validTracesInfo!,\n );\n\n // Render only one plot if the grid properties cannot determine positioning of multiple plots.\n if (\n isMultiPlot.current &&\n gridProperties.templateRows === SINGLE_REPEAT &&\n gridProperties.templateColumns === SINGLE_REPEAT\n ) {\n Object.keys(groupedTraces).forEach((key, index) => {\n if (index > 0) {\n delete groupedTraces[key];\n }\n });\n isMultiPlot.current = false;\n }\n\n const allupLegendsProps = getAllupLegendsProps(\n plotlyInputWithValidData,\n colorMap,\n props.colorwayType,\n chart.validTracesInfo!,\n isDarkTheme,\n );\n\n type ChartType = keyof ChartTypeMap;\n // map through the grouped traces and render the appropriate chart\n return (\n <>\n <div\n style={{\n display: 'grid',\n gridTemplateRows: gridProperties.templateRows,\n gridTemplateColumns: gridProperties.templateColumns,\n }}\n >\n {Object.entries(groupedTraces).map(([xAxisKey, index]) => {\n const plotlyInputForGroup: PlotlySchema = {\n ...plotlyInputWithValidData,\n data: index.map(idx => plotlyInputWithValidData.data[idx]),\n };\n\n const filteredTracesInfo = validTracesFilteredIndex.filter(trace => index.includes(trace.index));\n let chartType =\n validTracesFilteredIndex.some(trace => trace.type === FALLBACK_TYPE) || chart.type === FALLBACK_TYPE\n ? FALLBACK_TYPE\n : filteredTracesInfo[0].type;\n\n if (\n validTracesFilteredIndex.some(trace => trace.type === 'line') &&\n validTracesFilteredIndex.some(trace => trace.type === 'scatter')\n ) {\n chartType = 'line';\n }\n\n const chartEntry = chartMap[chartType as ChartType];\n if (chartEntry) {\n const { transformer, renderer, preTransformCondition, preTransformOperation } = chartEntry;\n if (preTransformCondition === undefined || preTransformCondition(plotlyInputForGroup)) {\n const transformedInput = preTransformOperation\n ? preTransformOperation(plotlyInputForGroup)\n : plotlyInputForGroup;\n const cellProperties = gridProperties.layout[xAxisKey];\n\n return renderChart<ReturnType<typeof transformer>>(\n renderer,\n transformer,\n [transformedInput, isMultiPlot.current, colorMap, props.colorwayType, isDarkTheme],\n {\n ...commonProps,\n xAxisAnnotation: cellProperties?.xAnnotation,\n yAxisAnnotation: cellProperties?.yAnnotation,\n },\n cellProperties?.row ?? 1,\n cellProperties?.column ?? 1,\n );\n }\n return <></>;\n } else {\n throw new Error(`Unsupported chart type :${plotlyInputForGroup.data[0]?.type}`);\n }\n })}\n </div>\n {isMultiPlot.current && createLegends(allupLegendsProps)}\n </>\n );\n});\nDeclarativeChart.displayName = 'DeclarativeChart';\nDeclarativeChart.defaultProps = {\n colorwayType: 'default',\n};\n"],"names":["React","decodeBase64Fields","isArrayOrTypedArray","isMonthArray","mapFluentChart","sanitizeJson","tokens","ThemeContext_unstable","V9ThemeContext","webLightTheme","d3Color","correctYearMonth","getGridProperties","isNonPlotType","transformPlotlyJsonToDonutProps","transformPlotlyJsonToVSBCProps","transformPlotlyJsonToAreaChartProps","transformPlotlyJsonToLineChartProps","transformPlotlyJsonToHorizontalBarWithAxisProps","transformPlotlyJsonToHeatmapProps","transformPlotlyJsonToSankeyProps","transformPlotlyJsonToGaugeProps","transformPlotlyJsonToGVBCProps","transformPlotlyJsonToVBCProps","transformPlotlyJsonToChartTableProps","transformPlotlyJsonToScatterChartProps","projectPolarToCartesian","getAllupLegendsProps","NON_PLOT_KEY_PREFIX","SINGLE_REPEAT","transformPlotlyJsonToFunnelChartProps","transformPlotlyJsonToGanttChartProps","DonutChart","VerticalStackedBarChart","LineChart","HorizontalBarChartWithAxis","AreaChart","HeatMapChart","SankeyChart","GaugeChart","GroupedVerticalBarChart","VerticalBarChart","ScatterChart","FunnelChart","GanttChart","withResponsiveContainer","ChartTable","Legends","ResponsiveDonutChart","ResponsiveVerticalStackedBarChart","ResponsiveLineChart","ResponsiveHorizontalBarChartWithAxis","ResponsiveAreaChart","ResponsiveHeatMapChart","ResponsiveSankeyChart","ResponsiveGaugeChart","ResponsiveGroupedVerticalBarChart","ResponsiveVerticalBarChart","ResponsiveScatterChart","ResponsiveChartTable","ResponsiveGanttChart","DEFAULT_XAXIS","FALLBACK_TYPE","useColorMapping","colorMap","useRef","Map","renderChart","Renderer","transformer","transformerArgs","commonProps","cellRow","cellColumn","chartProps","div","key","style","gridRowStart","gridRowEnd","gridColumnStart","gridColumnEnd","LineAreaPreTransformOp","plotlyInput","xValues","data","x","isXMonth","renderData","map","dataPoint","layout","chartMap","donut","renderer","sankey","table","horizontalbar","groupedverticalbar","verticalstackedbar","heatmap","gauge","verticalbar","area","preTransformOperation","line","scatter","gantt","funnel","fallback","useIsDarkTheme","parentV9Theme","useContext","v9Theme","backgroundColor","hsl","colorNeutralBackground1","foregroundColor","colorNeutralForeground1","isDarkTheme","l","DeclarativeChart","forwardRef","props","forwardedRef","plotlySchema","chartSchema","chart","isValid","Error","errorMessage","error","plotlyInputWithValidData","validTracesInfo","trace","index","validTracesFilteredIndex","type","selectedLegends","chartRef","isMultiPlot","activeLegends","setActiveLegends","useState","onActiveLegendsChange","keys","onSchemaChange","useEffect","multiSelectLegendProps","canSelectMultipleLegends","onChange","legendProps","componentRef","createLegends","exportAsImage","useCallback","opts","Promise","resolve","reject","current","toImage","background","scale","then","catch","useImperativeHandle","cartesianProjection","forEach","mode","includes","groupedTraces","nonCartesianTraceCount","traceKey","xaxis","push","Object","length","gridProperties","templateRows","templateColumns","allupLegendsProps","colorwayType","display","gridTemplateRows","gridTemplateColumns","entries","xAxisKey","plotlyInputForGroup","idx","filteredTracesInfo","filter","chartType","some","chartEntry","preTransformCondition","undefined","transformedInput","cellProperties","xAxisAnnotation","xAnnotation","yAxisAnnotation","yAnnotation","row","column","displayName","defaultProps"],"mappings":"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"}
@@ -9,12 +9,18 @@ function _export(target, all) {
9
9
  });
10
10
  }
11
11
  _export(exports, {
12
+ createColorScale: function() {
13
+ return createColorScale;
14
+ },
12
15
  extractColor: function() {
13
16
  return extractColor;
14
17
  },
15
18
  getColor: function() {
16
19
  return getColor;
17
20
  },
21
+ getOpacity: function() {
22
+ return getOpacity;
23
+ },
18
24
  getSchemaColors: function() {
19
25
  return getSchemaColors;
20
26
  },
@@ -28,6 +34,7 @@ const _d3color = require("d3-color");
28
34
  const _chartutilities = require("@fluentui/chart-utilities");
29
35
  const _utilities = require("../../utilities/utilities");
30
36
  const _colors = require("../../utilities/colors");
37
+ const _d3scale = require("d3-scale");
31
38
  const DEFAULT_PLOTLY_COLORWAY = [
32
39
  '#636efa',
33
40
  '#ef553b',
@@ -109,7 +116,7 @@ const extractColor = (colorway, colorwayType, colors, colorMap, isDarkTheme)=>{
109
116
  };
110
117
  const resolveColor = (extractedColors, index, legend, colorMap, isDarkTheme)=>{
111
118
  let color = '';
112
- if (extractedColors && (0, _chartutilities.isArrayOrTypedArray)(extractedColors) && extractedColors[index]) {
119
+ if (extractedColors && (0, _chartutilities.isArrayOrTypedArray)(extractedColors) && extractedColors.length > 0) {
113
120
  color = extractedColors[index % extractedColors.length];
114
121
  } else if (typeof extractedColors === 'string') {
115
122
  color = extractedColors;
@@ -118,3 +125,26 @@ const resolveColor = (extractedColors, index, legend, colorMap, isDarkTheme)=>{
118
125
  }
119
126
  return color;
120
127
  };
128
+ const getOpacity = (series, index)=>{
129
+ var _series_marker, _series_marker1, _series_marker2, _series_marker3, _series_marker4;
130
+ var _series_opacity;
131
+ return ((_series_marker = series.marker) === null || _series_marker === void 0 ? void 0 : _series_marker.opacity) ? (0, _chartutilities.isArrayOrTypedArray)((_series_marker1 = series.marker) === null || _series_marker1 === void 0 ? void 0 : _series_marker1.opacity) ? ((_series_marker2 = series.marker) === null || _series_marker2 === void 0 ? void 0 : _series_marker2.opacity)[index % ((_series_marker3 = series.marker) === null || _series_marker3 === void 0 ? void 0 : _series_marker3.opacity).length] : (_series_marker4 = series.marker) === null || _series_marker4 === void 0 ? void 0 : _series_marker4.opacity : (_series_opacity = series.opacity) !== null && _series_opacity !== void 0 ? _series_opacity : 1;
132
+ };
133
+ const createColorScale = (layout, series, currentColorScale)=>{
134
+ var _layout_coloraxis_colorscale, _layout_coloraxis, _series_marker, _series_marker1, _series_marker_color, _series_marker2;
135
+ if ((layout === null || layout === void 0 ? void 0 : (_layout_coloraxis = layout.coloraxis) === null || _layout_coloraxis === void 0 ? void 0 : (_layout_coloraxis_colorscale = _layout_coloraxis.colorscale) === null || _layout_coloraxis_colorscale === void 0 ? void 0 : _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') {
136
+ var _layout_coloraxis1, _series_marker3, _layout_coloraxis2, _layout_coloraxis3;
137
+ const scale = layout === null || layout === void 0 ? void 0 : (_layout_coloraxis1 = layout.coloraxis) === null || _layout_coloraxis1 === void 0 ? void 0 : _layout_coloraxis1.colorscale;
138
+ const colorValues = (_series_marker3 = series.marker) === null || _series_marker3 === void 0 ? void 0 : _series_marker3.color;
139
+ var _layout_coloraxis_cmin, _layout_coloraxis_cmax;
140
+ const [dMin, dMax] = [
141
+ (_layout_coloraxis_cmin = layout === null || layout === void 0 ? void 0 : (_layout_coloraxis2 = layout.coloraxis) === null || _layout_coloraxis2 === void 0 ? void 0 : _layout_coloraxis2.cmin) !== null && _layout_coloraxis_cmin !== void 0 ? _layout_coloraxis_cmin : Math.min(...colorValues),
142
+ (_layout_coloraxis_cmax = layout === null || layout === void 0 ? void 0 : (_layout_coloraxis3 = layout.coloraxis) === null || _layout_coloraxis3 === void 0 ? void 0 : _layout_coloraxis3.cmax) !== null && _layout_coloraxis_cmax !== void 0 ? _layout_coloraxis_cmax : Math.max(...colorValues)
143
+ ];
144
+ // Normalize colorscale domain to actual data domain
145
+ const scaleDomain = scale.map(([pos])=>dMin + pos * (dMax - dMin));
146
+ const scaleColors = scale.map((item)=>item[1]);
147
+ return (0, _d3scale.scaleLinear)().domain(scaleDomain).range(scaleColors);
148
+ }
149
+ return currentColorScale;
150
+ };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/DeclarativeChart/PlotlyColorAdapter.ts"],"sourcesContent":["import * as React from 'react';\nimport { color as d3Color } from 'd3-color';\nimport type { PieColors, Color } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray } from '@fluentui/chart-utilities';\nimport { areArraysEqual } from '../../utilities/utilities';\nimport { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';\n\ntype PlotlyColorway = 'plotly' | 'others';\n\n// The color sequences in plotly express are defined here:\n// https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport type ColorwayType = 'default' | 'builtin' | 'others' | undefined;\n\nconst DEFAULT_PLOTLY_COLORWAY = [\n '#636efa', //1\n '#ef553b', //2\n '#00cc96', //3\n '#ab63fa', //4\n '#ffa15a', //5\n '#19d3f3', //6\n '#ff6692', //7\n '#b6e880', //8\n '#ff97ff', //9\n '#fecb52', //10\n];\n\nconst PLOTLY_FLUENTVIZ_COLORWAY_MAPPING = [\n DataVizPalette.color1, //1\n DataVizPalette.warning, //2\n DataVizPalette.color8, //3\n DataVizPalette.color4, //4\n DataVizPalette.color7, //5\n DataVizPalette.color6, //6\n DataVizPalette.color2, //7\n DataVizPalette.color5, //8\n DataVizPalette.color9, //9\n DataVizPalette.color10, //10\n];\n\nfunction getPlotlyColorway(colorway: string[] | undefined): PlotlyColorway {\n const isPlotlyColorway =\n isArrayOrTypedArray(colorway) &&\n areArraysEqual(\n colorway?.map(c => c.toLowerCase()),\n DEFAULT_PLOTLY_COLORWAY,\n );\n\n return isPlotlyColorway ? 'plotly' : 'others';\n}\n\nfunction tryMapFluentDataViz(hexColor: string, templateColorway: PlotlyColorway, isDarkTheme?: boolean): string {\n if (templateColorway !== 'plotly') {\n return hexColor;\n }\n const index = DEFAULT_PLOTLY_COLORWAY.indexOf(hexColor.toLowerCase());\n if (index !== -1) {\n return getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[index], isDarkTheme);\n }\n return hexColor;\n}\n\nexport const getColor = (\n legendLabel: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n if (!colorMap.current.has(legendLabel)) {\n let nextColor: string;\n if (colorMap.current.size < PLOTLY_FLUENTVIZ_COLORWAY_MAPPING.length) {\n // Get first 10 colors from plotly-fluentviz colorway mapping\n nextColor = getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[colorMap.current.size], isDarkTheme);\n } else {\n nextColor = getNextColor(colorMap.current.size, 0, isDarkTheme);\n }\n colorMap.current.set(legendLabel, nextColor);\n return nextColor;\n }\n\n return colorMap.current.get(legendLabel) as string;\n};\n\nexport const getSchemaColors = (\n colorway: string[] | undefined,\n colors: PieColors | Color | Color[] | string | null | undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string[] | string | undefined => {\n const hexColors: string[] = [];\n if (!colors) {\n return undefined;\n }\n const templateColorway = getPlotlyColorway(colorway);\n if (isArrayOrTypedArray(colors)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (colors as any[]).forEach((element, index) => {\n const colorString = element?.toString().trim();\n const nextFluentColor = getColor(`Label_${index}`, colorMap, isDarkTheme);\n if (colorString) {\n const parsedColor = d3Color(colorString);\n hexColors.push(\n parsedColor ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme) : nextFluentColor,\n );\n } else {\n hexColors.push(nextFluentColor);\n }\n });\n } else if (typeof colors === 'string') {\n const parsedColor = d3Color(colors);\n return parsedColor\n ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme)\n : getColor('Label_0', colorMap, isDarkTheme);\n }\n return hexColors;\n};\n\nexport const extractColor = (\n colorway: string[] | undefined,\n colorwayType: ColorwayType,\n colors: PieColors | Color | Color[] | string | null | undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string | string[] | undefined => {\n return colorwayType === 'default' && colors ? getSchemaColors(colorway, colors, colorMap, isDarkTheme) : undefined;\n};\n\nexport const resolveColor = (\n extractedColors: string[] | string | null | undefined,\n index: number,\n legend: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n let color = '';\n if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors[index]) {\n color = extractedColors[index % extractedColors.length];\n } else if (typeof extractedColors === 'string') {\n color = extractedColors;\n } else {\n color = getColor(legend, colorMap, isDarkTheme);\n }\n return color;\n};\n"],"names":["React","color","d3Color","isArrayOrTypedArray","areArraysEqual","DataVizPalette","getColorFromToken","getNextColor","DEFAULT_PLOTLY_COLORWAY","PLOTLY_FLUENTVIZ_COLORWAY_MAPPING","color1","warning","color8","color4","color7","color6","color2","color5","color9","color10","getPlotlyColorway","colorway","isPlotlyColorway","map","c","toLowerCase","tryMapFluentDataViz","hexColor","templateColorway","isDarkTheme","index","indexOf","getColor","legendLabel","colorMap","current","has","nextColor","size","length","set","get","getSchemaColors","colors","hexColors","undefined","forEach","element","colorString","toString","trim","nextFluentColor","parsedColor","push","formatHex","extractColor","colorwayType","resolveColor","extractedColors","legend"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/DeclarativeChart/PlotlyColorAdapter.ts"],"sourcesContent":["import * as React from 'react';\nimport { color as d3Color } from 'd3-color';\nimport type { PieColors, Color, PlotData, Layout } from '@fluentui/chart-utilities';\nimport { isArrayOrTypedArray } from '@fluentui/chart-utilities';\nimport { areArraysEqual } from '../../utilities/utilities';\nimport { DataVizPalette, getColorFromToken, getNextColor } from '../../utilities/colors';\nimport { scaleLinear as d3ScaleLinear } from 'd3-scale';\n\ntype PlotlyColorway = 'plotly' | 'others';\n\n// The color sequences in plotly express are defined here:\n// https://plotly.com/python/discrete-color/#:~:text=Join%20now.-,Color%20Sequences%20in%20Plotly%20Express,-By%20default%2C%20Plotly\nexport type ColorwayType = 'default' | 'builtin' | 'others' | undefined;\n\nconst DEFAULT_PLOTLY_COLORWAY = [\n '#636efa', //1\n '#ef553b', //2\n '#00cc96', //3\n '#ab63fa', //4\n '#ffa15a', //5\n '#19d3f3', //6\n '#ff6692', //7\n '#b6e880', //8\n '#ff97ff', //9\n '#fecb52', //10\n];\n\nconst PLOTLY_FLUENTVIZ_COLORWAY_MAPPING = [\n DataVizPalette.color1, //1\n DataVizPalette.warning, //2\n DataVizPalette.color8, //3\n DataVizPalette.color4, //4\n DataVizPalette.color7, //5\n DataVizPalette.color6, //6\n DataVizPalette.color2, //7\n DataVizPalette.color5, //8\n DataVizPalette.color9, //9\n DataVizPalette.color10, //10\n];\n\nfunction getPlotlyColorway(colorway: string[] | undefined): PlotlyColorway {\n const isPlotlyColorway =\n isArrayOrTypedArray(colorway) &&\n areArraysEqual(\n colorway?.map(c => c.toLowerCase()),\n DEFAULT_PLOTLY_COLORWAY,\n );\n\n return isPlotlyColorway ? 'plotly' : 'others';\n}\n\nfunction tryMapFluentDataViz(hexColor: string, templateColorway: PlotlyColorway, isDarkTheme?: boolean): string {\n if (templateColorway !== 'plotly') {\n return hexColor;\n }\n const index = DEFAULT_PLOTLY_COLORWAY.indexOf(hexColor.toLowerCase());\n if (index !== -1) {\n return getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[index], isDarkTheme);\n }\n return hexColor;\n}\n\nexport const getColor = (\n legendLabel: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n if (!colorMap.current.has(legendLabel)) {\n let nextColor: string;\n if (colorMap.current.size < PLOTLY_FLUENTVIZ_COLORWAY_MAPPING.length) {\n // Get first 10 colors from plotly-fluentviz colorway mapping\n nextColor = getColorFromToken(PLOTLY_FLUENTVIZ_COLORWAY_MAPPING[colorMap.current.size], isDarkTheme);\n } else {\n nextColor = getNextColor(colorMap.current.size, 0, isDarkTheme);\n }\n colorMap.current.set(legendLabel, nextColor);\n return nextColor;\n }\n\n return colorMap.current.get(legendLabel) as string;\n};\n\nexport const getSchemaColors = (\n colorway: string[] | undefined,\n colors: PieColors | Color | Color[] | string | null | undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string[] | string | undefined => {\n const hexColors: string[] = [];\n if (!colors) {\n return undefined;\n }\n const templateColorway = getPlotlyColorway(colorway);\n if (isArrayOrTypedArray(colors)) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (colors as any[]).forEach((element, index) => {\n const colorString = element?.toString().trim();\n const nextFluentColor = getColor(`Label_${index}`, colorMap, isDarkTheme);\n if (colorString) {\n const parsedColor = d3Color(colorString);\n hexColors.push(\n parsedColor ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme) : nextFluentColor,\n );\n } else {\n hexColors.push(nextFluentColor);\n }\n });\n } else if (typeof colors === 'string') {\n const parsedColor = d3Color(colors);\n return parsedColor\n ? tryMapFluentDataViz(parsedColor.formatHex(), templateColorway, isDarkTheme)\n : getColor('Label_0', colorMap, isDarkTheme);\n }\n return hexColors;\n};\n\nexport const extractColor = (\n colorway: string[] | undefined,\n colorwayType: ColorwayType,\n colors: PieColors | Color | Color[] | string | null | undefined,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string | string[] | undefined => {\n return colorwayType === 'default' && colors ? getSchemaColors(colorway, colors, colorMap, isDarkTheme) : undefined;\n};\n\nexport const resolveColor = (\n extractedColors: string[] | string | null | undefined,\n index: number,\n legend: string,\n colorMap: React.MutableRefObject<Map<string, string>>,\n isDarkTheme?: boolean,\n): string => {\n let color = '';\n if (extractedColors && isArrayOrTypedArray(extractedColors) && extractedColors.length > 0) {\n color = extractedColors[index % extractedColors.length];\n } else if (typeof extractedColors === 'string') {\n color = extractedColors;\n } else {\n color = getColor(legend, colorMap, isDarkTheme);\n }\n return color;\n};\n\nexport const getOpacity = (series: Partial<PlotData>, index: number): number => {\n return series.marker?.opacity\n ? isArrayOrTypedArray(series.marker?.opacity)\n ? (series.marker?.opacity as number[])[index % (series.marker?.opacity as number[]).length]\n : (series.marker?.opacity as number)\n : series.opacity ?? 1;\n};\n\nexport const createColorScale = (\n layout: Partial<Layout> | undefined,\n series: Partial<PlotData>,\n currentColorScale: ((value: number) => string) | undefined,\n): ((value: number) => string) | undefined => {\n if (\n layout?.coloraxis?.colorscale?.length &&\n isArrayOrTypedArray(series.marker?.color) &&\n (series.marker?.color as Color[]).length > 0 &&\n typeof (series.marker?.color as Color[])?.[0] === 'number'\n ) {\n const scale = layout?.coloraxis?.colorscale as Array<[number, string]>;\n const colorValues = series.marker?.color as number[];\n const [dMin, dMax] = [\n layout?.coloraxis?.cmin ?? Math.min(...colorValues),\n layout?.coloraxis?.cmax ?? Math.max(...colorValues),\n ];\n\n // Normalize colorscale domain to actual data domain\n const scaleDomain = scale.map(([pos]) => dMin + pos * (dMax - dMin));\n const scaleColors = scale.map(item => item[1]);\n\n return d3ScaleLinear<string>().domain(scaleDomain).range(scaleColors);\n }\n return currentColorScale;\n};\n"],"names":["React","color","d3Color","isArrayOrTypedArray","areArraysEqual","DataVizPalette","getColorFromToken","getNextColor","scaleLinear","d3ScaleLinear","DEFAULT_PLOTLY_COLORWAY","PLOTLY_FLUENTVIZ_COLORWAY_MAPPING","color1","warning","color8","color4","color7","color6","color2","color5","color9","color10","getPlotlyColorway","colorway","isPlotlyColorway","map","c","toLowerCase","tryMapFluentDataViz","hexColor","templateColorway","isDarkTheme","index","indexOf","getColor","legendLabel","colorMap","current","has","nextColor","size","length","set","get","getSchemaColors","colors","hexColors","undefined","forEach","element","colorString","toString","trim","nextFluentColor","parsedColor","push","formatHex","extractColor","colorwayType","resolveColor","extractedColors","legend","getOpacity","series","marker","opacity","createColorScale","layout","currentColorScale","coloraxis","colorscale","scale","colorValues","dMin","dMax","cmin","Math","min","cmax","max","scaleDomain","pos","scaleColors","item","domain","range"],"mappings":"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"}