Tab Panel

<wa-tab-panel> Since 2.0 stable

Tab panels are used inside tab groups to display tabbed content.

This component must be used as a child of <wa-tab-group>. Please see the Tab Group docs to see examples of this component in action.

Slots

Learn more about using slots.

Name Description
(default) The tab panel's content.

Attributes & Properties

Learn more about attributes and properties.

Name Description Reflects
name
name
The tab panel's name.
Type string
Default ''
active
active
When true, the tab panel will be shown.
Type boolean
Default false

CSS custom properties

Learn more about CSS custom properties.

Name Description
--padding
The tab panel's padding.

CSS parts

Learn more about CSS parts.

Name Description
base The component's base wrapper.

Importing

The autoloader is the recommended way to import components. If you prefer to do it manually, use one of the following code snippets.

CDN npm React

To manually import this component from the CDN, use the following code.

import 'https://early.webawesome.com/[email protected]/dist/components/tab-panel/tab-panel.js';
        

To manually import this component from NPM, use the following code.

import '@awesome.me/webawesome/dist/components/tab-panel/tab-panel.js';
        

To manually import this component from React, use the following code.

import '@awesome.me/webawesome/dist/react/tab-panel';
        
Need a hand? Report a bug Ask for help
    No results