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

Collect customer feedback with the Mopinion survey library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = FormBlock;
var _preact = require("preact");
var _compat = require("preact/compat");
var _hooks = require("preact/hooks");
var _utils = require("../../../utils");
var _constants = require("../../../constants");
var _elements = require("../../elements");
var _useBlock2 = _interopRequireDefault(require("../hooks/useBlock"));
var _ConfigStore = require("../stores/ConfigStore");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var blockComponentMap = _defineProperty({
  textarea: _elements.TextInput,
  input: _elements.TextInput,
  radio: _elements.SelectList,
  checkbox: _elements.SelectList,
  select: _elements.DropDown,
  rating: _elements.Rating,
  nps: _elements.Rating,
  ces: _elements.Rating,
  gcr: _elements.SelectList,
  thumbs: _elements.SelectList,
  category: _elements.SelectList,
  contact: _elements.Contact,
  link: _elements.Link,
  likert: _elements.MatrixLikert,
  matrix: _elements.MatrixLikert,
  screenshot: _elements.Screenshot,
  website_data: _elements.ExternalData,
  section_break: _elements.Section,
  recaptcha: _elements.ReCaptchaWrapper,
  multimedia: _elements.Multimedia
}, _constants.honeyBotTypeName, _elements.HoneyBot);
function ExtraElements(_ref) {
  var state = _ref.state,
    block = _ref.block,
    actions = _ref.actions,
    showErrors = _ref.showErrors;
  var inputElement = block.properties.elements_extra[Object.keys(block.properties.elements_extra).pop()];
  return (0, _preact.h)(_preact.Fragment, null, (0, _preact.h)("div", {
    style: {
      display: state[inputElement.data_field].isVisible ? 'block' : 'none',
      marginTop: 8
    }
  }, ['checkbox', 'radio', 'select'].indexOf(block.typeName) > -1 && (0, _preact.h)(_elements.TextInput, {
    block: block,
    state: state[inputElement.data_field],
    setValue: function setValue(value) {
      return actions.setNestedValue(inputElement.data_field, value);
    },
    showErrors: showErrors,
    placeholder: inputElement.placeholder
  })));
}
function FormBlock(_ref2) {
  var _block$properties, _blockComponentMap$bl, _block$properties2, _block$properties3;
  var id = _ref2.id,
    showErrors = _ref2.showErrors,
    firstInvalid = _ref2.firstInvalid;
  var _useConfigStore = (0, _ConfigStore.useConfigStore)(),
    text = _useConfigStore.text;
  var _useBlock = (0, _useBlock2["default"])({
      id: id
    }),
    state = _useBlock.state,
    block = _useBlock.block,
    actions = _useBlock.actions,
    errorMessage = _useBlock.errorMessage,
    errorMessages = _useBlock.errorMessages;
  var _id = (0, _hooks.useRef)((0, _utils.rnd)());
  if (block.typeName === 'screenshot' && (_block$properties = block.properties) !== null && _block$properties !== void 0 && _block$properties.bottomScreen) {
    return null;
  }
  var BlockComponent = (_blockComponentMap$bl = blockComponentMap[block.typeName]) !== null && _blockComponentMap$bl !== void 0 ? _blockComponentMap$bl : null;
  return (0, _preact.h)(_elements.Group, {
    block: block,
    focusInvalid: showErrors && firstInvalid,
    show: _constants.alwaysNotVisibleBlocks.indexOf(block.typeName) > -1 ? false : state.isVisible,
    typeCount: state.typeCount,
    _id: _id.current
  }, (0, _preact.h)(_elements.GroupTitle, {
    required: (_block$properties2 = block.properties) === null || _block$properties2 === void 0 ? void 0 : _block$properties2.required,
    block: block,
    requiredMarkLabel: errorMessage !== null && errorMessage !== void 0 ? errorMessage : text === null || text === void 0 ? void 0 : text.requiredMarkLabel,
    _id: _id.current
  }, block.title), (0, _preact.h)(BlockComponent, _extends({
    block: block,
    state: state
  }, actions, {
    text: text,
    showErrors: showErrors,
    showError: state.showError,
    errorMessages: errorMessages,
    _id: _id.current
  })), ((_block$properties3 = block.properties) === null || _block$properties3 === void 0 ? void 0 : _block$properties3.elements_extra) && (0, _preact.h)(ExtraElements, {
    block: block,
    state: state,
    actions: actions,
    showErrors: showErrors
  }), state.showError && block.typeName !== 'contact' && (0, _preact.h)(_elements.ErrorMessage, {
    id: "error-message-".concat(block.id),
    showErrors: showErrors
  }, errorMessage));
}
//# sourceMappingURL=FormBlock.js.map