Summary

Introduce a way to define a default filter when the Storybook starts.

This idea can be extended to a Persona/Profile concept to quickly change the filter selection based on the current audience.

Problem Statement

Storybook can contain stories created for different reasons.

Filter by tags is a good way to quickly reduce the number of stories shown to de-clutter the Storybook, especially for designers and managers who may not be tech savvy.

Showing all stories and ask them to filter to a set of tags is still quite daunting to them.

At the same time, it is still beneficial to include all stories in the production Storybook so the engineers and package/app authors can rely on Storybook as the holy place to gather or validate information.

Non-goals

No response

Implementation

There are a few things can be done:

Enhance Filter capabilities

• Support Docs-only mode (hiding all stories)
• Support Select All/Clear All tag filters

Support Initial Filter values

For example:

// .storybook/main.ts

export default {
  filters: {
    init: {
      docsMode: boolean (default: false)
      tags: [] // default: none
      tags: ['*'] // all
      tags: ['tag-a', 'tag-b', ... ] // filter by include
      tags: ['!tag-a', '!tag-b', ...] // filter by exclude
    }
  }
}

(or) Support Persona/Profiles

// .storybook/main.ts

export default {
  persona: [{
    name: 'UX',
    docs: { docsMode: true }
  }, {
    name: 'Designer',
    docs: { docsMode: false },
    filters: {
      init: {
        docsMode: true,
        tags: [...]
      }
    }
  }, {
    name: 'Engineer',
    default: true, // first entry wins
    filters: {
      init: {
        docsMode: false,
        tags: [...]
      }
    }
  }, {
    name: 'Author',
    filters: {
      init: {
        docsMode: false,
        tags: [...]
      }
    }
  }]
}

Prior Art

No response

Deliverables

No response

Risks

No response

Unresolved Questions

• Using a to do list makes it easy to resolve the questions as we move the RFC along.

Alternatives considered / Abandoned Ideas

No response