'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect, useRef } from 'react';
import { Check, Copy, Loader2, Sparkles, X } from 'lucide-react';
import { coauthorActionLabel } from '../lib/coauthor-client.js';
/**
 * Universal AI-result panel rendered by both the TipTap bubble menu and the
 * Cmd+K slash-command palette. Shows a before/after diff plus three actions:
 *
 *   - Apply (write the result back to the active target)
 *   - Copy (copy the result to the clipboard)
 *   - Discard (close without changing anything)
 *
 * The popover takes the same `{ open, loading, action, before, after, error }`
 * state shape regardless of caller so the UX stays identical across surfaces.
 */
export function CoauthorResultPopover({ open, loading, action, before, after, error, changes, applyLabel, onApply, onCopy, onDiscard, }) {
    const dialogRef = useRef(null);
    useEffect(() => {
        if (!open)
            return;
        const onKey = (e) => {
            if (e.key === 'Escape') {
                e.preventDefault();
                onDiscard();
            }
        };
        document.addEventListener('keydown', onKey);
        return () => document.removeEventListener('keydown', onKey);
    }, [open, onDiscard]);
    useEffect(() => {
        if (!open)
            return;
        dialogRef.current?.focus();
    }, [open]);
    if (!open)
        return null;
    const applyDisabled = loading || !!error || after.length === 0;
    const copyDisabled = loading || !!error || after.length === 0;
    return (_jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 px-4", role: "presentation", onClick: onDiscard, children: _jsxs("div", { ref: dialogRef, role: "dialog", "aria-modal": "true", "aria-label": `AI ${coauthorActionLabel(action)} result`, tabIndex: -1, onClick: (e) => e.stopPropagation(), className: "bg-card w-full max-w-2xl rounded-lg shadow-2xl outline-none", children: [_jsxs("div", { className: "border-border flex items-center justify-between border-b px-4 py-3", children: [_jsxs("div", { className: "text-foreground flex items-center gap-2 text-sm font-medium", children: [_jsx(Sparkles, { className: "text-primary h-4 w-4", "aria-hidden": true }), _jsxs("span", { children: ["AI ", coauthorActionLabel(action)] }), loading && (_jsx(Loader2, { className: "text-muted-foreground ml-1 h-4 w-4 animate-spin", "aria-label": "Loading" }))] }), _jsx("button", { type: "button", onClick: onDiscard, className: "text-muted-foreground hover:bg-accent hover:text-muted-foreground rounded p-1", "aria-label": "Close", children: _jsx(X, { className: "h-4 w-4" }) })] }), _jsxs("div", { className: "grid grid-cols-2 gap-4 p-4", children: [_jsxs("section", { "aria-labelledby": "coauthor-before", children: [_jsx("h3", { id: "coauthor-before", className: "text-muted-foreground mb-2 text-xs font-medium tracking-wide uppercase", children: "Before" }), _jsx("pre", { className: "border-border bg-muted text-foreground max-h-72 overflow-auto rounded border p-3 text-sm whitespace-pre-wrap", children: before })] }), _jsxs("section", { "aria-labelledby": "coauthor-after", children: [_jsx("h3", { id: "coauthor-after", className: "text-muted-foreground mb-2 text-xs font-medium tracking-wide uppercase", children: "After" }), loading ? (_jsx("div", { className: "border-border bg-muted text-muted-foreground flex h-72 items-center justify-center rounded border border-dashed text-sm", role: "status", children: "Thinking\u2026" })) : error ? (_jsx("div", { className: "border-destructive/30 bg-destructive/10 text-destructive flex h-72 items-center justify-center rounded border border-dashed p-3 text-sm", children: error })) : (_jsx("pre", { className: "border-info/30 bg-info/10 text-foreground max-h-72 overflow-auto rounded border p-3 text-sm whitespace-pre-wrap", children: after }))] })] }), changes && changes.length > 0 && !loading && !error && (_jsxs("div", { className: "border-border border-t px-4 py-3", children: [_jsxs("h3", { className: "text-muted-foreground mb-2 text-xs font-medium tracking-wide uppercase", children: ["Changes (", changes.length, ")"] }), _jsx("ul", { className: "max-h-32 space-y-1 overflow-auto text-xs", children: changes.map((change, i) => (_jsxs("li", { className: "bg-muted flex items-start gap-2 rounded px-2 py-1", children: [_jsx("span", { className: "text-destructive line-through", children: change.original }), _jsx("span", { className: "text-muted-foreground", children: "\u2192" }), _jsx("span", { className: "text-success", children: change.corrected }), change.reason && (_jsx("span", { className: "text-muted-foreground ml-auto italic", children: change.reason }))] }, i))) })] })), _jsxs("div", { className: "border-border bg-muted flex items-center justify-end gap-2 border-t px-4 py-3", children: [_jsxs("button", { type: "button", onClick: onDiscard, className: "border-border bg-card text-foreground hover:bg-accent rounded-md border px-3 py-1.5 text-sm", children: [_jsx(X, { className: "mr-1.5 inline h-3.5 w-3.5", "aria-hidden": true }), "Discard"] }), _jsxs("button", { type: "button", onClick: onCopy, disabled: copyDisabled, className: "border-border bg-card text-foreground hover:bg-accent rounded-md border px-3 py-1.5 text-sm disabled:cursor-not-allowed disabled:opacity-50", children: [_jsx(Copy, { className: "mr-1.5 inline h-3.5 w-3.5", "aria-hidden": true }), "Copy"] }), _jsxs("button", { type: "button", onClick: onApply, disabled: applyDisabled, className: "bg-primary hover:bg-primary/90 rounded-md px-3 py-1.5 text-sm font-medium text-white disabled:cursor-not-allowed disabled:opacity-50", children: [_jsx(Check, { className: "mr-1.5 inline h-3.5 w-3.5", "aria-hidden": true }), applyLabel ?? 'Apply'] })] })] }) }));
}
//# sourceMappingURL=CoauthorResultPopover.js.map