Panels

Dock

Edge-welded panels whose border follows the curve.

TOP · PRIMARY

9Castle Gates

BOTTOM · PAPER

<BottomStack>
  <Dock edge="bottom" tone="stone">…</Dock>
  <TabBar aria-label="Primary" value={tab} onValueChange={setTab}>…</TabBar>
</BottomStack>

<Dock edge="top" tone="primary">…</Dock>
<Dock edge="top" tone="stone" flush>…</Dock>

Edge-welded panels built like buttons, contour, gold frame, face, so the border wraps the curved exposed corners. Inside a BottomStack they weld onto the tab bar.