[RFC] Remove addon panel type

[Sidnioulz]

Summary

In a distant past, Storybook used to have a global tab bar at the top of the screen, allowing users to switch between Docs pages and stories. Storybook stopped using this internally by moving Docs pages to the sidebar, but the panel feature remains under the hood for addon authors.

This RFC proposes to remove the addon panel type altogether, to simplify UI maintenance and WCAG compliance.

Problem Statement

The fact that a tabbar exists in this part of the UI is problematic. To make Storybook more accessible, we want to implement a proper toolbar pattern for the top toolbar, and tablist patterns where we have tablists.

Having a UI element where both the toolbar tools and navigation tabs intersect makes it particularly hard to provide a coherent keyboard navigation pattern. We either have to present tools before tabs, even though the tools available in the toolbar depend on the current tab, or leave tools between the tablist and tabpanel, breaking the expected keyboard navigation pattern.

Removing the ability to create new tabs would solve this UI dilemma.

Addon authors would have to port their tabs to another UI mechanism. Decorators would allow addon authors to reimplement their own tab structures if they so desired.
Existing and planned layout customisations would allow addon authors to control what tools and UI elements appear in their tabs, which means they'd have good control over the final UI output of their addons.

A11Y Resources

• https://www.w3.org/WAI/ARIA/apg/patterns/tabs/
• https://adrianroselli.com/2013/02/aria-tabs.html
• https://web.archive.org/web/20130208024627/http://www.marcozehe.de/2013/02/02/advanced-aria-tip-1-tabs-in-web-apps/

Non-goals

No response

Implementation

In Storybook 10

• Deprecate the tab type from the addon registration API
• Implement UI: Selectively hide panels per story #32071 to give addon authors an equivalent level of customisability
• Possibly implement a better renderLabel in the sidebar to let users choose an icon for their own indexed stories?
• Possibly build an example repository with a tabbar decorator and layout customisations implementing a custom view?

In Storybook 11

• Remove the tab type from the addon registration API
• Remove tabs from the manager preview toolbar

Prior Art

No response

Deliverables

No response

Risks

If we don't provide alternatives for addon authors who have a legitimate need for full page views, this may blow back. A decorator could be provided that uses local parameters to switch between the actual story and a custom view.

Unresolved Questions

• Decide what shape an equivalent feature would take for the few addon authors still using tabs

Alternatives considered / Abandoned Ideas

We've considered preserving the tabs feature with the current UI, but making it compatible with the DOM structure we need for accessibility will be hard. We'd end up having to use JS to absolutely position tabs where they exist and dynamically reserve space for them in the toolbar. That UI code would be prone to breaking.

We could also consider other UI forms (e.g. two bars) but the team so far prefers to remove tabs altogether.