Upgrade storybook

.github/workflows/test.yml

@@ -23,8 +23,8 @@ jobs:
           pnpx playwright install --with-deps firefox chromium webkit
           pnpx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
             "pnpm storybook" \
-            "pnpx wait-on tcp:6006 && pnpm test-storybook --browsers firefox chromium webkit"
+            "pnpx wait-on tcp:6006 && pnpm test-storybook"
       - name: Run tests in production
-        run: pnpm test-storybook --browsers firefox chromium webkit
+        run: pnpm test-storybook
         env:
-          TARGET_URL: "${{ github.event.deployment_status.target_url }}"
+          STORYBOOK_URL: "${{ github.event.deployment_status.target_url }}"

.storybook/main.ts

@@ -4,8 +4,8 @@ const config: StorybookConfig = {
   stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
   addons: [
     "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-interactions",
+    "@storybook/addon-docs",
+    "@storybook/addon-vitest"
   ],
   framework: {
     name: "@storybook/react-vite",

.storybook/preview.ts

@@ -1,4 +1,4 @@
-import type { Preview } from "@storybook/react";
+import type { Preview } from "@storybook/react-vite";
 
 import "./global.css";
 

.storybook/vitest.setup.ts

@@ -0,0 +1,6 @@
+import { setProjectAnnotations } from '@storybook/react-vite';
+import * as projectAnnotations from './preview';
+
+// This is an important step to apply the right configuration when testing your stories.
+// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
+setProjectAnnotations([projectAnnotations]);

eslint.config.mjs

@@ -1,3 +1,6 @@
+// For more info, see https://github.com/storybookjs/eslint-plugin-storybook#configuration-flat-config-format
+import storybook from "eslint-plugin-storybook";
+
 import { defineConfig } from "eslint/config";
 import { fixupConfigRules, fixupPluginRules } from "@eslint/compat";
 import react from "eslint-plugin-react";

package.json

@@ -17,8 +17,9 @@
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "test": "pnpm test-vitest && pnpm test-storybook",
-    "test-storybook": "test-storybook",
-    "test-vitest": "vitest",
+    "test-storybook": "cross-env TEST_ALL_BROWSERS=true vitest --project=storybook",
+    "test-storybook-chromium": "vitest --project=storybook",
+    "test-vitest": "vitest --project=unit",
     "test-debug": "cross-env DEBUG=true PWDEBUG=1 pnpm test-storybook",
     "prepublishOnly": "pnpm build"
   },
@@ -35,37 +36,35 @@
     "@eslint/compat": "^1.2.9",
     "@eslint/eslintrc": "^3.3.1",
     "@eslint/js": "^9.26.0",
-    "@storybook/addon-actions": "^8.6.12",
-    "@storybook/addon-essentials": "^8.6.12",
-    "@storybook/addon-interactions": "^8.6.12",
-    "@storybook/addon-links": "^8.6.12",
-    "@storybook/blocks": "^8.6.12",
-    "@storybook/react": "^8.6.12",
-    "@storybook/react-vite": "^8.6.12",
-    "@storybook/test": "^8.6.12",
-    "@storybook/test-runner": "^0.22.0",
+    "@storybook/addon-docs": "^10.0.7",
+    "@storybook/addon-links": "^10.0.7",
+    "@storybook/addon-vitest": "^10.0.7",
+    "@storybook/react-vite": "^10.0.7",
     "@testing-library/dom": "^10.4.0",
-    "@testing-library/react": "^16.3.0",
     "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.3.0",
     "@types/react": "^19.1.5",
     "@types/react-dom": "^19.1.5",
     "@typescript-eslint/eslint-plugin": "^8.31.1",
     "@typescript-eslint/parser": "^8.31.1",
-    "@vitejs/plugin-react": "^4.4.1",
+    "@vitejs/plugin-react": "^5.1.0",
     "cross-env": "^7.0.3",
     "eslint": "^9.26.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-storybook": "10.0.7",
     "globals": "^16.0.0",
-    "jsdom": "^26.1.0",
-    "playwright": "^1.52.0",
+    "jsdom": "^27.2.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
-    "storybook": "^8.6.12",
+    "storybook": "^10.0.7",
     "tsup": "^8.4.0",
     "typescript": "~5.8.3",
-    "vite": "^6.3.4",
-    "vitest": "^3.1.4"
+    "vite": "^7.2.2",
+    "vitest": "^4.0.8",
+    "@vitest/browser": "^4.0.8",
+    "@vitest/browser-playwright": "^4.0.8",
+    "@vitest/coverage-v8": "^4.0.8"
   },
   "packageManager": "pnpm@10.4.1",
   "pnpm": {