"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

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

var _classnames = _interopRequireDefault(require("classnames"));

var _uiUtilities = _interopRequireDefault(require("@teamleader/ui-utilities"));

var _theme = _interopRequireDefault(require("./theme.css"));

var _box = _interopRequireDefault(require("../box"));

var _typography = require("../typography");

var _EmailSuggestion = _interopRequireDefault(require("./EmailSuggestion"));

var Autocomplete = function Autocomplete(_ref) {
  var suggestions = _ref.suggestions,
      highlightedSuggestion = _ref.highlightedSuggestion,
      onClick = _ref.onClick,
      onHover = _ref.onHover,
      _ref$renderSuggestion = _ref.renderSuggestion,
      renderSuggestion = _ref$renderSuggestion === void 0 ? _EmailSuggestion.default : _ref$renderSuggestion,
      menuWidth = _ref.menuWidth;
  var Component = renderSuggestion;
  return /*#__PURE__*/_react.default.createElement(_box.default, {
    className: (0, _classnames.default)(_uiUtilities.default['box-shadow-200'], _theme.default['autocomplete']),
    style: {
      width: menuWidth
    }
  }, /*#__PURE__*/_react.default.createElement(_box.default, {
    backgroundColor: "neutral",
    backgroundTint: "lightest",
    borderWidth: 1,
    borderRadius: "rounded",
    overflow: "hidden"
  }, Array.isArray(suggestions) ? suggestions.map(function (suggestion) {
    return /*#__PURE__*/_react.default.createElement(Component, {
      key: suggestion.id || suggestion.email,
      suggestion: suggestion,
      selected: suggestion === highlightedSuggestion,
      onClick: onClick === null || onClick === void 0 ? void 0 : onClick.bind(null, suggestion),
      onMouseOver: onHover === null || onHover === void 0 ? void 0 : onHover.bind(null, suggestion)
    });
  }) : Object.keys(suggestions).map(function (key, i) {
    return /*#__PURE__*/_react.default.createElement(_box.default, {
      key: key,
      borderTopWidth: i > 0 ? 1 : 0
    }, /*#__PURE__*/_react.default.createElement(_typography.Heading4, {
      padding: 3,
      paddingTop: 4
    }, key), suggestions[key].map(function (suggestion) {
      return /*#__PURE__*/_react.default.createElement(Component, {
        key: suggestion.id || suggestion.email,
        suggestion: suggestion,
        selected: suggestion === highlightedSuggestion,
        onClick: onClick === null || onClick === void 0 ? void 0 : onClick.bind(null, suggestion),
        onMouseOver: onHover === null || onHover === void 0 ? void 0 : onHover.bind(null, suggestion)
      });
    }));
  })));
};

var _default = Autocomplete;
exports.default = _default;