@hitachivantara/uikit-react-viz 5.4.0 → 5.4.2
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.
|
@@ -47,10 +47,6 @@ const HvBaseChart = ({
|
|
|
47
47
|
animation: false,
|
|
48
48
|
...options
|
|
49
49
|
});
|
|
50
|
-
const [initialSize, setInitialSize] = react.useState(width != null || height != null ? {
|
|
51
|
-
width,
|
|
52
|
-
height
|
|
53
|
-
} : void 0);
|
|
54
50
|
react.useEffect(() => {
|
|
55
51
|
var _a;
|
|
56
52
|
if (!isMounted.current) {
|
|
@@ -65,37 +61,28 @@ const HvBaseChart = ({
|
|
|
65
61
|
animation: false,
|
|
66
62
|
...options
|
|
67
63
|
});
|
|
68
|
-
setInitialSize({
|
|
69
|
-
width,
|
|
70
|
-
height
|
|
71
|
-
});
|
|
72
64
|
currentTheme.current = theme;
|
|
73
65
|
return;
|
|
74
66
|
}
|
|
75
67
|
const instance = (_a = chartRef.current) == null ? void 0 : _a.getEchartsInstance();
|
|
76
68
|
if (!instance)
|
|
77
69
|
return;
|
|
78
|
-
if (width !== instance.getWidth() || height !== instance.getHeight()) {
|
|
79
|
-
instance.resize({
|
|
80
|
-
width,
|
|
81
|
-
height
|
|
82
|
-
});
|
|
83
|
-
}
|
|
84
70
|
instance.setOption({
|
|
85
71
|
...options
|
|
86
72
|
}, {
|
|
87
73
|
replaceMerge: ["xAxis", "yAxis", "series", "dataset"]
|
|
88
74
|
});
|
|
89
|
-
}, [theme, options
|
|
75
|
+
}, [theme, options]);
|
|
90
76
|
return /* @__PURE__ */ jsxRuntime.jsx(ReactECharts__default.default, {
|
|
91
77
|
ref: chartRef,
|
|
92
78
|
echarts: echarts__namespace,
|
|
93
79
|
option: initialOption,
|
|
94
80
|
theme,
|
|
95
81
|
notMerge: true,
|
|
96
|
-
...
|
|
82
|
+
...(width || height) && {
|
|
97
83
|
style: {
|
|
98
|
-
|
|
84
|
+
width,
|
|
85
|
+
height
|
|
99
86
|
}
|
|
100
87
|
}
|
|
101
88
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseChart.cjs","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\n\nimport ReactECharts from \"echarts-for-react/lib/core\";\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { useVizTheme } from \"@viz/hooks\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n options: EChartsOption;\n width?: echarts.ResizeOpts[\"width\"];\n height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = ({ options, width, height }: HvBaseChartProps) => {\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 [initialOption, setInitialOption] = useState<EChartsOption>({\n aria: {\n enabled: true,\n },\n animation: false,\n ...options,\n });\n
|
|
1
|
+
{"version":3,"file":"BaseChart.cjs","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\n\nimport ReactECharts from \"echarts-for-react/lib/core\";\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { useVizTheme } from \"@viz/hooks\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n options: EChartsOption;\n width?: echarts.ResizeOpts[\"width\"];\n height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = ({ options, width, height }: HvBaseChartProps) => {\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 [initialOption, setInitialOption] = useState<EChartsOption>({\n aria: {\n enabled: true,\n },\n animation: false,\n ...options,\n });\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({\n aria: {\n enabled: true,\n },\n animation: false,\n ...options,\n });\n currentTheme.current = theme;\n return;\n }\n\n const instance = chartRef.current?.getEchartsInstance();\n\n if (!instance) return;\n\n instance.setOption(\n {\n ...options,\n },\n {\n replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n }\n );\n }, [theme, options]);\n\n return (\n <ReactECharts\n ref={chartRef}\n echarts={echarts}\n option={initialOption}\n theme={theme}\n notMerge\n {...((width || height) && {\n style: { width, height },\n })}\n />\n );\n};\n"],"names":["echarts","use","CanvasRenderer","AriaComponent","HvBaseChart","options","width","height","theme","useVizTheme","currentTheme","useRef","chartRef","isMounted","initialOption","setInitialOption","useState","aria","enabled","animation","useEffect","current","instance","getEchartsInstance","setOption","replaceMerge","ReactECharts","ref","option","notMerge","style"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYAA,mBAAQC,IAAI,CAACC,0BAAgBC,WAAAA,aAAa,CAAC;AAWpC,MAAMC,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAASC;AAAAA,EAAOC;AAAyB,MAAM;AACrE,QAAA;AAAA,IAAEC;AAAAA,MAAUC,YAAY,YAAA;AAExBC,QAAAA,eAAeC,aAA2BH,KAAK;AAC/CI,QAAAA,WAAWD,aAAqB,IAAI;AACpCE,QAAAA,YAAYF,aAAgB,KAAK;AAEvC,QAAM,CAACG,eAAeC,gBAAgB,IAAIC,eAAwB;AAAA,IAChEC,MAAM;AAAA,MACJC,SAAS;AAAA,IACX;AAAA,IACAC,WAAW;AAAA,IACX,GAAGd;AAAAA,EAAAA,CACJ;AAEDe,QAAAA,UAAU,MAAM;;AACV,QAAA,CAACP,UAAUQ,SAAS;AACtBR,gBAAUQ,UAAU;AACpB;AAAA,IACF;AAIIb,QAAAA,UAAUE,aAAaW,SAAS;AACjB,uBAAA;AAAA,QACfJ,MAAM;AAAA,UACJC,SAAS;AAAA,QACX;AAAA,QACAC,WAAW;AAAA,QACX,GAAGd;AAAAA,MAAAA,CACJ;AACDK,mBAAaW,UAAUb;AACvB;AAAA,IACF;AAEMc,UAAAA,YAAWV,cAASS,YAATT,mBAAkBW;AAEnC,QAAI,CAACD;AAAU;AAEfA,aAASE,UACP;AAAA,MACE,GAAGnB;AAAAA,IAAAA,GAEL;AAAA,MACEoB,cAAc,CAAC,SAAS,SAAS,UAAU,SAAS;AAAA,IAAA,CAExD;AAAA,EAAA,GACC,CAACjB,OAAOH,OAAO,CAAC;AAEnB,wCACGqB,sBAAAA,SAAY;AAAA,IACXC,KAAKf;AAAAA,IAAAA,SACLZ;AAAAA,IACA4B,QAAQd;AAAAA,IACRN;AAAAA,IACAqB,UAAQ;AAAA,IAAA,IACFvB,SAASC,WAAW;AAAA,MACxBuB,OAAO;AAAA,QAAExB;AAAAA,QAAOC;AAAAA,MAAO;AAAA,IACzB;AAAA,EAAA,CACD;AAEL;;"}
|
|
@@ -24,10 +24,6 @@ const HvBaseChart = ({
|
|
|
24
24
|
animation: false,
|
|
25
25
|
...options
|
|
26
26
|
});
|
|
27
|
-
const [initialSize, setInitialSize] = useState(width != null || height != null ? {
|
|
28
|
-
width,
|
|
29
|
-
height
|
|
30
|
-
} : void 0);
|
|
31
27
|
useEffect(() => {
|
|
32
28
|
var _a;
|
|
33
29
|
if (!isMounted.current) {
|
|
@@ -42,37 +38,28 @@ const HvBaseChart = ({
|
|
|
42
38
|
animation: false,
|
|
43
39
|
...options
|
|
44
40
|
});
|
|
45
|
-
setInitialSize({
|
|
46
|
-
width,
|
|
47
|
-
height
|
|
48
|
-
});
|
|
49
41
|
currentTheme.current = theme;
|
|
50
42
|
return;
|
|
51
43
|
}
|
|
52
44
|
const instance = (_a = chartRef.current) == null ? void 0 : _a.getEchartsInstance();
|
|
53
45
|
if (!instance)
|
|
54
46
|
return;
|
|
55
|
-
if (width !== instance.getWidth() || height !== instance.getHeight()) {
|
|
56
|
-
instance.resize({
|
|
57
|
-
width,
|
|
58
|
-
height
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
47
|
instance.setOption({
|
|
62
48
|
...options
|
|
63
49
|
}, {
|
|
64
50
|
replaceMerge: ["xAxis", "yAxis", "series", "dataset"]
|
|
65
51
|
});
|
|
66
|
-
}, [theme, options
|
|
52
|
+
}, [theme, options]);
|
|
67
53
|
return /* @__PURE__ */ jsx(ReactECharts, {
|
|
68
54
|
ref: chartRef,
|
|
69
55
|
echarts,
|
|
70
56
|
option: initialOption,
|
|
71
57
|
theme,
|
|
72
58
|
notMerge: true,
|
|
73
|
-
...
|
|
59
|
+
...(width || height) && {
|
|
74
60
|
style: {
|
|
75
|
-
|
|
61
|
+
width,
|
|
62
|
+
height
|
|
76
63
|
}
|
|
77
64
|
}
|
|
78
65
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseChart.js","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\n\nimport ReactECharts from \"echarts-for-react/lib/core\";\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { useVizTheme } from \"@viz/hooks\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n options: EChartsOption;\n width?: echarts.ResizeOpts[\"width\"];\n height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = ({ options, width, height }: HvBaseChartProps) => {\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 [initialOption, setInitialOption] = useState<EChartsOption>({\n aria: {\n enabled: true,\n },\n animation: false,\n ...options,\n });\n
|
|
1
|
+
{"version":3,"file":"BaseChart.js","sources":["../../../../src/components/BaseChart/BaseChart.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\n\nimport { AriaComponent } from \"echarts/components\";\nimport { CanvasRenderer } from \"echarts/renderers\";\nimport * as echarts from \"echarts/core\";\n\nimport ReactECharts from \"echarts-for-react/lib/core\";\nimport type { EChartsOption } from \"echarts-for-react/lib/types\";\n\nimport { useVizTheme } from \"@viz/hooks\";\n\n// Register chart components\necharts.use([CanvasRenderer, AriaComponent]);\n\nexport interface HvBaseChartProps {\n options: EChartsOption;\n width?: echarts.ResizeOpts[\"width\"];\n height?: echarts.ResizeOpts[\"height\"];\n}\n\n/**\n * Base chart.\n */\nexport const HvBaseChart = ({ options, width, height }: HvBaseChartProps) => {\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 [initialOption, setInitialOption] = useState<EChartsOption>({\n aria: {\n enabled: true,\n },\n animation: false,\n ...options,\n });\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({\n aria: {\n enabled: true,\n },\n animation: false,\n ...options,\n });\n currentTheme.current = theme;\n return;\n }\n\n const instance = chartRef.current?.getEchartsInstance();\n\n if (!instance) return;\n\n instance.setOption(\n {\n ...options,\n },\n {\n replaceMerge: [\"xAxis\", \"yAxis\", \"series\", \"dataset\"],\n }\n );\n }, [theme, options]);\n\n return (\n <ReactECharts\n ref={chartRef}\n echarts={echarts}\n option={initialOption}\n theme={theme}\n notMerge\n {...((width || height) && {\n style: { width, height },\n })}\n />\n );\n};\n"],"names":["echarts","use","CanvasRenderer","AriaComponent","HvBaseChart","options","width","height","theme","useVizTheme","currentTheme","useRef","chartRef","isMounted","initialOption","setInitialOption","useState","aria","enabled","animation","useEffect","current","instance","getEchartsInstance","setOption","replaceMerge","ReactECharts","ref","option","notMerge","style"],"mappings":";;;;;;;AAYAA,QAAQC,IAAI,CAACC,gBAAgBC,aAAa,CAAC;AAWpC,MAAMC,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAASC;AAAAA,EAAOC;AAAyB,MAAM;AACrE,QAAA;AAAA,IAAEC;AAAAA,MAAUC,YAAY;AAExBC,QAAAA,eAAeC,OAA2BH,KAAK;AAC/CI,QAAAA,WAAWD,OAAqB,IAAI;AACpCE,QAAAA,YAAYF,OAAgB,KAAK;AAEvC,QAAM,CAACG,eAAeC,gBAAgB,IAAIC,SAAwB;AAAA,IAChEC,MAAM;AAAA,MACJC,SAAS;AAAA,IACX;AAAA,IACAC,WAAW;AAAA,IACX,GAAGd;AAAAA,EAAAA,CACJ;AAEDe,YAAU,MAAM;;AACV,QAAA,CAACP,UAAUQ,SAAS;AACtBR,gBAAUQ,UAAU;AACpB;AAAA,IACF;AAIIb,QAAAA,UAAUE,aAAaW,SAAS;AACjB,uBAAA;AAAA,QACfJ,MAAM;AAAA,UACJC,SAAS;AAAA,QACX;AAAA,QACAC,WAAW;AAAA,QACX,GAAGd;AAAAA,MAAAA,CACJ;AACDK,mBAAaW,UAAUb;AACvB;AAAA,IACF;AAEMc,UAAAA,YAAWV,cAASS,YAATT,mBAAkBW;AAEnC,QAAI,CAACD;AAAU;AAEfA,aAASE,UACP;AAAA,MACE,GAAGnB;AAAAA,IAAAA,GAEL;AAAA,MACEoB,cAAc,CAAC,SAAS,SAAS,UAAU,SAAS;AAAA,IAAA,CAExD;AAAA,EAAA,GACC,CAACjB,OAAOH,OAAO,CAAC;AAEnB,6BACGqB,cAAY;AAAA,IACXC,KAAKf;AAAAA,IACLZ;AAAAA,IACA4B,QAAQd;AAAAA,IACRN;AAAAA,IACAqB,UAAQ;AAAA,IAAA,IACFvB,SAASC,WAAW;AAAA,MACxBuB,OAAO;AAAA,QAAExB;AAAAA,QAAOC;AAAAA,MAAO;AAAA,IACzB;AAAA,EAAA,CACD;AAEL;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hitachivantara/uikit-react-viz",
|
|
3
|
-
"version": "5.4.
|
|
3
|
+
"version": "5.4.2",
|
|
4
4
|
"private": false,
|
|
5
5
|
"author": "Hitachi Vantara UI Kit Team",
|
|
6
6
|
"description": "Contributed React visualization components for the NEXT UI Kit.",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@emotion/css": "^11.11.0",
|
|
36
|
-
"@hitachivantara/uikit-react-core": "^5.26.
|
|
36
|
+
"@hitachivantara/uikit-react-core": "^5.26.2"
|
|
37
37
|
},
|
|
38
38
|
"files": [
|
|
39
39
|
"dist"
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"access": "public",
|
|
43
43
|
"directory": "package"
|
|
44
44
|
},
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "e3f4274547dc42cf6ace2a22267b63eba283e34a",
|
|
46
46
|
"main": "dist/cjs/index.cjs",
|
|
47
47
|
"exports": {
|
|
48
48
|
".": {
|