Automatic Control Filtering

[andyragu]

Summary

Hi, I'm currently upgrading my SB to v10. With this upgrade the automatic generation of controls has changed in a way that now requires me to explicitly declare controls on every component's stories. I'm wondering if there's a way to configure this globally to automatically filter these controls without manually defining them in each story.

Thanks!

Additional information

No response

Create a reproduction

No response

[dosubot[bot]]

You can configure automatic control filtering globally in Storybook v10. Just set the controls parameter in your .storybook/preview.js (or main.js) file. For example, to include or exclude controls by name or pattern:

export default {
  parameters: {
    controls: {
      include: ['propA', 'propB'], // or use a regex: /^(propA|propB)$/
      exclude: ['internalProp', /^on[A-Z].*/], // exclude by name or regex
    },
  },
};

You can also use controls.disable: true to turn off all controls globally, or controls.matchers to filter by prop patterns (like color or date):

export default {
  parameters: {
    controls: {
      matchers: {
        color: /(background|color)$/i,
        date: /Date$/,
      },
    },
  },
};

With this setup, you don't need to manually define controls in every story—your global config will apply everywhere. More details and examples are in the official docs and this discussion.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}