csf-component.md

Component property must be set in meta (csf-component)

Included in these configurations:

• csf

Rule Details

This rule encourages you to set the component property of your CSF default export. The component property is optional, but configuring unlocks a variety of features in Storybook, including automatic prop table documentation in most frameworks, auto-generated controls for dynamically editing your stories, and in CSF3, a resonable default for rendering your component without having to define a render function.

Examples of incorrect code for this rule:

export default {
  title: 'Button',
}

Examples of correct code for this rule:

export default {
  title: 'Button',
  component: Button,
}

When Not To Use It

While we encourage each CSF file to clearly correspond to a single component, it's possible to organize a Storybook in any way you choose. If you have some other organization scheme, especially if you're migrating from the legacy storiesOf API, this rule might not apply to you.

Further Reading

• Automatic argType inference