import React, { forwardRef } from 'react';
import { identity } from 'ramda';
import Checkbox from '@mui/material/Checkbox';
import MenuItem from '@mui/material/MenuItem';
import Typography from '@mui/material/Typography';
import { withTooltip } from '../../../HOCs/withTooltip';
import { useStyles } from './styles';
var MenuItemWithTooltip = withTooltip(MenuItem);
export var DefaultMenuItemRenderer = forwardRef(function (_a, ref) {
    var item = _a.item, _b = _a.onMenuClose, onMenuClose = _b === void 0 ? identity : _b;
    var styles = useStyles();
    var disabled = item.disabled, text = item.text, tooltip = item.tooltip, onClick = item.onClick, _c = item.id, id = _c === void 0 ? '' : _c, selectable = item.selectable, selected = item.selected;
    var handleClick = function (e) {
        onMenuClose(e);
        onClick(e);
    };
    return (React.createElement(MenuItemWithTooltip, { tooltipTitle: tooltip, showForDisabled: true, classes: { root: styles.menuItem }, onClick: handleClick, disabled: disabled, ref: ref, "data-modal": true, "data-reltio-id": "reltio-search-menu-item".concat(id) },
        selectable && React.createElement(Checkbox, { checked: selected, color: "primary" }),
        React.createElement(Typography, { classes: { root: styles.menuText } }, text)));
});
DefaultMenuItemRenderer.displayName = 'DefaultMenuItemRenderer';
