@mopinion/survey/features/form/components/CloseButton.js

Collect customer feedback with the Mopinion survey library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _preact = require("preact");
var _compat = require("preact/compat");
var _utils = require("../../../utils");
var _ConfigStore = require("../stores/ConfigStore");
var _FormStore = require("../stores/FormStore");
var _HandleTabIndex = _interopRequireDefault(require("../../elements/components/HandleTabIndex"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
var CloseButton = (0, _compat.forwardRef)(function CloseButton(props, ref) {
  var _useConfigStore = (0, _ConfigStore.useConfigStore)(),
    text = _useConfigStore.text;
  var _useFormStore = (0, _FormStore.useFormStore)(),
    feedbackButtonRef = _useFormStore.feedbackButtonRef,
    shiftFocusToTopRef = _useFormStore.shiftFocusToTopRef,
    actions = _useFormStore.actions;
  return (0, _preact.h)(_HandleTabIndex["default"], {
    component: "button",
    type: "button",
    id: "closeModalBtn",
    ref: ref,
    title: text.closeBtnTitle,
    "aria-label": text.closeBtnTitle,
    className: 'close-modal wcag',
    onClick: function onClick() {
      actions.toggleForm();
    },
    style: {
      backgroundColor: 'transparent',
      boxShadow: 'none',
      border: 'none'
    },
    "data-testid": "close",
    onKeyDown: function onKeyDown(e) {
      if (e.key === 'Enter') {
        (0, _utils.tryFocus)(feedbackButtonRef.current);
      }
      if (e.key === 'Tab' && e.shiftKey) {
        e.preventDefault();
        (0, _utils.tryFocus)(shiftFocusToTopRef.current);
      }
    }
  });
});
var _default = exports["default"] = CloseButton;
//# sourceMappingURL=CloseButton.js.map