TabBar
Tabs organize content across different screens, data sets, and other interactions.
The fds-tab-bar
extends Material web's mwc-tab-bar-base.
Usage
Import
npm i @finastra/tab-bar
import '@finastra/tab-bar';
import '@finastra/tab';
...
<fds-tab-bar seperator>
<fds-tab label="Active"></fds-tab>
<fds-tab label="Disabled" disabled></fds-tab>
<fds-tab label="Inactive"></fds-tab>
<fds-tab label="Inactive"></fds-tab>
</fds-tab-bar>
Pure HTML pages
<script src="https://cdn.jsdelivr.net/npm/@finastra/tab/dist/tab.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@finastra/tab-bar/dist/tab-bar.js"></script>
<fds-tab-bar seperator>
<fds-tab label="Active"></fds-tab>
<fds-tab label="Disabled" disabled></fds-tab>
<fds-tab label="Inactive"></fds-tab>
<fds-tab label="Inactive"></fds-tab>
</fds-tab-bar>