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 { useStyles } from './styles';
export var SettingsMenuItemRenderer = forwardRef(function (_a, ref) {
    var item = _a.item, _b = _a.onMenuClose, onMenuClose = _b === void 0 ? identity : _b;
    var styles = useStyles();
    var text = item.text, onClick = item.onClick, id = item.id, selected = item.selected;
    var handleClick = function (e) {
        onMenuClose(e);
        onClick(e);
    };
    return (React.createElement(MenuItem, { classes: { root: styles.menuItem }, onClick: handleClick, ref: ref, "data-modal": true, "data-reltio-id": "reltio-settings-menu-item".concat(id) },
        React.createElement(Checkbox, { checked: selected, className: styles.checkbox, color: "primary" }),
        React.createElement(Typography, { classes: { root: styles.menuText } }, text)));
});
SettingsMenuItemRenderer.displayName = 'SettingsMenuItemRenderer';
