Sidebar 16

1import { AppSidebar } from "@/registry/radix-sera/blocks/sidebar-16/components/app-sidebar"
2import { SiteHeader } from "@/registry/radix-sera/blocks/sidebar-16/components/site-header"
3import { SidebarInset, SidebarProvider } from "@/registry/radix-sera/ui/sidebar"
4 
5export const iframeHeight = "800px"
6 
7export const description = "A sidebar with a header and a search form."
8 
9export default function Page() {
10  return (
11    <div className="[--header-height:calc(--spacing(14))]">
12      <SidebarProvider className="flex flex-col">
13        <SiteHeader />
14        <div className="flex flex-1">
15          <AppSidebar />
16          <SidebarInset>
17            <div className="flex flex-1 flex-col gap-4 p-4">
18              <div className="grid auto-rows-min gap-4 md:grid-cols-3">
19                <div className="aspect-video rounded-xl bg-muted/50" />
20                <div className="aspect-video rounded-xl bg-muted/50" />
21                <div className="aspect-video rounded-xl bg-muted/50" />
22              </div>
23              <div className="min-h-screen flex-1 rounded-xl bg-muted/50 md:min-h-min" />
24            </div>
25          </SidebarInset>
26        </div>
27      </SidebarProvider>
28    </div>
29  )
30}