How to pass background color to vue component in @storybook

441 views Asked by At

// SomeComponent.stories.js

const defaultArgs = {
  theme: 'light'
};

export default {
  title: 'SomeComponent',
  component: SomeComponent,
  args: defaultArgs,
};

// Define template for SomeComponent Story
const SomeComponentTemplate = (args, { argTypes }) => ({
  components: { SomeComponent },
  props: Object.keys(argTypes),
  template: `
    <SomeComponent :theme="theme"/>
  `
});

export const Default = SomeComponentTemplate.bind({});
Default.args = { ...defaultArgs };

Whenever I change the background color from storybook via @storybook/addon-backgrounds I would want to pass the value to my component.

Say, If user selects black from the Background, I want to pass black to the theme property.

Is it possible to do this?

0

There are 0 answers