Locara
← All components Layout & primitives

Tabs

Peer content sections. Roving tabindex, automatic or manual activation, horizontal or vertical orientation.

Inspired by Radix Tabs, WAI-ARIA APG, Apple HIG Tab Views.

Preview

What it looks like.

Arrow keys move between tabs. Switch activation — manual requires Enter/Space to confirm.
Qwen 2.5 7B · Q4_K_M · 4.89 GB on disk · 5.2 GB resident. Loaded via llama.cpp Metal backend.

Live — the real component, scoped to this frame.

Usage

Drop it into your app.

import { Tabs, TabsList, Tab, TabPanel } from '@locara/components'

<Tabs defaultValue="overview" activationMode="automatic">
  <TabsList>
    <Tab value="overview">Overview</Tab>
    <Tab value="caps">Capabilities</Tab>
    <Tab value="models">Models</Tab>
    <Tab value="logs">Logs</Tab>
  </TabsList>
  <TabPanel value="overview">A Locara app is a manifest…</TabPanel>
  <TabPanel value="caps">Capability declarations…</TabPanel>
  <TabPanel value="models">Pinned models…</TabPanel>
  <TabPanel value="logs">Recent activity…</TabPanel>
</Tabs>

Or copy the source into your repo: locara add tabs