import { forwardRef } from "react"; /** * Dialog * * Control imperatively: dialogRef.current.showModal() / .close() * * title: string | ReactNode - header title rendered in

* bordered: boolean - adds borders between header, body, and footer * actions: ReactNode - footer action buttons * closeLabel: string - aria-label for the × button (default: "Close") * onClose: function - called when the native close event fires * backdropClose: boolean - close on backdrop click and Escape (default: true) */ const Dialog = forwardRef(function Dialog( { title, bordered = false, actions, closeLabel = "Close", onClose, backdropClose = true, className = "", children, ...props }, ref ) { // backdropClose=false → closedby="none" (disables backdrop + Escape natively) // Don't override if the consumer passed closedby explicitly const closedby = "closedby" in props ? undefined // already in ...props, don't double-set : backdropClose ? undefined // default browser behaviour : "none"; const classes = [ "prs-dialog", bordered && "prs-dialog-bordered", className, ] .filter(Boolean) .join(" "); return (
{/* Header */} {title != null && (

{title}

)} {/* Body */}
{children}
{/* Actions */} {actions != null && (
{actions}
)}
{/* Backdrop - clicking closes unless backdropClose=false */}
{backdropClose &&
); }); export default Dialog; // Internal close icon - always decorative const CloseIcon = () => ( );