Support Svelte 5 preview

[danawoodman]

Description

I want to play with Histoire and Svelte 5 preview but have to use npm i --force because Histoire doesn't support the package range. This should fix that.

Additional context

self explanatory

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• If it's a new feature, provide a convincing reason to add it. Ideally, you should open a suggestion issue first and have it approved before working on it.
• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the Commit Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[netlify]

✅ Deploy Preview for histoire-examples-svelte3 ready!

Name	Link
🔨 Latest commit	66e6006
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-examples-svelte3/deploys/65cfa50dc1b4d0000819f0c0
😎 Deploy Preview	https://deploy-preview-685--histoire-examples-svelte3.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for histoire-examples-vue3 ready!

Name	Link
🔨 Latest commit	66e6006
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-examples-vue3/deploys/65cfa50d3d8472000857fd2f
😎 Deploy Preview	https://deploy-preview-685--histoire-examples-vue3.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for histoire-site ready!

Name	Link
🔨 Latest commit	66e6006
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-site/deploys/65cfa50d38f3bc00088fc34b
😎 Deploy Preview	https://deploy-preview-685--histoire-site.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for histoire-controls ready!

Name	Link
🔨 Latest commit	66e6006
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-controls/deploys/65cfa50d3a398300080afe27
😎 Deploy Preview	https://deploy-preview-685--histoire-controls.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[danawoodman]

on further investigation, it seems Histoire plugin svelte is broken with Svelte v5:

Error while collecting story /path/to/project/packages/components/src/lib/Foostory.svelte:
TypeError: Class extends value undefined is not a constructor or null
    at /path/to/project/packages/components/node_modules/@histoire/plugin-svelte/dist/collect/Story.svelte.js:89:17
    at async ViteNodeRunner.runModule (file:///path/to/project/node_modules/vite-node/dist/client.mjs:342:5)
    at async ViteNodeRunner.directRequest (file:///path/to/project/node_modules/vite-node/dist/client.mjs:326:5)
    at async ViteNodeRunner.cachedRequest (file:///path/to/project/node_modules/vite-node/dist/client.mjs:189:14)
    at async ViteNodeRunner.dependencyRequest (file:///path/to/project/node_modules/vite-node/dist/client.mjs:223:12)
    at async /path/to/project/packages/components/node_modules/@histoire/plugin-svelte/dist/collect/index.js:4:31
    at async ViteNodeRunner.runModule (file:///path/to/project/node_modules/vite-node/dist/client.mjs:342:5)
    at async ViteNodeRunner.directRequest (file:///path/to/project/node_modules/vite-node/dist/client.mjs:326:5)
    at async ViteNodeRunner.cachedRequest (file:///path/to/project/node_modules/vite-node/dist/client.mjs:189:14)
    at async ViteNodeRunner.dependencyRequest (file:///path/to/project/node_modules/vite-node/dist/client.mjs:223:12)

[KaruroChori]

Svelte 5 moved to a different interface for components which is not class based, so this is the likely reason.