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

Collect customer feedback with the Mopinion survey library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = SlideInForm;
var _preact = require("preact");
var _components = require("../../../components");
var _ConfigStore = require("../stores/ConfigStore");
var _FormStore = require("../stores/FormStore");
var _FormWindow = _interopRequireDefault(require("./FormWindow"));
var _FeedbackButton = _interopRequireDefault(require("./FeedbackButton"));
var _CloseButton = _interopRequireDefault(require("./CloseButton"));
var _BaseForm = _interopRequireDefault(require("./BaseForm"));
var _LanguageToggle = _interopRequireDefault(require("./LanguageToggle"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function SlideInForm() {
  var _useFormStore = (0, _FormStore.useFormStore)(),
    feedbackButtonRef = _useFormStore.feedbackButtonRef,
    closeButtonRef = _useFormStore.closeButtonRef,
    frameRef = _useFormStore.frameRef,
    formBodyRef = _useFormStore.formBodyRef,
    wrapStyle = _useFormStore.wrapStyle,
    buttonType = _useFormStore.buttonType,
    formType = _useFormStore.formType,
    position = _useFormStore.position,
    formOpen = _useFormStore.formOpen,
    screenshotActive = _useFormStore.screenshotActive,
    formActions = _useFormStore.actions;
  var _useFormProps = (0, _ConfigStore.useFormProps)(),
    formKey = _useFormProps.formKey;
  var _useProperties = (0, _ConfigStore.useProperties)(),
    conversational = _useProperties.conversational,
    _useProperties$transl = _useProperties.translation,
    translation = _useProperties$transl === void 0 ? {} : _useProperties$transl;
  var _useConfigStore = (0, _ConfigStore.useConfigStore)(),
    themeClass = _useConfigStore.themeClass;
  return (0, _preact.h)(_components.Portal, {
    into: document.body
  }, (0, _preact.h)("div", {
    className: "mopinion-survey-content wcag ".concat(themeClass),
    "data-mop-form-type": formType
  }, (0, _preact.h)("div", {
    id: "surveyWindowWrap",
    "class": "surveyWindowWrap mopinion-slider slide-".concat(position, " ").concat(formOpen ? 'mopinion-slider-active' : '', " ").concat(screenshotActive ? 'screen-capture-active' : ''),
    "data-parent-for": formKey,
    style: wrapStyle,
    onKeyDown: function onKeyDown(e) {
      return formActions.handleWCAGkeyEvents(e);
    }
  }, (0, _preact.h)("div", {
    "class": "surveySliderScroller",
    id: "surveySliderScroller",
    style: !conversational ? {
      maxHeight: '80vh',
      overflowY: 'auto',
      '-webkit-overflow-scrolling': 'touch',
      '-ms-overflow-style': '-ms-autohiding-scrollbar'
    } : {
      overflow: 'hidden'
    }
  }, (0, _preact.h)(_FormWindow["default"], {
    ref: frameRef
  }, (0, _preact.h)("div", {
    id: "surveyBody",
    style: {
      overflow: 'hidden'
    },
    className: "mopinion-slide",
    ref: formBodyRef,
    role: "dialog",
    "aria-labelledby": "surveyTitle-".concat(formKey)
  }, (0, _preact.h)(_CloseButton["default"], {
    ref: closeButtonRef
  }), (translation === null || translation === void 0 ? void 0 : translation.useTranslation) && (translation === null || translation === void 0 ? void 0 : translation.useToggle) && (0, _preact.h)(_LanguageToggle["default"], null), (0, _preact.h)(_BaseForm["default"], null)))), buttonType === 'label' && (0, _preact.h)(_FeedbackButton["default"], {
    ref: feedbackButtonRef
  })), buttonType === 'float' && (0, _preact.h)(_FeedbackButton["default"], {
    ref: feedbackButtonRef
  })));
}
//# sourceMappingURL=SlideInForm.js.map