Tabs Bar

A navigation bar that organises content into labelled tabs, allowing users to switch between related views.

Overview: A summary of the selected item and its key metrics.

<div class="w-full">
  <diwa-tabs-bar active-tab-index="0" class="block w-full">
    <button>Overview</button>
    <button>Details</button>
    <button>Settings</button>
  </diwa-tabs-bar>
  <div role="tabpanel" class="p-4 text-sm border border-t-0 border-[var(--diwa-border)] rounded-b text-[var(--diwa-text-secondary)]">Overview: A summary of the selected item and its key metrics.</div>
</div>