Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Theme switcher does not work with latest Storybook versions #67

Open
yannickoo opened this issue Jan 31, 2022 · 1 comment
Open

Theme switcher does not work with latest Storybook versions #67

yannickoo opened this issue Jan 31, 2022 · 1 comment
Labels
doc Documentation update

Comments

@yannickoo
Copy link

It seems like this addon is not working nicely together with the latest version of Storybook. With an older version of Storybook it was enough to add the themes option to the exported parameters object in .storybook/preview.js but now you need to use addParameters function to add the config properly.

.storybook/preview.js ⬇️

Before

export const parameters = {
  themes: {
    default: 'foo',
    list: [
      { name: 'foo', class: 'theme-foo', color: '#f00' },
      { name: 'bar', class: 'theme-bar', color: '#0f0' }
    ],
    clearable: false,
    onChange: (themeName) => {
      // …
    }
  }
}

After

import { addParameters } from '@storybook/web-components'

addParameters({
  themes: {
    default: 'foo',
    list: [
      { name: 'foo', class: 'theme-foo', color: '#f00' },
      { name: 'bar', class: 'theme-bar', color: '#0f0' }
    ],
    clearable: false,
    onChange: (themeName) => {
      // …
    }
  }
}

⚠️ Make sure that you import addParameters function from the right package, in my case it was @storybook/web-components.


Thanks to @darekkay who pointed to that here ➡️ #56 (comment) 🎉

I have created this issue to make it easier for other people to find this one

@tonai tonai added the doc Documentation update label Feb 9, 2022
@jeremyzilar
Copy link

That was very helpful. I added some additional examples to that thread — #56 (comment)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
doc Documentation update
Projects
None yet
Development

No branches or pull requests

3 participants