import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Tooltip } from "@mui/material";
import Button from "../Button";
import Icon from "../Icon";
import "./styles.scss";
export const TooltipModes = ["simple", "confirmation", "delete"];
export const TooltipPlacements = [
    "auto-end",
    "auto-start",
    "auto",
    "bottom-end",
    "bottom-start",
    "bottom",
    "left-end",
    "left-start",
    "left",
    "right-end",
    "right-start",
    "right",
    "top-end",
    "top-start",
    "top",
];
export default function TooltipComponent({ children, mode = "simple", placement = "bottom", title, desc, cancel, confirm, triggerOpen, className, }) {
    const tooltipSimpleClassName = ["ds-tooltip-simple", className].filter(Boolean).join(" ");
    const tooltipComplexClassName = ["ds-tooltip", className].filter(Boolean).join(" ");
    const renderSimple = () => (_jsx(Tooltip, { title: title, placement: placement, open: triggerOpen !== undefined ? triggerOpen : undefined, arrow: true, classes: {
            tooltip: tooltipSimpleClassName,
            popper: "ds-tooltip-popper",
        }, children: children }));
    const renderInnerComplex = () => (_jsxs("div", { className: "tooltip-box", children: [_jsxs("div", { className: "body", children: [_jsx(Icon, { name: mode === "delete" ? "delete" : "help_center", size: "small", className: mode, filled: mode === "confirmation" }), _jsxs("div", { className: "texts", children: [_jsx("div", { className: "title", children: title }), _jsx("div", { className: "desc", children: desc || "" })] })] }), _jsxs("div", { className: "footer", children: [cancel && (_jsx(Button, { text: cancel.label, size: "x-small", mode: "ghost", onClick: cancel.onClick, color: mode === "delete" ? "danger" : "white", icon: cancel.icon })), confirm && (_jsx(Button, { text: confirm.label, size: "x-small", mode: "filled", onClick: confirm.onClick, color: mode === "delete" ? "danger" : "white", icon: confirm.icon }))] })] }));
    const renderComplex = () => (_jsx(Tooltip, { classes: {
            tooltip: tooltipComplexClassName,
            popper: "ds-tooltip-popper",
        }, title: renderInnerComplex(), placement: placement, arrow: true, open: triggerOpen !== undefined ? triggerOpen : undefined, disableFocusListener: triggerOpen !== undefined, disableHoverListener: triggerOpen !== undefined, disableTouchListener: triggerOpen !== undefined, children: children }));
    return mode === "simple" ? renderSimple() : renderComplex();
}
