chore(maintenance): 🤖 upgrade vite to v8

[punkbit]

Why?

This upgrade vite to the latest v8 keeps the current project's build tooling or setup. Consequently, storybooks have also upgraded to the 10.3.0 version for compatibility with Vite 8.

⏳ The branch/PR will be kept on the side for further iterations and confirmation's healthy.

How?

• Upgraded Vite from ^7.3.0 to ^8.0.0
• Upgraded Storybook packages from 10.1.10 to 10.3.0-alpha.16 (required for Vite 8 support)
• Upgraded @vitejs/plugin-react from ^5.1.2 to ^6.0.0
• Migrated from MDX to TSX for Introduction stories due to Rolldown's stricter module requirements
• Removed vite-tsconfig-paths (no longer needed)
• Added Vite 8 workaround in storybook config to filter vite-plugin-externalize-deps (Rolldown doesn't support function-based externals)
• Cleaned up old MDX shim workarounds from Storybook config

Preview?

N/A

[changeset-bot]

⚠️ No Changeset found

Latest commit: 6a51c10

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

Claude finished @punkbit's task in 1m 29s —— View job

---

PR Review: chore(maintenance): 🤖 upgrade vite to v8

• Read CLAUDE.md and conventions
• Analyze changed files
• Provide review feedback

---

Good work on the migration! The changes are well-structured and all workarounds are clearly documented. This is a clean tooling upgrade with no impact on public component APIs.

💡 Suggestions (non-blocking)

• .storybook/main.ts — plugin filter safety: The filter in viteFinal (lines 38–44) uses typeof plugin === 'object' && 'name' in plugin to identify plugins. Vite's PluginOption type allows nested arrays and Promise-based plugins — both satisfy typeof x === 'object' but don't have a name property, so they'd be silently dropped by this filter. In practice, Storybook's auto-generated config likely doesn't produce those shapes, but a more defensive approach would be to only drop the one known plugin by name and keep everything else:

  config.plugins = config.plugins.filter(
    (plugin) => {
      if (plugin == null || plugin === false) return false;
      if (Array.isArray(plugin)) return true; // keep nested arrays
      if (typeof plugin === 'object' && 'name' in plugin) {
        return plugin.name !== 'vite-plugin-externalize-deps';
      }
      return true; // keep Promises and other shapes
    }
  );

  Fix this →

• package.json — alpha Storybook packages: All Storybook packages are pinned to 10.3.0-alpha.16 (no ^, which is correct for alphas). Worth tracking the stable 10.3.x release and upgrading once available to avoid long-term reliance on pre-release packages.

• vite.config.ts — interop: 'auto' removal: Removing interop: 'auto' from CJS output is the right move for Rolldown compatibility, but if downstream consumers rely on the CJS build for mixed ESM/CJS module interop, it's worth a smoke test to confirm no regressions in the shipped dist/cjs output.

---

No blocking issues. The rollupOptions → rolldownOptions rename, resolve.tsconfigPaths: true migration, and MDX → TSX conversion are all correct Vite 8 migration steps. 🙌

[workflow-authentication-public]

📚 Storybook Preview Deployed

✅ Preview URL: https://click-cngvm2n6b-clickhouse.vercel.app

Built from commit: 0c9d8900717d7bd600571da7ec729bfb626651d2