UI / Components / layout / SurfaceTabBar

SurfaceTabBar

Drag-reorder tabs with overlay × on hover.

Chrome-style tab bar with drag-to-reorder + hover-revealed close button. Optional kebab menu per tab (rename, pin, archive). For workspace surfaces, browser tabs, doc tabs.

$npx dock-ui add surface-tab-bar

Usage

import { SurfaceTabBar } from "@/components/ui/surface-tab-bar";

<SurfaceTabBar tabs={tabs} activeId={activeId} onSelect={setActive} onClose={close} />

Install

via CLI
$ npx dock-ui add surface-tab-bar
Writes the file(s) directly to your components/ui/ folder. You own the code.
For agents
curl -L https://ui.trydock.ai/r/surface-tab-bar.json
Returns a JSON manifest with file paths + contents. Agent-readable, LLM-fetchable.
← All components
Themes·Component kit · glossary
View on GitHub →