Can we please avoid those redundant Svelte's wrappers?

[frederikhors]

Thanks for your amazing, delicious work on Storybook!!!

Is your feature request related to a problem? Please describe
I'm trying Storybook for the first time and with Svelte.

Using kitchen-sink example here I find it very inconvenient to create "wrappers" (such as ButtonView.svelte) because it becomes a tedious repetition of the component itself.

Example:

A button has primary and size (and many other) props and I need to put them both in ButtonView.svelte and the real Button.svelte component to use it in Storybook.

Why this? Could it be because it is complicated to inject slots?

Maybe I'm wrong in using it like this?

Describe the solution you'd like
I would like to "directly" use Button.svelte in my button.stories.js without ButtonView.svelte wrapper.

Maybe we can use an object like this:

import DefaultSlot from "./DefaultSlot.svelte"
import FirstSlot from "./FirstSlot.svelte"
{
  slots: {
    default: { component: DefaultSlot }
    first: { component: FirstSlot }
  }
}

What do you think, Svelte guys? 😄

[j3rem1e]

Check this plugin: https://www.npmjs.com/package/@storybook/addon-svelte-csf

It allows to write stories directly in svelte syntax.

[frederikhors]

@j3rem1e thank you! Interesting! I'm studying...

@shilman, can I ask you to not close this issue until we found a comfortable way to write Svelte stories?

[shilman]

@frederikhors sure thing. i'll let you close it when it's answered to your satisfaction

[frederikhors]

@j3rem1e, @shilman it works amazing! Thanks!

Is there more extensive documentation?