@hitachivantara/uikit-react-viz 5.6.26 → 5.6.28

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 (95) hide show
  1. package/dist/cjs/components/BarChart/BarChart.cjs +82 -80
  2. package/dist/cjs/components/BarChart/BarChart.cjs.map +1 -1
  3. package/dist/cjs/components/BaseChart/BaseChart.cjs +42 -36
  4. package/dist/cjs/components/BaseChart/BaseChart.cjs.map +1 -1
  5. package/dist/cjs/components/ConfusionMatrix/ConfusionMatrix.cjs +28 -17
  6. package/dist/cjs/components/ConfusionMatrix/ConfusionMatrix.cjs.map +1 -1
  7. package/dist/cjs/components/ConfusionMatrix/ConfusionMatrix.styles.cjs +22 -22
  8. package/dist/cjs/components/ConfusionMatrix/ConfusionMatrix.styles.cjs.map +1 -1
  9. package/dist/cjs/components/ConfusionMatrix/utils.cjs +32 -23
  10. package/dist/cjs/components/ConfusionMatrix/utils.cjs.map +1 -1
  11. package/dist/cjs/components/DonutChart/DonutChart.cjs +60 -59
  12. package/dist/cjs/components/DonutChart/DonutChart.cjs.map +1 -1
  13. package/dist/cjs/components/LineChart/LineChart.cjs +80 -81
  14. package/dist/cjs/components/LineChart/LineChart.cjs.map +1 -1
  15. package/dist/cjs/hooks/tooltip/styles.cjs +2 -7
  16. package/dist/cjs/hooks/tooltip/styles.cjs.map +1 -1
  17. package/dist/cjs/hooks/tooltip/useTooltip.cjs +55 -37
  18. package/dist/cjs/hooks/tooltip/useTooltip.cjs.map +1 -1
  19. package/dist/cjs/hooks/useData.cjs +24 -22
  20. package/dist/cjs/hooks/useData.cjs.map +1 -1
  21. package/dist/cjs/hooks/useDataZoom.cjs +15 -14
  22. package/dist/cjs/hooks/useDataZoom.cjs.map +1 -1
  23. package/dist/cjs/hooks/useDataset.cjs +7 -4
  24. package/dist/cjs/hooks/useDataset.cjs.map +1 -1
  25. package/dist/cjs/hooks/useGrid.cjs.map +1 -1
  26. package/dist/cjs/hooks/useLegend.cjs +5 -7
  27. package/dist/cjs/hooks/useLegend.cjs.map +1 -1
  28. package/dist/cjs/hooks/useOption.cjs +1 -4
  29. package/dist/cjs/hooks/useOption.cjs.map +1 -1
  30. package/dist/cjs/hooks/useSeries.cjs +14 -4
  31. package/dist/cjs/hooks/useSeries.cjs.map +1 -1
  32. package/dist/cjs/hooks/useVisualMap.cjs +11 -1
  33. package/dist/cjs/hooks/useVisualMap.cjs.map +1 -1
  34. package/dist/cjs/hooks/useVizTheme.cjs.map +1 -1
  35. package/dist/cjs/hooks/useXAxis.cjs +17 -10
  36. package/dist/cjs/hooks/useXAxis.cjs.map +1 -1
  37. package/dist/cjs/hooks/useYAxis.cjs +41 -44
  38. package/dist/cjs/hooks/useYAxis.cjs.map +1 -1
  39. package/dist/cjs/providers/Provider.cjs +3 -11
  40. package/dist/cjs/providers/Provider.cjs.map +1 -1
  41. package/dist/cjs/utils/getAgFunc.cjs.map +1 -1
  42. package/dist/cjs/utils/getAxisType.cjs.map +1 -1
  43. package/dist/cjs/utils/getGroupKey.cjs.map +1 -1
  44. package/dist/cjs/utils/getLegendIcon.cjs.map +1 -1
  45. package/dist/cjs/utils/getMeasure.cjs.map +1 -1
  46. package/dist/cjs/utils/registerTheme.cjs +15 -4
  47. package/dist/cjs/utils/registerTheme.cjs.map +1 -1
  48. package/dist/esm/components/BarChart/BarChart.js +82 -80
  49. package/dist/esm/components/BarChart/BarChart.js.map +1 -1
  50. package/dist/esm/components/BaseChart/BaseChart.js +42 -36
  51. package/dist/esm/components/BaseChart/BaseChart.js.map +1 -1
  52. package/dist/esm/components/ConfusionMatrix/ConfusionMatrix.js +28 -17
  53. package/dist/esm/components/ConfusionMatrix/ConfusionMatrix.js.map +1 -1
  54. package/dist/esm/components/ConfusionMatrix/ConfusionMatrix.styles.js +22 -22
  55. package/dist/esm/components/ConfusionMatrix/ConfusionMatrix.styles.js.map +1 -1
  56. package/dist/esm/components/ConfusionMatrix/utils.js +32 -23
  57. package/dist/esm/components/ConfusionMatrix/utils.js.map +1 -1
  58. package/dist/esm/components/DonutChart/DonutChart.js +60 -59
  59. package/dist/esm/components/DonutChart/DonutChart.js.map +1 -1
  60. package/dist/esm/components/LineChart/LineChart.js +80 -81
  61. package/dist/esm/components/LineChart/LineChart.js.map +1 -1
  62. package/dist/esm/hooks/tooltip/styles.js +2 -7
  63. package/dist/esm/hooks/tooltip/styles.js.map +1 -1
  64. package/dist/esm/hooks/tooltip/useTooltip.js +55 -37
  65. package/dist/esm/hooks/tooltip/useTooltip.js.map +1 -1
  66. package/dist/esm/hooks/useData.js +24 -22
  67. package/dist/esm/hooks/useData.js.map +1 -1
  68. package/dist/esm/hooks/useDataZoom.js +15 -14
  69. package/dist/esm/hooks/useDataZoom.js.map +1 -1
  70. package/dist/esm/hooks/useDataset.js +7 -4
  71. package/dist/esm/hooks/useDataset.js.map +1 -1
  72. package/dist/esm/hooks/useGrid.js.map +1 -1
  73. package/dist/esm/hooks/useLegend.js +5 -7
  74. package/dist/esm/hooks/useLegend.js.map +1 -1
  75. package/dist/esm/hooks/useOption.js +1 -4
  76. package/dist/esm/hooks/useOption.js.map +1 -1
  77. package/dist/esm/hooks/useSeries.js +14 -4
  78. package/dist/esm/hooks/useSeries.js.map +1 -1
  79. package/dist/esm/hooks/useVisualMap.js +11 -1
  80. package/dist/esm/hooks/useVisualMap.js.map +1 -1
  81. package/dist/esm/hooks/useVizTheme.js.map +1 -1
  82. package/dist/esm/hooks/useXAxis.js +17 -10
  83. package/dist/esm/hooks/useXAxis.js.map +1 -1
  84. package/dist/esm/hooks/useYAxis.js +41 -44
  85. package/dist/esm/hooks/useYAxis.js.map +1 -1
  86. package/dist/esm/providers/Provider.js +3 -11
  87. package/dist/esm/providers/Provider.js.map +1 -1
  88. package/dist/esm/utils/getAgFunc.js.map +1 -1
  89. package/dist/esm/utils/getAxisType.js.map +1 -1
  90. package/dist/esm/utils/getGroupKey.js.map +1 -1
  91. package/dist/esm/utils/getLegendIcon.js.map +1 -1
  92. package/dist/esm/utils/getMeasure.js.map +1 -1
  93. package/dist/esm/utils/registerTheme.js +15 -4
  94. package/dist/esm/utils/registerTheme.js.map +1 -1
  95. package/package.json +5 -5
@@ -7,52 +7,49 @@ const useYAxis = ({
7
7
  axes,
8
8
  defaultType = "continuous"
9
9
  }) => {
10
- const {
11
- colors
12
- } = uikitReactCore.useTheme();
13
- const createAxis = react.useCallback(({
14
- id,
15
- type,
16
- name,
17
- labelFormatter,
18
- labelRotation,
19
- maxValue,
20
- minValue,
21
- nameProps,
22
- data,
23
- position
24
- }) => {
25
- const nameStyleKeys = nameProps ? Object.keys(nameProps).filter((key) => key !== "location") : void 0;
26
- const nameStyle = nameProps && nameStyleKeys ? nameStyleKeys.reduce((acc, curr) => {
27
- return {
28
- ...acc,
29
- [curr]: curr === "color" ? colors?.[nameProps[curr]] || nameProps[curr] : nameProps[curr]
30
- };
31
- }, {}) : void 0;
32
- return {
10
+ const { colors } = uikitReactCore.useTheme();
11
+ const createAxis = react.useCallback(
12
+ ({
33
13
  id,
34
- type: getAxisType.getAxisType(type) ?? getAxisType.getAxisType(defaultType),
14
+ type,
35
15
  name,
36
- axisLabel: {
37
- rotate: labelRotation ?? 0,
38
- formatter: labelFormatter
39
- },
40
- max: maxValue === "max" ? "dataMax" : maxValue,
41
- min: minValue === "min" ? "dataMin" : minValue,
42
- ...nameProps?.location && {
43
- nameLocation: nameProps?.location
44
- },
45
- ...nameStyle && {
46
- nameTextStyle: nameStyle
47
- },
48
- ...data && {
49
- data
50
- },
51
- ...position && {
52
- position
53
- }
54
- };
55
- }, [colors, defaultType]);
16
+ labelFormatter,
17
+ labelRotation,
18
+ maxValue,
19
+ minValue,
20
+ nameProps,
21
+ data,
22
+ position
23
+ }) => {
24
+ const nameStyleKeys = nameProps ? Object.keys(nameProps).filter((key) => key !== "location") : void 0;
25
+ const nameStyle = nameProps && nameStyleKeys ? nameStyleKeys.reduce((acc, curr) => {
26
+ return {
27
+ ...acc,
28
+ [curr]: curr === "color" ? colors?.[nameProps[curr]] || nameProps[curr] : nameProps[curr]
29
+ };
30
+ }, {}) : void 0;
31
+ return {
32
+ id,
33
+ type: getAxisType.getAxisType(type) ?? getAxisType.getAxisType(defaultType),
34
+ name,
35
+ axisLabel: {
36
+ rotate: labelRotation ?? 0,
37
+ formatter: labelFormatter
38
+ },
39
+ max: maxValue === "max" ? "dataMax" : maxValue,
40
+ min: minValue === "min" ? "dataMin" : minValue,
41
+ ...nameProps?.location && {
42
+ nameLocation: nameProps?.location
43
+ },
44
+ ...nameStyle && {
45
+ nameTextStyle: nameStyle
46
+ },
47
+ ...data && { data },
48
+ ...position && { position }
49
+ };
50
+ },
51
+ [colors, defaultType]
52
+ );
56
53
  const option = react.useMemo(() => {
57
54
  return {
58
55
  yAxis: Array.isArray(axes) ? axes.map((axis) => createAxis(axis)) : [createAxis({})]
@@ -1 +1 @@
1
- {"version":3,"file":"useYAxis.cjs","sources":["../../../src/hooks/useYAxis.tsx"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { getAxisType } from \"@viz/utils\";\nimport { HvChartAxisType } from \"@viz/types\";\nimport { HvChartYAxis, HvEChartsOption } from \"@viz/types/common\";\n\ninterface YAxis extends HvChartYAxis {\n data?: string[];\n}\n\ninterface HvYAxisHookProps {\n axes?: YAxis[];\n defaultType?: HvChartAxisType;\n}\n\nexport const useYAxis = ({\n axes,\n defaultType = \"continuous\",\n}: HvYAxisHookProps) => {\n const { colors } = useTheme();\n\n const createAxis = useCallback(\n ({\n id,\n type,\n name,\n labelFormatter,\n labelRotation,\n maxValue,\n minValue,\n nameProps,\n data,\n position,\n }: YAxis) => {\n const nameStyleKeys = nameProps\n ? Object.keys(nameProps).filter((key) => key !== \"location\")\n : undefined;\n const nameStyle =\n nameProps && nameStyleKeys\n ? nameStyleKeys.reduce((acc, curr) => {\n return {\n ...acc,\n [curr]:\n curr === \"color\"\n ? colors?.[nameProps[curr] as string] || nameProps[curr]\n : nameProps[curr],\n };\n }, {})\n : undefined;\n\n return {\n id,\n type: getAxisType(type) ?? getAxisType(defaultType),\n name,\n axisLabel: {\n rotate: labelRotation ?? 0,\n formatter: labelFormatter,\n },\n max: maxValue === \"max\" ? \"dataMax\" : maxValue,\n min: minValue === \"min\" ? \"dataMin\" : minValue,\n ...(nameProps?.location && {\n nameLocation: nameProps?.location,\n }),\n ...(nameStyle && {\n nameTextStyle: nameStyle,\n }),\n ...(data && { data }),\n ...(position && { position }),\n };\n },\n [colors, defaultType]\n );\n\n const option = useMemo<Pick<HvEChartsOption, \"yAxis\">>(() => {\n return {\n yAxis: Array.isArray(axes)\n ? axes.map((axis) => createAxis(axis))\n : [createAxis({})],\n };\n }, [axes, createAxis]);\n\n return option;\n};\n"],"names":["useYAxis","axes","defaultType","colors","useTheme","createAxis","useCallback","id","type","name","labelFormatter","labelRotation","maxValue","minValue","nameProps","data","position","nameStyleKeys","Object","keys","filter","key","undefined","nameStyle","reduce","acc","curr","getAxisType","axisLabel","rotate","formatter","max","min","location","nameLocation","nameTextStyle","option","useMemo","yAxis","Array","isArray","map","axis"],"mappings":";;;;;AAiBO,MAAMA,WAAWA,CAAC;AAAA,EACvBC;AAAAA,EACAC,cAAc;AACE,MAAM;AAChB,QAAA;AAAA,IAAEC;AAAAA,MAAWC,eAAS,SAAA;AAEtBC,QAAAA,aAAaC,MAAAA,YACjB,CAAC;AAAA,IACCC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,MACW;AACLC,UAAAA,gBAAgBH,YAClBI,OAAOC,KAAKL,SAAS,EAAEM,OAAQC,CAAAA,QAAQA,QAAQ,UAAU,IACzDC;AACJ,UAAMC,YACJT,aAAaG,gBACTA,cAAcO,OAAO,CAACC,KAAKC,SAAS;AAC3B,aAAA;AAAA,QACL,GAAGD;AAAAA,QACH,CAACC,IAAI,GACHA,SAAS,UACLvB,SAASW,UAAUY,IAAI,CAAY,KAAIZ,UAAUY,IAAI,IACrDZ,UAAUY,IAAI;AAAA,MAAA;AAAA,IACtB,GACC,CAAE,CAAA,IACLJ;AAEC,WAAA;AAAA,MACLf;AAAAA,MACAC,MAAMmB,YAAAA,YAAYnB,IAAI,KAAKmB,YAAAA,YAAYzB,WAAW;AAAA,MAClDO;AAAAA,MACAmB,WAAW;AAAA,QACTC,QAAQlB,iBAAiB;AAAA,QACzBmB,WAAWpB;AAAAA,MACb;AAAA,MACAqB,KAAKnB,aAAa,QAAQ,YAAYA;AAAAA,MACtCoB,KAAKnB,aAAa,QAAQ,YAAYA;AAAAA,MACtC,GAAIC,WAAWmB,YAAY;AAAA,QACzBC,cAAcpB,WAAWmB;AAAAA,MAC3B;AAAA,MACA,GAAIV,aAAa;AAAA,QACfY,eAAeZ;AAAAA,MACjB;AAAA,MACA,GAAIR,QAAQ;AAAA,QAAEA;AAAAA,MAAK;AAAA,MACnB,GAAIC,YAAY;AAAA,QAAEA;AAAAA,MAAS;AAAA,IAAA;AAAA,EAC7B,GAEF,CAACb,QAAQD,WAAW,CACtB;AAEMkC,QAAAA,SAASC,MAAAA,QAAwC,MAAM;AACpD,WAAA;AAAA,MACLC,OAAOC,MAAMC,QAAQvC,IAAI,IACrBA,KAAKwC,IAAKC,CAAAA,SAASrC,WAAWqC,IAAI,CAAC,IACnC,CAACrC,WAAW,CAAE,CAAA,CAAC;AAAA,IAAA;AAAA,EACrB,GACC,CAACJ,MAAMI,UAAU,CAAC;AAEd+B,SAAAA;AACT;;"}
1
+ {"version":3,"file":"useYAxis.cjs","sources":["../../../src/hooks/useYAxis.tsx"],"sourcesContent":["import { useMemo, useCallback } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { getAxisType } from \"@viz/utils\";\nimport { HvChartAxisType } from \"@viz/types\";\nimport { HvChartYAxis, HvEChartsOption } from \"@viz/types/common\";\n\ninterface YAxis extends HvChartYAxis {\n data?: string[];\n}\n\ninterface HvYAxisHookProps {\n axes?: YAxis[];\n defaultType?: HvChartAxisType;\n}\n\nexport const useYAxis = ({\n axes,\n defaultType = \"continuous\",\n}: HvYAxisHookProps) => {\n const { colors } = useTheme();\n\n const createAxis = useCallback(\n ({\n id,\n type,\n name,\n labelFormatter,\n labelRotation,\n maxValue,\n minValue,\n nameProps,\n data,\n position,\n }: YAxis) => {\n const nameStyleKeys = nameProps\n ? Object.keys(nameProps).filter((key) => key !== \"location\")\n : undefined;\n const nameStyle =\n nameProps && nameStyleKeys\n ? nameStyleKeys.reduce((acc, curr) => {\n return {\n ...acc,\n [curr]:\n curr === \"color\"\n ? colors?.[nameProps[curr] as string] || nameProps[curr]\n : nameProps[curr],\n };\n }, {})\n : undefined;\n\n return {\n id,\n type: getAxisType(type) ?? getAxisType(defaultType),\n name,\n axisLabel: {\n rotate: labelRotation ?? 0,\n formatter: labelFormatter,\n },\n max: maxValue === \"max\" ? \"dataMax\" : maxValue,\n min: minValue === \"min\" ? \"dataMin\" : minValue,\n ...(nameProps?.location && {\n nameLocation: nameProps?.location,\n }),\n ...(nameStyle && {\n nameTextStyle: nameStyle,\n }),\n ...(data && { data }),\n ...(position && { position }),\n };\n },\n [colors, defaultType]\n );\n\n const option = useMemo<Pick<HvEChartsOption, \"yAxis\">>(() => {\n return {\n yAxis: Array.isArray(axes)\n ? axes.map((axis) => createAxis(axis))\n : [createAxis({})],\n };\n }, [axes, createAxis]);\n\n return option;\n};\n"],"names":["useTheme","useCallback","getAxisType","useMemo"],"mappings":";;;;;AAiBO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA,cAAc;AAChB,MAAwB;AAChB,QAAA,EAAE,WAAWA,eAAAA;AAEnB,QAAM,aAAaC,MAAA;AAAA,IACjB,CAAC;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,MACW;AACL,YAAA,gBAAgB,YAClB,OAAO,KAAK,SAAS,EAAE,OAAO,CAAC,QAAQ,QAAQ,UAAU,IACzD;AACJ,YAAM,YACJ,aAAa,gBACT,cAAc,OAAO,CAAC,KAAK,SAAS;AAC3B,eAAA;AAAA,UACL,GAAG;AAAA,UACH,CAAC,IAAI,GACH,SAAS,UACL,SAAS,UAAU,IAAI,CAAW,KAAK,UAAU,IAAI,IACrD,UAAU,IAAI;AAAA,QAAA;AAAA,MACtB,GACC,CAAE,CAAA,IACL;AAEC,aAAA;AAAA,QACL;AAAA,QACA,MAAMC,YAAAA,YAAY,IAAI,KAAKA,YAAAA,YAAY,WAAW;AAAA,QAClD;AAAA,QACA,WAAW;AAAA,UACT,QAAQ,iBAAiB;AAAA,UACzB,WAAW;AAAA,QACb;AAAA,QACA,KAAK,aAAa,QAAQ,YAAY;AAAA,QACtC,KAAK,aAAa,QAAQ,YAAY;AAAA,QACtC,GAAI,WAAW,YAAY;AAAA,UACzB,cAAc,WAAW;AAAA,QAC3B;AAAA,QACA,GAAI,aAAa;AAAA,UACf,eAAe;AAAA,QACjB;AAAA,QACA,GAAI,QAAQ,EAAE,KAAK;AAAA,QACnB,GAAI,YAAY,EAAE,SAAS;AAAA,MAAA;AAAA,IAE/B;AAAA,IACA,CAAC,QAAQ,WAAW;AAAA,EAAA;AAGhB,QAAA,SAASC,MAAAA,QAAwC,MAAM;AACpD,WAAA;AAAA,MACL,OAAO,MAAM,QAAQ,IAAI,IACrB,KAAK,IAAI,CAAC,SAAS,WAAW,IAAI,CAAC,IACnC,CAAC,WAAW,CAAE,CAAA,CAAC;AAAA,IAAA;AAAA,EACrB,GACC,CAAC,MAAM,UAAU,CAAC;AAEd,SAAA;AACT;;"}
@@ -7,19 +7,11 @@ const registerTheme = require("../utils/registerTheme.cjs");
7
7
  const HvVizContext = react.createContext({
8
8
  theme: void 0
9
9
  });
10
- const HvVizProvider = ({
11
- children
12
- }) => {
13
- const {
14
- activeTheme,
15
- selectedMode,
16
- selectedTheme
17
- } = uikitReactCore.useTheme();
10
+ const HvVizProvider = ({ children }) => {
11
+ const { activeTheme, selectedMode, selectedTheme } = uikitReactCore.useTheme();
18
12
  const value = react.useMemo(() => {
19
13
  registerTheme.registerTheme(selectedTheme, selectedMode, activeTheme);
20
- return {
21
- theme: `${selectedTheme}-${selectedMode}`
22
- };
14
+ return { theme: `${selectedTheme}-${selectedMode}` };
23
15
  }, [selectedTheme, selectedMode, activeTheme]);
24
16
  return /* @__PURE__ */ jsxRuntime.jsx(HvVizContext.Provider, { value, children });
25
17
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Provider.cjs","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { createContext, useMemo } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { registerTheme } from \"@viz/utils\";\n\nexport interface HvVizContextValue {\n /**\n * Current theme\n */\n theme?: string;\n}\n\nexport const HvVizContext = createContext<HvVizContextValue>({\n theme: undefined,\n});\n\nexport interface HvVizProviderProps {\n /**\n * Component tree.\n */\n children?: React.ReactNode;\n}\n\n/**\n * Enables theming capabilities for visualizations.\n *\n * Without this provider the visualizations will not comply to the UI Kit themes.\n *\n * This provider should always be used in combination with the `HvProvider` from\n * the core package since the former uses the themes provided by the latter.\n *\n * `HvVizProvider` should always be used after `HvProvider` like so to work properly:\n *\n * ```\n * <HvProvider>\n * <HvVizProvider>\n * (...)\n * </HvVizProvider>\n * </HvProvider>\n * ```\n */\nexport const HvVizProvider = ({ children }: HvVizProviderProps) => {\n const { activeTheme, selectedMode, selectedTheme } = useTheme();\n\n const value = useMemo(() => {\n registerTheme(selectedTheme, selectedMode, activeTheme);\n\n return { theme: `${selectedTheme}-${selectedMode}` };\n }, [selectedTheme, selectedMode, activeTheme]);\n\n return (\n <HvVizContext.Provider value={value}>{children}</HvVizContext.Provider>\n );\n};\n"],"names":["HvVizContext","createContext","theme","undefined","HvVizProvider","children","activeTheme","selectedMode","selectedTheme","useTheme","value","useMemo","jsx"],"mappings":";;;;;;AAaO,MAAMA,eAAeC,MAAAA,cAAiC;AAAA,EAC3DC,OAAOC;AACT,CAAC;AA2BM,MAAMC,gBAAgBA,CAAC;AAAA,EAAEC;AAA6B,MAAM;AAC3D,QAAA;AAAA,IAAEC;AAAAA,IAAaC;AAAAA,IAAcC;AAAAA,MAAkBC,eAAS,SAAA;AAExDC,QAAAA,QAAQC,MAAAA,QAAQ,MAAM;AACZH,kBAAAA,cAAAA,eAAeD,cAAcD,WAAW;AAE/C,WAAA;AAAA,MAAEJ,OAAQ,GAAEM,aAAc,IAAGD,YAAa;AAAA,IAAA;AAAA,EAChD,GAAA,CAACC,eAAeD,cAAcD,WAAW,CAAC;AAE7C,SACGM,2BAAAA,IAAA,aAAa,UAAb,EAAsB,OAAeP,SAAS,CAAA;AAEnD;;;"}
1
+ {"version":3,"file":"Provider.cjs","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { createContext, useMemo } from \"react\";\n\nimport { useTheme } from \"@hitachivantara/uikit-react-core\";\n\nimport { registerTheme } from \"@viz/utils\";\n\nexport interface HvVizContextValue {\n /**\n * Current theme\n */\n theme?: string;\n}\n\nexport const HvVizContext = createContext<HvVizContextValue>({\n theme: undefined,\n});\n\nexport interface HvVizProviderProps {\n /**\n * Component tree.\n */\n children?: React.ReactNode;\n}\n\n/**\n * Enables theming capabilities for visualizations.\n *\n * Without this provider the visualizations will not comply to the UI Kit themes.\n *\n * This provider should always be used in combination with the `HvProvider` from\n * the core package since the former uses the themes provided by the latter.\n *\n * `HvVizProvider` should always be used after `HvProvider` like so to work properly:\n *\n * ```\n * <HvProvider>\n * <HvVizProvider>\n * (...)\n * </HvVizProvider>\n * </HvProvider>\n * ```\n */\nexport const HvVizProvider = ({ children }: HvVizProviderProps) => {\n const { activeTheme, selectedMode, selectedTheme } = useTheme();\n\n const value = useMemo(() => {\n registerTheme(selectedTheme, selectedMode, activeTheme);\n\n return { theme: `${selectedTheme}-${selectedMode}` };\n }, [selectedTheme, selectedMode, activeTheme]);\n\n return (\n <HvVizContext.Provider value={value}>{children}</HvVizContext.Provider>\n );\n};\n"],"names":["createContext","useTheme","useMemo","registerTheme","jsx"],"mappings":";;;;;;AAaO,MAAM,eAAeA,MAAAA,cAAiC;AAAA,EAC3D,OAAO;AACT,CAAC;AA2BM,MAAM,gBAAgB,CAAC,EAAE,eAAmC;AACjE,QAAM,EAAE,aAAa,cAAc,kBAAkBC,eAAS,SAAA;AAExD,QAAA,QAAQC,MAAAA,QAAQ,MAAM;AACZC,kBAAAA,cAAA,eAAe,cAAc,WAAW;AAEtD,WAAO,EAAE,OAAO,GAAG,aAAa,IAAI,YAAY;EAC/C,GAAA,CAAC,eAAe,cAAc,WAAW,CAAC;AAE7C,SACGC,2BAAAA,IAAA,aAAa,UAAb,EAAsB,OAAe,SAAS,CAAA;AAEnD;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"getAgFunc.cjs","sources":["../../../src/utils/getAgFunc.ts"],"sourcesContent":["import { HvChartAggregation } from \"@viz/types\";\n\nexport const getAgFunc = (func: HvChartAggregation, field: string) =>\n func === \"count\" ? \"count()\" : `${func}(d[\"${field}\"])`;\n"],"names":["getAgFunc","func","field"],"mappings":";;AAEaA,MAAAA,YAAYA,CAACC,MAA0BC,UAClDD,SAAS,UAAU,YAAa,GAAEA,IAAK,OAAMC,KAAM;;"}
1
+ {"version":3,"file":"getAgFunc.cjs","sources":["../../../src/utils/getAgFunc.ts"],"sourcesContent":["import { HvChartAggregation } from \"@viz/types\";\n\nexport const getAgFunc = (func: HvChartAggregation, field: string) =>\n func === \"count\" ? \"count()\" : `${func}(d[\"${field}\"])`;\n"],"names":[],"mappings":";;AAEa,MAAA,YAAY,CAAC,MAA0B,UAClD,SAAS,UAAU,YAAY,GAAG,IAAI,OAAO,KAAK;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"getAxisType.cjs","sources":["../../../src/utils/getAxisType.ts"],"sourcesContent":["import { HvChartAxisType } from \"@viz/types\";\n\nexport const getAxisType = (type?: HvChartAxisType) => {\n switch (type) {\n case \"categorical\":\n return \"category\";\n case \"time\":\n return \"time\";\n case \"continuous\":\n return \"value\";\n default:\n return undefined;\n }\n};\n"],"names":["getAxisType","type","undefined"],"mappings":";;AAEaA,MAAAA,cAAcA,CAACC,SAA2B;AACrD,UAAQA,MAAI;AAAA,IACV,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT;AACSC,aAAAA;AAAAA,EACX;AACF;;"}
1
+ {"version":3,"file":"getAxisType.cjs","sources":["../../../src/utils/getAxisType.ts"],"sourcesContent":["import { HvChartAxisType } from \"@viz/types\";\n\nexport const getAxisType = (type?: HvChartAxisType) => {\n switch (type) {\n case \"categorical\":\n return \"category\";\n case \"time\":\n return \"time\";\n case \"continuous\":\n return \"value\";\n default:\n return undefined;\n }\n};\n"],"names":[],"mappings":";;AAEa,MAAA,cAAc,CAAC,SAA2B;AACrD,UAAQ,MAAM;AAAA,IACZ,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT;AACS,aAAA;AAAA,EACX;AACF;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"getGroupKey.cjs","sources":["../../../src/utils/getGroupKey.ts"],"sourcesContent":["import { HvChartCommonProps } from \"@viz/types/common\";\n\nexport const getGroupKey = (groupBy: HvChartCommonProps[\"groupBy\"]) =>\n Array.isArray(groupBy) ? groupBy.join(\"_\") : groupBy;\n"],"names":["getGroupKey","groupBy","Array","isArray","join"],"mappings":";;AAEaA,MAAAA,cAAcA,CAACC,YAC1BC,MAAMC,QAAQF,OAAO,IAAIA,QAAQG,KAAK,GAAG,IAAIH;;"}
1
+ {"version":3,"file":"getGroupKey.cjs","sources":["../../../src/utils/getGroupKey.ts"],"sourcesContent":["import { HvChartCommonProps } from \"@viz/types/common\";\n\nexport const getGroupKey = (groupBy: HvChartCommonProps[\"groupBy\"]) =>\n Array.isArray(groupBy) ? groupBy.join(\"_\") : groupBy;\n"],"names":[],"mappings":";;AAEa,MAAA,cAAc,CAAC,YAC1B,MAAM,QAAQ,OAAO,IAAI,QAAQ,KAAK,GAAG,IAAI;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"getLegendIcon.cjs","sources":["../../../src/utils/getLegendIcon.ts"],"sourcesContent":["import { HvChartLegendIcon } from \"@viz/types/legend\";\n\nexport const getLegendIcon = (icon: HvChartLegendIcon) => {\n switch (icon) {\n case \"square\":\n return \"path://M0,0L16,0L16,16L0,16L0,0Z\";\n case \"line\":\n default:\n return \"path://M0,0L16,0L16,2L0,2Z\";\n }\n};\n"],"names":["getLegendIcon","icon"],"mappings":";;AAEaA,MAAAA,gBAAgBA,CAACC,SAA4B;AACxD,UAAQA,MAAI;AAAA,IACV,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AAAA,IACL;AACS,aAAA;AAAA,EACX;AACF;;"}
1
+ {"version":3,"file":"getLegendIcon.cjs","sources":["../../../src/utils/getLegendIcon.ts"],"sourcesContent":["import { HvChartLegendIcon } from \"@viz/types/legend\";\n\nexport const getLegendIcon = (icon: HvChartLegendIcon) => {\n switch (icon) {\n case \"square\":\n return \"path://M0,0L16,0L16,16L0,16L0,0Z\";\n case \"line\":\n default:\n return \"path://M0,0L16,0L16,2L0,2Z\";\n }\n};\n"],"names":[],"mappings":";;AAEa,MAAA,gBAAgB,CAAC,SAA4B;AACxD,UAAQ,MAAM;AAAA,IACZ,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AAAA,IACL;AACS,aAAA;AAAA,EACX;AACF;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"getMeasure.cjs","sources":["../../../src/utils/getMeasure.ts"],"sourcesContent":["import { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n HvBarChartMeasures,\n HvDonutChartMeasure,\n HvLineChartMeasures,\n} from \"@viz/types\";\n\nexport const getMeasure = (\n name: string,\n msr: Arrayable<HvLineChartMeasures | HvBarChartMeasures> | HvDonutChartMeasure\n): HvLineChartMeasures | HvBarChartMeasures | HvDonutChartMeasure => {\n const measureName = name.split(\"_\")[0];\n const measuresArray = Array.isArray(msr) ? msr : [msr];\n // find the measure in measures array or return the first one\n return (\n measuresArray.find((m) => {\n if (typeof m === \"string\") {\n return m === measureName;\n }\n return m.field === measureName;\n }) ?? measuresArray[0]\n );\n};\n"],"names":["getMeasure","name","msr","measureName","split","measuresArray","Array","isArray","find","m","field"],"mappings":";;AAQaA,MAAAA,aAAaA,CACxBC,MACAC,QACmE;AACnE,QAAMC,cAAcF,KAAKG,MAAM,GAAG,EAAE,CAAC;AACrC,QAAMC,gBAAgBC,MAAMC,QAAQL,GAAG,IAAIA,MAAM,CAACA,GAAG;AAGnDG,SAAAA,cAAcG,KAAMC,CAAM,MAAA;AACpB,QAAA,OAAOA,MAAM,UAAU;AACzB,aAAOA,MAAMN;AAAAA,IACf;AACA,WAAOM,EAAEC,UAAUP;AAAAA,EAAAA,CACpB,KAAKE,cAAc,CAAC;AAEzB;;"}
1
+ {"version":3,"file":"getMeasure.cjs","sources":["../../../src/utils/getMeasure.ts"],"sourcesContent":["import { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n HvBarChartMeasures,\n HvDonutChartMeasure,\n HvLineChartMeasures,\n} from \"@viz/types\";\n\nexport const getMeasure = (\n name: string,\n msr: Arrayable<HvLineChartMeasures | HvBarChartMeasures> | HvDonutChartMeasure\n): HvLineChartMeasures | HvBarChartMeasures | HvDonutChartMeasure => {\n const measureName = name.split(\"_\")[0];\n const measuresArray = Array.isArray(msr) ? msr : [msr];\n // find the measure in measures array or return the first one\n return (\n measuresArray.find((m) => {\n if (typeof m === \"string\") {\n return m === measureName;\n }\n return m.field === measureName;\n }) ?? measuresArray[0]\n );\n};\n"],"names":[],"mappings":";;AAQa,MAAA,aAAa,CACxB,MACA,QACmE;AACnE,QAAM,cAAc,KAAK,MAAM,GAAG,EAAE,CAAC;AACrC,QAAM,gBAAgB,MAAM,QAAQ,GAAG,IAAI,MAAM,CAAC,GAAG;AAGnD,SAAA,cAAc,KAAK,CAAC,MAAM;AACpB,QAAA,OAAO,MAAM,UAAU;AACzB,aAAO,MAAM;AAAA,IACf;AACA,WAAO,EAAE,UAAU;AAAA,EAAA,CACpB,KAAK,cAAc,CAAC;AAEzB;;"}
@@ -58,7 +58,20 @@ const registerTheme = (name, mode, themeStructure) => {
58
58
  }
59
59
  };
60
60
  echarts__namespace.registerTheme(`${name}-${mode}`, {
61
- color: [themeStructure?.colors.modes[mode].cat1, themeStructure?.colors.modes[mode].cat2, themeStructure?.colors.modes[mode].cat3, themeStructure?.colors.modes[mode].cat4, themeStructure?.colors.modes[mode].cat5, themeStructure?.colors.modes[mode].cat6, themeStructure?.colors.modes[mode].cat7, themeStructure?.colors.modes[mode].cat8, themeStructure?.colors.modes[mode].cat9, themeStructure?.colors.modes[mode].cat10, themeStructure?.colors.modes[mode].cat11, themeStructure?.colors.modes[mode].cat12],
61
+ color: [
62
+ themeStructure?.colors.modes[mode].cat1,
63
+ themeStructure?.colors.modes[mode].cat2,
64
+ themeStructure?.colors.modes[mode].cat3,
65
+ themeStructure?.colors.modes[mode].cat4,
66
+ themeStructure?.colors.modes[mode].cat5,
67
+ themeStructure?.colors.modes[mode].cat6,
68
+ themeStructure?.colors.modes[mode].cat7,
69
+ themeStructure?.colors.modes[mode].cat8,
70
+ themeStructure?.colors.modes[mode].cat9,
71
+ themeStructure?.colors.modes[mode].cat10,
72
+ themeStructure?.colors.modes[mode].cat11,
73
+ themeStructure?.colors.modes[mode].cat12
74
+ ],
62
75
  legend: {
63
76
  textStyle: {
64
77
  ...baseText
@@ -78,9 +91,7 @@ const registerTheme = (name, mode, themeStructure) => {
78
91
  }
79
92
  },
80
93
  dataZoom: {
81
- textStyle: {
82
- ...baseText
83
- }
94
+ textStyle: { ...baseText }
84
95
  },
85
96
  categoryAxis: {
86
97
  ...customAxis
@@ -1 +1 @@
1
- {"version":3,"file":"registerTheme.cjs","sources":["../../../src/utils/registerTheme.ts"],"sourcesContent":["import { HvTheme } from \"@hitachivantara/uikit-react-core\";\nimport * as echarts from \"echarts/core\";\n\nexport const registerTheme = (\n name: string,\n mode: string,\n themeStructure?: HvTheme\n) => {\n const baseText = {\n color: themeStructure?.colors.modes[mode].secondary,\n fontWeight: themeStructure?.fontWeights.normal,\n fontSize: themeStructure?.fontSizes.sm,\n fontFamily: themeStructure?.fontFamily.body,\n };\n\n const customAxis = {\n nameTextStyle: {\n ...baseText,\n color: themeStructure?.colors.modes[mode].secondary_80,\n },\n axisLine: {\n show: true,\n lineStyle: {\n color: themeStructure?.colors.modes[mode].atmo3,\n },\n },\n axisTick: {\n show: true,\n lineStyle: {\n color: themeStructure?.colors.modes[mode].atmo3,\n },\n },\n axisLabel: {\n color: themeStructure?.colors.modes[mode].secondary_80,\n fontWeight: themeStructure?.fontWeights.normal,\n fontSize: themeStructure?.fontSizes.sm,\n fontFamily: themeStructure?.fontFamily.body,\n },\n splitLine: {\n show: true,\n lineStyle: {\n color: themeStructure?.colors.modes[mode].atmo3,\n },\n },\n };\n\n echarts.registerTheme(`${name}-${mode}`, {\n color: [\n themeStructure?.colors.modes[mode].cat1,\n themeStructure?.colors.modes[mode].cat2,\n themeStructure?.colors.modes[mode].cat3,\n themeStructure?.colors.modes[mode].cat4,\n themeStructure?.colors.modes[mode].cat5,\n themeStructure?.colors.modes[mode].cat6,\n themeStructure?.colors.modes[mode].cat7,\n themeStructure?.colors.modes[mode].cat8,\n themeStructure?.colors.modes[mode].cat9,\n themeStructure?.colors.modes[mode].cat10,\n themeStructure?.colors.modes[mode].cat11,\n themeStructure?.colors.modes[mode].cat12,\n ],\n legend: {\n textStyle: {\n ...baseText,\n },\n },\n tooltip: {\n borderWidth: 0,\n padding: 0,\n textStyle: {\n ...baseText,\n },\n axisPointer: {\n lineStyle: {\n color: themeStructure?.colors.modes[mode].secondary,\n width: 1,\n },\n },\n },\n dataZoom: {\n textStyle: { ...baseText },\n },\n categoryAxis: {\n ...customAxis,\n },\n valueAxis: {\n ...customAxis,\n },\n logAxis: {\n ...customAxis,\n },\n timeAxis: {\n ...customAxis,\n },\n line: {\n lineStyle: {\n width: 2,\n },\n },\n visualMap: {\n textStyle: {\n ...baseText,\n },\n },\n heatmap: {\n label: {\n fontWeight: baseText.fontWeight,\n fontSize: baseText.fontSize,\n fontFamily: baseText.fontFamily,\n },\n itemStyle: {\n borderColor: themeStructure?.colors.modes[mode].atmo3,\n borderWidth: 1,\n },\n },\n });\n};\n"],"names":["registerTheme","name","mode","themeStructure","baseText","color","colors","modes","secondary","fontWeight","fontWeights","normal","fontSize","fontSizes","sm","fontFamily","body","customAxis","nameTextStyle","secondary_80","axisLine","show","lineStyle","atmo3","axisTick","axisLabel","splitLine","echarts","cat1","cat2","cat3","cat4","cat5","cat6","cat7","cat8","cat9","cat10","cat11","cat12","legend","textStyle","tooltip","borderWidth","padding","axisPointer","width","dataZoom","categoryAxis","valueAxis","logAxis","timeAxis","line","visualMap","heatmap","label","itemStyle","borderColor"],"mappings":"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"}
1
+ {"version":3,"file":"registerTheme.cjs","sources":["../../../src/utils/registerTheme.ts"],"sourcesContent":["import { HvTheme } from \"@hitachivantara/uikit-react-core\";\nimport * as echarts from \"echarts/core\";\n\nexport const registerTheme = (\n name: string,\n mode: string,\n themeStructure?: HvTheme\n) => {\n const baseText = {\n color: themeStructure?.colors.modes[mode].secondary,\n fontWeight: themeStructure?.fontWeights.normal,\n fontSize: themeStructure?.fontSizes.sm,\n fontFamily: themeStructure?.fontFamily.body,\n };\n\n const customAxis = {\n nameTextStyle: {\n ...baseText,\n color: themeStructure?.colors.modes[mode].secondary_80,\n },\n axisLine: {\n show: true,\n lineStyle: {\n color: themeStructure?.colors.modes[mode].atmo3,\n },\n },\n axisTick: {\n show: true,\n lineStyle: {\n color: themeStructure?.colors.modes[mode].atmo3,\n },\n },\n axisLabel: {\n color: themeStructure?.colors.modes[mode].secondary_80,\n fontWeight: themeStructure?.fontWeights.normal,\n fontSize: themeStructure?.fontSizes.sm,\n fontFamily: themeStructure?.fontFamily.body,\n },\n splitLine: {\n show: true,\n lineStyle: {\n color: themeStructure?.colors.modes[mode].atmo3,\n },\n },\n };\n\n echarts.registerTheme(`${name}-${mode}`, {\n color: [\n themeStructure?.colors.modes[mode].cat1,\n themeStructure?.colors.modes[mode].cat2,\n themeStructure?.colors.modes[mode].cat3,\n themeStructure?.colors.modes[mode].cat4,\n themeStructure?.colors.modes[mode].cat5,\n themeStructure?.colors.modes[mode].cat6,\n themeStructure?.colors.modes[mode].cat7,\n themeStructure?.colors.modes[mode].cat8,\n themeStructure?.colors.modes[mode].cat9,\n themeStructure?.colors.modes[mode].cat10,\n themeStructure?.colors.modes[mode].cat11,\n themeStructure?.colors.modes[mode].cat12,\n ],\n legend: {\n textStyle: {\n ...baseText,\n },\n },\n tooltip: {\n borderWidth: 0,\n padding: 0,\n textStyle: {\n ...baseText,\n },\n axisPointer: {\n lineStyle: {\n color: themeStructure?.colors.modes[mode].secondary,\n width: 1,\n },\n },\n },\n dataZoom: {\n textStyle: { ...baseText },\n },\n categoryAxis: {\n ...customAxis,\n },\n valueAxis: {\n ...customAxis,\n },\n logAxis: {\n ...customAxis,\n },\n timeAxis: {\n ...customAxis,\n },\n line: {\n lineStyle: {\n width: 2,\n },\n },\n visualMap: {\n textStyle: {\n ...baseText,\n },\n },\n heatmap: {\n label: {\n fontWeight: baseText.fontWeight,\n fontSize: baseText.fontSize,\n fontFamily: baseText.fontFamily,\n },\n itemStyle: {\n borderColor: themeStructure?.colors.modes[mode].atmo3,\n borderWidth: 1,\n },\n },\n });\n};\n"],"names":["echarts"],"mappings":"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"}
@@ -14,86 +14,88 @@ import { useLegend } from "../../hooks/useLegend.js";
14
14
  import { useOption } from "../../hooks/useOption.js";
15
15
  import { useTooltip } from "../../hooks/tooltip/useTooltip.js";
16
16
  import { HvBaseChart } from "../BaseChart/BaseChart.js";
17
- echarts.use([BarChart, DatasetComponent, GridComponent, TooltipComponent, LegendComponent, DataZoomSliderComponent, DataZoomInsideComponent]);
18
- const HvBarChart = forwardRef((props, ref) => {
19
- const {
20
- yAxis,
21
- xAxis,
22
- horizontal = false,
23
- horizontalRangeSlider,
24
- grid,
25
- data,
26
- groupBy,
27
- splitBy,
28
- sortBy,
29
- stack,
30
- seriesNameFormatter,
31
- measures,
32
- legend,
33
- tooltip,
34
- classes,
35
- height,
36
- width,
37
- onOptionChange
38
- } = props;
39
- const chartData = useData({
40
- data,
41
- groupBy,
42
- sortBy,
43
- splitBy,
44
- measures
45
- });
46
- const chartDataset = useDataset(chartData);
47
- const chartYAxis = useYAxis({
48
- axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],
49
- defaultType: horizontal ? "categorical" : "continuous"
50
- });
51
- const chartXAxis = useXAxis({
52
- type: horizontal ? "continuous" : "categorical",
53
- ...xAxis
54
- });
55
- const chartSlider = useDataZoom({
56
- showHorizontal: horizontalRangeSlider?.show
57
- });
58
- const chartGrid = useGrid({
59
- ...grid
60
- });
61
- const chartSeries = useSeries({
62
- type: "bar",
63
- data: chartData,
64
- groupBy,
65
- measures,
66
- stack,
67
- nameFormatter: seriesNameFormatter,
68
- horizontal
69
- });
70
- const chartLegend = useLegend({
71
- ...legend,
72
- series: chartSeries.series,
73
- icon: "square"
74
- });
75
- const chartTooltip = useTooltip({
76
- ...tooltip,
77
- trigger: "axis",
78
- measures,
79
- classes,
80
- horizontal
81
- });
82
- const option = useOption({
83
- option: {
84
- ...chartYAxis,
85
- ...chartXAxis,
86
- ...chartSlider,
87
- ...chartGrid,
88
- ...chartDataset,
89
- ...chartSeries,
90
- ...chartLegend,
91
- ...chartTooltip
92
- },
93
- onOptionChange
94
- });
95
- return /* @__PURE__ */ jsx(HvBaseChart, { ref, option, width, height });
96
- });
17
+ echarts.use([
18
+ BarChart,
19
+ DatasetComponent,
20
+ GridComponent,
21
+ TooltipComponent,
22
+ LegendComponent,
23
+ DataZoomSliderComponent,
24
+ DataZoomInsideComponent
25
+ ]);
26
+ const HvBarChart = forwardRef(
27
+ (props, ref) => {
28
+ const {
29
+ yAxis,
30
+ xAxis,
31
+ horizontal = false,
32
+ horizontalRangeSlider,
33
+ grid,
34
+ data,
35
+ groupBy,
36
+ splitBy,
37
+ sortBy,
38
+ stack,
39
+ seriesNameFormatter,
40
+ measures,
41
+ legend,
42
+ tooltip,
43
+ classes,
44
+ height,
45
+ width,
46
+ onOptionChange
47
+ } = props;
48
+ const chartData = useData({ data, groupBy, sortBy, splitBy, measures });
49
+ const chartDataset = useDataset(chartData);
50
+ const chartYAxis = useYAxis({
51
+ axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],
52
+ defaultType: horizontal ? "categorical" : "continuous"
53
+ });
54
+ const chartXAxis = useXAxis({
55
+ type: horizontal ? "continuous" : "categorical",
56
+ ...xAxis
57
+ });
58
+ const chartSlider = useDataZoom({
59
+ showHorizontal: horizontalRangeSlider?.show
60
+ });
61
+ const chartGrid = useGrid({ ...grid });
62
+ const chartSeries = useSeries({
63
+ type: "bar",
64
+ data: chartData,
65
+ groupBy,
66
+ measures,
67
+ stack,
68
+ nameFormatter: seriesNameFormatter,
69
+ horizontal
70
+ });
71
+ const chartLegend = useLegend({
72
+ ...legend,
73
+ series: chartSeries.series,
74
+ icon: "square"
75
+ });
76
+ const chartTooltip = useTooltip({
77
+ ...tooltip,
78
+ trigger: "axis",
79
+ measures,
80
+ classes,
81
+ horizontal
82
+ });
83
+ const option = useOption({
84
+ option: {
85
+ ...chartYAxis,
86
+ ...chartXAxis,
87
+ ...chartSlider,
88
+ ...chartGrid,
89
+ ...chartDataset,
90
+ ...chartSeries,
91
+ ...chartLegend,
92
+ ...chartTooltip
93
+ },
94
+ onOptionChange
95
+ });
96
+ return /* @__PURE__ */ jsx(HvBaseChart, { ref, option, width, height });
97
+ }
98
+ );
97
99
  export {
98
100
  HvBarChart
99
101
  };
@@ -1 +1 @@
1
- {"version":3,"file":"BarChart.js","sources":["../../../../src/components/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useXAxis,\n useYAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n useOption,\n HvChartTooltipClasses,\n} from \"@viz/hooks\";\n\nimport { HvBarChartMeasures } from \"../../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../../types/common\";\n\n// Register chart components\necharts.use([\n BarChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvBarChartMeasures>;\n /** Whether the bar chart should be horizontal. Defaults to `false`. */\n horizontal?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n (props, ref) => {\n const {\n yAxis,\n xAxis,\n horizontal = false,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n stack,\n seriesNameFormatter,\n measures,\n legend,\n tooltip,\n classes,\n height,\n width,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n defaultType: horizontal ? \"categorical\" : \"continuous\",\n });\n\n const chartXAxis = useXAxis({\n type: horizontal ? \"continuous\" : \"categorical\",\n ...xAxis,\n });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"bar\",\n data: chartData,\n groupBy,\n measures,\n stack,\n nameFormatter: seriesNameFormatter,\n horizontal,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n icon: \"square\",\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n horizontal,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":["echarts","use","BarChart","DatasetComponent","GridComponent","TooltipComponent","LegendComponent","DataZoomSliderComponent","DataZoomInsideComponent","HvBarChart","forwardRef","props","ref","yAxis","xAxis","horizontal","horizontalRangeSlider","grid","data","groupBy","splitBy","sortBy","stack","seriesNameFormatter","measures","legend","tooltip","classes","height","width","onOptionChange","chartData","useData","chartDataset","useDataset","chartYAxis","useYAxis","axes","Array","isArray","defaultType","chartXAxis","useXAxis","type","chartSlider","useDataZoom","showHorizontal","show","chartGrid","useGrid","chartSeries","useSeries","nameFormatter","chartLegend","useLegend","series","icon","chartTooltip","useTooltip","trigger","option","useOption"],"mappings":";;;;;;;;;;;;;;;;AAmCAA,QAAQC,IAAI,CACVC,UACAC,kBACAC,eACAC,kBACAC,iBACAC,yBACAC,uBAAuB,CACxB;AAkBM,MAAMC,aAAaC,WACxB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC,aAAa;AAAA,IACbC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EACEnB,IAAAA;AAEJ,QAAMoB,YAAYC,QAAQ;AAAA,IAAEd;AAAAA,IAAMC;AAAAA,IAASE;AAAAA,IAAQD;AAAAA,IAASI;AAAAA,EAAAA,CAAU;AAEhES,QAAAA,eAAeC,WAAWH,SAAS;AAEzC,QAAMI,aAAaC,SAAS;AAAA,IAC1BC,MAAMC,MAAMC,QAAQ1B,KAAK,KAAKA,SAAS,OAAOA,QAAQ,CAACA,KAAK;AAAA,IAC5D2B,aAAazB,aAAa,gBAAgB;AAAA,EAAA,CAC3C;AAED,QAAM0B,aAAaC,SAAS;AAAA,IAC1BC,MAAM5B,aAAa,eAAe;AAAA,IAClC,GAAGD;AAAAA,EAAAA,CACJ;AAED,QAAM8B,cAAcC,YAAY;AAAA,IAC9BC,gBAAgB9B,uBAAuB+B;AAAAA,EAAAA,CACxC;AAED,QAAMC,YAAYC,QAAQ;AAAA,IAAE,GAAGhC;AAAAA,EAAAA,CAAM;AAErC,QAAMiC,cAAcC,UAAU;AAAA,IAC5BR,MAAM;AAAA,IACNzB,MAAMa;AAAAA,IACNZ;AAAAA,IACAK;AAAAA,IACAF;AAAAA,IACA8B,eAAe7B;AAAAA,IACfR;AAAAA,EAAAA,CACD;AAED,QAAMsC,cAAcC,UAAU;AAAA,IAC5B,GAAG7B;AAAAA,IACH8B,QAAQL,YAAYK;AAAAA,IACpBC,MAAM;AAAA,EAAA,CACP;AAED,QAAMC,eAAeC,WAAW;AAAA,IAC9B,GAAGhC;AAAAA,IACHiC,SAAS;AAAA,IACTnC;AAAAA,IACAG;AAAAA,IACAZ;AAAAA,EAAAA,CACD;AAED,QAAM6C,SAASC,UAAU;AAAA,IACvBD,QAAQ;AAAA,MACN,GAAGzB;AAAAA,MACH,GAAGM;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,MACH,GAAGf;AAAAA,MACH,GAAGiB;AAAAA,MACH,GAAGG;AAAAA,MACH,GAAGI;AAAAA,IACL;AAAA,IACA3B;AAAAA,EAAAA,CACD;AAED,SACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAkB,CAAA;AAE3E,CACF;"}
1
+ {"version":3,"file":"BarChart.js","sources":["../../../../src/components/BarChart/BarChart.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport * as echarts from \"echarts/core\";\nimport { BarChart } from \"echarts/charts\";\nimport {\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n} from \"echarts/components\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { Arrayable } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n useXAxis,\n useYAxis,\n useDataZoom,\n useGrid,\n useData,\n useDataset,\n useSeries,\n useLegend,\n useTooltip,\n useOption,\n HvChartTooltipClasses,\n} from \"@viz/hooks\";\n\nimport { HvBarChartMeasures } from \"../../types\";\nimport { HvBaseChart } from \"../BaseChart\";\nimport { HvAxisChartCommonProps, HvChartCommonProps } from \"../../types/common\";\n\n// Register chart components\necharts.use([\n BarChart,\n DatasetComponent,\n GridComponent,\n TooltipComponent,\n LegendComponent,\n DataZoomSliderComponent,\n DataZoomInsideComponent,\n]);\n\nexport interface HvBarChartClasses extends HvChartTooltipClasses {}\n\nexport interface HvBarChartProps\n extends HvAxisChartCommonProps,\n HvChartCommonProps {\n /** Columns to measure on the chart. */\n measures: Arrayable<HvBarChartMeasures>;\n /** Whether the bar chart should be horizontal. Defaults to `false`. */\n horizontal?: boolean;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvBarChartClasses;\n}\n\n/**\n * A bar chart is a chart or graph that presents categorical data with rectangular bars.\n */\nexport const HvBarChart = forwardRef<ReactECharts, HvBarChartProps>(\n (props, ref) => {\n const {\n yAxis,\n xAxis,\n horizontal = false,\n horizontalRangeSlider,\n grid,\n data,\n groupBy,\n splitBy,\n sortBy,\n stack,\n seriesNameFormatter,\n measures,\n legend,\n tooltip,\n classes,\n height,\n width,\n onOptionChange,\n } = props;\n\n const chartData = useData({ data, groupBy, sortBy, splitBy, measures });\n\n const chartDataset = useDataset(chartData);\n\n const chartYAxis = useYAxis({\n axes: Array.isArray(yAxis) || yAxis == null ? yAxis : [yAxis],\n defaultType: horizontal ? \"categorical\" : \"continuous\",\n });\n\n const chartXAxis = useXAxis({\n type: horizontal ? \"continuous\" : \"categorical\",\n ...xAxis,\n });\n\n const chartSlider = useDataZoom({\n showHorizontal: horizontalRangeSlider?.show,\n });\n\n const chartGrid = useGrid({ ...grid });\n\n const chartSeries = useSeries({\n type: \"bar\",\n data: chartData,\n groupBy,\n measures,\n stack,\n nameFormatter: seriesNameFormatter,\n horizontal,\n });\n\n const chartLegend = useLegend({\n ...legend,\n series: chartSeries.series,\n icon: \"square\",\n });\n\n const chartTooltip = useTooltip({\n ...tooltip,\n trigger: \"axis\",\n measures,\n classes,\n horizontal,\n });\n\n const option = useOption({\n option: {\n ...chartYAxis,\n ...chartXAxis,\n ...chartSlider,\n ...chartGrid,\n ...chartDataset,\n ...chartSeries,\n ...chartLegend,\n ...chartTooltip,\n },\n onOptionChange,\n });\n\n return (\n <HvBaseChart ref={ref} option={option} width={width} height={height} />\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAmCA,QAAQ,IAAI;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAkBM,MAAM,aAAa;AAAA,EACxB,CAAC,OAAO,QAAQ;AACR,UAAA;AAAA,MACJ;AAAA,MACA;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACE,IAAA;AAEE,UAAA,YAAY,QAAQ,EAAE,MAAM,SAAS,QAAQ,SAAS,UAAU;AAEhE,UAAA,eAAe,WAAW,SAAS;AAEzC,UAAM,aAAa,SAAS;AAAA,MAC1B,MAAM,MAAM,QAAQ,KAAK,KAAK,SAAS,OAAO,QAAQ,CAAC,KAAK;AAAA,MAC5D,aAAa,aAAa,gBAAgB;AAAA,IAAA,CAC3C;AAED,UAAM,aAAa,SAAS;AAAA,MAC1B,MAAM,aAAa,eAAe;AAAA,MAClC,GAAG;AAAA,IAAA,CACJ;AAED,UAAM,cAAc,YAAY;AAAA,MAC9B,gBAAgB,uBAAuB;AAAA,IAAA,CACxC;AAED,UAAM,YAAY,QAAQ,EAAE,GAAG,KAAM,CAAA;AAErC,UAAM,cAAc,UAAU;AAAA,MAC5B,MAAM;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA,MACf;AAAA,IAAA,CACD;AAED,UAAM,cAAc,UAAU;AAAA,MAC5B,GAAG;AAAA,MACH,QAAQ,YAAY;AAAA,MACpB,MAAM;AAAA,IAAA,CACP;AAED,UAAM,eAAe,WAAW;AAAA,MAC9B,GAAG;AAAA,MACH,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAED,UAAM,SAAS,UAAU;AAAA,MACvB,QAAQ;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,QACH,GAAG;AAAA,MACL;AAAA,MACA;AAAA,IAAA,CACD;AAED,WACG,oBAAA,aAAA,EAAY,KAAU,QAAgB,OAAc,OAAgB,CAAA;AAAA,EAEzE;AACF;"}
@@ -7,42 +7,48 @@ import * as echarts from "echarts/core";
7
7
  import ReactECharts from "echarts-for-react/lib/core";
8
8
  import { useVizTheme } from "../../hooks/useVizTheme.js";
9
9
  echarts.use([CanvasRenderer, AriaComponent]);
10
- const HvBaseChart = forwardRef((props, ref) => {
11
- const {
12
- option,
13
- width,
14
- height
15
- } = props;
16
- const {
17
- theme
18
- } = useVizTheme();
19
- const currentTheme = useRef(theme);
20
- const chartRef = useRef(null);
21
- const isMounted = useRef(false);
22
- const forkedRef = useForkRef(ref, chartRef);
23
- const [initialOption, setInitialOption] = useState(option);
24
- useEffect(() => {
25
- if (!isMounted.current) {
26
- isMounted.current = true;
27
- return;
28
- }
29
- if (theme !== currentTheme.current) {
30
- setInitialOption(option);
31
- currentTheme.current = theme;
32
- return;
33
- }
34
- const instance = chartRef.current?.getEchartsInstance();
35
- if (!instance)
36
- return;
37
- instance.setOption(option, {
38
- replaceMerge: ["xAxis", "yAxis", "series", "dataset"]
39
- });
40
- }, [theme, option]);
41
- return /* @__PURE__ */ jsx(ReactECharts, { ref: forkedRef, echarts, option: initialOption, theme, notMerge: true, style: {
42
- width: width || "100%",
43
- height: height || "100%"
44
- } });
45
- });
10
+ const HvBaseChart = forwardRef(
11
+ (props, ref) => {
12
+ const { option, width, height } = props;
13
+ const { theme } = useVizTheme();
14
+ const currentTheme = useRef(theme);
15
+ const chartRef = useRef(null);
16
+ const isMounted = useRef(false);
17
+ const forkedRef = useForkRef(ref, chartRef);
18
+ const [initialOption, setInitialOption] = useState(option);
19
+ useEffect(() => {
20
+ if (!isMounted.current) {
21
+ isMounted.current = true;
22
+ return;
23
+ }
24
+ if (theme !== currentTheme.current) {
25
+ setInitialOption(option);
26
+ currentTheme.current = theme;
27
+ return;
28
+ }
29
+ const instance = chartRef.current?.getEchartsInstance();
30
+ if (!instance)
31
+ return;
32
+ instance.setOption(option, {
33
+ replaceMerge: ["xAxis", "yAxis", "series", "dataset"]
34
+ });
35
+ }, [theme, option]);
36
+ return /* @__PURE__ */ jsx(
37
+ ReactECharts,
38
+ {
39
+ ref: forkedRef,
40
+ echarts,
41
+ option: initialOption,
42
+ theme,
43
+ notMerge: true,
44
+ style: {
45
+ width: width || "100%",
46
+ height: height || "100%"
47
+ }
48
+ }
49
+ );
50
+ }
51
+ );
46
52
  export {
47
53
  HvBaseChart
48
54
  };
@@ -1 +1 @@
1
- {"version":3,"file":"BaseChart.js","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, useState } from \"react\";\n\nimport { useForkRef } from \"@mui/material\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { useVizTheme } from \"@viz/hooks\";\nimport { HvEChartsOption } from \"@viz/types/common\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n /** ECharts option. */\n option: HvEChartsOption;\n /** Charts width. */\n width?: echarts.ResizeOpts[\"width\"];\n /** Charts height. */\n height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = forwardRef<ReactECharts, HvBaseChartProps>(\n (props, ref) => {\n const { option, width, height } = props;\n\n const { theme } = useVizTheme();\n\n const currentTheme = useRef<string | undefined>(theme);\n const chartRef = useRef<ReactECharts>(null);\n const isMounted = useRef<boolean>(false);\n\n const forkedRef = useForkRef<ReactECharts>(ref, chartRef);\n\n const [initialOption, setInitialOption] = useState<HvEChartsOption>(option);\n\n useEffect(() => {\n if (!isMounted.current) {\n isMounted.current = true;\n return;\n }\n\n // when the theme changes echarts destroys the chart and mounts it again\n // thus we need to reset the initial option\n if (theme !== currentTheme.current) {\n setInitialOption(option);\n currentTheme.current = theme;\n return;\n }\n\n const instance = chartRef.current?.getEchartsInstance();\n\n if (!instance) return;\n\n instance.setOption(option, {\n replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n });\n }, [theme, option]);\n\n return (\n <ReactECharts\n ref={forkedRef}\n echarts={echarts}\n option={initialOption}\n theme={theme}\n notMerge\n style={{\n width: width || \"100%\",\n height: height || \"100%\",\n }}\n />\n );\n }\n);\n"],"names":["echarts","use","CanvasRenderer","AriaComponent","HvBaseChart","forwardRef","props","ref","option","width","height","theme","useVizTheme","currentTheme","useRef","chartRef","isMounted","forkedRef","useForkRef","initialOption","setInitialOption","useState","useEffect","current","instance","getEchartsInstance","setOption","replaceMerge"],"mappings":";;;;;;;;AAaAA,QAAQC,IAAI,CAACC,gBAAgBC,aAAa,CAAC;AAcpC,MAAMC,cAAcC,WACzB,CAACC,OAAOC,QAAQ;AACR,QAAA;AAAA,IAAEC;AAAAA,IAAQC;AAAAA,IAAOC;AAAAA,EAAWJ,IAAAA;AAE5B,QAAA;AAAA,IAAEK;AAAAA,MAAUC,YAAY;AAExBC,QAAAA,eAAeC,OAA2BH,KAAK;AAC/CI,QAAAA,WAAWD,OAAqB,IAAI;AACpCE,QAAAA,YAAYF,OAAgB,KAAK;AAEjCG,QAAAA,YAAYC,WAAyBX,KAAKQ,QAAQ;AAExD,QAAM,CAACI,eAAeC,gBAAgB,IAAIC,SAA0Bb,MAAM;AAE1Ec,YAAU,MAAM;AACV,QAAA,CAACN,UAAUO,SAAS;AACtBP,gBAAUO,UAAU;AACpB;AAAA,IACF;AAIIZ,QAAAA,UAAUE,aAAaU,SAAS;AAClCH,uBAAiBZ,MAAM;AACvBK,mBAAaU,UAAUZ;AACvB;AAAA,IACF;AAEMa,UAAAA,WAAWT,SAASQ,SAASE,mBAAmB;AAEtD,QAAI,CAACD;AAAU;AAEfA,aAASE,UAAUlB,QAAQ;AAAA,MACzBmB,cAAc,CAAC,SAAS,SAAS,UAAU,SAAS;AAAA,IAAA,CACrD;AAAA,EAAA,GACA,CAAChB,OAAOH,MAAM,CAAC;AAGhB,SAAA,oBAAC,cACC,EAAA,KAAKS,WACL,SACA,QAAQE,eACR,OACA,UAAQ,MACR,OAAO;AAAA,IACLV,OAAOA,SAAS;AAAA,IAChBC,QAAQA,UAAU;AAAA,EAEpB,EAAA,CAAA;AAEN,CACF;"}
1
+ {"version":3,"file":"BaseChart.js","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, useState } from \"react\";\n\nimport { useForkRef } from \"@mui/material\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\nimport ReactECharts from \"echarts-for-react/lib/core\";\n\nimport { useVizTheme } from \"@viz/hooks\";\nimport { HvEChartsOption } from \"@viz/types/common\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n /** ECharts option. */\n option: HvEChartsOption;\n /** Charts width. */\n width?: echarts.ResizeOpts[\"width\"];\n /** Charts height. */\n height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = forwardRef<ReactECharts, HvBaseChartProps>(\n (props, ref) => {\n const { option, width, height } = props;\n\n const { theme } = useVizTheme();\n\n const currentTheme = useRef<string | undefined>(theme);\n const chartRef = useRef<ReactECharts>(null);\n const isMounted = useRef<boolean>(false);\n\n const forkedRef = useForkRef<ReactECharts>(ref, chartRef);\n\n const [initialOption, setInitialOption] = useState<HvEChartsOption>(option);\n\n useEffect(() => {\n if (!isMounted.current) {\n isMounted.current = true;\n return;\n }\n\n // when the theme changes echarts destroys the chart and mounts it again\n // thus we need to reset the initial option\n if (theme !== currentTheme.current) {\n setInitialOption(option);\n currentTheme.current = theme;\n return;\n }\n\n const instance = chartRef.current?.getEchartsInstance();\n\n if (!instance) return;\n\n instance.setOption(option, {\n replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n });\n }, [theme, option]);\n\n return (\n <ReactECharts\n ref={forkedRef}\n echarts={echarts}\n option={initialOption}\n theme={theme}\n notMerge\n style={{\n width: width || \"100%\",\n height: height || \"100%\",\n }}\n />\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;;AAaA,QAAQ,IAAI,CAAC,gBAAgB,aAAa,CAAC;AAcpC,MAAM,cAAc;AAAA,EACzB,CAAC,OAAO,QAAQ;AACd,UAAM,EAAE,QAAQ,OAAO,OAAA,IAAW;AAE5B,UAAA,EAAE,UAAU;AAEZ,UAAA,eAAe,OAA2B,KAAK;AAC/C,UAAA,WAAW,OAAqB,IAAI;AACpC,UAAA,YAAY,OAAgB,KAAK;AAEjC,UAAA,YAAY,WAAyB,KAAK,QAAQ;AAExD,UAAM,CAAC,eAAe,gBAAgB,IAAI,SAA0B,MAAM;AAE1E,cAAU,MAAM;AACV,UAAA,CAAC,UAAU,SAAS;AACtB,kBAAU,UAAU;AACpB;AAAA,MACF;AAII,UAAA,UAAU,aAAa,SAAS;AAClC,yBAAiB,MAAM;AACvB,qBAAa,UAAU;AACvB;AAAA,MACF;AAEM,YAAA,WAAW,SAAS,SAAS,mBAAmB;AAEtD,UAAI,CAAC;AAAU;AAEf,eAAS,UAAU,QAAQ;AAAA,QACzB,cAAc,CAAC,SAAS,SAAS,UAAU,SAAS;AAAA,MAAA,CACrD;AAAA,IAAA,GACA,CAAC,OAAO,MAAM,CAAC;AAGhB,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK;AAAA,QACL;AAAA,QACA,QAAQ;AAAA,QACR;AAAA,QACA,UAAQ;AAAA,QACR,OAAO;AAAA,UACL,OAAO,SAAS;AAAA,UAChB,QAAQ,UAAU;AAAA,QACpB;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}