"use client";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { cn } from "@stigmer/theme";
/**
 * A single row in a version timeline.
 *
 * Renders a version entry with: truncated hash badge, relative timestamp,
 * actor info, tag badge, "current" indicator, and git provenance link.
 * Supports keyboard activation and focus management.
 *
 * All visual properties flow through `--stgm-*` design tokens.
 * Zero Console dependencies — safe for platform builder embedding.
 *
 * @example
 * ```tsx
 * <VersionTimelineEntry
 *   entry={version}
 *   isSelected={selectedId === version.id}
 *   onSelect={() => setSelectedId(version.id)}
 * />
 * ```
 */
export function VersionTimelineEntry({ entry, isSelected, isCompareSource, isLast, onSelect, trailing, }) {
    const handleKeyDown = (e) => {
        if (e.key === "Enter" || e.key === " ") {
            e.preventDefault();
            onSelect?.();
        }
    };
    return (_jsxs("div", { role: "listitem", "aria-current": entry.isCurrent ? "true" : undefined, className: "relative flex gap-3", children: [_jsxs("div", { className: "flex flex-col items-center pt-1", children: [_jsx("div", { className: cn("size-2.5 shrink-0 rounded-full border-2", entry.isCurrent
                            ? "border-primary bg-primary"
                            : isCompareSource
                                ? "border-primary border-dashed bg-background"
                                : isSelected
                                    ? "border-primary bg-background"
                                    : "border-border bg-background"), "aria-hidden": "true" }), !isLast && (_jsx("div", { className: "mt-1 w-px flex-1 bg-border", "aria-hidden": "true" }))] }), _jsxs("button", { type: "button", onClick: onSelect, onKeyDown: handleKeyDown, tabIndex: 0, "aria-selected": isSelected, className: cn("mb-4 flex min-w-0 flex-1 flex-col gap-1 rounded-md px-2.5 py-2 text-left transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", isCompareSource
                    ? "border border-dashed border-primary bg-primary-subtle"
                    : isSelected
                        ? "bg-accent-hover"
                        : "hover:bg-accent-hover"), children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("code", { className: "shrink-0 rounded bg-muted px-1.5 py-0.5 font-mono text-[11px] font-medium text-foreground", title: entry.id, children: entry.label }), isCompareSource && (_jsx("span", { className: "shrink-0 rounded-full bg-primary px-1.5 py-0.5 text-[10px] font-medium text-primary-foreground", children: "A" })), entry.tag && (_jsx("span", { className: "shrink-0 rounded-full bg-primary-subtle px-1.5 py-0.5 text-[10px] font-medium text-primary", children: entry.tag })), entry.isCurrent && (_jsx("span", { className: "shrink-0 rounded-full bg-status-ready-subtle px-1.5 py-0.5 text-[10px] font-medium text-status-ready", children: "current" })), trailing && (_jsx("div", { className: "ml-auto shrink-0", children: trailing }))] }), _jsxs("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [_jsx("time", { dateTime: entry.timestamp.toISOString(), title: entry.timestamp.toLocaleString(), children: formatRelativeTime(entry.timestamp) }), entry.actor && (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": "true", children: "\u00B7" }), _jsxs("span", { className: "flex items-center gap-1", children: [entry.actor.avatar && (_jsx("img", { src: entry.actor.avatar, alt: "", className: "size-3.5 rounded-full" })), _jsx("span", { children: entry.actor.displayName || entry.actor.id })] })] }))] }), entry.sublabel && (_jsx("p", { className: "text-xs text-muted-foreground", children: entry.sublabel })), entry.gitProvenance && (_jsx(GitProvenanceRow, { provenance: entry.gitProvenance }))] })] }));
}
// ---------------------------------------------------------------------------
// Git provenance inline display
// ---------------------------------------------------------------------------
function GitProvenanceRow({ provenance, }) {
    const repoUrl = normalizeGitUrl(provenance.remoteUrl);
    const truncatedCommit = provenance.commit.slice(0, 7);
    const commitUrl = repoUrl
        ? `${repoUrl}/commit/${provenance.commit}`
        : null;
    return (_jsxs("div", { className: "flex items-center gap-1.5 text-[11px] text-muted-foreground", children: [_jsx(GitIcon, { className: "size-3 shrink-0" }), provenance.ref && (_jsx("span", { className: "font-medium", children: provenance.ref })), commitUrl ? (_jsx("a", { href: commitUrl, target: "_blank", rel: "noopener noreferrer", className: "font-mono text-primary underline-offset-2 hover:underline", onClick: (e) => e.stopPropagation(), children: truncatedCommit })) : (_jsx("code", { className: "font-mono", children: truncatedCommit }))] }));
}
// ---------------------------------------------------------------------------
// Utilities
// ---------------------------------------------------------------------------
function formatRelativeTime(date) {
    const now = Date.now();
    const diffMs = now - date.getTime();
    const diffSec = Math.floor(diffMs / 1000);
    const diffMin = Math.floor(diffSec / 60);
    const diffHr = Math.floor(diffMin / 60);
    const diffDays = Math.floor(diffHr / 24);
    if (diffSec < 60)
        return "just now";
    if (diffMin < 60)
        return `${diffMin}m ago`;
    if (diffHr < 24)
        return `${diffHr}h ago`;
    if (diffDays < 7)
        return `${diffDays}d ago`;
    if (diffDays < 30)
        return `${Math.floor(diffDays / 7)}w ago`;
    return date.toLocaleDateString(undefined, {
        month: "short",
        day: "numeric",
        year: date.getFullYear() !== new Date().getFullYear() ? "numeric" : undefined,
    });
}
function normalizeGitUrl(url) {
    if (!url)
        return null;
    const cleaned = url.replace(/\.git$/, "");
    if (cleaned.startsWith("https://") || cleaned.startsWith("http://")) {
        return cleaned;
    }
    const sshMatch = cleaned.match(/^(?:git@|ssh:\/\/)([^:/]+)[:/](.+)$/);
    if (sshMatch) {
        return `https://${sshMatch[1]}/${sshMatch[2]}`;
    }
    return null;
}
// ---------------------------------------------------------------------------
// Icons
// ---------------------------------------------------------------------------
function GitIcon({ className }) {
    return (_jsxs("svg", { className: className, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("circle", { cx: "8", cy: "4", r: "2" }), _jsx("circle", { cx: "8", cy: "12", r: "2" }), _jsx("path", { d: "M8 6v4" })] }));
}
//# sourceMappingURL=VersionTimelineEntry.js.map