36 lines
1.3 KiB
TypeScript
36 lines
1.3 KiB
TypeScript
"use client"
|
|
import * as React from "react"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
interface DialogProps {
|
|
open: boolean
|
|
onOpenChange: (open: boolean) => void
|
|
children: React.ReactNode
|
|
}
|
|
|
|
export function Dialog({ open, onOpenChange, children }: DialogProps) {
|
|
if (!open) return null
|
|
return (
|
|
<div className="fixed inset-0 z-50">
|
|
<div className="fixed inset-0 bg-black/50 backdrop-blur-sm" onClick={() => onOpenChange(false)} />
|
|
<div className="fixed inset-0 flex items-center justify-center p-4">
|
|
<div className="relative bg-background rounded-2xl shadow-xl max-w-lg w-full max-h-[90vh] overflow-y-auto p-6 animate-in fade-in-0 zoom-in-95">
|
|
{children}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export function DialogHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
|
|
return <div className={cn("flex flex-col space-y-2 mb-4", className)} {...props} />
|
|
}
|
|
|
|
export function DialogTitle({ className, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {
|
|
return <h2 className={cn("text-xl font-bold", className)} {...props} />
|
|
}
|
|
|
|
export function DialogDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {
|
|
return <p className={cn("text-sm text-muted-foreground", className)} {...props} />
|
|
}
|