import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2026 GoodData Corporation
import { useState } from "react";
import { defineMessages, useIntl } from "react-intl";
import { ConfirmDialog, UiTooltip } from "@gooddata/sdk-ui-kit";
const messages = defineMessages({
    dialogTitle: { id: "export.template.dialog.title" },
    exportButton: { id: "export.template.dialog.export" },
    cancelButton: { id: "cancel" },
});
export function ExportTemplateSelectionDialog({ templates, onConfirm, onCancel, }) {
    const intl = useIntl();
    const [selectedTemplateId, setSelectedTemplateId] = useState(templates[0]?.id ?? "");
    const handleSubmit = () => {
        onConfirm(selectedTemplateId);
    };
    return (_jsx(ConfirmDialog, { className: "gd-export-template-selection-dialog s-export-template-selection-dialog", isPositive: true, displayCloseButton: true, headline: intl.formatMessage(messages.dialogTitle), cancelButtonText: intl.formatMessage(messages.cancelButton), submitButtonText: intl.formatMessage(messages.exportButton), onCancel: onCancel, onClose: onCancel, onSubmit: handleSubmit, children: _jsx("div", { className: "gd-export-template-list", role: "radiogroup", "aria-label": intl.formatMessage(messages.dialogTitle), children: templates.map((template) => (_jsx(UiTooltip, { triggerBy: ["hover", "focus"], arrowPlacement: "bottom", content: template.name, anchor: _jsxs("label", { className: "gd-export-template-item input-radio-label s-export-template-item", children: [
                        _jsx("input", { type: "radio", className: "input-radio", name: "exportTemplate", value: template.id, checked: selectedTemplateId === template.id, onChange: () => setSelectedTemplateId(template.id) }), _jsx("span", { className: "input-label-text", children: template.name })
                    ] }) }, template.id))) }) }));
}
