🤖 feat: upgrade Storybook to v10.0.0

.storybook/main.ts

@@ -5,9 +5,9 @@ import path from "path";
 const config: StorybookConfig = {
   stories: ["../src/**/*.stories.@(ts|tsx)"],
   addons: [
-    "@storybook/addon-essentials",
-    "@storybook/addon-interactions",
     "@storybook/addon-links",
+    "@storybook/addon-docs",
+    "@storybook/addon-interactions",
   ],
   framework: {
     name: "@storybook/react-vite",

.storybook/preview.tsx

@@ -1,4 +1,4 @@
-import type { Preview } from "@storybook/react";
+import type { Preview } from "@storybook/react-vite";
 import "../src/styles/globals.css";
 
 const preview: Preview = {

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 js from "@eslint/js";
 import { defineConfig } from "eslint/config";
 import react from "eslint-plugin-react";
@@ -444,4 +447,15 @@ export default defineConfig([
       },
     },
   },
+  {
+    // Storybook story files - disable type-aware rules for Storybook 10 barrel exports
+    files: ["**/*.stories.ts", "**/*.stories.tsx", ".storybook/**/*.ts", ".storybook/**/*.tsx"],
+    rules: {
+      "@typescript-eslint/no-unsafe-assignment": "off",
+      "@typescript-eslint/no-unsafe-call": "off",
+      "@typescript-eslint/no-unsafe-member-access": "off",
+      "@typescript-eslint/no-unsafe-return": "off",
+    },
+  },
+  ...storybook.configs["flat/recommended"],
 ]);

package.json

@@ -82,13 +82,9 @@
   "devDependencies": {
     "@eslint/js": "^9.36.0",
     "@playwright/test": "^1.56.0",
-    "@storybook/addon-essentials": "^8.6.14",
-    "@storybook/addon-interactions": "^8.6.14",
-    "@storybook/addon-links": "^8.6.14",
-    "@storybook/blocks": "^8.6.14",
-    "@storybook/react": "^8.6.14",
-    "@storybook/react-vite": "^8.6.14",
-    "@storybook/test-runner": "^0.23.0",
+    "@storybook/addon-links": "^10.0.0",
+    "@storybook/react-vite": "^10.0.0",
+    "@storybook/test-runner": "^0.24.0",
     "@tailwindcss/vite": "^4.1.15",
     "@testing-library/react": "^16.3.0",
     "@types/bun": "^1.2.23",
@@ -141,7 +137,7 @@
     "remark-gfm": "^4.0.1",
     "remark-math": "^6.0.0",
     "shiki": "^3.13.0",
-    "storybook": "^8.6.14",
+    "storybook": "^10.0.0",
     "tailwind-merge": "^3.3.1",
     "tailwindcss": "^4.1.15",
     "ts-jest": "^29.4.4",
@@ -150,7 +146,9 @@
     "typescript-eslint": "^8.45.0",
     "vite": "^7.1.11",
     "vite-plugin-svgr": "^4.5.0",
-    "vite-plugin-top-level-await": "^1.6.0"
+    "vite-plugin-top-level-await": "^1.6.0",
+    "eslint-plugin-storybook": "10.0.0",
+    "@storybook/addon-docs": "^10.0.0"
   },
   "files": [
     "dist/**/*.js",

src/App.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { useRef } from "react";
 import { AppLoader } from "./components/AppLoader";
 import type { ProjectConfig } from "./config";

src/components/CommandPalette.stories.tsx

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { action } from "@storybook/addon-actions";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { action } from "storybook/actions";
 import { CommandPalette } from "./CommandPalette";
 import { CommandRegistryProvider } from "@/contexts/CommandRegistryContext";
 import type { CommandAction } from "@/contexts/CommandRegistryContext";

src/components/ErrorMessage.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { ErrorMessage } from "./ErrorMessage";
 
 const meta = {

src/components/GitStatusIndicatorView.stories.tsx

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { expect, userEvent, waitFor } from "@storybook/test";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { expect, userEvent, waitFor } from "storybook/test";
 import { GitStatusIndicatorView } from "./GitStatusIndicatorView";
 import type { GitCommit, GitBranchHeader } from "@/utils/git/parseGitLog";
 import { useState } from "react";
@@ -23,7 +23,7 @@ const meta = {
     layout: "centered",
   },
   tags: ["autodocs"],
-} satisfies Meta<InteractiveProps>;
+} satisfies Meta<typeof GitStatusIndicatorView>;
 
 export default meta;
 type Story = StoryObj<InteractiveProps>;

src/components/KebabMenu.stories.tsx

@@ -1,6 +1,6 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { KebabMenu } from "./KebabMenu";
-import { action } from "@storybook/addon-actions";
+import { action } from "storybook/actions";
 
 const meta = {
   title: "Components/KebabMenu",

src/components/Messages/AssistantMessage.stories.tsx

@@ -1,7 +1,7 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { AssistantMessage } from "./AssistantMessage";
 import type { DisplayedMessage } from "@/types/message";
-import { action } from "@storybook/addon-actions";
+import { action } from "storybook/actions";
 
 // Stable timestamp for visual testing (Apple demo time: Jan 24, 2024, 9:41 AM PST)
 const STABLE_TIMESTAMP = new Date("2024-01-24T09:41:00-08:00").getTime();

src/components/Messages/HistoryHiddenMessage.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { HistoryHiddenMessage } from "./HistoryHiddenMessage";
 import type { DisplayedMessage } from "@/types/message";
 

src/components/Messages/ReasoningMessage.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { ReasoningMessage } from "./ReasoningMessage";
 import type { DisplayedMessage } from "@/types/message";
 

src/components/Messages/StreamErrorMessage.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { StreamErrorMessage } from "./StreamErrorMessage";
 import type { DisplayedMessage } from "@/types/message";
 import type { StreamErrorType } from "@/types/errors";

src/components/Messages/TerminalOutput.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { TerminalOutput } from "./TerminalOutput";
 
 const meta = {

src/components/Messages/UserMessage.stories.tsx

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { action } from "@storybook/addon-actions";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { action } from "storybook/actions";
 import { UserMessage } from "./UserMessage";
 import type { DisplayedMessage } from "@/types/message";
 

src/components/Modal.stories.tsx

@@ -1,6 +1,6 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { action } from "@storybook/addon-actions";
-import { expect, userEvent, waitFor } from "@storybook/test";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { action } from "storybook/actions";
+import { expect, userEvent, waitFor } from "storybook/test";
 import { useState } from "react";
 import {
   Modal,

src/components/ModelSelector.stories.tsx

@@ -1,6 +1,6 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { ModelSelector } from "./ModelSelector";
-import { action } from "@storybook/addon-actions";
+import { action } from "storybook/actions";
 
 const meta = {
   title: "Components/ModelSelector",

src/components/NewWorkspaceModal.stories.tsx

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { action } from "@storybook/addon-actions";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { action } from "storybook/actions";
 import NewWorkspaceModal from "./NewWorkspaceModal";
 
 const meta = {

src/components/ThinkingSlider.stories.tsx

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { expect, within } from "@storybook/test";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { expect, within } from "storybook/test";
 import { ThinkingSliderComponent } from "./ThinkingSlider";
 import { ThinkingProvider } from "@/contexts/ThinkingContext";
 

src/components/TipsCarousel.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { TipsCarousel } from "./TipsCarousel";
 
 const meta = {

src/components/ToggleGroup.stories.tsx

@@ -1,7 +1,7 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { action } from "@storybook/addon-actions";
-import { expect, userEvent, within, waitFor } from "@storybook/test";
-import { useArgs } from "@storybook/preview-api";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { action } from "storybook/actions";
+import { expect, userEvent, within, waitFor } from "storybook/test";
+import { useArgs } from "storybook/preview-api";
 import { ToggleGroup, type ToggleOption } from "./ToggleGroup";
 import { useState } from "react";
 import { cn } from "@/lib/utils";

src/components/Tooltip.stories.tsx

@@ -1,5 +1,5 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { expect, userEvent, within, waitFor } from "@storybook/test";
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { expect, userEvent, within, waitFor } from "storybook/test";
 import { TooltipWrapper, Tooltip, HelpIndicator } from "./Tooltip";
 
 const meta = {

src/components/ui/CopyButton.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react";
+import type { Meta, StoryObj } from "@storybook/react-vite";
 import { CopyButton } from "./CopyButton";
 
 const meta: Meta<typeof CopyButton> = {