Pesto UI

Page Header

The top-of-page block — breadcrumb, optional avatar, large title with a supporting line, and an actions cluster that drops below the title on small screens.

tsx
import { PageHeader } from "@pestoui/core"

Title and description

Agents

Every agent in this workspace, with its connections and last run.

Breadcrumb, actions and rule

The usual detail-page arrangement: a path above the title, the primary action on the right, and a hairline rule closing the block off.

Agents

Every agent in this workspace, with its connections and last run.

With a leading avatar

The avatar slot takes an orb, an avatar, or an icon tile — it stays vertically centred against the title and description.

Niche Content Composer

Publishes a daily niche post to your social channels.

Props

PropTypeDefaultDescription
titleReact.ReactNode—Page title, rendered as the h1.
descriptionReact.ReactNode—Supporting line under the title.
breadcrumbReact.ReactNode—Slot above the title — usually a Breadcrumb.
actionsReact.ReactNode—Right-hand action cluster; wraps below the title under sm.
avatarReact.ReactNode—Leading slot — avatar, orb, or icon tile.
borderbooleanfalseDraws a hairline rule below the block.
classNamestring—Merged onto the <header> element.
PreviousOrb AvatarNext Pagination

Pesto UI · 117 documented components