import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2024-2025 GoodData Corporation
import { Bubble, BubbleHoverTrigger, IconQuestionMark } from "@gooddata/sdk-ui-kit";
import { useTheme } from "@gooddata/sdk-ui-theme-provider";
const TOOLTIP_ALIGN_POINTS = [{ align: "cr cl", offset: { x: 10, y: 0 } }];
function DescriptionIconWithTooltip({ snippet }) {
    const theme = useTheme();
    return (_jsx("span", { children: _jsx("span", { className: "gd-bubble-trigger-wrapper", children: _jsxs(BubbleHoverTrigger, { children: [
                    _jsx(IconQuestionMark, { color: theme?.palette?.complementary?.c7 ?? "#B0BECA", width: 16, height: 16, className: "gd-advanced-customization-dialog__snippet__tooltip__trigger" }), _jsx(Bubble, { alignPoints: TOOLTIP_ALIGN_POINTS, className: "bubble-light", children: _jsxs("div", { className: "gd-advanced-customization-dialog__snippet__tooltip", children: [
                                _jsx("div", { className: "gd-advanced-customization-dialog__snippet__tooltip__header", children: snippet.name }), _jsx("div", { className: "gd-advanced-customization-dialog__snippet__tooltip__body", children: snippet.description })
                            ] }) })
                ] }) }) }));
}
export function SnippetHeader({ snippet }) {
    return _jsx("div", { className: "gd-advanced-customization-dialog__snippet--header", children: snippet.name });
}
export function SnippetItem({ snippet, onClick }) {
    return (_jsxs("div", { onClick: () => onClick(snippet), className: "gd-advanced-customization-dialog__snippet", children: [
            _jsx("span", { children: snippet.name }), _jsx(DescriptionIconWithTooltip, { snippet: snippet })
        ] }));
}
//# sourceMappingURL=SnippetItem.js.map