react-chartjs-2 - npm Package Compare versions

Comparing version 5.2.0 to 5.3.0

dist/index.js

 import React, { forwardRef, useRef, useEffect } from 'react';
 import { Chart as Chart$1, LineController, BarController, RadarController, DoughnutController, PolarAreaController, BubbleController, PieController, ScatterController } from 'chart.js';
 
-const defaultDatasetIdKey = "label";
+const defaultDatasetIdKey = 'label';
 function reforwardRef(ref, value) {
-    if (typeof ref === "function") {
+    if (typeof ref === 'function') {
         ref(value);
@@ -54,3 +54,3 @@ } else if (ref) {
  */ function getDatasetAtEvent(chart, event) {
-    return chart.getElementsAtEventForMode(event.nativeEvent, "dataset", {
+    return chart.getElementsAtEventForMode(event.nativeEvent, 'dataset', {
         intersect: true
@@ -65,3 +65,3 @@ }, false);
  */ function getElementAtEvent(chart, event) {
-    return chart.getElementsAtEventForMode(event.nativeEvent, "nearest", {
+    return chart.getElementsAtEventForMode(event.nativeEvent, 'nearest', {
         intersect: true
@@ -76,3 +76,3 @@ }, false);
  */ function getElementsAtEvent(chart, event) {
-    return chart.getElementsAtEventForMode(event.nativeEvent, "index", {
+    return chart.getElementsAtEventForMode(event.nativeEvent, 'index', {
         intersect: true
@@ -83,5 +83,5 @@ }, false);
 function ChartComponent(props, ref) {
-    const { height =150 , width =300 , redraw =false , datasetIdKey , type , data , options , plugins =[] , fallbackContent , updateMode , ...canvasProps } = props;
+    const { height = 150, width = 300, redraw = false, datasetIdKey, type, data, options, plugins = [], fallbackContent, updateMode, ...canvasProps } = props;
     const canvasRef = useRef(null);
-    const chartRef = useRef();
+    const chartRef = useRef(null);
     const renderChart = ()=>{
@@ -156,8 +156,9 @@ if (!canvasRef.current) return;
     }, []);
-    return /*#__PURE__*/ React.createElement("canvas", Object.assign({
+    return /*#__PURE__*/ React.createElement("canvas", {
         ref: canvasRef,
         role: "img",
         height: height,
-        width: width
-    }, canvasProps), fallbackContent);
+        width: width,
+        ...canvasProps
+    }, fallbackContent);
 }
@@ -168,17 +169,18 @@ const Chart = /*#__PURE__*/ forwardRef(ChartComponent);
     Chart$1.register(registerables);
-    return /*#__PURE__*/ forwardRef((props, ref)=>/*#__PURE__*/ React.createElement(Chart, Object.assign({}, props, {
+    return /*#__PURE__*/ forwardRef((props, ref)=>/*#__PURE__*/ React.createElement(Chart, {
+            ...props,
             ref: ref,
             type: type
-        })));
+        }));
 }
-const Line = /* #__PURE__ */ createTypedChart("line", LineController);
-const Bar = /* #__PURE__ */ createTypedChart("bar", BarController);
-const Radar = /* #__PURE__ */ createTypedChart("radar", RadarController);
-const Doughnut = /* #__PURE__ */ createTypedChart("doughnut", DoughnutController);
-const PolarArea = /* #__PURE__ */ createTypedChart("polarArea", PolarAreaController);
-const Bubble = /* #__PURE__ */ createTypedChart("bubble", BubbleController);
-const Pie = /* #__PURE__ */ createTypedChart("pie", PieController);
-const Scatter = /* #__PURE__ */ createTypedChart("scatter", ScatterController);
+const Line = /* #__PURE__ */ createTypedChart('line', LineController);
+const Bar = /* #__PURE__ */ createTypedChart('bar', BarController);
+const Radar = /* #__PURE__ */ createTypedChart('radar', RadarController);
+const Doughnut = /* #__PURE__ */ createTypedChart('doughnut', DoughnutController);
+const PolarArea = /* #__PURE__ */ createTypedChart('polarArea', PolarAreaController);
+const Bubble = /* #__PURE__ */ createTypedChart('bubble', BubbleController);
+const Pie = /* #__PURE__ */ createTypedChart('pie', PieController);
+const Scatter = /* #__PURE__ */ createTypedChart('scatter', ScatterController);
 
 export { Bar, Bubble, Chart, Doughnut, Line, Pie, PolarArea, Radar, Scatter, getDatasetAtEvent, getElementAtEvent, getElementsAtEvent };
 //# sourceMappingURL=index.js.map

dist/types.d.ts

@@ -1,2 +0,2 @@
-import type { CanvasHTMLAttributes, MutableRefObject, ReactNode } from 'react';
+import type { CanvasHTMLAttributes, MutableRefObject, ReactNode, JSX } from 'react';
 import type { Chart, ChartType, ChartData, ChartOptions, DefaultDataPoint, Plugin, UpdateMode } from 'chart.js';
@@ -3,0 +3,0 @@ export type ForwardedRef<T> = ((instance: T | null) => void) | MutableRefObject<T | null> | null;

package.json

 {
   "name": "react-chartjs-2",
   "type": "module",
-  "version": "5.2.0",
+  "version": "5.3.0",
   "description": "React components for Chart.js",
@@ -39,3 +39,3 @@ "author": "Jeremy Ayerst",
     "chart.js": "^4.1.1",
-    "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
   },
@@ -42,0 +42,0 @@ "main": "./dist/index.cjs",

README.md

@@ -35,4 +35,2 @@ # react-chartjs-2
 <span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
-<a href="https://slack.cube.dev/?ref=eco-react-chartjs">Slack</a>
-<span>&nbsp;&nbsp;•&nbsp;&nbsp;</span>
 <a href="https://stackoverflow.com/questions/tagged/react-chartjs-2">Stack Overflow</a>
@@ -64,8 +62,2 @@ <br />
 
-Need an API to fetch data? Consider [Cube](https://cube.dev/?ref=eco-react-chartjs), an open-source API for data apps.
-
-<br />
-
-[![supported by Cube](https://user-images.githubusercontent.com/986756/154330861-d79ab8ec-aacb-4af8-9e17-1b28f1eccb01.svg)](https://cube.dev/?ref=eco-react-chartjs)
-
 ## Docs
@@ -72,0 +64,0 @@

No alert changes

Improved metrics

Lines of code

466

increased by0.87%

Worsened metrics

Total package byte prevSize

55890

decreased by-1.73%

Number of lines in readme file

74

decreased by-9.76%

No dependency changes