"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.ModalClose = ModalClose;var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
var _globalObject = require("@skbkontur/global-object");

var _useLocaleForControl = require("../../lib/locale/useLocaleForControl");
var _ThemeContext = require("../../lib/theming/ThemeContext");
var _Emotion = require("../../lib/theming/Emotion");
var _keyListener = require("../../lib/events/keyListener");
var _ResponsiveLayout = require("../ResponsiveLayout");
var _CommonWrapper = require("../../internal/CommonWrapper");
var _XIcon20Regular = require("../../internal/icons2022/XIcon/XIcon20Regular");
var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");


var _Modal = require("./Modal.styles");
var _Modal2 = require("./Modal");
var _locale = require("./locale");var _excluded = ["disableClose", "requestClose"];

function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _ref.requestClose,otherProps = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
  var locale = (0, _useLocaleForControl.useLocaleForControl)('Modal', _locale.ModalLocaleHelper);
  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
  var _React$useState = _react.default.useState(false),focusedByTab = _React$useState[0],setFocusedByTab = _React$useState[1];

  var handleFocus = function handleFocus() {
    // focus event fires before keyDown eventlistener
    // so we should check tabPressed in async way
    _globalObject.globalObject.requestAnimationFrame == null || _globalObject.globalObject.requestAnimationFrame(function () {
      if (_keyListener.keyListener.isTabPressed) {
        setFocusedByTab(true);
      }
    });
  };

  var handleBlur = function handleBlur() {
    setFocusedByTab(false);
  };

  var icon = /*#__PURE__*/_react.default.createElement(_XIcon20Regular.XIcon20Regular, { align: "none" });
  var versionGTE5_1 = (0, _ThemeHelpers.isThemeGTE)(theme, '5.1');

  return /*#__PURE__*/(
    _react.default.createElement(_CommonWrapper.CommonWrapper, otherProps, /*#__PURE__*/
    _react.default.createElement(_ResponsiveLayout.ResponsiveLayout, null,
    function (_ref2) {var _cx;var isMobile = _ref2.isMobile;return /*#__PURE__*/(
        _react.default.createElement("button", {
          "aria-label": locale.closeButtonAriaLabel,
          className: (0, _Emotion.cx)((_cx = {}, _cx[
          _Modal.styles.close(theme)] = true, _cx[
          _Modal.styles.close5_1(theme)] = versionGTE5_1, _cx[
          _Modal.styles.closeMobile(theme)] = isMobile, _cx[
          _Modal.styles.closeMobile5_1(theme)] = isMobile && versionGTE5_1, _cx[
          _Modal.styles.disabled(theme)] = disableClose, _cx[
          _Modal.styles.focus(theme)] = focusedByTab && !versionGTE5_1, _cx[
          _Modal.styles.focus5_1(theme)] = focusedByTab && versionGTE5_1, _cx)
          ),
          onClick: requestClose,
          onFocus: handleFocus,
          onBlur: handleBlur,
          "data-tid": _Modal2.ModalDataTids.close,
          tabIndex: disableClose ? -1 : 0 },

        icon
        ));}

    )
    ));

}

ModalClose.__KONTUR_REACT_UI__ = 'ModalClose';
ModalClose.displayName = 'ModalClose';