Skip to content

Tracking Issue: Create new version of TabPanel #51553

@chad1008

Description

@chad1008

The goal of this issue is to track progress on the introduction of a new, more granular/composable version of the TabPanel component. This new component will be given the more appropriate name of Tabs. This new component will provide various subcomponents for the tab list, the tabs themselves, and the tab content. We'll also provide a pre-composed version of the component that maintains the functionality and API shape of the current TabPanel component.

The overall goal is to give consumers more flexibility with how tab panels are implemented by moving away from a singular, monolithic component. This will allow us to avoid some of the various hacks, workarounds, and style overrides that have been needed in the past.

We'll complete this work in several steps:

  • Create a new Tabs panel using Radix internals Tabs: Add @radix-ui/react-tabs-powered version of TabPanel  #51551
  • Create modular subcomponents, and update the new Tabs component to utilize them
  • Replace the existing TabPanel component with the new Tabs implementation, testing and fixing any gaps/issues we find
  • Finalize/polish and release the granular/composable version of Tabs
  • Convert existing TabPanel usages in Gutenberg to the new, composable Tabs component
  • Introduce a TabPanel deprecation warning

Metadata

Metadata

Assignees

Labels

[Package] Components/packages/components[Type] Tracking IssueTactical breakdown of efforts across the codebase and/or tied to Overview issues.

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions