Skip to content

AppSidebar

AppSidebar(props): Element

Defined in: packages/react/src/components/AdminSidebar.tsx:68

Admin panel sidebar component.

Renders the VexCMS admin navigation using shadcn Sidebar primitives. Displays a nav group per registered collection with links to /admin/:slug. The active collection’s menu button is highlighted via the isActive prop.

Navigation links are rendered via VexLink, which reads FrameworkComponentsContext to use the configured framework Link component (e.g. Next.js NextLink) or falls back to a native <a>. VexLink is passed via the Base UI render prop on SidebarMenuButton — Base UI’s useRender merges the button’s styles and state attributes into the rendered link element.

Must be rendered inside a SidebarProviderAdminLayout provides this.

AppSidebarProps

Sidebar props

Element

// Used inside AdminLayout — SidebarProvider and FrameworkComponentsContext are in scope
<AppSidebar config={vexConfig} activeSlug="posts" />