@trackunit/react-chart-components 1.6.17 → 1.6.19

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.
package/index.cjs.js CHANGED
@@ -410,7 +410,10 @@ const DonutChart = ({ data, size = "full", loading, onClick, className, dataTest
410
410
  ],
411
411
  };
412
412
  }, [size, currentValue, showOthers, limitedData, limitedDataWithoutOthers, chartColor, hoveringItem?.id, unit]);
413
- return (jsxRuntime.jsxs("div", { className: cvaChartRoot$1({ className, legendPosition }), "data-testid": dataTestId, ref: containerRef, children: [jsxRuntime.jsx("div", { className: cvaChartContainer({ legendPosition }), children: jsxRuntime.jsx(Chart, { className: cvaChart({ legendPosition, size }), dataTestId: "pie-chart", onChartReady: handleChartReady, onClick: handleChartClick, onEvents: handleChartEvents, options: chartOptions, showLoading: loading, style: { width: "100%", height: "100%" } }) }), size === "full" && (jsxRuntime.jsx("div", { className: cvaLegend({ legendPosition }), "data-testid": "legend", children: limitedData.map((item, index) => (jsxRuntime.jsx(LegendItem, { className: "p-1.5 py-0.5", color: item.color ?? chartColor(index), count: item.value, dataTestId: `legend-${item.id}`, disabled: (item.value ?? 0) === 0, hideValue: hideLegendValues, label: item.name, onClick: onClick ? () => onClick(item) : undefined, onMouseEnter: () => handleLegendMouseEnter(item), onMouseLeave: handleLegendMouseLeave, selected: item.selected, unit: unit }, item.id))) }))] }));
413
+ if (loading) {
414
+ return jsxRuntime.jsx(reactComponents.Spinner, { centering: "centered", dataTestId: dataTestId ? `${dataTestId}-loading` : "donut-chart-loading" });
415
+ }
416
+ return (jsxRuntime.jsxs("div", { className: cvaChartRoot$1({ className, legendPosition }), "data-testid": dataTestId, ref: containerRef, children: [jsxRuntime.jsx("div", { className: cvaChartContainer({ legendPosition }), children: jsxRuntime.jsx(Chart, { className: cvaChart({ legendPosition, size }), dataTestId: dataTestId ? `chart-${dataTestId}` : undefined, onChartReady: handleChartReady, onClick: handleChartClick, onEvents: handleChartEvents, options: chartOptions, style: { width: "100%", height: "100%" } }) }), size === "full" && (jsxRuntime.jsx("div", { className: cvaLegend({ legendPosition }), "data-testid": "legend", children: limitedData.map((item, index) => (jsxRuntime.jsx(LegendItem, { className: "p-1.5 py-0.5", color: item.color ?? chartColor(index), count: item.value, dataTestId: `legend-${item.id}`, disabled: (item.value ?? 0) === 0, hideValue: hideLegendValues, label: item.name, onClick: onClick ? () => onClick(item) : undefined, onMouseEnter: () => handleLegendMouseEnter(item), onMouseLeave: handleLegendMouseLeave, selected: item.selected, unit: unit }, item.id))) }))] }));
414
417
  };
415
418
  const cvaChartRoot$1 = cssClassVarianceUtilities.cvaMerge(["flex", "w-full", "h-full", "gap-4"], {
416
419
  variants: {
package/index.esm.js CHANGED
@@ -389,7 +389,10 @@ const DonutChart = ({ data, size = "full", loading, onClick, className, dataTest
389
389
  ],
390
390
  };
391
391
  }, [size, currentValue, showOthers, limitedData, limitedDataWithoutOthers, chartColor, hoveringItem?.id, unit]);
392
- return (jsxs("div", { className: cvaChartRoot$1({ className, legendPosition }), "data-testid": dataTestId, ref: containerRef, children: [jsx("div", { className: cvaChartContainer({ legendPosition }), children: jsx(Chart, { className: cvaChart({ legendPosition, size }), dataTestId: "pie-chart", onChartReady: handleChartReady, onClick: handleChartClick, onEvents: handleChartEvents, options: chartOptions, showLoading: loading, style: { width: "100%", height: "100%" } }) }), size === "full" && (jsx("div", { className: cvaLegend({ legendPosition }), "data-testid": "legend", children: limitedData.map((item, index) => (jsx(LegendItem, { className: "p-1.5 py-0.5", color: item.color ?? chartColor(index), count: item.value, dataTestId: `legend-${item.id}`, disabled: (item.value ?? 0) === 0, hideValue: hideLegendValues, label: item.name, onClick: onClick ? () => onClick(item) : undefined, onMouseEnter: () => handleLegendMouseEnter(item), onMouseLeave: handleLegendMouseLeave, selected: item.selected, unit: unit }, item.id))) }))] }));
392
+ if (loading) {
393
+ return jsx(Spinner, { centering: "centered", dataTestId: dataTestId ? `${dataTestId}-loading` : "donut-chart-loading" });
394
+ }
395
+ return (jsxs("div", { className: cvaChartRoot$1({ className, legendPosition }), "data-testid": dataTestId, ref: containerRef, children: [jsx("div", { className: cvaChartContainer({ legendPosition }), children: jsx(Chart, { className: cvaChart({ legendPosition, size }), dataTestId: dataTestId ? `chart-${dataTestId}` : undefined, onChartReady: handleChartReady, onClick: handleChartClick, onEvents: handleChartEvents, options: chartOptions, style: { width: "100%", height: "100%" } }) }), size === "full" && (jsx("div", { className: cvaLegend({ legendPosition }), "data-testid": "legend", children: limitedData.map((item, index) => (jsx(LegendItem, { className: "p-1.5 py-0.5", color: item.color ?? chartColor(index), count: item.value, dataTestId: `legend-${item.id}`, disabled: (item.value ?? 0) === 0, hideValue: hideLegendValues, label: item.name, onClick: onClick ? () => onClick(item) : undefined, onMouseEnter: () => handleLegendMouseEnter(item), onMouseLeave: handleLegendMouseLeave, selected: item.selected, unit: unit }, item.id))) }))] }));
393
396
  };
394
397
  const cvaChartRoot$1 = cvaMerge(["flex", "w-full", "h-full", "gap-4"], {
395
398
  variants: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@trackunit/react-chart-components",
3
- "version": "1.6.17",
3
+ "version": "1.6.19",
4
4
  "repository": "https://github.com/Trackunit/manager",
5
5
  "license": "SEE LICENSE IN LICENSE.txt",
6
6
  "engines": {
@@ -9,13 +9,13 @@
9
9
  "dependencies": {
10
10
  "echarts": "5.6.0",
11
11
  "react": "19.0.0",
12
- "@trackunit/date-and-time-utils": "1.6.13",
13
- "@trackunit/react-date-and-time-hooks": "1.6.13",
14
- "@trackunit/ui-design-tokens": "1.6.14",
15
- "@trackunit/shared-utils": "1.8.13",
16
- "@trackunit/css-class-variance-utilities": "1.6.13",
17
- "@trackunit/react-components": "1.7.17",
18
- "@trackunit/react-test-setup": "1.3.13"
12
+ "@trackunit/date-and-time-utils": "1.6.14",
13
+ "@trackunit/react-date-and-time-hooks": "1.6.15",
14
+ "@trackunit/ui-design-tokens": "1.6.15",
15
+ "@trackunit/shared-utils": "1.8.14",
16
+ "@trackunit/css-class-variance-utilities": "1.6.14",
17
+ "@trackunit/react-components": "1.7.19",
18
+ "@trackunit/react-test-setup": "1.3.14"
19
19
  },
20
20
  "module": "./index.esm.js",
21
21
  "main": "./index.cjs.js",