feat: support react 19 (#1236)

* test: make tests pass

* test: upgrade prettier too

* fix: import type JSX from react to make it work with react 19

* fix: make storybook work

* build: upgrade typescript

* fix: fix types and building

* fix: test typings

* fix: simplify test setup

* fix: test setup typings

* chore: update chartjs-plugin-annotation

Author: anajavi

.eslintrc.json

@@ -1,11 +1,11 @@
 {
   "parser": "@typescript-eslint/parser",
-  "plugins": ["@typescript-eslint"],
+  "plugins": ["@typescript-eslint", "prettier"],
   "extends": [
     "standard",
     "standard-react",
-    "plugin:prettier/recommended",
-    "plugin:@typescript-eslint/recommended"
+    "plugin:@typescript-eslint/recommended",
+    "plugin:prettier/recommended"
   ],
   "env": {
     "browser": true
@@ -40,6 +40,8 @@
     "semi": [2, "always"],
     "strict": 0,
     "no-use-before-define": 0,
-    "@typescript-eslint/no-use-before-define": 2
+    "@typescript-eslint/no-use-before-define": 2,
+    "@typescript-eslint/consistent-type-imports": "error",
+    "@typescript-eslint/no-import-type-side-effects": "error"
   }
 }

.storybook/main.js

@@ -2,9 +2,6 @@ const path = require('path');
 const { mergeConfig } = require('vite');
 
 module.exports = {
-  core: {
-    builder: '@storybook/builder-vite',
-  },
   viteFinal(config) {
     return mergeConfig(config, {
       resolve: {
@@ -20,4 +17,9 @@ module.exports = {
     '@storybook/addon-controls',
     '@storybook/addon-actions',
   ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  docs: {},
 };

.storybook/manager.js

@@ -1,4 +1,4 @@
-import { addons } from '@storybook/addons';
+import { addons } from '@storybook/manager-api';
 
 import { theme } from './theme';
 

package.json

@@ -42,8 +42,8 @@
     "postpublish": "del ./package",
     "emitDeclarations": "tsc --emitDeclarationOnly",
     "build": "rollup -c && pnpm emitDeclarations",
-    "start:storybook": "start-storybook -p 6006 --ci",
-    "build:storybook": "del ./storybook-static; NODE_ENV=production build-storybook",
+    "start:storybook": "storybook dev -p 6006 --ci",
+    "build:storybook": "del ./storybook-static; NODE_ENV=production storybook build",
     "test:lint": "eslint \"src/**/*.{ts,tsx}\" \"stories/**/*.{ts,tsx}\" \"sandboxes/**/*.{ts,tsx}\" \"test/**/*.{ts,tsx}\"",
     "test:unit": "vitest run --coverage",
     "test:unit:watch": "vitest watch",
@@ -59,68 +59,69 @@
   },
   "peerDependencies": {
     "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"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.0.0",
     "@commitlint/config-conventional": "^17.0.0",
     "@commitlint/cz-commitlint": "^17.0.0",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@size-limit/preset-big-lib": "^8.0.0",
-    "@storybook/addon-actions": "^6.3.12",
-    "@storybook/addon-controls": "^6.3.12",
-    "@storybook/addon-docs": "^6.3.12",
-    "@storybook/addons": "^6.3.12",
-    "@storybook/builder-vite": "^0.4.0",
-    "@storybook/client-api": "^6.5.13",
-    "@storybook/client-logger": "^6.5.13",
-    "@storybook/react": "^6.3.12",
-    "@swc/core": "^1.3.17",
-    "@swc/helpers": "^0.5.0",
-    "@testing-library/jest-dom": "^5.5.0",
-    "@testing-library/react": "^13.0.0",
+    "@storybook/addon-actions": "^8.4.7",
+    "@storybook/addon-controls": "^8.4.7",
+    "@storybook/addon-docs": "^8.4.7",
+    "@storybook/preview-api": "^8.4.7",
+    "@storybook/client-logger": "^8.4.7",
+    "@storybook/manager-api": "^8.4.7",
+    "@storybook/react": "^8.4.7",
+    "@storybook/react-vite": "^8.4.7",
+    "@storybook/theming": "^8.4.7",
+    "@swc/core": "^1.10.1",
+    "@swc/helpers": "^0.5.15",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
     "@types/faker": "^5.5.8",
     "@types/node": "^18.0.0",
-    "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
-    "@types/testing-library__jest-dom": "^5.14.5",
-    "@typescript-eslint/eslint-plugin": "^5.0.0",
-    "@typescript-eslint/parser": "^5.0.0",
+    "@types/react": "^19.0.2",
+    "@types/react-dom": "^19.0.2",
+    "@typescript-eslint/eslint-plugin": "^8.18.0",
+    "@typescript-eslint/parser": "^8.18.0",
     "@vitejs/plugin-react": "^4.3.4",
     "@vitest/coverage-v8": "^2.1.8",
-    "browserslist": "^4.17.3",
-    "chart.js": "^4.1.1",
+    "browserslist": "^4.24.2",
+    "chart.js": "^4.4.7",
     "chartjs-adapter-date-fns": "^3.0.0",
-    "chartjs-plugin-annotation": "^2.0.1",
-    "chartjs-plugin-zoom": "^2.0.0",
+    "chartjs-plugin-annotation": "^3.1.0",
+    "chartjs-plugin-zoom": "^2.2.0",
     "clean-publish": "^5.0.0",
     "commitizen": "^4.2.4",
     "date-fns": "^2.25.0",
     "del-cli": "^6.0.0",
-    "eslint": "^7.32.0",
-    "eslint-config-prettier": "^8.3.0",
-    "eslint-config-standard": "^17.0.0",
+    "eslint": "^8.57.1",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-config-standard": "^17.1.0",
     "eslint-config-standard-react": "^13.0.0",
     "eslint-plugin-import": "^2.25.1",
-    "eslint-plugin-n": "^14.0.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-promise": "^5.1.0",
+    "eslint-plugin-n": "^16.0.0",
+    "eslint-plugin-prettier": "^5.2.1",
+    "eslint-plugin-promise": "^6.0.0",
     "eslint-plugin-react": "^7.17.0",
     "faker": "^5.5.3",
     "happy-dom": "^16.1.0",
     "nano-staged": "^0.8.0",
-    "prettier": "^2.0.4",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "react-test-renderer": "^18.0.0",
+    "prettier": "^3.4.2",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "rollup": "^4.0.0",
     "rollup-plugin-swc3": "^0.12.0",
     "simple-git-hooks": "^2.6.1",
     "simple-github-release": "^1.0.0",
     "size-limit": "^8.0.0",
     "standard-version": "^9.3.1",
+    "storybook": "^8.4.7",
     "tsd": "^0.31.0",
-    "typescript": "^4.9.4",
+    "typescript": "^5.7.2",
     "vite": "^6.0.6",
     "vitest": "^2.1.8",
     "vitest-canvas-mock": "^0.3.3"