{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "sf-dialog",
"title": "SF Dialog",
"description": "Brutalist modal dialog with 2px borders, no radius, no shadow",
"registryDependencies": [
"dialog"
],
"files": [
{
"path": "components/sf/sf-dialog.tsx",
"content": "\"use client\";\n\nimport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n DialogTrigger,\n} from \"@/components/ui/dialog\";\nimport { cn } from \"@/lib/utils\";\n\n/**\n * Modal dialog — FRAME layer overlay primitive.\n *\n * Radix Dialog root wrapped with SF contract. Compose with\n * SFDialogTrigger, SFDialogContent, SFDialogHeader, SFDialogTitle,\n * SFDialogDescription, SFDialogFooter, and SFDialogClose.\n * Content applies sharp corners, 2px border, no shadow.\n *\n * @example\n * \n * Open\n * \n * Confirm\n * \n * \n */\nfunction SFDialog(props: React.ComponentProps) {\n return ;\n}\n\n/** Sub-component of SFDialog — trigger element that opens the dialog on interaction. */\nfunction SFDialogTrigger(props: React.ComponentProps) {\n return ;\n}\n\n/** Sub-component of SFDialog — close button that dismisses the dialog when activated. */\nfunction SFDialogClose(props: React.ComponentProps) {\n return ;\n}\n\n/** Sub-component of SFDialog — modal content panel with sharp corners, 2px border, and no shadow. */\nfunction SFDialogContent({\n className,\n ...props\n}: React.ComponentProps) {\n return (\n \n );\n}\n\n/** Sub-component of SFDialog — header region with 2px bottom border separating it from content. */\nfunction SFDialogHeader({\n className,\n ...props\n}: React.ComponentProps) {\n return (\n \n );\n}\n\n/** Sub-component of SFDialog — footer region with 2px top border and muted background for action buttons. */\nfunction SFDialogFooter({\n className,\n ...props\n}: React.ComponentProps) {\n return (\n \n );\n}\n\n/** Sub-component of SFDialog — dialog title in font-mono uppercase with letter-spacing. */\nfunction SFDialogTitle({\n className,\n ...props\n}: React.ComponentProps) {\n return (\n \n );\n}\n\n/** Sub-component of SFDialog — supporting description text in muted foreground, uppercase, xs size. */\nfunction SFDialogDescription({\n className,\n ...props\n}: React.ComponentProps) {\n return (\n \n );\n}\n\nexport {\n SFDialog,\n SFDialogTrigger,\n SFDialogClose,\n SFDialogContent,\n SFDialogHeader,\n SFDialogFooter,\n SFDialogTitle,\n SFDialogDescription,\n};\n",
"type": "registry:ui"
}
],
"meta": {
"layer": "frame",
"pattern": "A"
},
"type": "registry:ui"
}