Page() — ui Function Reference

Architecture documentation for the Page() function in page.tsx from the ui codebase.

Function tsx ComponentRegistry ChartRegistry

Entity Profile

ComponentRegistry→ ChartRegistry→ Page() — ui Function Reference

Dependency Diagram

graph TD
  e1514ff7_7c86_ede1_0523_3358769f301c["Page()"]
  ad4d3414_541e_2e7e_7c1e_b2465d65838c["page.tsx"]
  e1514ff7_7c86_ede1_0523_3358769f301c -->|defined in| ad4d3414_541e_2e7e_7c1e_b2465d65838c
  style e1514ff7_7c86_ede1_0523_3358769f301c fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

deprecated/www/__registry__/new-york/block/sidebar-16/page.tsx lines 29–134

export default function Page() {
  const [open, setOpen] = React.useState(true)

  return (
    <div
      style={
        {
          "--header-height": HEADER_HEIGHT,
        } as React.CSSProperties
      }
    >
      <header className="bg-sidebar sticky h-[--header-height] top-0 z-50 w-full border-b border-border/40  backdrop-blur">
        <div className="flex h-14 items-center px-4">
          <div className="mr-4 hidden md:flex">
            <Button
              className="hidden md:flex"
              variant="ghost"
              size="icon"
              onClick={() => setOpen(!open)}
            >
              <Sidebar />
            </Button>
            <a href="#" className="mr-4 flex items-center gap-2 lg:mr-6">
              <div className="flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground">
                <Command className="size-4" />
              </div>
            </a>
            <nav className="flex items-center gap-4 text-sm xl:gap-6">
              <a
                href="#"
                className="transition-colors hover:text-foreground/80"
              >
                Docs
              </a>
              <a
                href="#"
                className="transition-colors hover:text-foreground/80"
              >
                Components
              </a>
              <a
                href="#"
                className="transition-colors hover:text-foreground/80"
              >
                Blocks
              </a>
              <a
                href="#"
                className="transition-colors hover:text-foreground/80"
              >
                Charts
              </a>
              <a
                href="#"
                className="transition-colors hover:text-foreground/80"
              >
                Themes
              </a>
              <a
                href="#"
                className="transition-colors hover:text-foreground/80"
              >
                Colors
              </a>
            </nav>
          </div>
        </div>
      </header>
      <SidebarProvider open={open} onOpenChange={setOpen}>
        <AppSidebar />

        <SidebarInset>
          <header className=" flex shrink-0 items-center gap-2 border-b py-2">
            <div className="flex items-center gap-2 px-4 py-2">
              <div className="flex md:hidden items-center gap-2">
                <SidebarTrigger />
                <Separator orientation="vertical" className="mr-2 h-4" />
              </div>
              <Breadcrumb>
                <BreadcrumbList>
                  <BreadcrumbItem className="hidden md:block">