creativetimofficial--ui
Alexandru Paduraru
28 行
2.9 KiB
JSON
28 行
2.9 KiB
JSON
{
|
|
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
|
|
"name": "modals-11",
|
|
"description": "Confirm vault deletion modal with text input verification",
|
|
"registryDependencies": [
|
|
"dialog",
|
|
"button",
|
|
"input",
|
|
"label"
|
|
],
|
|
"files": [
|
|
{
|
|
"path": "creative-tim/blocks/modals-11/page.tsx",
|
|
"content": "\"use client\"\n\nimport * as React from \"react\"\nimport { X } from \"lucide-react\"\n\nimport { Button } from \"@/components/ui/button\"\nimport {\n Dialog,\n DialogContent,\n DialogHeader,\n DialogTitle,\n DialogTrigger,\n} from \"@/components/ui/dialog\"\nimport { Input } from \"@/components/ui/input\"\nimport { Label } from \"@/components/ui/label\"\n\nexport default function ModalsBlock() {\n const [isOpen, setIsOpen] = React.useState(false)\n\n return (\n <div className=\"grid min-h-screen w-full place-items-center\">\n <Dialog open={isOpen} onOpenChange={setIsOpen}>\n <DialogTrigger asChild>\n <Button onClick={() => setIsOpen(true)}>Open Modal</Button>\n </DialogTrigger>\n <DialogContent className=\"sm:max-w-[500px]\">\n <button\n onClick={() => setIsOpen(false)}\n className=\"ring-offset-background focus:ring-ring absolute top-4 right-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-none disabled:pointer-events-none\"\n >\n <X className=\"h-4 w-4\" />\n <span className=\"sr-only\">Close</span>\n </button>\n <DialogHeader>\n <DialogTitle className=\"mb-2 text-xl\">\n Erase Fashion Vault\n </DialogTitle>\n </DialogHeader>\n <p className=\"text-muted-foreground mt-2 text-sm\">\n Type the full collection handle to confirm irreversible deletion of\n this vault.\n </p>\n\n <form className=\"mt-6 space-y-6\">\n <div className=\"space-y-2\">\n <Label htmlFor=\"identifier\" className=\"font-semibold\">\n Collection identifier\n </Label>\n <Input id=\"identifier\" placeholder=\"spring-edit-collection\" />\n </div>\n\n <div className=\"flex items-center justify-end gap-2 pt-4\">\n <Button\n type=\"button\"\n variant=\"outline\"\n onClick={() => setIsOpen(false)}\n >\n Cancel\n </Button>\n <Button type=\"submit\" variant=\"destructive\">\n Delete Vault\n </Button>\n </div>\n </form>\n </DialogContent>\n </Dialog>\n </div>\n )\n}\n",
|
|
"type": "registry:page",
|
|
"target": "app/modals-11/page.tsx"
|
|
}
|
|
],
|
|
"meta": {
|
|
"iframeHeight": "550px",
|
|
"container": "w-full bg-surface",
|
|
"mobile": "component"
|
|
},
|
|
"categories": [
|
|
"modals"
|
|
],
|
|
"type": "registry:block"
|
|
} |