storybookjs/storybook
View on GitHub[Bug]: Sveltes {...$$restProps} breaks storybook component when in use with --style-props
Open
#26,114 opened on Feb 20, 2024
bughelp wantedsev:S3svelte
Repository metrics
- Stars
- (89,909 stars)
- PR merge metrics
- (Avg merge 7d 22h) (184 merged PRs in 30d)
Description
Describe the bug
My button component uses {...$$restProps} to pass all props to the html button element. When I also use style-props to set som custom css properties, I get an error of Error: String contains an invalid character. I use the addon-svelte-csf to write my stories.
To Reproduce
button component
<button {...$$restProps}>
<slot />
</button>
story
<Template let:args><Button {...args}>Click here</Button></Template>
System
System:
OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1185G7 @ 3.00GHz
Shell: 5.8.1 - /usr/bin/zsh
Binaries:
Node: 21.6.0 - ~/.nvm/versions/node/v21.6.0/bin/node
npm: 10.2.4 - ~/.nvm/versions/node/v21.6.0/bin/npm <----- active
npmPackages:
@storybook/addon-essentials: ^7.6.10 => 7.6.10
@storybook/addon-interactions: ^7.6.10 => 7.6.10
@storybook/addon-links: ^7.6.10 => 7.6.10
@storybook/addon-svelte-csf: ^4.1.0 => 4.1.0
@storybook/blocks: ^7.6.10 => 7.6.10
@storybook/svelte: ^7.6.10 => 7.6.10
@storybook/sveltekit: ^7.6.10 => 7.6.10
@storybook/test: ^7.6.10 => 7.6.10
eslint-plugin-storybook: ^0.6.15 => 0.6.15
storybook: ^7.6.10 => 7.6.10
Additional context
No response