import React, { useCallback } from 'react';
import { DropdownItem } from '@atlaskit/dropdown-menu';
import Lozenge from '@atlaskit/lozenge';
var LozengeActionItem = function LozengeActionItem(_ref) {
  var appearance = _ref.appearance,
    id = _ref.id,
    onClick = _ref.onClick,
    testId = _ref.testId,
    text = _ref.text;
  var handleClick = useCallback(function (e) {
    // Prevent dropdown to close on select item.
    // We want to show loading screen.
    e.stopPropagation();
    if (onClick) {
      onClick(id, text, appearance);
    }
  }, [appearance, id, onClick, text]);
  var handleMouseEnter = useCallback(function (e) {
    var _e$currentTarget;
    (_e$currentTarget = e.currentTarget) === null || _e$currentTarget === void 0 || (_e$currentTarget = _e$currentTarget.firstElementChild) === null || _e$currentTarget === void 0 || _e$currentTarget.focus();
  }, []);
  return /*#__PURE__*/React.createElement("span", {
    onFocus: handleMouseEnter,
    onMouseEnter: handleMouseEnter,
    role: "presentation"
  }, /*#__PURE__*/React.createElement(DropdownItem, {
    onClick: handleClick,
    testId: testId
  }, /*#__PURE__*/React.createElement(Lozenge, {
    appearance: appearance,
    isBold: true
  }, text)));
};
export default LozengeActionItem;