import React from "react";
function getAttachmentExtensionLabel(fileName) {
    if (!fileName) {
        return null;
    }
    const trimmedName = fileName.trim();
    const lastDotIndex = trimmedName.lastIndexOf(".");
    if (lastDotIndex === -1 || lastDotIndex === trimmedName.length - 1) {
        return null;
    }
    return trimmedName.substring(lastDotIndex + 1).toUpperCase();
}
const AttachmentCard = (props) => {
    const { attachment } = props;
    const extensionLabel = getAttachmentExtensionLabel(attachment.name);
    return (React.createElement("li", null,
        React.createElement("a", { href: attachment.downloadUrl, target: "_blank", rel: "noopener noreferrer", title: attachment.name, className: "group flex items-center justify-between gap-3 rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm text-gray-900 transition hover:border-gray-300 hover:bg-gray-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-200" },
            React.createElement("span", { className: "flex items-center gap-3 min-w-0" },
                React.createElement("span", { className: "flex flex-col min-w-0" },
                    React.createElement("span", { className: "text-sm font-medium text-gray-900 truncate" }, attachment.name || "Attachment"),
                    extensionLabel && (React.createElement("span", { className: "text-[11px] font-semibold uppercase tracking-wide text-gray-400" }, extensionLabel)))),
            React.createElement("span", { className: "flex flex-shrink-0 items-center text-gray-500 text-xs font-semibold uppercase tracking-wide" }, "Download"))));
};
const EventAttachmentList = (props) => {
    const { attachments, title = "Attachments", variant = "section", showHeader = true, showCount = true, className = "", } = props;
    if (!attachments || attachments.length === 0) {
        return null;
    }
    const attachmentsList = (React.createElement("ul", { className: "space-y-2" }, attachments.map((attachment, index) => {
        return React.createElement(AttachmentCard, { attachment: attachment, key: index });
    })));
    if (variant === "inline") {
        return React.createElement("div", { className: className }, attachmentsList);
    }
    return (React.createElement("div", { className: `mt-4 rounded-2xl border border-gray-100 bg-gray-50/80 p-4 ${className}`.trim() },
        showHeader && (React.createElement("div", { className: "flex items-center justify-between text-xs font-semibold uppercase tracking-wide text-gray-500" },
            React.createElement("span", null, title),
            showCount && (React.createElement("span", { className: "rounded-full bg-white px-2 py-0.5 text-[11px] font-semibold text-gray-600" }, attachments.length)))),
        React.createElement("div", { className: "mt-3" }, attachmentsList)));
};
export default EventAttachmentList;
//# sourceMappingURL=EventAttachmentList.js.map