Vela UI Docs
venizia.ai

App Frame

The chrome around a satellite app in both display modes: alone it draws its own rail and header; inside the Shell it keeps only its own navigation and page, titles the Shell's header through the mount bridge, and folds its navigation into a drawer on narrow screens.

App Frame

@velaui/app-frame
@velaui/app-frameOpen Open
pnpm dlx velaui add @velaui/app-frame

Built from

  1. ButtonDisplays a button or a component that looks like a button.
  2. SegmentedA set of mutually exclusive options inside a single inline container.
  3. SheetA side panel that slides in over the page for details, forms, and secondary flows.
  4. 8 iconsFrom the Vela UI icon set, installed with the block.

Mount it in a route

// app/page.tsx
import AppFrameBlock from "@/components/blocks/app-frame/app-frame";

export default function Page() {
  return <AppFrameBlock />;
}