{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "page",
  "title": "Page",
  "type": "registry:ui",
  "files": [
    {
      "path": "packages/registry-react/components/page/page.tsx",
      "content": "import * as React from 'react'\nimport { cn } from '@/lib/utils'\n\nconst Page = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} data-uipkge=\"\" data-slot=\"page\" className={cn('space-y-6', className)} {...props} />\n  ),\n)\nPage.displayName = 'Page'\n\nconst PageBody = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} data-uipkge=\"\" data-slot=\"page-body\" className={cn('', className)} {...props} />\n  ),\n)\nPageBody.displayName = 'PageBody'\n\nexport interface PageHeaderProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Right-aligned action bar (buttons, menus). The Vue `#actions` slot. */\n  actions?: React.ReactNode\n}\n\nconst PageHeader = React.forwardRef<HTMLDivElement, PageHeaderProps>(\n  ({ className, children, actions, ...props }, ref) => (\n    <div\n      ref={ref}\n      data-uipkge=\"\"\n      data-slot=\"page-header\"\n      className={cn('flex flex-col justify-between gap-4 sm:flex-row sm:items-center', className)}\n      {...props}\n    >\n      <div className=\"flex-1\">{children}</div>\n      {actions}\n    </div>\n  ),\n)\nPageHeader.displayName = 'PageHeader'\n\nexport interface PageHeaderHeadingProps extends React.HTMLAttributes<HTMLDivElement> {\n  title: string\n  description?: string\n}\n\nconst PageHeaderHeading = React.forwardRef<HTMLDivElement, PageHeaderHeadingProps>(\n  ({ className, title, description, ...props }, ref) => (\n    <div ref={ref} data-uipkge=\"\" data-slot=\"page-header-heading\" className={cn('', className)} {...props}>\n      <h2 className=\"text-xl font-bold tracking-tight\">{title}</h2>\n      {description && <p className=\"text-muted-foreground mt-1 text-sm leading-relaxed\">{description}</p>}\n    </div>\n  ),\n)\nPageHeaderHeading.displayName = 'PageHeaderHeading'\n\nexport { Page, PageBody, PageHeader, PageHeaderHeading }\n",
      "type": "registry:ui",
      "target": "~/components/ui/page/page.tsx"
    },
    {
      "path": "packages/registry-react/components/page/index.ts",
      "content": "export { Page, PageBody, PageHeader, PageHeaderHeading } from './page'\nexport type { PageHeaderProps, PageHeaderHeadingProps } from './page'\n",
      "type": "registry:ui",
      "target": "~/components/ui/page/index.ts"
    }
  ],
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [],
  "description": "Page-level layout shell — title row, optional breadcrumbs, action bar, and slotted content well. The standard wrapper for route pages so every screen looks consistent.",
  "categories": [
    "layout"
  ]
}