msolarczekandClaude Opus 5
c8e6f30a27
Unveränderter Stand von certvia/dev (a48c5fb) plus Craftvia-Spezifikation und Brandbook unter docs/craftvia/. ISMS-Module werden im Folgecommit entfernt. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import Link from "next/link";
|
||
import { X } from "lucide-react";
|
||
import { SectTitle } from "@/components/mockup-ui";
|
||
|
||
/**
|
||
* Serverseitig gerendertes, schließbares Popup (Overlay). Öffnen/Schließen
|
||
* läuft über searchParams der Listen-Seite (?detail=/?edit=/?new=1) —
|
||
* kein Client-State, Browser-Zurück schließt das Popup ebenfalls.
|
||
*/
|
||
export function Modal({
|
||
title,
|
||
sub,
|
||
headerExtra,
|
||
closeHref,
|
||
closeLabel,
|
||
children,
|
||
footer,
|
||
}: {
|
||
title: string;
|
||
sub?: string;
|
||
headerExtra?: React.ReactNode;
|
||
closeHref: string;
|
||
closeLabel: string;
|
||
children: React.ReactNode;
|
||
footer?: React.ReactNode;
|
||
}) {
|
||
return (
|
||
<div className="fixed inset-0 z-50 flex items-start justify-center overflow-y-auto bg-black/30 p-6 backdrop-blur-[2px]">
|
||
<div className="shadow-card my-auto w-full max-w-4xl rounded-2xl border bg-card">
|
||
<div className="flex items-start justify-between gap-3 border-b p-5">
|
||
<SectTitle title={title} sub={sub} />
|
||
<div className="flex items-center gap-3">
|
||
{headerExtra}
|
||
<Link
|
||
href={closeHref}
|
||
title={closeLabel}
|
||
className="rounded-md p-1 text-muted-foreground hover:bg-muted hover:text-foreground"
|
||
>
|
||
<X className="size-4.5" />
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
{children}
|
||
{footer && <div className="flex justify-end gap-2 border-t p-5">{footer}</div>}
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|