import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import cx from "classnames";
import { Item, UiTooltip } from "@gooddata/sdk-ui-kit";
export const DashboardInsightMenuItemButton = (props) => {
    const { itemName, itemId, disabled, icon, onClick, tooltip, isFocused, className, submenu = false, } = props;
    // for JSX icons we need an extra gd-icon-wrapper class to align the icon and the text vertically
    return renderButtonWithTooltip(_jsx(Item, { className: className, testId: itemId, onClick: disabled ? undefined : onClick, disabled: disabled, subMenu: submenu, children: _jsxs("span", { className: cx({ "gd-icon-wrapper": icon && typeof icon !== "string" }), children: [icon ? typeof icon === "string" ? _jsx("i", { "aria-hidden": true, className: icon }) : icon : null, itemName] }) }), disabled, tooltip, isFocused);
};
function renderButtonWithTooltip(button, disabled, tooltip, isFocused) {
    if (tooltip && disabled) {
        return (_jsxs(_Fragment, { children: [
                _jsx(UiTooltip, { triggerBy: isFocused ? [] : ["hover", "focus"], arrowPlacement: "left", optimalPlacement: true, content: tooltip, anchor: button }), _jsx("div", { className: "sr-only", "aria-live": "polite", children: tooltip })
            ] }));
    }
    else {
        return button;
    }
}
