"use strict";

exports.__esModule = true;
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _material = require("@mui/material");

var _styles = require("@mui/material/styles");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const PREFIX = 'SCRichTextEditorAutocomplete';
const classes = {
  container: `${PREFIX}-container`,
  item: `${PREFIX}-item`
};
const Root = (0, _styles.styled)(_material.Paper, {
  name: PREFIX,
  slot: 'Root',
  overridesResolver: (_, styles) => styles.root
})(() => ({
  [`&.${classes.container}`]: {
    minWidth: '200px',
    position: 'absolute',
    zIndex: 10
  },
  [`& .${classes.item}`]: {
    cursor: 'pointer'
  }
}));

const Autocomplete = props => {
  if (!props.items.length) {
    return null;
  }

  return /*#__PURE__*/_react.default.createElement(Root, {
    className: classes.container,
    style: {
      top: props.top,
      left: props.left
    }
  }, /*#__PURE__*/_react.default.createElement(_material.List, {
    dense: true
  }, props.items.map((item, index) => /*#__PURE__*/_react.default.createElement(_material.ListItem, {
    key: index,
    className: classes.item,
    selected: index === props.selectedIndex,
    onClick: () => props.onClick(index)
  }, item.content))));
};

var _default = Autocomplete;
exports.default = _default;