import React from 'react';
import Box from '@material-ui/core/Box';
import Checkbox from '@material-ui/core/Checkbox';
import Tooltip from '@material-ui/core/Tooltip';
import Typography from '@material-ui/core/Typography';
import CheckBoxIcon from '@material-ui/icons/CheckBox';
import CheckBoxOutlineBlankIcon from '@material-ui/icons/CheckBoxOutlineBlank';
import { useComboBoxStyles } from './useComboBoxStyles.esm.js';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import { withStyles } from '@material-ui/core/styles';

const FixedWidthFormControlLabel = withStyles(
  (_theme) => ({
    label: {
      width: "100%"
    },
    root: {
      width: "90%"
    }
  }),
  { name: "FixedWidthFormControlLabel" }
)(FormControlLabel);
const icon = /* @__PURE__ */ React.createElement(CheckBoxOutlineBlankIcon, { fontSize: "small" });
const checkedIcon = /* @__PURE__ */ React.createElement(CheckBoxIcon, { fontSize: "small" });
function RenderOptionLabel(props) {
  const classes = useComboBoxStyles();
  return /* @__PURE__ */ React.createElement(Box, { className: classes.fullWidth }, /* @__PURE__ */ React.createElement(
    FixedWidthFormControlLabel,
    {
      className: classes.fullWidth,
      control: /* @__PURE__ */ React.createElement(
        Checkbox,
        {
          icon,
          checkedIcon,
          checked: props.isSelected
        }
      ),
      onClick: (event) => event.preventDefault(),
      label: /* @__PURE__ */ React.createElement(Tooltip, { title: props.title }, /* @__PURE__ */ React.createElement(Box, { display: "flex", alignItems: "center" }, /* @__PURE__ */ React.createElement(Box, { className: classes.boxLabel }, /* @__PURE__ */ React.createElement(Typography, { noWrap: true }, props.title))))
    }
  ));
}

export { RenderOptionLabel };
//# sourceMappingURL=RenderOptionLabel.esm.js.map
