react-survey-builder 1.0.76 → 1.0.77

package/dist/bundle.js

@@ -917,7 +917,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _multi_column__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./multi-column */ \"./src/multi-column/index.js\");\n/* harmony import */ var _fieldset__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fieldset */ \"./src/fieldset/index.js\");\n/* harmony import */ var _step__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./step */ \"./src/step/index.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-hook-form */ \"./node_modules/react-hook-form/dist/index.esm.mjs\");\nfunction _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); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\nvar ReactSurveyFormFields = function ReactSurveyFormFields(_ref) {\n  var _ref$validateForCorre = _ref.validateForCorrectness,\n    validateForCorrectness = _ref$validateForCorre === void 0 ? false : _ref$validateForCorre,\n    _ref$displayShort = _ref.displayShort,\n    displayShort = _ref$displayShort === void 0 ? false : _ref$displayShort,\n    _ref$readOnly = _ref.readOnly,\n    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,\n    downloadPath = _ref.downloadPath,\n    answers = _ref.answers,\n    onSubmit = _ref.onSubmit,\n    onChange = _ref.onChange,\n    items = _ref.items,\n    _ref$submitButton = _ref.submitButton,\n    submitButton = _ref$submitButton === void 0 ? false : _ref$submitButton,\n    _ref$backButton = _ref.backButton,\n    backButton = _ref$backButton === void 0 ? false : _ref$backButton,\n    _ref$backAction = _ref.backAction,\n    backAction = _ref$backAction === void 0 ? null : _ref$backAction,\n    _ref$hideActions = _ref.hideActions,\n    hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,\n    _ref$hideLabels = _ref.hideLabels,\n    hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,\n    variables = _ref.variables,\n    buttonClassName = _ref.buttonClassName,\n    checkboxButtonClassName = _ref.checkboxButtonClassName,\n    headerClassName = _ref.headerClassName,\n    labelClassName = _ref.labelClassName,\n    formId = _ref.formId,\n    methods = _ref.methods,\n    _ref$print = _ref.print,\n    print = _ref$print === void 0 ? false : _ref$print;\n  //#region helper functions\n\n  var _convert = function _convert($dataAnswers) {\n    if (Array.isArray($dataAnswers)) {\n      var result = {};\n      $dataAnswers.forEach(function (answer) {\n        result[answer.name] = answer.value;\n      });\n      return result;\n    }\n    return $dataAnswers || {};\n  };\n  var form = react__WEBPACK_IMPORTED_MODULE_0___default().useRef();\n  var inputs = react__WEBPACK_IMPORTED_MODULE_0___default().useRef({});\n  var answerData = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(_convert(answers));\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    formAnswers = _React$useState2[0],\n    setFormAnswers = _React$useState2[1];\n  var _getDefaultValue = function _getDefaultValue($dataItem) {\n    var defaultValue = answerData.current[$dataItem.fieldName];\n    if ($dataItem.element === 'DatePicker') {\n      var _$dataItem$defaultTod;\n      var defaultToday = (_$dataItem$defaultTod = $dataItem.defaultToday) !== null && _$dataItem$defaultTod !== void 0 ? _$dataItem$defaultTod : false;\n      if (defaultToday && (defaultValue === '' || defaultValue === undefined)) {\n        var today = new Date();\n        var dd = today.getDate();\n        var mm = today.getMonth() + 1;\n        var yyyy = today.getFullYear();\n        if (dd < 10) {\n          dd = '0' + dd;\n        }\n        if (mm < 10) {\n          mm = '0' + mm;\n        }\n        today = mm + '/' + dd + '/' + yyyy;\n        defaultValue = today;\n      }\n    }\n    if ($dataItem.element === 'Checkbox') {\n      var _$dataItem$defaultChe;\n      var defaultChecked = (_$dataItem$defaultChe = $dataItem.defaultChecked) !== null && _$dataItem$defaultChe !== void 0 ? _$dataItem$defaultChe : false;\n      if (defaultChecked === true) {\n        defaultValue = true;\n      }\n    }\n    if (defaultValue === undefined) {\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'Tags') {\n        defaultValue = [];\n      } else if ($dataItem.element === 'NumberInput' || $dataItem.element === 'Range') {\n        var _$dataItem$minValue;\n        defaultValue = (_$dataItem$minValue = $dataItem.minValue) !== null && _$dataItem$minValue !== void 0 ? _$dataItem$minValue : 0;\n      } else {\n        defaultValue = '';\n      }\n    }\n    return defaultValue;\n  };\n  var _optionsDefaultValue = function _optionsDefaultValue($dataItem) {\n    var defaultValue = _getDefaultValue($dataItem);\n    if (defaultValue) {\n      return defaultValue;\n    }\n    var defaultChecked = [];\n    $dataItem.options.forEach(function (option) {\n      if (answerData.current[\"option_\".concat(option.key)]) {\n        defaultChecked.push(option.key);\n      }\n    });\n    return defaultChecked;\n  };\n  var _getItemValue = function _getItemValue($dataItem, ref) {\n    var _ref$inputField;\n    var $item = {\n      element: $dataItem.element,\n      value: ''\n    };\n    var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();\n    if ($dataItem.element === 'Rating') {\n      $item.value = ref.inputField.current.state.rating;\n    } else if ($dataItem.element === 'Tags') {\n      $item.value = $formData[$dataItem.fieldName];\n      // } else if (item.element === 'DatePicker') {\n      // \t$item.value = ref.state.value;\n    } else if ($dataItem.element === 'Camera') {\n      $item.value = ref.state.img;\n    } else if ($dataItem.element === 'FileUpload') {\n      $item.value = ref.state.fileUpload;\n    } else if ($dataItem.element === 'Signature') {\n      $item.value = ref.state.value;\n    } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {\n      $item = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.inputField.current);\n      if ($item && typeof $item.value === 'string') {\n        $item.value = $item.value.trim();\n      }\n    } else {\n      $item.value = $formData[$dataItem.fieldName];\n    }\n    return $item;\n  };\n  var _isIncorrect = function _isIncorrect($dataItem) {\n    var incorrect = false;\n    var canHaveAnswer = ['NumberInput', 'EmailInput', 'TextInput', 'PhoneNumber', 'TextArea', 'DatePicker', 'Dropdown', 'Tags', 'Checkboxes', 'Checkbox', 'RadioButtons', 'Rating', 'Range'].indexOf($dataItem.element) !== -1;\n    if (canHaveAnswer) {\n      var ref = inputs.current[$dataItem.fieldName];\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {\n        $dataItem.options.forEach(function (option) {\n          var $option = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.options[\"child_ref_\".concat(option.key)]);\n          if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {\n            incorrect = true;\n          }\n        });\n      } else {\n        var $item = _getItemValue($dataItem, ref);\n        if ($dataItem.element === 'Rating' || $dataItem.element === 'Range' || $dataItem.element === 'NumberInput') {\n          // number to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($dataItem.element === 'Checkbox') {\n          // boolean to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($item.value.toLowerCase() !== $dataItem.correct.trim().toLowerCase()) {\n          incorrect = true;\n        }\n      }\n    }\n    return incorrect;\n  };\n  var _collectFormData = function _collectFormData($dataItems, $formData) {\n    var formData = [];\n    $dataItems.filter(function (i) {\n      return i[\"static\"] !== true;\n    }).forEach(function (item) {\n      var itemData = {\n        id: item.id,\n        name: item.fieldName,\n        customName: item.customName || item.fieldName,\n        label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',\n        value: $formData[item.fieldName],\n        required: item.required || false\n      };\n      if (itemData) {\n        formData.push(itemData);\n      }\n    });\n    return formData;\n  };\n\n  //#endregion\n  //#region form methods\n\n  var handleSubmit = function handleSubmit($formData, event) {\n    event.preventDefault();\n    var hasErrors = false;\n    if (validateForCorrectness) {\n      hasErrors = validateForm();\n    }\n\n    // Only submit if there are no errors.\n    if (hasErrors === false) {\n      if (onSubmit) {\n        var $data = _collectFormData(items, $formData);\n        onSubmit({\n          formData: $formData,\n          answers: $data\n        });\n        setFormAnswers($data);\n      } else {\n        var $form = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(form.current);\n        $form.submit();\n      }\n    }\n  };\n  var handleChange = function handleChange(event) {\n    // Call submit function on change\n    var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n    // console.log('handleChange', $data);\n\n    if (onChange) {\n      onChange($data);\n    }\n    setFormAnswers($data);\n  };\n  var validateForm = function validateForm() {\n    var hasErrors = false;\n    var dataItems = items;\n    if (displayShort) {\n      dataItems = items.filter(function (i) {\n        return i.alternateForm === true;\n      });\n    }\n    dataItems.forEach(function (item) {\n      if (_isIncorrect(item)) {\n        if (methods) {\n          methods.setError(item.fieldName, {\n            type: 'incorrect',\n            message: \"\".concat(item.label, \" was answered incorrectly\")\n          });\n        }\n        hasErrors = true;\n      }\n    });\n    return hasErrors;\n  };\n  var getDataItemById = function getDataItemById(id) {\n    var $dataItem = items.find(function (x) {\n      return x.id === id;\n    });\n    if ($dataItem !== undefined) {\n      var _ref2, _ref3, _ref4, _$dataItem$fieldName;\n      return _objectSpread(_objectSpread({}, $dataItem), {}, {\n        fieldRules: getFieldRules($dataItem),\n        print: print !== null && print !== void 0 ? print : false,\n        readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,\n        hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,\n        disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,\n        mutable: true,\n        name: (_$dataItem$fieldName = $dataItem.fieldName) !== null && _$dataItem$fieldName !== void 0 ? _$dataItem$fieldName : $dataItem.name,\n        key: \"form_\".concat($dataItem.id),\n        item: $dataItem,\n        value: _getDefaultValue($dataItem)\n      });\n    }\n    return null;\n  };\n  var getStandardElement = function getStandardElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n      name: item.fieldName,\n      key: \"form_\".concat(item.id),\n      item: item,\n      value: _getDefaultValue(item),\n      onChange: handleChange\n    });\n  };\n  var getInputElement = function getInputElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref5) {\n        var _ref5$field = _ref5.field,\n          _onChange = _ref5$field.onChange,\n          onBlur = _ref5$field.onBlur,\n          value = _ref5$field.value,\n          name = _ref5$field.name,\n          ref = _ref5$field.ref,\n          _ref5$fieldState = _ref5.fieldState,\n          invalid = _ref5$fieldState.invalid,\n          isTouched = _ref5$fieldState.isTouched,\n          isDirty = _ref5$fieldState.isDirty,\n          error = _ref5$fieldState.error,\n          formState = _ref5.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item,\n          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,\n          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null\n        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var controls = item === null || item === void 0 ? void 0 : item.childItems.map(function (childItem) {\n      return childItem ? getInputElement(getDataItemById(childItem)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"\\xA0\");\n    });\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      controls: controls,\n      items: items,\n      answers: formAnswers\n    });\n  };\n  var getSimpleElement = function getSimpleElement(item) {\n    var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      headerClassName: headerClassName,\n      labelClassName: labelClassName\n    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_7___default().get(item.key);\n      if (!item.component) {\n        console.error(\"\".concat(item.element, \" was not registered\"));\n      }\n    }\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref6) {\n        var _ref6$field = _ref6.field,\n          _onChange2 = _ref6$field.onChange,\n          onBlur = _ref6$field.onBlur,\n          value = _ref6$field.value,\n          name = _ref6$field.name,\n          ref = _ref6$field.ref,\n          _ref6$fieldState = _ref6.fieldState,\n          invalid = _ref6$fieldState.invalid,\n          isTouched = _ref6$fieldState.isTouched,\n          isDirty = _ref6$fieldState.isDirty,\n          error = _ref6$fieldState.error,\n          formState = _ref6.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange2(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item\n        });\n      }\n    });\n  };\n  var getFieldRules = function getFieldRules(item) {\n    var fieldRules = {};\n    if (item.fieldRules !== undefined && item.fieldRules !== null) {\n      fieldRules = _objectSpread({}, item.fieldRules);\n    }\n    if (item.required) {\n      fieldRules.required = \"\".concat(item.label, \" is required\");\n    }\n    return fieldRules;\n  };\n  var handleRenderSubmit = function handleRenderSubmit() {\n    var actionName = actionName || 'Submit';\n    var buttonProps = {};\n    if (formId) {\n      buttonProps.form = formId;\n    }\n    return submitButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n      variant: \"primary\",\n      type: \"submit\"\n    }, actionName);\n  };\n  var handleRenderBack = function handleRenderBack() {\n    var backName = backName || 'Cancel';\n    return backButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n      variant: \"secondary\",\n      onClick: backAction,\n      className: \"btn-cancel\"\n    }, backName);\n  };\n\n  //#endregion\n\n  var dataItems = items ? _toConsumableArray(items) : [];\n  if (displayShort) {\n    dataItems = items ? _toConsumableArray(items).filter(function (i) {\n      return i.alternateForm === true;\n    }) : [];\n  }\n  dataItems.forEach(function (item) {\n    if (item && item.readOnly && item.variableKey && variables[item.variableKey]) {\n      answerData.current[item.fieldName] = variables[item.variableKey];\n    }\n  });\n  var fieldItems = dataItems.filter(function (x) {\n    return !x.parentId;\n  }).map(function (item) {\n    var _ref7, _ref8, _ref9;\n    if (!item) return null;\n    item.fieldRules = getFieldRules(item);\n    item.print = print !== null && print !== void 0 ? print : false;\n    item.readOnly = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;\n    item.hideLabel = (_ref8 = hideLabels || item.hideLabel) !== null && _ref8 !== void 0 ? _ref8 : false;\n    item.disabled = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;\n    item.mutable = true;\n    switch (item.element) {\n      case 'RadioButtons':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\n      case 'Rating':\n      case 'Tags':\n      case 'Dropdown':\n      case 'TextInput':\n      case 'EmailInput':\n      case 'NumberInput':\n      case 'TextArea':\n      case 'PhoneNumber':\n      case 'DatePicker':\n        return getStandardElement(item);\n      case 'CustomElement':\n        return getCustomElement(item);\n      case 'MultiColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.MultiColumnRow);\n      case 'ThreeColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.ThreeColumnRow);\n      case 'TwoColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.TwoColumnRow);\n      case 'Step':\n        return getContainerElement(item, _step__WEBPACK_IMPORTED_MODULE_5__.Step);\n      case 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__.FieldSet);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref10) {\n            var _ref10$field = _ref10.field,\n              _onChange3 = _ref10$field.onChange,\n              onBlur = _ref10$field.onBlur,\n              value = _ref10$field.value,\n              name = _ref10$field.name,\n              ref = _ref10$field.ref,\n              _ref10$fieldState = _ref10.fieldState,\n              invalid = _ref10$fieldState.invalid,\n              isTouched = _ref10$fieldState.isTouched,\n              isDirty = _ref10$fieldState.isDirty,\n              error = _ref10$fieldState.error,\n              formState = _ref10.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Signature, {\n              methods: methods,\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange3(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              item: item\n            });\n          }\n        });\n      case 'Checkboxes':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _optionsDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref11) {\n            var _ref11$field = _ref11.field,\n              _onChange4 = _ref11$field.onChange,\n              onBlur = _ref11$field.onBlur,\n              value = _ref11$field.value,\n              name = _ref11$field.name,\n              ref = _ref11$field.ref,\n              _ref11$fieldState = _ref11.fieldState,\n              invalid = _ref11$fieldState.invalid,\n              isTouched = _ref11$fieldState.isTouched,\n              isDirty = _ref11$fieldState.isDirty,\n              error = _ref11$fieldState.error,\n              formState = _ref11.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Checkboxes, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange4(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item,\n              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,\n              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null\n            });\n          }\n        });\n      case 'Image':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Image, {\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Download':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Download, {\n          downloadPath: downloadPath,\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Camera':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref12) {\n            var _ref12$field = _ref12.field,\n              _onChange5 = _ref12$field.onChange,\n              onBlur = _ref12$field.onBlur,\n              value = _ref12$field.value,\n              name = _ref12$field.name,\n              ref = _ref12$field.ref,\n              _ref12$fieldState = _ref12.fieldState,\n              invalid = _ref12$fieldState.invalid,\n              isTouched = _ref12$fieldState.isTouched,\n              isDirty = _ref12$fieldState.isDirty,\n              error = _ref12$fieldState.error,\n              formState = _ref12.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Camera, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange5(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      case 'FileUpload':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref13) {\n            var _ref13$field = _ref13.field,\n              _onChange6 = _ref13$field.onChange,\n              onBlur = _ref13$field.onBlur,\n              value = _ref13$field.value,\n              name = _ref13$field.name,\n              ref = _ref13$field.ref,\n              _ref13$fieldState = _ref13.fieldState,\n              invalid = _ref13$fieldState.invalid,\n              isTouched = _ref13$fieldState.isTouched,\n              isDirty = _ref13$fieldState.isDirty,\n              error = _ref13$fieldState.error,\n              formState = _ref13.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.FileUpload, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange6(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      default:\n        return getSimpleElement(item);\n    }\n  });\n  var formProps = {};\n  if (formId) {\n    formProps.id = formId;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"react-survey-builder-form\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], _extends({\n    onSubmit: methods.handleSubmit(handleSubmit)\n  }, formProps), fieldItems, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: buttonClassName ? buttonClassName : 'btn-toolbar'\n  }, !hideActions && handleRenderSubmit(), !hideActions && backAction && handleRenderBack())))));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactSurveyFormFields);\n\n//# sourceURL=webpack://react-survey-builder/./src/form-fields.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _multi_column__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./multi-column */ \"./src/multi-column/index.js\");\n/* harmony import */ var _fieldset__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fieldset */ \"./src/fieldset/index.js\");\n/* harmony import */ var _step__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./step */ \"./src/step/index.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-hook-form */ \"./node_modules/react-hook-form/dist/index.esm.mjs\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _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); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\nvar ReactSurveyFormFields = function ReactSurveyFormFields(_ref) {\n  var _ref$validateForCorre = _ref.validateForCorrectness,\n    validateForCorrectness = _ref$validateForCorre === void 0 ? false : _ref$validateForCorre,\n    _ref$displayShort = _ref.displayShort,\n    displayShort = _ref$displayShort === void 0 ? false : _ref$displayShort,\n    _ref$readOnly = _ref.readOnly,\n    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,\n    downloadPath = _ref.downloadPath,\n    answers = _ref.answers,\n    onSubmit = _ref.onSubmit,\n    onChange = _ref.onChange,\n    items = _ref.items,\n    _ref$submitButton = _ref.submitButton,\n    submitButton = _ref$submitButton === void 0 ? false : _ref$submitButton,\n    _ref$backButton = _ref.backButton,\n    backButton = _ref$backButton === void 0 ? false : _ref$backButton,\n    _ref$backAction = _ref.backAction,\n    backAction = _ref$backAction === void 0 ? null : _ref$backAction,\n    _ref$hideActions = _ref.hideActions,\n    hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,\n    _ref$hideLabels = _ref.hideLabels,\n    hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,\n    variables = _ref.variables,\n    buttonClassName = _ref.buttonClassName,\n    checkboxButtonClassName = _ref.checkboxButtonClassName,\n    headerClassName = _ref.headerClassName,\n    labelClassName = _ref.labelClassName,\n    formId = _ref.formId,\n    methods = _ref.methods,\n    _ref$print = _ref.print,\n    print = _ref$print === void 0 ? false : _ref$print;\n  //#region helper functions\n\n  var _convert = function _convert($dataAnswers) {\n    if (Array.isArray($dataAnswers)) {\n      var result = {};\n      $dataAnswers.forEach(function (answer) {\n        result[answer.name] = answer.value;\n      });\n      return result;\n    }\n    return $dataAnswers || {};\n  };\n  var form = react__WEBPACK_IMPORTED_MODULE_0___default().useRef();\n  var inputs = react__WEBPACK_IMPORTED_MODULE_0___default().useRef({});\n  var answerData = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(_convert(answers));\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    formAnswers = _React$useState2[0],\n    setFormAnswers = _React$useState2[1];\n  var _getDefaultValue = function _getDefaultValue($dataItem) {\n    var defaultValue = answerData.current[$dataItem.fieldName];\n    if ($dataItem.element === 'DatePicker') {\n      var _$dataItem$defaultTod;\n      var defaultToday = (_$dataItem$defaultTod = $dataItem.defaultToday) !== null && _$dataItem$defaultTod !== void 0 ? _$dataItem$defaultTod : false;\n      if (defaultToday && (defaultValue === '' || defaultValue === undefined)) {\n        var today = new Date();\n        var dd = today.getDate();\n        var mm = today.getMonth() + 1;\n        var yyyy = today.getFullYear();\n        if (dd < 10) {\n          dd = '0' + dd;\n        }\n        if (mm < 10) {\n          mm = '0' + mm;\n        }\n        today = mm + '/' + dd + '/' + yyyy;\n        defaultValue = today;\n      }\n    }\n    if ($dataItem.element === 'Checkbox') {\n      var _$dataItem$defaultChe;\n      var defaultChecked = (_$dataItem$defaultChe = $dataItem.defaultChecked) !== null && _$dataItem$defaultChe !== void 0 ? _$dataItem$defaultChe : false;\n      if (defaultChecked === true) {\n        defaultValue = true;\n      }\n    }\n    if (defaultValue === undefined) {\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'Tags') {\n        defaultValue = [];\n      } else if ($dataItem.element === 'NumberInput' || $dataItem.element === 'Range') {\n        var _$dataItem$minValue;\n        defaultValue = (_$dataItem$minValue = $dataItem.minValue) !== null && _$dataItem$minValue !== void 0 ? _$dataItem$minValue : 0;\n      } else {\n        defaultValue = '';\n      }\n    }\n    return defaultValue;\n  };\n  var _optionsDefaultValue = function _optionsDefaultValue($dataItem) {\n    var defaultValue = _getDefaultValue($dataItem);\n    if (defaultValue) {\n      return defaultValue;\n    }\n    var defaultChecked = [];\n    $dataItem.options.forEach(function (option) {\n      if (answerData.current[\"option_\".concat(option.key)]) {\n        defaultChecked.push(option.key);\n      }\n    });\n    return defaultChecked;\n  };\n  var _getItemValue = function _getItemValue($dataItem, ref) {\n    var _ref$inputField;\n    var $item = {\n      element: $dataItem.element,\n      value: ''\n    };\n    var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();\n    if ($dataItem.element === 'Rating') {\n      $item.value = ref.inputField.current.state.rating;\n    } else if ($dataItem.element === 'Tags') {\n      $item.value = $formData[$dataItem.fieldName];\n      // } else if (item.element === 'DatePicker') {\n      // \t$item.value = ref.state.value;\n    } else if ($dataItem.element === 'Camera') {\n      $item.value = ref.state.img;\n    } else if ($dataItem.element === 'FileUpload') {\n      $item.value = ref.state.fileUpload;\n    } else if ($dataItem.element === 'Signature') {\n      $item.value = ref.state.value;\n    } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {\n      $item = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.inputField.current);\n      if ($item && typeof $item.value === 'string') {\n        $item.value = $item.value.trim();\n      }\n    } else {\n      $item.value = $formData[$dataItem.fieldName];\n    }\n    return $item;\n  };\n  var _isIncorrect = function _isIncorrect($dataItem) {\n    var incorrect = false;\n    var canHaveAnswer = ['NumberInput', 'EmailInput', 'TextInput', 'PhoneNumber', 'TextArea', 'DatePicker', 'Dropdown', 'Tags', 'Checkboxes', 'Checkbox', 'RadioButtons', 'Rating', 'Range'].indexOf($dataItem.element) !== -1;\n    if (canHaveAnswer) {\n      var ref = inputs.current[$dataItem.fieldName];\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {\n        $dataItem.options.forEach(function (option) {\n          var $option = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.options[\"child_ref_\".concat(option.key)]);\n          if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {\n            incorrect = true;\n          }\n        });\n      } else {\n        var $item = _getItemValue($dataItem, ref);\n        if ($dataItem.element === 'Rating' || $dataItem.element === 'Range' || $dataItem.element === 'NumberInput') {\n          // number to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($dataItem.element === 'Checkbox') {\n          // boolean to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($item.value.toLowerCase() !== $dataItem.correct.trim().toLowerCase()) {\n          incorrect = true;\n        }\n      }\n    }\n    return incorrect;\n  };\n  var _collectFormData = function _collectFormData($dataItems, $formData) {\n    var formData = [];\n    $dataItems.filter(function (i) {\n      return i[\"static\"] !== true;\n    }).forEach(function (item) {\n      var itemData = {\n        id: item.id,\n        name: item.fieldName,\n        customName: item.customName || item.fieldName,\n        label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',\n        value: $formData[item.fieldName],\n        required: item.required || false\n      };\n      if (itemData) {\n        formData.push(itemData);\n      }\n    });\n    return formData;\n  };\n\n  //#endregion\n  //#region form methods\n\n  var handleSubmit = function handleSubmit($formData, event) {\n    event.preventDefault();\n    var hasErrors = false;\n    if (validateForCorrectness) {\n      hasErrors = validateForm();\n    }\n\n    // Only submit if there are no errors.\n    if (hasErrors === false) {\n      if (onSubmit) {\n        var $data = _collectFormData(items, $formData);\n        onSubmit({\n          formData: $formData,\n          answers: $data\n        });\n        setFormAnswers($data);\n      } else {\n        var $form = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(form.current);\n        $form.submit();\n      }\n    }\n  };\n  var handleChange = function handleChange(event) {\n    // Call submit function on change\n    var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n    // console.log('handleChange', $data);\n\n    if (onChange) {\n      onChange($data);\n    }\n    setFormAnswers($data);\n  };\n  var validateForm = function validateForm() {\n    var hasErrors = false;\n    var dataItems = items;\n    if (displayShort) {\n      dataItems = items.filter(function (i) {\n        return i.alternateForm === true;\n      });\n    }\n    dataItems.forEach(function (item) {\n      if (_isIncorrect(item)) {\n        if (methods) {\n          methods.setError(item.fieldName, {\n            type: 'incorrect',\n            message: \"\".concat(item.label, \" was answered incorrectly\")\n          });\n        }\n        hasErrors = true;\n      }\n    });\n    return hasErrors;\n  };\n  var getDataItemById = function getDataItemById(id) {\n    var $dataItem = items.find(function (x) {\n      return x.id === id;\n    });\n    if ($dataItem !== undefined) {\n      var _ref2, _ref3, _ref4, _$dataItem$fieldName;\n      return _objectSpread(_objectSpread({}, $dataItem), {}, {\n        fieldRules: getFieldRules($dataItem),\n        print: print !== null && print !== void 0 ? print : false,\n        readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,\n        hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,\n        disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,\n        mutable: true,\n        name: (_$dataItem$fieldName = $dataItem.fieldName) !== null && _$dataItem$fieldName !== void 0 ? _$dataItem$fieldName : $dataItem.name,\n        key: \"form_\".concat($dataItem.id),\n        item: $dataItem,\n        value: _getDefaultValue($dataItem)\n      });\n    }\n    return null;\n  };\n  var getStandardElement = function getStandardElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n      name: item.fieldName,\n      key: \"form_\".concat(item.id),\n      item: item,\n      value: _getDefaultValue(item),\n      onChange: handleChange\n    });\n  };\n  var getInputElement = function getInputElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref5) {\n        var _ref5$field = _ref5.field,\n          _onChange = _ref5$field.onChange,\n          onBlur = _ref5$field.onBlur,\n          value = _ref5$field.value,\n          name = _ref5$field.name,\n          ref = _ref5$field.ref,\n          _ref5$fieldState = _ref5.fieldState,\n          invalid = _ref5$fieldState.invalid,\n          isTouched = _ref5$fieldState.isTouched,\n          isDirty = _ref5$fieldState.isDirty,\n          error = _ref5$fieldState.error,\n          formState = _ref5.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item,\n          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,\n          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null\n        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var _item$childItems;\n    var controls = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(item.childItems) ? item === null || item === void 0 || (_item$childItems = item.childItems) === null || _item$childItems === void 0 ? void 0 : _item$childItems.map(function (childItem) {\n      return childItem ? getFieldElement(getDataItemById(childItem)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"\\xA0\");\n    }) : [];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      controls: controls,\n      items: items,\n      answers: formAnswers\n    });\n  };\n  var getSimpleElement = function getSimpleElement(item) {\n    var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      headerClassName: headerClassName,\n      labelClassName: labelClassName\n    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_7___default().get(item.key);\n      if (!item.component) {\n        console.error(\"\".concat(item.element, \" was not registered\"));\n      }\n    }\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref6) {\n        var _ref6$field = _ref6.field,\n          _onChange2 = _ref6$field.onChange,\n          onBlur = _ref6$field.onBlur,\n          value = _ref6$field.value,\n          name = _ref6$field.name,\n          ref = _ref6$field.ref,\n          _ref6$fieldState = _ref6.fieldState,\n          invalid = _ref6$fieldState.invalid,\n          isTouched = _ref6$fieldState.isTouched,\n          isDirty = _ref6$fieldState.isDirty,\n          error = _ref6$fieldState.error,\n          formState = _ref6.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange2(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item\n        });\n      }\n    });\n  };\n  var getFieldRules = function getFieldRules(item) {\n    var fieldRules = {};\n    if (item.fieldRules !== undefined && item.fieldRules !== null) {\n      fieldRules = _objectSpread({}, item.fieldRules);\n    }\n    if (item.required) {\n      fieldRules.required = \"\".concat(item.label, \" is required\");\n    }\n    return fieldRules;\n  };\n  var handleRenderSubmit = function handleRenderSubmit() {\n    var actionName = actionName || 'Submit';\n    var buttonProps = {};\n    if (formId) {\n      buttonProps.form = formId;\n    }\n    return submitButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"primary\",\n      type: \"submit\"\n    }, actionName);\n  };\n  var handleRenderBack = function handleRenderBack() {\n    var backName = backName || 'Cancel';\n    return backButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"secondary\",\n      onClick: backAction,\n      className: \"btn-cancel\"\n    }, backName);\n  };\n  var getFieldElement = function getFieldElement(item) {\n    var _ref7, _ref8, _ref9;\n    if (!item) return null;\n    item.fieldRules = getFieldRules(item);\n    item.print = print !== null && print !== void 0 ? print : false;\n    item.readOnly = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;\n    item.hideLabel = (_ref8 = hideLabels || item.hideLabel) !== null && _ref8 !== void 0 ? _ref8 : false;\n    item.disabled = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;\n    item.mutable = true;\n    switch (item.element) {\n      case 'RadioButtons':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\n      case 'Rating':\n      case 'Tags':\n      case 'Dropdown':\n      case 'TextInput':\n      case 'EmailInput':\n      case 'NumberInput':\n      case 'TextArea':\n      case 'PhoneNumber':\n      case 'DatePicker':\n        return getStandardElement(item);\n      case 'CustomElement':\n        return getCustomElement(item);\n      case 'MultiColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.MultiColumnRow);\n      case 'ThreeColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.ThreeColumnRow);\n      case 'TwoColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.TwoColumnRow);\n      case 'Step':\n        return getContainerElement(item, _step__WEBPACK_IMPORTED_MODULE_5__.Step);\n      case 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__.FieldSet);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref10) {\n            var _ref10$field = _ref10.field,\n              _onChange3 = _ref10$field.onChange,\n              onBlur = _ref10$field.onBlur,\n              value = _ref10$field.value,\n              name = _ref10$field.name,\n              ref = _ref10$field.ref,\n              _ref10$fieldState = _ref10.fieldState,\n              invalid = _ref10$fieldState.invalid,\n              isTouched = _ref10$fieldState.isTouched,\n              isDirty = _ref10$fieldState.isDirty,\n              error = _ref10$fieldState.error,\n              formState = _ref10.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Signature, {\n              methods: methods,\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange3(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              item: item\n            });\n          }\n        });\n      case 'Checkboxes':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _optionsDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref11) {\n            var _ref11$field = _ref11.field,\n              _onChange4 = _ref11$field.onChange,\n              onBlur = _ref11$field.onBlur,\n              value = _ref11$field.value,\n              name = _ref11$field.name,\n              ref = _ref11$field.ref,\n              _ref11$fieldState = _ref11.fieldState,\n              invalid = _ref11$fieldState.invalid,\n              isTouched = _ref11$fieldState.isTouched,\n              isDirty = _ref11$fieldState.isDirty,\n              error = _ref11$fieldState.error,\n              formState = _ref11.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Checkboxes, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange4(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item,\n              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,\n              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null\n            });\n          }\n        });\n      case 'Image':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Image, {\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Download':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Download, {\n          downloadPath: downloadPath,\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Camera':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref12) {\n            var _ref12$field = _ref12.field,\n              _onChange5 = _ref12$field.onChange,\n              onBlur = _ref12$field.onBlur,\n              value = _ref12$field.value,\n              name = _ref12$field.name,\n              ref = _ref12$field.ref,\n              _ref12$fieldState = _ref12.fieldState,\n              invalid = _ref12$fieldState.invalid,\n              isTouched = _ref12$fieldState.isTouched,\n              isDirty = _ref12$fieldState.isDirty,\n              error = _ref12$fieldState.error,\n              formState = _ref12.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Camera, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange5(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      case 'FileUpload':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref13) {\n            var _ref13$field = _ref13.field,\n              _onChange6 = _ref13$field.onChange,\n              onBlur = _ref13$field.onBlur,\n              value = _ref13$field.value,\n              name = _ref13$field.name,\n              ref = _ref13$field.ref,\n              _ref13$fieldState = _ref13.fieldState,\n              invalid = _ref13$fieldState.invalid,\n              isTouched = _ref13$fieldState.isTouched,\n              isDirty = _ref13$fieldState.isDirty,\n              error = _ref13$fieldState.error,\n              formState = _ref13.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.FileUpload, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange6(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      default:\n        return getSimpleElement(item);\n    }\n  };\n\n  //#endregion\n\n  var dataItems = items ? _toConsumableArray(items) : [];\n  if (displayShort) {\n    dataItems = items ? _toConsumableArray(items).filter(function (i) {\n      return i.alternateForm === true;\n    }) : [];\n  }\n  dataItems.forEach(function (item) {\n    if (item && item.readOnly && item.variableKey && variables[item.variableKey]) {\n      answerData.current[item.fieldName] = variables[item.variableKey];\n    }\n  });\n  var fieldItems = dataItems.filter(function (x) {\n    return !x.parentId;\n  }).map(function (item) {\n    return getFieldElement(item);\n  });\n  var formProps = {};\n  if (formId) {\n    formProps.id = formId;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"react-survey-builder-form\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_11__[\"default\"], _extends({\n    onSubmit: methods.handleSubmit(handleSubmit)\n  }, formProps), fieldItems, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: buttonClassName ? buttonClassName : 'btn-toolbar'\n  }, !hideActions && handleRenderSubmit(), !hideActions && backAction && handleRenderBack())))));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactSurveyFormFields);\n\n//# sourceURL=webpack://react-survey-builder/./src/form-fields.jsx?");
 
 /***/ }),
 
@@ -928,7 +928,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _multi_column__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./multi-column */ \"./src/multi-column/index.js\");\n/* harmony import */ var _fieldset__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fieldset */ \"./src/fieldset/index.js\");\n/* harmony import */ var _step__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./step */ \"./src/step/index.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-hook-form */ \"./node_modules/react-hook-form/dist/index.esm.mjs\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _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); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _regeneratorRuntime() { \"use strict\"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = \"function\" == typeof Symbol ? Symbol : {}, a = i.iterator || \"@@iterator\", c = i.asyncIterator || \"@@asyncIterator\", u = i.toStringTag || \"@@toStringTag\"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, \"\"); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, \"_invoke\", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: \"normal\", arg: t.call(e, r) }; } catch (t) { return { type: \"throw\", arg: t }; } } e.wrap = wrap; var h = \"suspendedStart\", l = \"suspendedYield\", f = \"executing\", s = \"completed\", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { [\"next\", \"throw\", \"return\"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if (\"throw\" !== c.type) { var u = c.arg, h = u.value; return h && \"object\" == _typeof(h) && n.call(h, \"__await\") ? e.resolve(h.__await).then(function (t) { invoke(\"next\", t, i, a); }, function (t) { invoke(\"throw\", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke(\"throw\", t, i, a); }); } a(c.arg); } var r; o(this, \"_invoke\", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw Error(\"Generator is already running\"); if (o === s) { if (\"throw\" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if (\"next\" === n.method) n.sent = n._sent = n.arg;else if (\"throw\" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else \"return\" === n.method && n.abrupt(\"return\", n.arg); o = f; var p = tryCatch(e, r, n); if (\"normal\" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } \"throw\" === p.type && (o = s, n.method = \"throw\", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, \"throw\" === n && e.iterator[\"return\"] && (r.method = \"return\", r.arg = t, maybeInvokeDelegate(e, r), \"throw\" === r.method) || \"return\" !== n && (r.method = \"throw\", r.arg = new TypeError(\"The iterator does not provide a '\" + n + \"' method\")), y; var i = tryCatch(o, e.iterator, r.arg); if (\"throw\" === i.type) return r.method = \"throw\", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, \"return\" !== r.method && (r.method = \"next\", r.arg = t), r.delegate = null, y) : a : (r.method = \"throw\", r.arg = new TypeError(\"iterator result is not an object\"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = \"normal\", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: \"root\" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || \"\" === e) { var r = e[a]; if (r) return r.call(e); if (\"function\" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + \" is not iterable\"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, \"constructor\", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, \"constructor\", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, \"GeneratorFunction\"), e.isGeneratorFunction = function (t) { var e = \"function\" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || \"GeneratorFunction\" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, \"GeneratorFunction\")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, \"Generator\"), define(g, a, function () { return this; }), define(g, \"toString\", function () { return \"[object Generator]\"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = \"next\", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) \"t\" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if (\"throw\" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = \"throw\", a.arg = e, r.next = n, o && (r.method = \"next\", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if (\"root\" === i.tryLoc) return handle(\"end\"); if (i.tryLoc <= this.prev) { var c = n.call(i, \"catchLoc\"), u = n.call(i, \"finallyLoc\"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw Error(\"try statement without catch or finally\"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, \"finallyLoc\") && this.prev < o.finallyLoc) { var i = o; break; } } i && (\"break\" === t || \"continue\" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = \"next\", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if (\"throw\" === t.type) throw t.arg; return \"break\" === t.type || \"continue\" === t.type ? this.next = t.arg : \"return\" === t.type ? (this.rval = this.arg = t.arg, this.method = \"return\", this.next = \"end\") : \"normal\" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, \"catch\": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if (\"throw\" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw Error(\"illegal catch attempt\"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, \"next\" === this.method && (this.arg = t), y; } }, e; }\nfunction asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }\nfunction _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"next\", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"throw\", err); } _next(undefined); }); }; }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\nvar ReactSurveyFormSteps = function ReactSurveyFormSteps(_ref) {\n  var _ref$validateForCorre = _ref.validateForCorrectness,\n    validateForCorrectness = _ref$validateForCorre === void 0 ? false : _ref$validateForCorre,\n    _ref$displayShort = _ref.displayShort,\n    displayShort = _ref$displayShort === void 0 ? false : _ref$displayShort,\n    _ref$readOnly = _ref.readOnly,\n    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,\n    downloadPath = _ref.downloadPath,\n    answers = _ref.answers,\n    onSubmit = _ref.onSubmit,\n    onChange = _ref.onChange,\n    items = _ref.items,\n    _ref$submitButton = _ref.submitButton,\n    submitButton = _ref$submitButton === void 0 ? false : _ref$submitButton,\n    _ref$backButton = _ref.backButton,\n    backButton = _ref$backButton === void 0 ? false : _ref$backButton,\n    _ref$backAction = _ref.backAction,\n    backAction = _ref$backAction === void 0 ? null : _ref$backAction,\n    _ref$hideActions = _ref.hideActions,\n    hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,\n    _ref$hideLabels = _ref.hideLabels,\n    hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,\n    variables = _ref.variables,\n    buttonClassName = _ref.buttonClassName,\n    checkboxButtonClassName = _ref.checkboxButtonClassName,\n    headerClassName = _ref.headerClassName,\n    labelClassName = _ref.labelClassName,\n    formId = _ref.formId,\n    methods = _ref.methods,\n    _ref$print = _ref.print,\n    print = _ref$print === void 0 ? false : _ref$print;\n  //#region helper functions\n\n  var _convert = function _convert($dataAnswers) {\n    if (Array.isArray($dataAnswers)) {\n      var result = {};\n      $dataAnswers.forEach(function (answer) {\n        result[answer.name] = answer.value;\n      });\n      return result;\n    }\n    return $dataAnswers || {};\n  };\n  var form = react__WEBPACK_IMPORTED_MODULE_0___default().useRef();\n  var inputs = react__WEBPACK_IMPORTED_MODULE_0___default().useRef({});\n  var answerData = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(_convert(answers));\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    formAnswers = _React$useState2[0],\n    setFormAnswers = _React$useState2[1];\n  var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState([]),\n    _React$useState4 = _slicedToArray(_React$useState3, 2),\n    steps = _React$useState4[0],\n    setSteps = _React$useState4[1];\n  var _React$useState5 = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState6 = _slicedToArray(_React$useState5, 2),\n    activeStep = _React$useState6[0],\n    setActiveStep = _React$useState6[1];\n  var _getDefaultValue = function _getDefaultValue($dataItem) {\n    var defaultValue = answerData.current[$dataItem.fieldName];\n    if ($dataItem.element === 'DatePicker') {\n      var _$dataItem$defaultTod;\n      var defaultToday = (_$dataItem$defaultTod = $dataItem.defaultToday) !== null && _$dataItem$defaultTod !== void 0 ? _$dataItem$defaultTod : false;\n      if (defaultToday && (defaultValue === '' || defaultValue === undefined)) {\n        var today = new Date();\n        var dd = today.getDate();\n        var mm = today.getMonth() + 1;\n        var yyyy = today.getFullYear();\n        if (dd < 10) {\n          dd = '0' + dd;\n        }\n        if (mm < 10) {\n          mm = '0' + mm;\n        }\n        today = mm + '/' + dd + '/' + yyyy;\n        defaultValue = today;\n      }\n    }\n    if ($dataItem.element === 'Checkbox') {\n      var _$dataItem$defaultChe;\n      var defaultChecked = (_$dataItem$defaultChe = $dataItem.defaultChecked) !== null && _$dataItem$defaultChe !== void 0 ? _$dataItem$defaultChe : false;\n      if (defaultChecked === true) {\n        defaultValue = true;\n      }\n    }\n    if (defaultValue === undefined) {\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'Tags') {\n        defaultValue = [];\n      } else if ($dataItem.element === 'NumberInput' || $dataItem.element === 'Range') {\n        var _$dataItem$minValue;\n        defaultValue = (_$dataItem$minValue = $dataItem.minValue) !== null && _$dataItem$minValue !== void 0 ? _$dataItem$minValue : 0;\n      } else {\n        defaultValue = '';\n      }\n    }\n    return defaultValue;\n  };\n  var _optionsDefaultValue = function _optionsDefaultValue($dataItem) {\n    var defaultValue = _getDefaultValue($dataItem);\n    if (defaultValue) {\n      return defaultValue;\n    }\n    var defaultChecked = [];\n    $dataItem.options.forEach(function (option) {\n      if (answerData.current[\"option_\".concat(option.key)]) {\n        defaultChecked.push(option.key);\n      }\n    });\n    return defaultChecked;\n  };\n  var _getItemValue = function _getItemValue($dataItem, ref) {\n    var _ref$inputField;\n    var $item = {\n      element: $dataItem.element,\n      value: ''\n    };\n    var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();\n    if ($dataItem.element === 'Rating') {\n      $item.value = ref.inputField.current.state.rating;\n    } else if ($dataItem.element === 'Tags') {\n      $item.value = $formData[$dataItem.fieldName];\n      // } else if (item.element === 'DatePicker') {\n      // \t$item.value = ref.state.value;\n    } else if ($dataItem.element === 'Camera') {\n      $item.value = ref.state.img;\n    } else if ($dataItem.element === 'FileUpload') {\n      $item.value = ref.state.fileUpload;\n    } else if ($dataItem.element === 'Signature') {\n      $item.value = ref.state.value;\n    } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {\n      $item = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.inputField.current);\n      if ($item && typeof $item.value === 'string') {\n        $item.value = $item.value.trim();\n      }\n    } else {\n      $item.value = $formData[$dataItem.fieldName];\n    }\n    return $item;\n  };\n  var _isIncorrect = function _isIncorrect($dataItem) {\n    var incorrect = false;\n    var canHaveAnswer = ['NumberInput', 'EmailInput', 'TextInput', 'PhoneNumber', 'TextArea', 'DatePicker', 'Dropdown', 'Tags', 'Checkboxes', 'Checkbox', 'RadioButtons', 'Rating', 'Range'].indexOf($dataItem.element) !== -1;\n    if (canHaveAnswer) {\n      var ref = inputs.current[$dataItem.fieldName];\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {\n        $dataItem.options.forEach(function (option) {\n          var $option = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.options[\"child_ref_\".concat(option.key)]);\n          if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {\n            incorrect = true;\n          }\n        });\n      } else {\n        var $item = _getItemValue($dataItem, ref);\n        if ($dataItem.element === 'Rating' || $dataItem.element === 'Range' || $dataItem.element === 'NumberInput') {\n          // number to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($dataItem.element === 'Checkbox') {\n          // boolean to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($item.value.toLowerCase() !== $dataItem.correct.trim().toLowerCase()) {\n          incorrect = true;\n        }\n      }\n    }\n    return incorrect;\n  };\n  var _collectFormData = function _collectFormData($dataItems, $formData) {\n    var formData = [];\n    $dataItems.filter(function (i) {\n      return i[\"static\"] !== true;\n    }).forEach(function (item) {\n      var itemData = {\n        id: item.id,\n        name: item.fieldName,\n        customName: item.customName || item.fieldName,\n        label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',\n        value: $formData[item.fieldName],\n        required: item.required || false\n      };\n      if (itemData) {\n        formData.push(itemData);\n      }\n    });\n    return formData;\n  };\n\n  //#endregion\n  //#region form methods\n\n  var handleSubmit = function handleSubmit($formData, event) {\n    event.preventDefault();\n    var hasErrors = false;\n    if (validateForCorrectness) {\n      hasErrors = validateForm();\n    }\n\n    // Only submit if there are no errors.\n    if (hasErrors === false) {\n      if (onSubmit) {\n        var $data = _collectFormData(items, $formData);\n        onSubmit({\n          formData: $formData,\n          answers: $data\n        });\n        setFormAnswers($data);\n      } else {\n        var $form = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(form.current);\n        $form.submit();\n      }\n    }\n  };\n  var handleChange = function handleChange(event) {\n    // Call submit function on change\n    var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n    // console.log('handleChange', $data);\n\n    if (onChange) {\n      onChange($data);\n    }\n    setFormAnswers($data);\n  };\n  var validateForm = function validateForm() {\n    var hasErrors = false;\n    var dataItems = items;\n    if (displayShort) {\n      dataItems = items.filter(function (i) {\n        return i.alternateForm === true;\n      });\n    }\n    dataItems.forEach(function (item) {\n      if (_isIncorrect(item)) {\n        if (methods) {\n          methods.setError(item.fieldName, {\n            type: 'incorrect',\n            message: \"\".concat(item.label, \" was answered incorrectly\")\n          });\n        }\n        hasErrors = true;\n      }\n    });\n    return hasErrors;\n  };\n  var getDataItemById = function getDataItemById(id) {\n    var $dataItem = items.find(function (x) {\n      return x.id === id;\n    });\n    if ($dataItem !== undefined) {\n      var _ref2, _ref3, _ref4, _$dataItem$fieldName;\n      return _objectSpread(_objectSpread({}, $dataItem), {}, {\n        fieldRules: getFieldRules($dataItem),\n        print: print !== null && print !== void 0 ? print : false,\n        readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,\n        hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,\n        disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,\n        mutable: true,\n        name: (_$dataItem$fieldName = $dataItem.fieldName) !== null && _$dataItem$fieldName !== void 0 ? _$dataItem$fieldName : $dataItem.name,\n        key: \"form_\".concat($dataItem.id),\n        item: $dataItem,\n        value: _getDefaultValue($dataItem)\n      });\n    }\n    return null;\n  };\n  var getStandardElement = function getStandardElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n      name: item.fieldName,\n      key: \"form_\".concat(item.id),\n      item: item,\n      value: _getDefaultValue(item),\n      onChange: handleChange\n    });\n  };\n  var getInputElement = function getInputElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref5) {\n        var _ref5$field = _ref5.field,\n          _onChange = _ref5$field.onChange,\n          onBlur = _ref5$field.onBlur,\n          value = _ref5$field.value,\n          name = _ref5$field.name,\n          ref = _ref5$field.ref,\n          _ref5$fieldState = _ref5.fieldState,\n          invalid = _ref5$fieldState.invalid,\n          isTouched = _ref5$fieldState.isTouched,\n          isDirty = _ref5$fieldState.isDirty,\n          error = _ref5$fieldState.error,\n          formState = _ref5.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item,\n          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,\n          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null\n        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var controls = item === null || item === void 0 ? void 0 : item.childItems.map(function (childItem) {\n      return childItem ? getInputElement(getDataItemById(childItem)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"\\xA0\");\n    });\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      controls: controls,\n      items: items,\n      answers: formAnswers\n    });\n  };\n  var getSimpleElement = function getSimpleElement(item) {\n    var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      headerClassName: headerClassName,\n      labelClassName: labelClassName\n    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_7___default().get(item.key);\n      if (!item.component) {\n        console.error(\"\".concat(item.element, \" was not registered\"));\n      }\n    }\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref6) {\n        var _ref6$field = _ref6.field,\n          _onChange2 = _ref6$field.onChange,\n          onBlur = _ref6$field.onBlur,\n          value = _ref6$field.value,\n          name = _ref6$field.name,\n          ref = _ref6$field.ref,\n          _ref6$fieldState = _ref6.fieldState,\n          invalid = _ref6$fieldState.invalid,\n          isTouched = _ref6$fieldState.isTouched,\n          isDirty = _ref6$fieldState.isDirty,\n          error = _ref6$fieldState.error,\n          formState = _ref6.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange2(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item\n        });\n      }\n    });\n  };\n  var getFieldRules = function getFieldRules(item) {\n    var fieldRules = {};\n    if (item.fieldRules !== undefined && item.fieldRules !== null) {\n      fieldRules = _objectSpread({}, item.fieldRules);\n    }\n    if (item.required) {\n      fieldRules.required = \"\".concat(item.label, \" is required\");\n    }\n    return fieldRules;\n  };\n  var handleRenderSubmit = function handleRenderSubmit() {\n    var actionName = actionName || 'Submit';\n    var buttonProps = {};\n    if (formId) {\n      buttonProps.form = formId;\n    }\n    return submitButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"primary\",\n      type: \"submit\"\n    }, actionName);\n  };\n  var handleRenderBack = function handleRenderBack() {\n    var backName = backName || 'Cancel';\n    return backButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"secondary\",\n      onClick: backAction,\n      className: \"btn-cancel\"\n    }, backName);\n  };\n\n  //#endregion\n\n  var onBackStep = /*#__PURE__*/function () {\n    var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {\n      var oldStep, previousIndex;\n      return _regeneratorRuntime().wrap(function _callee$(_context) {\n        while (1) switch (_context.prev = _context.next) {\n          case 0:\n            oldStep = steps.find(function (i) {\n              return i.id === id;\n            });\n            previousIndex = oldStep.index - 1;\n            setActiveStep(previousIndex > 0 ? steps[previousIndex] : null);\n          case 3:\n          case \"end\":\n            return _context.stop();\n        }\n      }, _callee);\n    }));\n    return function onBackStep() {\n      return _ref7.apply(this, arguments);\n    };\n  }();\n  var onNextStep = /*#__PURE__*/function () {\n    var _ref8 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {\n      var oldStep, clean, updatedSteps, nextStep;\n      return _regeneratorRuntime().wrap(function _callee2$(_context2) {\n        while (1) switch (_context2.prev = _context2.next) {\n          case 0:\n            oldStep = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isObjectNotEmpty)(activeStep) ? _objectSpread({}, activeStep) : null;\n            if (!oldStep) {\n              _context2.next = 15;\n              break;\n            }\n            console.log(oldStep);\n            // validate childItems of step\n            _context2.next = 5;\n            return methods.trigger(oldStep.childQuestions.map(function (i) {\n              return i.name;\n            }), true);\n          case 5:\n            clean = _context2.sent;\n            console.log(clean);\n            if (!clean) {\n              _context2.next = 14;\n              break;\n            }\n            updatedSteps = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.updateRecord)('id', _objectSpread(_objectSpread({}, oldStep), {}, {\n              completed: true,\n              answers: _collectFormData(oldStep.childQuestions, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || [])\n            }), _toConsumableArray(steps));\n            setSteps(updatedSteps);\n\n            // get next incomplete survey\n            nextStep = steps.find(function (i) {\n              return i.completed === false;\n            });\n            if (nextStep !== undefined) {\n              setActiveStep(nextStep);\n            } else {\n              if (onFinishedSurveys) {\n                onFinishedSurveys();\n              }\n            }\n            _context2.next = 15;\n            break;\n          case 14:\n            return _context2.abrupt(\"return\");\n          case 15:\n          case \"end\":\n            return _context2.stop();\n        }\n      }, _callee2);\n    }));\n    return function onNextStep() {\n      return _ref8.apply(this, arguments);\n    };\n  }();\n  var dataItems = items ? _toConsumableArray(items) : [];\n  if (displayShort) {\n    dataItems = items ? _toConsumableArray(items).filter(function (i) {\n      return i.alternateForm === true;\n    }) : [];\n  }\n  dataItems.forEach(function (item) {\n    if (item && item.readOnly && item.variableKey && variables[item.variableKey]) {\n      answerData.current[item.fieldName] = variables[item.variableKey];\n    }\n  });\n  var stepItems = dataItems.filter(function (x) {\n    return !x.parentId && x.element === 'Step';\n  }).map(function (item) {\n    var _ref9, _ref10, _ref11;\n    if (!item) return null;\n    item.fieldRules = getFieldRules(item);\n    item.print = print !== null && print !== void 0 ? print : false;\n    item.readOnly = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;\n    item.hideLabel = (_ref10 = hideLabels || item.hideLabel) !== null && _ref10 !== void 0 ? _ref10 : false;\n    item.disabled = (_ref11 = readOnly || item.readOnly) !== null && _ref11 !== void 0 ? _ref11 : false;\n    item.mutable = true;\n    switch (item.element) {\n      case 'RadioButtons':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\n      case 'Rating':\n      case 'Tags':\n      case 'Dropdown':\n      case 'TextInput':\n      case 'EmailInput':\n      case 'NumberInput':\n      case 'TextArea':\n      case 'PhoneNumber':\n      case 'DatePicker':\n        return getStandardElement(item);\n      case 'CustomElement':\n        return getCustomElement(item);\n      case 'MultiColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.MultiColumnRow);\n      case 'ThreeColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.ThreeColumnRow);\n      case 'TwoColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.TwoColumnRow);\n      case 'Step':\n        return getContainerElement(item, _step__WEBPACK_IMPORTED_MODULE_5__.Step);\n      case 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__.FieldSet);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref12) {\n            var _ref12$field = _ref12.field,\n              _onChange3 = _ref12$field.onChange,\n              onBlur = _ref12$field.onBlur,\n              value = _ref12$field.value,\n              name = _ref12$field.name,\n              ref = _ref12$field.ref,\n              _ref12$fieldState = _ref12.fieldState,\n              invalid = _ref12$fieldState.invalid,\n              isTouched = _ref12$fieldState.isTouched,\n              isDirty = _ref12$fieldState.isDirty,\n              error = _ref12$fieldState.error,\n              formState = _ref12.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Signature, {\n              methods: methods,\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange3(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              item: item\n            });\n          }\n        });\n      case 'Checkboxes':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _optionsDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref13) {\n            var _ref13$field = _ref13.field,\n              _onChange4 = _ref13$field.onChange,\n              onBlur = _ref13$field.onBlur,\n              value = _ref13$field.value,\n              name = _ref13$field.name,\n              ref = _ref13$field.ref,\n              _ref13$fieldState = _ref13.fieldState,\n              invalid = _ref13$fieldState.invalid,\n              isTouched = _ref13$fieldState.isTouched,\n              isDirty = _ref13$fieldState.isDirty,\n              error = _ref13$fieldState.error,\n              formState = _ref13.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Checkboxes, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange4(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item,\n              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,\n              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null\n            });\n          }\n        });\n      case 'Image':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Image, {\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Download':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Download, {\n          downloadPath: downloadPath,\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Camera':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref14) {\n            var _ref14$field = _ref14.field,\n              _onChange5 = _ref14$field.onChange,\n              onBlur = _ref14$field.onBlur,\n              value = _ref14$field.value,\n              name = _ref14$field.name,\n              ref = _ref14$field.ref,\n              _ref14$fieldState = _ref14.fieldState,\n              invalid = _ref14$fieldState.invalid,\n              isTouched = _ref14$fieldState.isTouched,\n              isDirty = _ref14$fieldState.isDirty,\n              error = _ref14$fieldState.error,\n              formState = _ref14.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Camera, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange5(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      case 'FileUpload':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref15) {\n            var _ref15$field = _ref15.field,\n              _onChange6 = _ref15$field.onChange,\n              onBlur = _ref15$field.onBlur,\n              value = _ref15$field.value,\n              name = _ref15$field.name,\n              ref = _ref15$field.ref,\n              _ref15$fieldState = _ref15.fieldState,\n              invalid = _ref15$fieldState.invalid,\n              isTouched = _ref15$fieldState.isTouched,\n              isDirty = _ref15$fieldState.isDirty,\n              error = _ref15$fieldState.error,\n              formState = _ref15.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.FileUpload, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange6(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      default:\n        return getSimpleElement(item);\n    }\n  });\n  react__WEBPACK_IMPORTED_MODULE_0___default().useMemo(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(stepItems)) {\n      var surveySteps = stepItems.map(function (step, index) {\n        return _objectSpread(_objectSpread({}, step), {}, {\n          childQuestions: dataItems.filter(function (i) {\n            return step.id === i.parentId;\n          }),\n          completed: false,\n          answers: []\n        });\n      });\n      setSteps(surveySteps);\n      if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(surveySteps)) {\n        setActiveStep(surveySteps[0]);\n      } else {\n        setActiveStep(null);\n      }\n    }\n  }, []);\n  var formProps = {};\n  if (formId) {\n    formProps.id = formId;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"react-survey-builder-form\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_11__[\"default\"], _extends({\n    onSubmit: methods.handleSubmit(handleSubmit)\n  }, formProps), activeStep, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: buttonClassName ? buttonClassName : 'btn-toolbar'\n  }, !hideActions && handleRenderSubmit(), !hideActions && backAction && handleRenderBack(), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    variant: \"secondary\",\n    onClick: onBackStep\n  }, \"Back\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    variant: \"primary\",\n    onClick: onNextStep\n  }, \"Next\"))))));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactSurveyFormSteps);\n\n//# sourceURL=webpack://react-survey-builder/./src/form-steps.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _multi_column__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./multi-column */ \"./src/multi-column/index.js\");\n/* harmony import */ var _fieldset__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fieldset */ \"./src/fieldset/index.js\");\n/* harmony import */ var _step__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./step */ \"./src/step/index.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-hook-form */ \"./node_modules/react-hook-form/dist/index.esm.mjs\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _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); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _regeneratorRuntime() { \"use strict\"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = \"function\" == typeof Symbol ? Symbol : {}, a = i.iterator || \"@@iterator\", c = i.asyncIterator || \"@@asyncIterator\", u = i.toStringTag || \"@@toStringTag\"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, \"\"); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, \"_invoke\", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: \"normal\", arg: t.call(e, r) }; } catch (t) { return { type: \"throw\", arg: t }; } } e.wrap = wrap; var h = \"suspendedStart\", l = \"suspendedYield\", f = \"executing\", s = \"completed\", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { [\"next\", \"throw\", \"return\"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if (\"throw\" !== c.type) { var u = c.arg, h = u.value; return h && \"object\" == _typeof(h) && n.call(h, \"__await\") ? e.resolve(h.__await).then(function (t) { invoke(\"next\", t, i, a); }, function (t) { invoke(\"throw\", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke(\"throw\", t, i, a); }); } a(c.arg); } var r; o(this, \"_invoke\", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw Error(\"Generator is already running\"); if (o === s) { if (\"throw\" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if (\"next\" === n.method) n.sent = n._sent = n.arg;else if (\"throw\" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else \"return\" === n.method && n.abrupt(\"return\", n.arg); o = f; var p = tryCatch(e, r, n); if (\"normal\" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } \"throw\" === p.type && (o = s, n.method = \"throw\", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, \"throw\" === n && e.iterator[\"return\"] && (r.method = \"return\", r.arg = t, maybeInvokeDelegate(e, r), \"throw\" === r.method) || \"return\" !== n && (r.method = \"throw\", r.arg = new TypeError(\"The iterator does not provide a '\" + n + \"' method\")), y; var i = tryCatch(o, e.iterator, r.arg); if (\"throw\" === i.type) return r.method = \"throw\", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, \"return\" !== r.method && (r.method = \"next\", r.arg = t), r.delegate = null, y) : a : (r.method = \"throw\", r.arg = new TypeError(\"iterator result is not an object\"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = \"normal\", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: \"root\" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || \"\" === e) { var r = e[a]; if (r) return r.call(e); if (\"function\" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + \" is not iterable\"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, \"constructor\", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, \"constructor\", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, \"GeneratorFunction\"), e.isGeneratorFunction = function (t) { var e = \"function\" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || \"GeneratorFunction\" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, \"GeneratorFunction\")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, \"Generator\"), define(g, a, function () { return this; }), define(g, \"toString\", function () { return \"[object Generator]\"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = \"next\", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) \"t\" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if (\"throw\" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = \"throw\", a.arg = e, r.next = n, o && (r.method = \"next\", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if (\"root\" === i.tryLoc) return handle(\"end\"); if (i.tryLoc <= this.prev) { var c = n.call(i, \"catchLoc\"), u = n.call(i, \"finallyLoc\"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw Error(\"try statement without catch or finally\"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, \"finallyLoc\") && this.prev < o.finallyLoc) { var i = o; break; } } i && (\"break\" === t || \"continue\" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = \"next\", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if (\"throw\" === t.type) throw t.arg; return \"break\" === t.type || \"continue\" === t.type ? this.next = t.arg : \"return\" === t.type ? (this.rval = this.arg = t.arg, this.method = \"return\", this.next = \"end\") : \"normal\" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, \"catch\": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if (\"throw\" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw Error(\"illegal catch attempt\"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, \"next\" === this.method && (this.arg = t), y; } }, e; }\nfunction asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }\nfunction _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"next\", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"throw\", err); } _next(undefined); }); }; }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\nvar ReactSurveyFormSteps = function ReactSurveyFormSteps(_ref) {\n  var _ref$validateForCorre = _ref.validateForCorrectness,\n    validateForCorrectness = _ref$validateForCorre === void 0 ? false : _ref$validateForCorre,\n    _ref$displayShort = _ref.displayShort,\n    displayShort = _ref$displayShort === void 0 ? false : _ref$displayShort,\n    _ref$readOnly = _ref.readOnly,\n    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,\n    downloadPath = _ref.downloadPath,\n    answers = _ref.answers,\n    onSubmit = _ref.onSubmit,\n    onChange = _ref.onChange,\n    items = _ref.items,\n    _ref$submitButton = _ref.submitButton,\n    submitButton = _ref$submitButton === void 0 ? false : _ref$submitButton,\n    _ref$backButton = _ref.backButton,\n    backButton = _ref$backButton === void 0 ? false : _ref$backButton,\n    _ref$backAction = _ref.backAction,\n    backAction = _ref$backAction === void 0 ? null : _ref$backAction,\n    _ref$hideActions = _ref.hideActions,\n    hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,\n    _ref$hideLabels = _ref.hideLabels,\n    hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,\n    variables = _ref.variables,\n    buttonClassName = _ref.buttonClassName,\n    checkboxButtonClassName = _ref.checkboxButtonClassName,\n    headerClassName = _ref.headerClassName,\n    labelClassName = _ref.labelClassName,\n    formId = _ref.formId,\n    methods = _ref.methods,\n    _ref$print = _ref.print,\n    print = _ref$print === void 0 ? false : _ref$print;\n  //#region helper functions\n\n  var _convert = function _convert($dataAnswers) {\n    if (Array.isArray($dataAnswers)) {\n      var result = {};\n      $dataAnswers.forEach(function (answer) {\n        result[answer.name] = answer.value;\n      });\n      return result;\n    }\n    return $dataAnswers || {};\n  };\n  var form = react__WEBPACK_IMPORTED_MODULE_0___default().useRef();\n  var inputs = react__WEBPACK_IMPORTED_MODULE_0___default().useRef({});\n  var answerData = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(_convert(answers));\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    formAnswers = _React$useState2[0],\n    setFormAnswers = _React$useState2[1];\n  var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState([]),\n    _React$useState4 = _slicedToArray(_React$useState3, 2),\n    steps = _React$useState4[0],\n    setSteps = _React$useState4[1];\n  var _React$useState5 = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState6 = _slicedToArray(_React$useState5, 2),\n    activeStep = _React$useState6[0],\n    setActiveStep = _React$useState6[1];\n  var _getDefaultValue = function _getDefaultValue($dataItem) {\n    var defaultValue = answerData.current[$dataItem.fieldName];\n    if ($dataItem.element === 'DatePicker') {\n      var _$dataItem$defaultTod;\n      var defaultToday = (_$dataItem$defaultTod = $dataItem.defaultToday) !== null && _$dataItem$defaultTod !== void 0 ? _$dataItem$defaultTod : false;\n      if (defaultToday && (defaultValue === '' || defaultValue === undefined)) {\n        var today = new Date();\n        var dd = today.getDate();\n        var mm = today.getMonth() + 1;\n        var yyyy = today.getFullYear();\n        if (dd < 10) {\n          dd = '0' + dd;\n        }\n        if (mm < 10) {\n          mm = '0' + mm;\n        }\n        today = mm + '/' + dd + '/' + yyyy;\n        defaultValue = today;\n      }\n    }\n    if ($dataItem.element === 'Checkbox') {\n      var _$dataItem$defaultChe;\n      var defaultChecked = (_$dataItem$defaultChe = $dataItem.defaultChecked) !== null && _$dataItem$defaultChe !== void 0 ? _$dataItem$defaultChe : false;\n      if (defaultChecked === true) {\n        defaultValue = true;\n      }\n    }\n    if (defaultValue === undefined) {\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'Tags') {\n        defaultValue = [];\n      } else if ($dataItem.element === 'NumberInput' || $dataItem.element === 'Range') {\n        var _$dataItem$minValue;\n        defaultValue = (_$dataItem$minValue = $dataItem.minValue) !== null && _$dataItem$minValue !== void 0 ? _$dataItem$minValue : 0;\n      } else {\n        defaultValue = '';\n      }\n    }\n    return defaultValue;\n  };\n  var _optionsDefaultValue = function _optionsDefaultValue($dataItem) {\n    var defaultValue = _getDefaultValue($dataItem);\n    if (defaultValue) {\n      return defaultValue;\n    }\n    var defaultChecked = [];\n    $dataItem.options.forEach(function (option) {\n      if (answerData.current[\"option_\".concat(option.key)]) {\n        defaultChecked.push(option.key);\n      }\n    });\n    return defaultChecked;\n  };\n  var _getItemValue = function _getItemValue($dataItem, ref) {\n    var _ref$inputField;\n    var $item = {\n      element: $dataItem.element,\n      value: ''\n    };\n    var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();\n    if ($dataItem.element === 'Rating') {\n      $item.value = ref.inputField.current.state.rating;\n    } else if ($dataItem.element === 'Tags') {\n      $item.value = $formData[$dataItem.fieldName];\n      // } else if (item.element === 'DatePicker') {\n      // \t$item.value = ref.state.value;\n    } else if ($dataItem.element === 'Camera') {\n      $item.value = ref.state.img;\n    } else if ($dataItem.element === 'FileUpload') {\n      $item.value = ref.state.fileUpload;\n    } else if ($dataItem.element === 'Signature') {\n      $item.value = ref.state.value;\n    } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {\n      $item = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.inputField.current);\n      if ($item && typeof $item.value === 'string') {\n        $item.value = $item.value.trim();\n      }\n    } else {\n      $item.value = $formData[$dataItem.fieldName];\n    }\n    return $item;\n  };\n  var _isIncorrect = function _isIncorrect($dataItem) {\n    var incorrect = false;\n    var canHaveAnswer = ['NumberInput', 'EmailInput', 'TextInput', 'PhoneNumber', 'TextArea', 'DatePicker', 'Dropdown', 'Tags', 'Checkboxes', 'Checkbox', 'RadioButtons', 'Rating', 'Range'].indexOf($dataItem.element) !== -1;\n    if (canHaveAnswer) {\n      var ref = inputs.current[$dataItem.fieldName];\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {\n        $dataItem.options.forEach(function (option) {\n          var $option = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.options[\"child_ref_\".concat(option.key)]);\n          if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {\n            incorrect = true;\n          }\n        });\n      } else {\n        var $item = _getItemValue($dataItem, ref);\n        if ($dataItem.element === 'Rating' || $dataItem.element === 'Range' || $dataItem.element === 'NumberInput') {\n          // number to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($dataItem.element === 'Checkbox') {\n          // boolean to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($item.value.toLowerCase() !== $dataItem.correct.trim().toLowerCase()) {\n          incorrect = true;\n        }\n      }\n    }\n    return incorrect;\n  };\n  var _collectFormData = function _collectFormData($dataItems, $formData) {\n    var formData = [];\n    $dataItems.filter(function (i) {\n      return i[\"static\"] !== true;\n    }).forEach(function (item) {\n      var itemData = {\n        id: item.id,\n        name: item.fieldName,\n        customName: item.customName || item.fieldName,\n        label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',\n        value: $formData[item.fieldName],\n        required: item.required || false\n      };\n      if (itemData) {\n        formData.push(itemData);\n      }\n    });\n    return formData;\n  };\n\n  //#endregion\n  //#region form methods\n\n  var handleSubmit = function handleSubmit($formData, event) {\n    event.preventDefault();\n    var hasErrors = false;\n    if (validateForCorrectness) {\n      hasErrors = validateForm();\n    }\n\n    // Only submit if there are no errors.\n    if (hasErrors === false) {\n      if (onSubmit) {\n        var $data = _collectFormData(items, $formData);\n        onSubmit({\n          formData: $formData,\n          answers: $data\n        });\n        setFormAnswers($data);\n      } else {\n        var $form = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(form.current);\n        $form.submit();\n      }\n    }\n  };\n  var handleChange = function handleChange(event) {\n    // Call submit function on change\n    var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n    // console.log('handleChange', $data);\n\n    if (onChange) {\n      onChange($data);\n    }\n    setFormAnswers($data);\n  };\n  var validateForm = function validateForm() {\n    var hasErrors = false;\n    var dataItems = items;\n    if (displayShort) {\n      dataItems = items.filter(function (i) {\n        return i.alternateForm === true;\n      });\n    }\n    dataItems.forEach(function (item) {\n      if (_isIncorrect(item)) {\n        if (methods) {\n          methods.setError(item.fieldName, {\n            type: 'incorrect',\n            message: \"\".concat(item.label, \" was answered incorrectly\")\n          });\n        }\n        hasErrors = true;\n      }\n    });\n    return hasErrors;\n  };\n  var getDataItemById = function getDataItemById(id) {\n    var $dataItem = items.find(function (x) {\n      return x.id === id;\n    });\n    if ($dataItem !== undefined) {\n      var _ref2, _ref3, _ref4, _$dataItem$fieldName;\n      return _objectSpread(_objectSpread({}, $dataItem), {}, {\n        fieldRules: getFieldRules($dataItem),\n        print: print !== null && print !== void 0 ? print : false,\n        readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,\n        hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,\n        disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,\n        mutable: true,\n        name: (_$dataItem$fieldName = $dataItem.fieldName) !== null && _$dataItem$fieldName !== void 0 ? _$dataItem$fieldName : $dataItem.name,\n        key: \"form_\".concat($dataItem.id),\n        item: $dataItem,\n        value: _getDefaultValue($dataItem)\n      });\n    }\n    return null;\n  };\n  var getStandardElement = function getStandardElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n      name: item.fieldName,\n      key: \"form_\".concat(item.id),\n      item: item,\n      value: _getDefaultValue(item),\n      onChange: handleChange\n    });\n  };\n  var getInputElement = function getInputElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref5) {\n        var _ref5$field = _ref5.field,\n          _onChange = _ref5$field.onChange,\n          onBlur = _ref5$field.onBlur,\n          value = _ref5$field.value,\n          name = _ref5$field.name,\n          ref = _ref5$field.ref,\n          _ref5$fieldState = _ref5.fieldState,\n          invalid = _ref5$fieldState.invalid,\n          isTouched = _ref5$fieldState.isTouched,\n          isDirty = _ref5$fieldState.isDirty,\n          error = _ref5$fieldState.error,\n          formState = _ref5.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item,\n          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,\n          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null\n        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var _item$childItems;\n    var controls = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(item.childItems) ? item === null || item === void 0 || (_item$childItems = item.childItems) === null || _item$childItems === void 0 ? void 0 : _item$childItems.map(function (childItem) {\n      return childItem ? getFieldElement(getDataItemById(childItem)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"\\xA0\");\n    }) : [];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      controls: controls,\n      items: items,\n      answers: formAnswers\n    });\n  };\n  var getSimpleElement = function getSimpleElement(item) {\n    var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      headerClassName: headerClassName,\n      labelClassName: labelClassName\n    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_7___default().get(item.key);\n      if (!item.component) {\n        console.error(\"\".concat(item.element, \" was not registered\"));\n      }\n    }\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref6) {\n        var _ref6$field = _ref6.field,\n          _onChange2 = _ref6$field.onChange,\n          onBlur = _ref6$field.onBlur,\n          value = _ref6$field.value,\n          name = _ref6$field.name,\n          ref = _ref6$field.ref,\n          _ref6$fieldState = _ref6.fieldState,\n          invalid = _ref6$fieldState.invalid,\n          isTouched = _ref6$fieldState.isTouched,\n          isDirty = _ref6$fieldState.isDirty,\n          error = _ref6$fieldState.error,\n          formState = _ref6.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange2(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item\n        });\n      }\n    });\n  };\n  var getFieldRules = function getFieldRules(item) {\n    var fieldRules = {};\n    if (item.fieldRules !== undefined && item.fieldRules !== null) {\n      fieldRules = _objectSpread({}, item.fieldRules);\n    }\n    if (item.required) {\n      fieldRules.required = \"\".concat(item.label, \" is required\");\n    }\n    return fieldRules;\n  };\n  var handleRenderSubmit = function handleRenderSubmit() {\n    var actionName = actionName || 'Submit';\n    var buttonProps = {};\n    if (formId) {\n      buttonProps.form = formId;\n    }\n    return submitButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"primary\",\n      type: \"submit\"\n    }, actionName);\n  };\n  var handleRenderBack = function handleRenderBack() {\n    var backName = backName || 'Cancel';\n    return backButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"secondary\",\n      onClick: backAction,\n      className: \"btn-cancel\"\n    }, backName);\n  };\n  var getFieldElement = function getFieldElement(item) {\n    var _ref7, _ref8, _ref9;\n    if (!item) return null;\n    item.fieldRules = getFieldRules(item);\n    item.print = print !== null && print !== void 0 ? print : false;\n    item.readOnly = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;\n    item.hideLabel = (_ref8 = hideLabels || item.hideLabel) !== null && _ref8 !== void 0 ? _ref8 : false;\n    item.disabled = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;\n    item.mutable = true;\n    switch (item.element) {\n      case 'RadioButtons':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\n      case 'Rating':\n      case 'Tags':\n      case 'Dropdown':\n      case 'TextInput':\n      case 'EmailInput':\n      case 'NumberInput':\n      case 'TextArea':\n      case 'PhoneNumber':\n      case 'DatePicker':\n        return getStandardElement(item);\n      case 'CustomElement':\n        return getCustomElement(item);\n      case 'MultiColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.MultiColumnRow);\n      case 'ThreeColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.ThreeColumnRow);\n      case 'TwoColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.TwoColumnRow);\n      case 'Step':\n        return getContainerElement(item, _step__WEBPACK_IMPORTED_MODULE_5__.Step);\n      case 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__.FieldSet);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref10) {\n            var _ref10$field = _ref10.field,\n              _onChange3 = _ref10$field.onChange,\n              onBlur = _ref10$field.onBlur,\n              value = _ref10$field.value,\n              name = _ref10$field.name,\n              ref = _ref10$field.ref,\n              _ref10$fieldState = _ref10.fieldState,\n              invalid = _ref10$fieldState.invalid,\n              isTouched = _ref10$fieldState.isTouched,\n              isDirty = _ref10$fieldState.isDirty,\n              error = _ref10$fieldState.error,\n              formState = _ref10.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Signature, {\n              methods: methods,\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange3(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              item: item\n            });\n          }\n        });\n      case 'Checkboxes':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _optionsDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref11) {\n            var _ref11$field = _ref11.field,\n              _onChange4 = _ref11$field.onChange,\n              onBlur = _ref11$field.onBlur,\n              value = _ref11$field.value,\n              name = _ref11$field.name,\n              ref = _ref11$field.ref,\n              _ref11$fieldState = _ref11.fieldState,\n              invalid = _ref11$fieldState.invalid,\n              isTouched = _ref11$fieldState.isTouched,\n              isDirty = _ref11$fieldState.isDirty,\n              error = _ref11$fieldState.error,\n              formState = _ref11.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Checkboxes, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange4(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item,\n              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,\n              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null\n            });\n          }\n        });\n      case 'Image':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Image, {\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Download':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Download, {\n          downloadPath: downloadPath,\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Camera':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref12) {\n            var _ref12$field = _ref12.field,\n              _onChange5 = _ref12$field.onChange,\n              onBlur = _ref12$field.onBlur,\n              value = _ref12$field.value,\n              name = _ref12$field.name,\n              ref = _ref12$field.ref,\n              _ref12$fieldState = _ref12.fieldState,\n              invalid = _ref12$fieldState.invalid,\n              isTouched = _ref12$fieldState.isTouched,\n              isDirty = _ref12$fieldState.isDirty,\n              error = _ref12$fieldState.error,\n              formState = _ref12.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Camera, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange5(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      case 'FileUpload':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref13) {\n            var _ref13$field = _ref13.field,\n              _onChange6 = _ref13$field.onChange,\n              onBlur = _ref13$field.onBlur,\n              value = _ref13$field.value,\n              name = _ref13$field.name,\n              ref = _ref13$field.ref,\n              _ref13$fieldState = _ref13.fieldState,\n              invalid = _ref13$fieldState.invalid,\n              isTouched = _ref13$fieldState.isTouched,\n              isDirty = _ref13$fieldState.isDirty,\n              error = _ref13$fieldState.error,\n              formState = _ref13.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.FileUpload, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange6(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      default:\n        return getSimpleElement(item);\n    }\n  };\n\n  //#endregion\n\n  var onBackStep = /*#__PURE__*/function () {\n    var _ref14 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {\n      var oldStep, previousIndex;\n      return _regeneratorRuntime().wrap(function _callee$(_context) {\n        while (1) switch (_context.prev = _context.next) {\n          case 0:\n            oldStep = steps.find(function (i) {\n              return i.id === id;\n            });\n            previousIndex = oldStep.index - 1;\n            setActiveStep(previousIndex > 0 ? steps[previousIndex] : null);\n          case 3:\n          case \"end\":\n            return _context.stop();\n        }\n      }, _callee);\n    }));\n    return function onBackStep() {\n      return _ref14.apply(this, arguments);\n    };\n  }();\n  var onNextStep = /*#__PURE__*/function () {\n    var _ref15 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {\n      var oldStep, clean, updatedSteps, nextStep;\n      return _regeneratorRuntime().wrap(function _callee2$(_context2) {\n        while (1) switch (_context2.prev = _context2.next) {\n          case 0:\n            oldStep = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isObjectNotEmpty)(activeStep) ? _objectSpread({}, activeStep) : null;\n            if (!oldStep) {\n              _context2.next = 15;\n              break;\n            }\n            console.log(oldStep);\n            // validate childItems of step\n            _context2.next = 5;\n            return methods.trigger(oldStep.childQuestions.map(function (i) {\n              return i.name;\n            }), true);\n          case 5:\n            clean = _context2.sent;\n            console.log(clean);\n            if (!clean) {\n              _context2.next = 14;\n              break;\n            }\n            updatedSteps = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.updateRecord)('id', _objectSpread(_objectSpread({}, oldStep), {}, {\n              completed: true,\n              answers: _collectFormData(oldStep.childQuestions, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || [])\n            }), _toConsumableArray(steps));\n            setSteps(updatedSteps);\n\n            // get next incomplete survey\n            nextStep = steps.find(function (i) {\n              return i.completed === false;\n            });\n            if (nextStep !== undefined) {\n              setActiveStep(nextStep);\n            } else {\n              if (onFinishedSurveys) {\n                onFinishedSurveys();\n              }\n            }\n            _context2.next = 15;\n            break;\n          case 14:\n            return _context2.abrupt(\"return\");\n          case 15:\n          case \"end\":\n            return _context2.stop();\n        }\n      }, _callee2);\n    }));\n    return function onNextStep() {\n      return _ref15.apply(this, arguments);\n    };\n  }();\n  var dataItems = items ? _toConsumableArray(items) : [];\n  if (displayShort) {\n    dataItems = items ? _toConsumableArray(items).filter(function (i) {\n      return i.alternateForm === true;\n    }) : [];\n  }\n  dataItems.forEach(function (item) {\n    if (item && item.readOnly && item.variableKey && variables[item.variableKey]) {\n      answerData.current[item.fieldName] = variables[item.variableKey];\n    }\n  });\n  var stepItems = dataItems.filter(function (x) {\n    return !x.parentId && x.element === 'Step';\n  }).map(function (item) {\n    return getFieldElement(item);\n  });\n  react__WEBPACK_IMPORTED_MODULE_0___default().useMemo(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(stepItems)) {\n      var surveySteps = stepItems.map(function (step, index) {\n        return _objectSpread(_objectSpread({}, step), {}, {\n          childQuestions: dataItems.filter(function (i) {\n            return step.id === i.parentId;\n          }),\n          completed: false,\n          answers: []\n        });\n      });\n      setSteps(surveySteps);\n      if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(surveySteps)) {\n        setActiveStep(surveySteps[0]);\n      } else {\n        setActiveStep(null);\n      }\n    }\n  }, []);\n  var formProps = {};\n  if (formId) {\n    formProps.id = formId;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"react-survey-builder-form\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_11__[\"default\"], _extends({\n    onSubmit: methods.handleSubmit(handleSubmit)\n  }, formProps), activeStep, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: buttonClassName ? buttonClassName : 'btn-toolbar'\n  }, !hideActions && handleRenderSubmit(), !hideActions && backAction && handleRenderBack(), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    variant: \"secondary\",\n    onClick: onBackStep\n  }, \"Back\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    variant: \"primary\",\n    onClick: onNextStep\n  }, \"Next\"))))));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactSurveyFormSteps);\n\n//# sourceURL=webpack://react-survey-builder/./src/form-steps.jsx?");
 
 /***/ }),
 
@@ -939,7 +939,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _multi_column__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./multi-column */ \"./src/multi-column/index.js\");\n/* harmony import */ var _fieldset__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fieldset */ \"./src/fieldset/index.js\");\n/* harmony import */ var _step__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./step */ \"./src/step/index.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-hook-form */ \"./node_modules/react-hook-form/dist/index.esm.mjs\");\nfunction _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); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\nvar ReactSurvey = function ReactSurvey(_ref) {\n  var _ref$validateForCorre = _ref.validateForCorrectness,\n    validateForCorrectness = _ref$validateForCorre === void 0 ? false : _ref$validateForCorre,\n    _ref$displayShort = _ref.displayShort,\n    displayShort = _ref$displayShort === void 0 ? false : _ref$displayShort,\n    _ref$readOnly = _ref.readOnly,\n    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,\n    downloadPath = _ref.downloadPath,\n    answers = _ref.answers,\n    onSubmit = _ref.onSubmit,\n    onChange = _ref.onChange,\n    items = _ref.items,\n    _ref$submitButton = _ref.submitButton,\n    submitButton = _ref$submitButton === void 0 ? false : _ref$submitButton,\n    _ref$backButton = _ref.backButton,\n    backButton = _ref$backButton === void 0 ? false : _ref$backButton,\n    _ref$backAction = _ref.backAction,\n    backAction = _ref$backAction === void 0 ? null : _ref$backAction,\n    _ref$hideActions = _ref.hideActions,\n    hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,\n    _ref$hideLabels = _ref.hideLabels,\n    hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,\n    variables = _ref.variables,\n    buttonClassName = _ref.buttonClassName,\n    checkboxButtonClassName = _ref.checkboxButtonClassName,\n    headerClassName = _ref.headerClassName,\n    labelClassName = _ref.labelClassName,\n    formId = _ref.formId,\n    _ref$print = _ref.print,\n    print = _ref$print === void 0 ? false : _ref$print;\n  //#region useForms\n\n  var methods = (0,react_hook_form__WEBPACK_IMPORTED_MODULE_8__.useForm)({\n    mode: 'all',\n    reValidateMode: 'onChange',\n    criteriaMode: 'all',\n    shouldFocusError: true,\n    shouldUnregister: true\n  });\n\n  //#endregion\n  //#region helper functions\n\n  var _convert = function _convert($dataAnswers) {\n    if (Array.isArray($dataAnswers)) {\n      var result = {};\n      $dataAnswers.forEach(function (answer) {\n        result[answer.name] = answer.value;\n      });\n      return result;\n    }\n    return $dataAnswers || {};\n  };\n  var form = react__WEBPACK_IMPORTED_MODULE_0___default().useRef();\n  var inputs = react__WEBPACK_IMPORTED_MODULE_0___default().useRef({});\n  var answerData = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(_convert(answers));\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    formAnswers = _React$useState2[0],\n    setFormAnswers = _React$useState2[1];\n  var _getDefaultValue = function _getDefaultValue($dataItem) {\n    var defaultValue = answerData.current[$dataItem.fieldName];\n    if ($dataItem.element === 'DatePicker') {\n      var _$dataItem$defaultTod;\n      var defaultToday = (_$dataItem$defaultTod = $dataItem.defaultToday) !== null && _$dataItem$defaultTod !== void 0 ? _$dataItem$defaultTod : false;\n      if (defaultToday && (defaultValue === '' || defaultValue === undefined)) {\n        var today = new Date();\n        var dd = today.getDate();\n        var mm = today.getMonth() + 1;\n        var yyyy = today.getFullYear();\n        if (dd < 10) {\n          dd = '0' + dd;\n        }\n        if (mm < 10) {\n          mm = '0' + mm;\n        }\n        today = mm + '/' + dd + '/' + yyyy;\n        defaultValue = today;\n      }\n    }\n    if ($dataItem.element === 'Checkbox') {\n      var _$dataItem$defaultChe;\n      var defaultChecked = (_$dataItem$defaultChe = $dataItem.defaultChecked) !== null && _$dataItem$defaultChe !== void 0 ? _$dataItem$defaultChe : false;\n      if (defaultChecked === true) {\n        defaultValue = true;\n      }\n    }\n    if (defaultValue === undefined) {\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'Tags') {\n        defaultValue = [];\n      } else if ($dataItem.element === 'NumberInput' || $dataItem.element === 'Range') {\n        var _$dataItem$minValue;\n        defaultValue = (_$dataItem$minValue = $dataItem.minValue) !== null && _$dataItem$minValue !== void 0 ? _$dataItem$minValue : 0;\n      } else {\n        defaultValue = '';\n      }\n    }\n    return defaultValue;\n  };\n  var _optionsDefaultValue = function _optionsDefaultValue($dataItem) {\n    var defaultValue = _getDefaultValue($dataItem);\n    if (defaultValue) {\n      return defaultValue;\n    }\n    var defaultChecked = [];\n    $dataItem.options.forEach(function (option) {\n      if (answerData.current[\"option_\".concat(option.key)]) {\n        defaultChecked.push(option.key);\n      }\n    });\n    return defaultChecked;\n  };\n  var _getItemValue = function _getItemValue($dataItem, ref) {\n    var _ref$inputField;\n    var $item = {\n      element: $dataItem.element,\n      value: ''\n    };\n    var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();\n    if ($dataItem.element === 'Rating') {\n      $item.value = ref.inputField.current.state.rating;\n    } else if ($dataItem.element === 'Tags') {\n      $item.value = $formData[$dataItem.fieldName];\n      // } else if (item.element === 'DatePicker') {\n      // \t$item.value = ref.state.value;\n    } else if ($dataItem.element === 'Camera') {\n      $item.value = ref.state.img;\n    } else if ($dataItem.element === 'FileUpload') {\n      $item.value = ref.state.fileUpload;\n    } else if ($dataItem.element === 'Signature') {\n      $item.value = ref.state.value;\n    } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {\n      $item = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.inputField.current);\n      if ($item && typeof $item.value === 'string') {\n        $item.value = $item.value.trim();\n      }\n    } else {\n      $item.value = $formData[$dataItem.fieldName];\n    }\n    return $item;\n  };\n  var _isIncorrect = function _isIncorrect($dataItem) {\n    var incorrect = false;\n    var canHaveAnswer = ['NumberInput', 'EmailInput', 'TextInput', 'PhoneNumber', 'TextArea', 'DatePicker', 'Dropdown', 'Tags', 'Checkboxes', 'Checkbox', 'RadioButtons', 'Rating', 'Range'].indexOf($dataItem.element) !== -1;\n    if (canHaveAnswer) {\n      var ref = inputs.current[$dataItem.fieldName];\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {\n        $dataItem.options.forEach(function (option) {\n          var $option = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.options[\"child_ref_\".concat(option.key)]);\n          if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {\n            incorrect = true;\n          }\n        });\n      } else {\n        var $item = _getItemValue($dataItem, ref);\n        if ($dataItem.element === 'Rating' || $dataItem.element === 'Range' || $dataItem.element === 'NumberInput') {\n          // number to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($dataItem.element === 'Checkbox') {\n          // boolean to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($item.value.toLowerCase() !== $dataItem.correct.trim().toLowerCase()) {\n          incorrect = true;\n        }\n      }\n    }\n    return incorrect;\n  };\n  var _collectFormData = function _collectFormData($dataItems, $formData) {\n    var formData = [];\n    $dataItems.filter(function (i) {\n      return i[\"static\"] !== true;\n    }).forEach(function (item) {\n      var itemData = {\n        id: item.id,\n        name: item.fieldName,\n        customName: item.customName || item.fieldName,\n        label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',\n        value: $formData[item.fieldName],\n        required: item.required || false\n      };\n      if (itemData) {\n        formData.push(itemData);\n      }\n    });\n    return formData;\n  };\n\n  //#endregion\n  //#region form methods\n\n  var handleSubmit = function handleSubmit($formData, event) {\n    event.preventDefault();\n    var hasErrors = false;\n    if (validateForCorrectness) {\n      hasErrors = validateForm();\n    }\n\n    // Only submit if there are no errors.\n    if (hasErrors === false) {\n      if (onSubmit) {\n        var $data = _collectFormData(items, $formData);\n        onSubmit({\n          formData: $formData,\n          answers: $data\n        });\n        setFormAnswers($data);\n      } else {\n        var $form = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(form.current);\n        $form.submit();\n      }\n    }\n  };\n  var handleChange = function handleChange(event) {\n    // Call submit function on change\n    var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n    // console.log('handleChange', $data);\n\n    if (onChange) {\n      onChange($data);\n    }\n    setFormAnswers($data);\n  };\n  var validateForm = function validateForm() {\n    var hasErrors = false;\n    var dataItems = items;\n    if (displayShort) {\n      dataItems = items.filter(function (i) {\n        return i.alternateForm === true;\n      });\n    }\n    dataItems.forEach(function (item) {\n      if (_isIncorrect(item)) {\n        if (methods) {\n          methods.setError(item.fieldName, {\n            type: 'incorrect',\n            message: \"\".concat(item.label, \" was answered incorrectly\")\n          });\n        }\n        hasErrors = true;\n      }\n    });\n    return hasErrors;\n  };\n  var getDataItemById = function getDataItemById(id) {\n    var $dataItem = items.find(function (x) {\n      return x.id === id;\n    });\n    if ($dataItem !== undefined) {\n      var _ref2, _ref3, _ref4, _$dataItem$fieldName;\n      return _objectSpread(_objectSpread({}, $dataItem), {}, {\n        fieldRules: getFieldRules($dataItem),\n        print: print !== null && print !== void 0 ? print : false,\n        readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,\n        hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,\n        disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,\n        mutable: true,\n        name: (_$dataItem$fieldName = $dataItem.fieldName) !== null && _$dataItem$fieldName !== void 0 ? _$dataItem$fieldName : $dataItem.name,\n        key: \"form_\".concat($dataItem.id),\n        item: $dataItem,\n        value: _getDefaultValue($dataItem)\n      });\n    }\n    return null;\n  };\n  var getStandardElement = function getStandardElement(item) {\n    var _item$fieldName;\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n      name: (_item$fieldName = item.fieldName) !== null && _item$fieldName !== void 0 ? _item$fieldName : item.name,\n      key: \"form_\".concat(item.id),\n      item: item,\n      value: _getDefaultValue(item),\n      onChange: handleChange\n    });\n  };\n  var getInputElement = function getInputElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref5) {\n        var _ref5$field = _ref5.field,\n          _onChange = _ref5$field.onChange,\n          onBlur = _ref5$field.onBlur,\n          value = _ref5$field.value,\n          name = _ref5$field.name,\n          ref = _ref5$field.ref,\n          _ref5$fieldState = _ref5.fieldState,\n          invalid = _ref5$fieldState.invalid,\n          isTouched = _ref5$fieldState.isTouched,\n          isDirty = _ref5$fieldState.isDirty,\n          error = _ref5$fieldState.error,\n          formState = _ref5.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item,\n          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,\n          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null\n        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var controls = item === null || item === void 0 ? void 0 : item.childItems.map(function (childItem) {\n      return childItem ? getInputElement(getDataItemById(childItem)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"\\xA0\");\n    });\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      controls: controls,\n      items: items,\n      answers: formAnswers\n    });\n  };\n  var getSimpleElement = function getSimpleElement(item) {\n    var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      headerClassName: headerClassName,\n      labelClassName: labelClassName\n    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_7___default().get(item.key);\n      if (!item.component) {\n        console.error(\"\".concat(item.element, \" was not registered\"));\n      }\n    }\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref6) {\n        var _ref6$field = _ref6.field,\n          _onChange2 = _ref6$field.onChange,\n          onBlur = _ref6$field.onBlur,\n          value = _ref6$field.value,\n          name = _ref6$field.name,\n          ref = _ref6$field.ref,\n          _ref6$fieldState = _ref6.fieldState,\n          invalid = _ref6$fieldState.invalid,\n          isTouched = _ref6$fieldState.isTouched,\n          isDirty = _ref6$fieldState.isDirty,\n          error = _ref6$fieldState.error,\n          formState = _ref6.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange2(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item\n        });\n      }\n    });\n  };\n  var getFieldRules = function getFieldRules(item) {\n    var fieldRules = {};\n    if (item.fieldRules !== undefined && item.fieldRules !== null) {\n      fieldRules = _objectSpread({}, item.fieldRules);\n    }\n    if (item.required) {\n      fieldRules.required = \"\".concat(item.label, \" is required\");\n    }\n    return fieldRules;\n  };\n  var handleRenderSubmit = function handleRenderSubmit() {\n    var actionName = actionName || 'Submit';\n    var buttonProps = {};\n    if (formId) {\n      buttonProps.form = formId;\n    }\n    return submitButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n      variant: \"primary\",\n      type: \"submit\"\n    }, actionName);\n  };\n  var handleRenderBack = function handleRenderBack() {\n    var backName = backName || 'Cancel';\n    return backButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n      variant: \"secondary\",\n      onClick: backAction,\n      className: \"btn-cancel\"\n    }, backName);\n  };\n\n  //#endregion\n\n  var dataItems = items ? _toConsumableArray(items) : [];\n  if (displayShort) {\n    dataItems = items ? _toConsumableArray(items).filter(function (i) {\n      return i.alternateForm === true;\n    }) : [];\n  }\n  dataItems.forEach(function (item) {\n    if (item && item.readOnly && item.variableKey && variables[item.variableKey]) {\n      answerData.current[item.fieldName] = variables[item.variableKey];\n    }\n  });\n  var fieldItems = dataItems.filter(function (x) {\n    return !x.parentId;\n  }).map(function (item) {\n    var _ref7, _ref8, _ref9;\n    if (!item) return null;\n    item.fieldRules = getFieldRules(item);\n    item.print = print !== null && print !== void 0 ? print : false;\n    item.readOnly = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;\n    item.hideLabel = (_ref8 = hideLabels || item.hideLabel) !== null && _ref8 !== void 0 ? _ref8 : false;\n    item.disabled = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;\n    item.mutable = true;\n    switch (item.element) {\n      case 'RadioButtons':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\n      case 'Rating':\n      case 'Tags':\n      case 'Dropdown':\n      case 'TextInput':\n      case 'EmailInput':\n      case 'NumberInput':\n      case 'TextArea':\n      case 'PhoneNumber':\n      case 'DatePicker':\n        return getStandardElement(item);\n      case 'CustomElement':\n        return getCustomElement(item);\n      case 'MultiColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.MultiColumnRow);\n      case 'ThreeColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.ThreeColumnRow);\n      case 'TwoColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.TwoColumnRow);\n      case 'Step':\n        return getContainerElement(item, _step__WEBPACK_IMPORTED_MODULE_5__.Step);\n      case 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__.FieldSet);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref10) {\n            var _ref10$field = _ref10.field,\n              _onChange3 = _ref10$field.onChange,\n              onBlur = _ref10$field.onBlur,\n              value = _ref10$field.value,\n              name = _ref10$field.name,\n              ref = _ref10$field.ref,\n              _ref10$fieldState = _ref10.fieldState,\n              invalid = _ref10$fieldState.invalid,\n              isTouched = _ref10$fieldState.isTouched,\n              isDirty = _ref10$fieldState.isDirty,\n              error = _ref10$fieldState.error,\n              formState = _ref10.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Signature, {\n              methods: methods,\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange3(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              item: item\n            });\n          }\n        });\n      case 'Checkboxes':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _optionsDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref11) {\n            var _ref11$field = _ref11.field,\n              _onChange4 = _ref11$field.onChange,\n              onBlur = _ref11$field.onBlur,\n              value = _ref11$field.value,\n              name = _ref11$field.name,\n              ref = _ref11$field.ref,\n              _ref11$fieldState = _ref11.fieldState,\n              invalid = _ref11$fieldState.invalid,\n              isTouched = _ref11$fieldState.isTouched,\n              isDirty = _ref11$fieldState.isDirty,\n              error = _ref11$fieldState.error,\n              formState = _ref11.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Checkboxes, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange4(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item,\n              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,\n              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null\n            });\n          }\n        });\n      case 'Image':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Image, {\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Download':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Download, {\n          downloadPath: downloadPath,\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Camera':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref12) {\n            var _ref12$field = _ref12.field,\n              _onChange5 = _ref12$field.onChange,\n              onBlur = _ref12$field.onBlur,\n              value = _ref12$field.value,\n              name = _ref12$field.name,\n              ref = _ref12$field.ref,\n              _ref12$fieldState = _ref12.fieldState,\n              invalid = _ref12$fieldState.invalid,\n              isTouched = _ref12$fieldState.isTouched,\n              isDirty = _ref12$fieldState.isDirty,\n              error = _ref12$fieldState.error,\n              formState = _ref12.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Camera, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange5(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      case 'FileUpload':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref13) {\n            var _ref13$field = _ref13.field,\n              _onChange6 = _ref13$field.onChange,\n              onBlur = _ref13$field.onBlur,\n              value = _ref13$field.value,\n              name = _ref13$field.name,\n              ref = _ref13$field.ref,\n              _ref13$fieldState = _ref13.fieldState,\n              invalid = _ref13$fieldState.invalid,\n              isTouched = _ref13$fieldState.isTouched,\n              isDirty = _ref13$fieldState.isDirty,\n              error = _ref13$fieldState.error,\n              formState = _ref13.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.FileUpload, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange6(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      default:\n        return getSimpleElement(item);\n    }\n  });\n  var formProps = {};\n  if (formId) {\n    formProps.id = formId;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"react-survey-builder-form\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_8__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], _extends({\n    onSubmit: methods.handleSubmit(handleSubmit)\n  }, formProps), fieldItems, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: buttonClassName ? buttonClassName : 'btn-toolbar'\n  }, !hideActions && handleRenderSubmit(), !hideActions && backAction && handleRenderBack())))));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactSurvey);\n\n//# sourceURL=webpack://react-survey-builder/./src/form.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _multi_column__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./multi-column */ \"./src/multi-column/index.js\");\n/* harmony import */ var _fieldset__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./fieldset */ \"./src/fieldset/index.js\");\n/* harmony import */ var _step__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./step */ \"./src/step/index.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-hook-form */ \"./node_modules/react-hook-form/dist/index.esm.mjs\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _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); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\nvar ReactSurvey = function ReactSurvey(_ref) {\n  var _ref$validateForCorre = _ref.validateForCorrectness,\n    validateForCorrectness = _ref$validateForCorre === void 0 ? false : _ref$validateForCorre,\n    _ref$displayShort = _ref.displayShort,\n    displayShort = _ref$displayShort === void 0 ? false : _ref$displayShort,\n    _ref$readOnly = _ref.readOnly,\n    readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,\n    downloadPath = _ref.downloadPath,\n    answers = _ref.answers,\n    onSubmit = _ref.onSubmit,\n    onChange = _ref.onChange,\n    items = _ref.items,\n    _ref$submitButton = _ref.submitButton,\n    submitButton = _ref$submitButton === void 0 ? false : _ref$submitButton,\n    _ref$backButton = _ref.backButton,\n    backButton = _ref$backButton === void 0 ? false : _ref$backButton,\n    _ref$backAction = _ref.backAction,\n    backAction = _ref$backAction === void 0 ? null : _ref$backAction,\n    _ref$hideActions = _ref.hideActions,\n    hideActions = _ref$hideActions === void 0 ? false : _ref$hideActions,\n    _ref$hideLabels = _ref.hideLabels,\n    hideLabels = _ref$hideLabels === void 0 ? false : _ref$hideLabels,\n    variables = _ref.variables,\n    buttonClassName = _ref.buttonClassName,\n    checkboxButtonClassName = _ref.checkboxButtonClassName,\n    headerClassName = _ref.headerClassName,\n    labelClassName = _ref.labelClassName,\n    formId = _ref.formId,\n    _ref$print = _ref.print,\n    print = _ref$print === void 0 ? false : _ref$print;\n  //#region useForms\n\n  var methods = (0,react_hook_form__WEBPACK_IMPORTED_MODULE_9__.useForm)({\n    mode: 'all',\n    reValidateMode: 'onChange',\n    criteriaMode: 'all',\n    shouldFocusError: true,\n    shouldUnregister: true\n  });\n\n  //#endregion\n  //#region helper functions\n\n  var _convert = function _convert($dataAnswers) {\n    if (Array.isArray($dataAnswers)) {\n      var result = {};\n      $dataAnswers.forEach(function (answer) {\n        result[answer.name] = answer.value;\n      });\n      return result;\n    }\n    return $dataAnswers || {};\n  };\n  var form = react__WEBPACK_IMPORTED_MODULE_0___default().useRef();\n  var inputs = react__WEBPACK_IMPORTED_MODULE_0___default().useRef({});\n  var answerData = react__WEBPACK_IMPORTED_MODULE_0___default().useRef(_convert(answers));\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    formAnswers = _React$useState2[0],\n    setFormAnswers = _React$useState2[1];\n  var _getDefaultValue = function _getDefaultValue($dataItem) {\n    var defaultValue = answerData.current[$dataItem.fieldName];\n    if ($dataItem.element === 'DatePicker') {\n      var _$dataItem$defaultTod;\n      var defaultToday = (_$dataItem$defaultTod = $dataItem.defaultToday) !== null && _$dataItem$defaultTod !== void 0 ? _$dataItem$defaultTod : false;\n      if (defaultToday && (defaultValue === '' || defaultValue === undefined)) {\n        var today = new Date();\n        var dd = today.getDate();\n        var mm = today.getMonth() + 1;\n        var yyyy = today.getFullYear();\n        if (dd < 10) {\n          dd = '0' + dd;\n        }\n        if (mm < 10) {\n          mm = '0' + mm;\n        }\n        today = mm + '/' + dd + '/' + yyyy;\n        defaultValue = today;\n      }\n    }\n    if ($dataItem.element === 'Checkbox') {\n      var _$dataItem$defaultChe;\n      var defaultChecked = (_$dataItem$defaultChe = $dataItem.defaultChecked) !== null && _$dataItem$defaultChe !== void 0 ? _$dataItem$defaultChe : false;\n      if (defaultChecked === true) {\n        defaultValue = true;\n      }\n    }\n    if (defaultValue === undefined) {\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'Tags') {\n        defaultValue = [];\n      } else if ($dataItem.element === 'NumberInput' || $dataItem.element === 'Range') {\n        var _$dataItem$minValue;\n        defaultValue = (_$dataItem$minValue = $dataItem.minValue) !== null && _$dataItem$minValue !== void 0 ? _$dataItem$minValue : 0;\n      } else {\n        defaultValue = '';\n      }\n    }\n    return defaultValue;\n  };\n  var _optionsDefaultValue = function _optionsDefaultValue($dataItem) {\n    var defaultValue = _getDefaultValue($dataItem);\n    if (defaultValue) {\n      return defaultValue;\n    }\n    var defaultChecked = [];\n    $dataItem.options.forEach(function (option) {\n      if (answerData.current[\"option_\".concat(option.key)]) {\n        defaultChecked.push(option.key);\n      }\n    });\n    return defaultChecked;\n  };\n  var _getItemValue = function _getItemValue($dataItem, ref) {\n    var _ref$inputField;\n    var $item = {\n      element: $dataItem.element,\n      value: ''\n    };\n    var $formData = methods === null || methods === void 0 ? void 0 : methods.getValues();\n    if ($dataItem.element === 'Rating') {\n      $item.value = ref.inputField.current.state.rating;\n    } else if ($dataItem.element === 'Tags') {\n      $item.value = $formData[$dataItem.fieldName];\n      // } else if (item.element === 'DatePicker') {\n      // \t$item.value = ref.state.value;\n    } else if ($dataItem.element === 'Camera') {\n      $item.value = ref.state.img;\n    } else if ($dataItem.element === 'FileUpload') {\n      $item.value = ref.state.fileUpload;\n    } else if ($dataItem.element === 'Signature') {\n      $item.value = ref.state.value;\n    } else if (ref && ref !== null && ref !== void 0 && ref.inputField && ref !== null && ref !== void 0 && (_ref$inputField = ref.inputField) !== null && _ref$inputField !== void 0 && _ref$inputField.current) {\n      $item = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.inputField.current);\n      if ($item && typeof $item.value === 'string') {\n        $item.value = $item.value.trim();\n      }\n    } else {\n      $item.value = $formData[$dataItem.fieldName];\n    }\n    return $item;\n  };\n  var _isIncorrect = function _isIncorrect($dataItem) {\n    var incorrect = false;\n    var canHaveAnswer = ['NumberInput', 'EmailInput', 'TextInput', 'PhoneNumber', 'TextArea', 'DatePicker', 'Dropdown', 'Tags', 'Checkboxes', 'Checkbox', 'RadioButtons', 'Rating', 'Range'].indexOf($dataItem.element) !== -1;\n    if (canHaveAnswer) {\n      var ref = inputs.current[$dataItem.fieldName];\n      if ($dataItem.element === 'Checkboxes' || $dataItem.element === 'RadioButtons') {\n        $dataItem.options.forEach(function (option) {\n          var $option = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(ref.options[\"child_ref_\".concat(option.key)]);\n          if (option.hasOwnProperty('correct') && !$option.checked || !option.hasOwnProperty('correct') && $option.checked) {\n            incorrect = true;\n          }\n        });\n      } else {\n        var $item = _getItemValue($dataItem, ref);\n        if ($dataItem.element === 'Rating' || $dataItem.element === 'Range' || $dataItem.element === 'NumberInput') {\n          // number to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($dataItem.element === 'Checkbox') {\n          // boolean to string\n          if ($item.value.toString() !== $dataItem.correct) {\n            incorrect = true;\n          }\n        } else if ($item.value.toLowerCase() !== $dataItem.correct.trim().toLowerCase()) {\n          incorrect = true;\n        }\n      }\n    }\n    return incorrect;\n  };\n  var _collectFormData = function _collectFormData($dataItems, $formData) {\n    var formData = [];\n    $dataItems.filter(function (i) {\n      return i[\"static\"] !== true;\n    }).forEach(function (item) {\n      var itemData = {\n        id: item.id,\n        name: item.fieldName,\n        customName: item.customName || item.fieldName,\n        label: item.label !== null && item.label !== undefined && item.label !== '' ? item.label.trim() : '',\n        value: $formData[item.fieldName],\n        required: item.required || false\n      };\n      if (itemData) {\n        formData.push(itemData);\n      }\n    });\n    return formData;\n  };\n\n  //#endregion\n  //#region form methods\n\n  var handleSubmit = function handleSubmit($formData, event) {\n    event.preventDefault();\n    var hasErrors = false;\n    if (validateForCorrectness) {\n      hasErrors = validateForm();\n    }\n\n    // Only submit if there are no errors.\n    if (hasErrors === false) {\n      if (onSubmit) {\n        var $data = _collectFormData(items, $formData);\n        onSubmit({\n          formData: $formData,\n          answers: $data\n        });\n        setFormAnswers($data);\n      } else {\n        var $form = react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(form.current);\n        $form.submit();\n      }\n    }\n  };\n  var handleChange = function handleChange(event) {\n    // Call submit function on change\n    var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n    // console.log('handleChange', $data);\n\n    if (onChange) {\n      onChange($data);\n    }\n    setFormAnswers($data);\n  };\n  var validateForm = function validateForm() {\n    var hasErrors = false;\n    var dataItems = items;\n    if (displayShort) {\n      dataItems = items.filter(function (i) {\n        return i.alternateForm === true;\n      });\n    }\n    dataItems.forEach(function (item) {\n      if (_isIncorrect(item)) {\n        if (methods) {\n          methods.setError(item.fieldName, {\n            type: 'incorrect',\n            message: \"\".concat(item.label, \" was answered incorrectly\")\n          });\n        }\n        hasErrors = true;\n      }\n    });\n    return hasErrors;\n  };\n  var getDataItemById = function getDataItemById(id) {\n    var $dataItem = items.find(function (x) {\n      return x.id === id;\n    });\n    if ($dataItem !== undefined) {\n      var _ref2, _ref3, _ref4, _$dataItem$fieldName;\n      return _objectSpread(_objectSpread({}, $dataItem), {}, {\n        fieldRules: getFieldRules($dataItem),\n        print: print !== null && print !== void 0 ? print : false,\n        readOnly: (_ref2 = readOnly || $dataItem.readOnly) !== null && _ref2 !== void 0 ? _ref2 : false,\n        hideLabel: (_ref3 = hideLabels || $dataItem.hideLabel) !== null && _ref3 !== void 0 ? _ref3 : false,\n        disabled: (_ref4 = readOnly || $dataItem.readOnly) !== null && _ref4 !== void 0 ? _ref4 : false,\n        mutable: true,\n        name: (_$dataItem$fieldName = $dataItem.fieldName) !== null && _$dataItem$fieldName !== void 0 ? _$dataItem$fieldName : $dataItem.name,\n        key: \"form_\".concat($dataItem.id),\n        item: $dataItem,\n        value: _getDefaultValue($dataItem)\n      });\n    }\n    return null;\n  };\n  var getStandardElement = function getStandardElement(item) {\n    var _item$fieldName;\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n      name: (_item$fieldName = item.fieldName) !== null && _item$fieldName !== void 0 ? _item$fieldName : item.name,\n      key: \"form_\".concat(item.id),\n      item: item,\n      value: _getDefaultValue(item),\n      onChange: handleChange\n    });\n  };\n  var getInputElement = function getInputElement(item) {\n    if (!item) return null;\n    if (item.custom) {\n      return getCustomElement(item);\n    }\n    var Input = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref5) {\n        var _ref5$field = _ref5.field,\n          _onChange = _ref5$field.onChange,\n          onBlur = _ref5$field.onBlur,\n          value = _ref5$field.value,\n          name = _ref5$field.name,\n          ref = _ref5$field.ref,\n          _ref5$fieldState = _ref5.fieldState,\n          invalid = _ref5$fieldState.invalid,\n          isTouched = _ref5$fieldState.isTouched,\n          isDirty = _ref5$fieldState.isDirty,\n          error = _ref5$fieldState.error,\n          formState = _ref5.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Input, {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item,\n          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,\n          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null\n        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var _item$childItems;\n    var controls = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_8__.isListNotEmpty)(item.childItems) ? item === null || item === void 0 || (_item$childItems = item.childItems) === null || _item$childItems === void 0 ? void 0 : _item$childItems.map(function (childItem) {\n      return childItem ? getFieldElement(getDataItemById(childItem)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, \"\\xA0\");\n    }) : [];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      controls: controls,\n      items: items,\n      answers: formAnswers\n    });\n  };\n  var getSimpleElement = function getSimpleElement(item) {\n    var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_2__[\"default\"][item.element];\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, {\n      mutable: true,\n      key: \"form_\".concat(item.id),\n      item: item,\n      headerClassName: headerClassName,\n      labelClassName: labelClassName\n    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_7___default().get(item.key);\n      if (!item.component) {\n        console.error(\"\".concat(item.element, \" was not registered\"));\n      }\n    }\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n      key: \"form_\".concat(item.id),\n      control: methods.control,\n      name: item.fieldName,\n      rules: item.fieldRules,\n      defaultValue: _getDefaultValue(item),\n      disabled: item.disabled,\n      required: item.required,\n      render: function render(_ref6) {\n        var _ref6$field = _ref6.field,\n          _onChange2 = _ref6$field.onChange,\n          onBlur = _ref6$field.onBlur,\n          value = _ref6$field.value,\n          name = _ref6$field.name,\n          ref = _ref6$field.ref,\n          _ref6$fieldState = _ref6.fieldState,\n          invalid = _ref6$fieldState.invalid,\n          isTouched = _ref6$fieldState.isTouched,\n          isDirty = _ref6$fieldState.isDirty,\n          error = _ref6$fieldState.error,\n          formState = _ref6.formState;\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n          onBlur: onBlur,\n          onChange: function onChange(e) {\n            _onChange2(e);\n            handleChange(e);\n          },\n          value: value,\n          name: name,\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          isInvalid: invalid,\n          item: item\n        });\n      }\n    });\n  };\n  var getFieldRules = function getFieldRules(item) {\n    var fieldRules = {};\n    if (item.fieldRules !== undefined && item.fieldRules !== null) {\n      fieldRules = _objectSpread({}, item.fieldRules);\n    }\n    if (item.required) {\n      fieldRules.required = \"\".concat(item.label, \" is required\");\n    }\n    return fieldRules;\n  };\n  var handleRenderSubmit = function handleRenderSubmit() {\n    var actionName = actionName || 'Submit';\n    var buttonProps = {};\n    if (formId) {\n      buttonProps.form = formId;\n    }\n    return submitButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"primary\",\n      type: \"submit\"\n    }, actionName);\n  };\n  var handleRenderBack = function handleRenderBack() {\n    var backName = backName || 'Cancel';\n    return backButton || /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      variant: \"secondary\",\n      onClick: backAction,\n      className: \"btn-cancel\"\n    }, backName);\n  };\n  var getFieldElement = function getFieldElement(item) {\n    var _ref7, _ref8, _ref9;\n    if (!item) return null;\n    item.fieldRules = getFieldRules(item);\n    item.print = print !== null && print !== void 0 ? print : false;\n    item.readOnly = (_ref7 = readOnly || item.readOnly) !== null && _ref7 !== void 0 ? _ref7 : false;\n    item.hideLabel = (_ref8 = hideLabels || item.hideLabel) !== null && _ref8 !== void 0 ? _ref8 : false;\n    item.disabled = (_ref9 = readOnly || item.readOnly) !== null && _ref9 !== void 0 ? _ref9 : false;\n    item.mutable = true;\n    switch (item.element) {\n      case 'RadioButtons':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\n      case 'Rating':\n      case 'Tags':\n      case 'Dropdown':\n      case 'TextInput':\n      case 'EmailInput':\n      case 'NumberInput':\n      case 'TextArea':\n      case 'PhoneNumber':\n      case 'DatePicker':\n        return getStandardElement(item);\n      case 'CustomElement':\n        return getCustomElement(item);\n      case 'MultiColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.MultiColumnRow);\n      case 'ThreeColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.ThreeColumnRow);\n      case 'TwoColumnRow':\n        return getContainerElement(item, _multi_column__WEBPACK_IMPORTED_MODULE_3__.TwoColumnRow);\n      case 'Step':\n        return getContainerElement(item, _step__WEBPACK_IMPORTED_MODULE_5__.Step);\n      case 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__.FieldSet);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref10) {\n            var _ref10$field = _ref10.field,\n              _onChange3 = _ref10$field.onChange,\n              onBlur = _ref10$field.onBlur,\n              value = _ref10$field.value,\n              name = _ref10$field.name,\n              ref = _ref10$field.ref,\n              _ref10$fieldState = _ref10.fieldState,\n              invalid = _ref10$fieldState.invalid,\n              isTouched = _ref10$fieldState.isTouched,\n              isDirty = _ref10$fieldState.isDirty,\n              error = _ref10$fieldState.error,\n              formState = _ref10.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Signature, {\n              methods: methods,\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange3(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              item: item\n            });\n          }\n        });\n      case 'Checkboxes':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _optionsDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref11) {\n            var _ref11$field = _ref11.field,\n              _onChange4 = _ref11$field.onChange,\n              onBlur = _ref11$field.onBlur,\n              value = _ref11$field.value,\n              name = _ref11$field.name,\n              ref = _ref11$field.ref,\n              _ref11$fieldState = _ref11.fieldState,\n              invalid = _ref11$fieldState.invalid,\n              isTouched = _ref11$fieldState.isTouched,\n              isDirty = _ref11$fieldState.isDirty,\n              error = _ref11$fieldState.error,\n              formState = _ref11.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Checkboxes, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange4(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item,\n              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,\n              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null\n            });\n          }\n        });\n      case 'Image':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Image, {\n          ref: function ref(c) {\n            return inputs.current[item.fieldName] = c;\n          },\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Download':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Download, {\n          downloadPath: downloadPath,\n          key: \"form_\".concat(item.id),\n          item: item\n        });\n      case 'Camera':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref12) {\n            var _ref12$field = _ref12.field,\n              _onChange5 = _ref12$field.onChange,\n              onBlur = _ref12$field.onBlur,\n              value = _ref12$field.value,\n              name = _ref12$field.name,\n              ref = _ref12$field.ref,\n              _ref12$fieldState = _ref12.fieldState,\n              invalid = _ref12$fieldState.invalid,\n              isTouched = _ref12$fieldState.isTouched,\n              isDirty = _ref12$fieldState.isDirty,\n              error = _ref12$fieldState.error,\n              formState = _ref12.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.Camera, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange5(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      case 'FileUpload':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.Controller, {\n          key: \"form_\".concat(item.id),\n          control: methods.control,\n          name: item.fieldName,\n          rules: item.fieldRules,\n          defaultValue: _getDefaultValue(item),\n          disabled: item.disabled,\n          required: item.required,\n          render: function render(_ref13) {\n            var _ref13$field = _ref13.field,\n              _onChange6 = _ref13$field.onChange,\n              onBlur = _ref13$field.onBlur,\n              value = _ref13$field.value,\n              name = _ref13$field.name,\n              ref = _ref13$field.ref,\n              _ref13$fieldState = _ref13.fieldState,\n              invalid = _ref13$fieldState.invalid,\n              isTouched = _ref13$fieldState.isTouched,\n              isDirty = _ref13$fieldState.isDirty,\n              error = _ref13$fieldState.error,\n              formState = _ref13.formState;\n            return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements__WEBPACK_IMPORTED_MODULE_2__.FileUpload, {\n              onBlur: onBlur,\n              onChange: function onChange(e) {\n                _onChange6(e);\n                handleChange(e);\n              },\n              value: value,\n              name: name,\n              ref: function ref(c) {\n                return inputs.current[item.fieldName] = c;\n              },\n              isInvalid: invalid,\n              item: item\n            });\n          }\n        });\n      default:\n        return getSimpleElement(item);\n    }\n  };\n\n  //#endregion\n\n  var dataItems = items ? _toConsumableArray(items) : [];\n  if (displayShort) {\n    dataItems = items ? _toConsumableArray(items).filter(function (i) {\n      return i.alternateForm === true;\n    }) : [];\n  }\n  dataItems.forEach(function (item) {\n    if (item && item.readOnly && item.variableKey && variables[item.variableKey]) {\n      answerData.current[item.fieldName] = variables[item.variableKey];\n    }\n  });\n  var fieldItems = dataItems.filter(function (x) {\n    return !x.parentId;\n  }).map(function (item) {\n    return getFieldElement(item);\n  });\n  var formProps = {};\n  if (formId) {\n    formProps.id = formId;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"react-survey-builder-form\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_9__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_11__[\"default\"], _extends({\n    onSubmit: methods.handleSubmit(handleSubmit)\n  }, formProps), fieldItems, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: buttonClassName ? buttonClassName : 'btn-toolbar'\n  }, !hideActions && handleRenderSubmit(), !hideActions && backAction && handleRenderBack())))));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ReactSurvey);\n\n//# sourceURL=webpack://react-survey-builder/./src/form.jsx?");
 
 /***/ }),
 
@@ -950,7 +950,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ElementStore: () => (/* reexport safe */ _stores_store__WEBPACK_IMPORTED_MODULE_6__[\"default\"]),\n/* harmony export */   ReactSurveyBuilder: () => (/* binding */ ReactSurveyBuilder),\n/* harmony export */   ReactSurveyFieldGenerator: () => (/* binding */ ReactSurveyFieldGenerator),\n/* harmony export */   ReactSurveyGenerator: () => (/* binding */ ReactSurveyGenerator),\n/* harmony export */   Registry: () => (/* reexport default from dynamic */ _stores_registry__WEBPACK_IMPORTED_MODULE_7___default.a),\n/* harmony export */   cleanUpSurveyItems: () => (/* binding */ cleanUpSurveyItems),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dnd__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-dnd */ \"./node_modules/react-dnd/dist/esm/common/DndProvider.js\");\n/* harmony import */ var react_dnd_html5_backend__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-dnd-html5-backend */ \"./node_modules/react-dnd-html5-backend/dist/esm/index.js\");\n/* harmony import */ var _preview__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./preview */ \"./src/preview.jsx\");\n/* harmony import */ var _toolbar__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./toolbar */ \"./src/toolbar.jsx\");\n/* harmony import */ var _form__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./form */ \"./src/form.jsx\");\n/* harmony import */ var _form_fields__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./form-fields */ \"./src/form-fields.jsx\");\n/* harmony import */ var _form_steps__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./form-steps */ \"./src/form-steps.jsx\");\n/* harmony import */ var _stores_store__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./stores/store */ \"./src/stores/store.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Container.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Row.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Col.js\");\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\nvar ReactSurveyBuilder = function ReactSurveyBuilder(_ref) {\n  var _ref$items = _ref.items,\n    items = _ref$items === void 0 ? [] : _ref$items,\n    _ref$showCorrectColum = _ref.showCorrectColumn,\n    showCorrectColumn = _ref$showCorrectColum === void 0 ? false : _ref$showCorrectColum,\n    _ref$files = _ref.files,\n    files = _ref$files === void 0 ? [] : _ref$files,\n    _ref$saveAlways = _ref.saveAlways,\n    saveAlways = _ref$saveAlways === void 0 ? false : _ref$saveAlways,\n    _ref$toolbarItems = _ref.toolbarItems,\n    toolbarItems = _ref$toolbarItems === void 0 ? [] : _ref$toolbarItems,\n    _ref$customToolbarIte = _ref.customToolbarItems,\n    customToolbarItems = _ref$customToolbarIte === void 0 ? [] : _ref$customToolbarIte,\n    _ref$showDescription = _ref.showDescription,\n    showDescription = _ref$showDescription === void 0 ? false : _ref$showDescription,\n    _ref$surveyName = _ref.surveyName,\n    surveyName = _ref$surveyName === void 0 ? null : _ref$surveyName,\n    _ref$saveSurveyName = _ref.saveSurveyName,\n    saveSurveyName = _ref$saveSurveyName === void 0 ? null : _ref$saveSurveyName,\n    _ref$previewSurveyBlo = _ref.previewSurveyBlock,\n    previewSurveyBlock = _ref$previewSurveyBlo === void 0 ? null : _ref$previewSurveyBlo,\n    renderEditForm = _ref.renderEditForm,\n    variables = _ref.variables,\n    onPost = _ref.onPost,\n    onLoad = _ref.onLoad,\n    url = _ref.url,\n    saveUrl = _ref.saveUrl;\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(false),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    editMode = _React$useState2[0],\n    setEditMode = _React$useState2[1];\n  var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState4 = _slicedToArray(_React$useState3, 2),\n    editElement = _React$useState4[0],\n    setEditElement = _React$useState4[1];\n  var saveFormData = function saveFormData() {\n    _stores_store__WEBPACK_IMPORTED_MODULE_6__[\"default\"].dispatch('post');\n  };\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_dnd__WEBPACK_IMPORTED_MODULE_8__.DndProvider, {\n    backend: react_dnd_html5_backend__WEBPACK_IMPORTED_MODULE_9__.HTML5Backend\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    fluid: true,\n    className: \"react-survey-builder position-absolute overflow-hidden\",\n    style: {\n      height: '100%'\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_11__[\"default\"], {\n    className: \"overflow-hidden h-100\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n    xs: 9,\n    className: \"overflow-hidden h-100\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_preview__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n    files: files,\n    showCorrectColumn: showCorrectColumn,\n    showDescription: showDescription,\n    items: items,\n    url: url,\n    saveUrl: saveUrl,\n    onLoad: onLoad,\n    onPost: onPost,\n    editMode: editMode,\n    setEditMode: setEditMode,\n    variables: variables,\n    registry: (_stores_registry__WEBPACK_IMPORTED_MODULE_7___default()),\n    editElement: editElement,\n    setEditElement: setEditElement,\n    renderEditForm: renderEditForm,\n    saveAlways: saveAlways\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n    xs: 3,\n    className: \"overflow-hidden h-100\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_toolbar__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n    toolbarTop: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"h3\", null, surveyName !== null && surveyName !== void 0 ? surveyName : 'Preview')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      className: \"d-grid gap-3 mb-3\"\n    }, !!!saveAlways && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Button, {\n      onClick: function onClick() {\n        saveFormData();\n      }\n    }, saveSurveyName || 'Save Survey'), previewSurveyBlock ? previewSurveyBlock : null)),\n    showDescription: showDescription,\n    items: toolbarItems,\n    customItems: customToolbarItems\n  })))));\n};\nvar ReactSurveyGenerator = function ReactSurveyGenerator(props) {\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_form__WEBPACK_IMPORTED_MODULE_3__[\"default\"], props);\n};\nvar ReactSurveyFieldGenerator = function ReactSurveyFieldGenerator(props) {\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_form_fields__WEBPACK_IMPORTED_MODULE_4__[\"default\"], props);\n};\nvar ReactSurveyStepGenerator = function ReactSurveyStepGenerator(props) {\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_form_steps__WEBPACK_IMPORTED_MODULE_5__[\"default\"], props);\n};\nvar cleanUpSurveyItems = function cleanUpSurveyItems() {\n  var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];\n  return items.map(function (item) {\n    var _item$element, _item$key;\n    var dataItem = {\n      id: item.id,\n      element: (_item$element = item.element) !== null && _item$element !== void 0 ? _item$element : (_item$key = item.key) !== null && _item$key !== void 0 ? _item$key : '',\n      text: item.text,\n      \"static\": item[\"static\"]\n    };\n    if (item.childItems !== undefined && item.childItems !== null) {\n      dataItem.childItems = item.childItems;\n    }\n    if (item.name !== undefined && item.name !== null) {\n      dataItem.name = item.name;\n    }\n    if (item.conditional !== undefined && item.conditional !== null) {\n      dataItem.conditional = item.conditional;\n    }\n    if (item.conditionalFieldName !== undefined && item.conditionalFieldName !== null) {\n      dataItem.conditionalFieldName = item.conditionalFieldName;\n    }\n    if (item.conditionalFieldValue !== undefined && item.conditionalFieldValue !== null) {\n      dataItem.conditionalFieldValue = item.conditionalFieldValue;\n    }\n    if (item.groupName !== undefined && item.groupName !== null) {\n      dataItem.groupName = item.groupName;\n    }\n    if (item.required !== undefined && item.required !== null) {\n      dataItem.required = item.required;\n    }\n    if (item.description !== undefined && item.description !== null) {\n      dataItem.description = item.description;\n    }\n    if (item.placeholder !== undefined && item.placeholder !== null) {\n      dataItem.placeholder = item.placeholder;\n    }\n    if (item.bold !== undefined && item.bold !== null) {\n      dataItem.bold = item.bold;\n    }\n    if (item.italic !== undefined && item.italic !== null) {\n      dataItem.italic = item.italic;\n    }\n    if (item.labelLocation !== undefined && item.labelLocation !== null) {\n      dataItem.labelLocation = item.labelLocation;\n    }\n    if (item.help !== undefined && item.help !== null) {\n      dataItem.help = item.help;\n    }\n    if (item.hideLabel !== undefined && item.hideLabel !== null) {\n      dataItem.hideLabel = item.hideLabel;\n    }\n    if (item.readOnly !== undefined && item.readOnly !== null) {\n      dataItem.readOnly = item.readOnly;\n    }\n    if (item.defaultToday !== undefined && item.defaultToday !== null) {\n      dataItem.defaultToday = item.defaultToday;\n    }\n    if (item.content !== undefined && item.content !== null) {\n      dataItem.content = item.content;\n    }\n    if (item.href !== undefined && item.href !== null) {\n      dataItem.href = item.href;\n    }\n    if (item.inherited !== undefined && item.inherited !== null) {\n      dataItem.inherited = item.inherited;\n    }\n    if (item.isContainer !== undefined && item.isContainer !== null) {\n      dataItem.isContainer = item.isContainer;\n    }\n    if (item.type === 'custom') {\n      elementOptions.key = item.key;\n      elementOptions.custom = true;\n      elementOptions.forwardRef = item.forwardRef;\n      elementOptions.bare = item.bare;\n      elementOptions.props = item.props;\n      elementOptions.component = item.component || null;\n      elementOptions.customOptions = item.customOptions || [];\n    }\n    if (item.pageBreakBefore !== undefined && item.pageBreakBefore !== null) {\n      dataItem.pageBreakBefore = item.pageBreakBefore;\n    }\n    if (item.alternateForm !== undefined && item.alternateForm !== null) {\n      dataItem.alternateForm = item.alternateForm;\n    }\n    if (item.inline !== undefined && item.inline !== null) {\n      dataItem.inline = item.inline;\n    }\n    if (item.className !== undefined && item.className !== null) {\n      dataItem.className = item.className;\n    }\n    if (item.src !== undefined && item.src !== null) {\n      dataItem.src = item.src;\n    }\n    if (item.dateFormat !== undefined && item.dateFormat !== null) {\n      dataItem.dateFormat = item.dateFormat;\n    }\n    if (item.filePath !== undefined && item.filePath !== null) {\n      dataItem.filePath = item.filePath;\n    }\n    if (item.step !== undefined && item.step !== null) {\n      dataItem.step = item.step;\n    }\n    if (item.minValue !== undefined && item.minValue !== null) {\n      dataItem.minValue = item.minValue;\n    }\n    if (item.maxValue !== undefined && item.maxValue !== null) {\n      dataItem.maxValue = item.maxValue;\n    }\n    if (item.minLabel !== undefined && item.minLabel !== null) {\n      dataItem.minLabel = item.minLabel;\n    }\n    if (item.maxLabel !== undefined && item.maxLabel !== null) {\n      dataItem.maxLabel = item.maxLabel;\n    }\n    if (item.defaultValue !== undefined && item.defaultValue !== null) {\n      dataItem.defaultValue = item.defaultValue;\n    }\n    if (item.colCount !== undefined && item.colCount !== null) {\n      dataItem.colCount = item.colCount;\n    }\n    if (item.fieldName !== undefined && item.fieldName !== null) {\n      dataItem.fieldName = item.fieldName;\n    }\n    if (item.label !== undefined && item.label !== null) {\n      dataItem.label = item.label;\n    }\n    if (item.options !== undefined && item.options !== null) {\n      dataItem.options = item.options;\n    }\n    return dataItem;\n  });\n};\nvar SurveyBuilders = {};\nSurveyBuilders.ReactSurveyBuilder = ReactSurveyBuilder;\nSurveyBuilders.ReactSurveyGenerator = ReactSurveyGenerator;\nSurveyBuilders.ReactSurveyFieldGenerator = ReactSurveyFieldGenerator;\nSurveyBuilders.ReactSurveyStepGenerator = ReactSurveyStepGenerator;\nSurveyBuilders.ElementStore = _stores_store__WEBPACK_IMPORTED_MODULE_6__[\"default\"];\nSurveyBuilders.Registry = (_stores_registry__WEBPACK_IMPORTED_MODULE_7___default());\nSurveyBuilders.cleanUpSurveyItems = cleanUpSurveyItems;\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SurveyBuilders);\n\n\n//# sourceURL=webpack://react-survey-builder/./src/index.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ElementStore: () => (/* reexport safe */ _stores_store__WEBPACK_IMPORTED_MODULE_6__[\"default\"]),\n/* harmony export */   ReactSurveyBuilder: () => (/* binding */ ReactSurveyBuilder),\n/* harmony export */   ReactSurveyFieldGenerator: () => (/* binding */ ReactSurveyFieldGenerator),\n/* harmony export */   ReactSurveyGenerator: () => (/* binding */ ReactSurveyGenerator),\n/* harmony export */   ReactSurveyStepGenerator: () => (/* binding */ ReactSurveyStepGenerator),\n/* harmony export */   Registry: () => (/* reexport default from dynamic */ _stores_registry__WEBPACK_IMPORTED_MODULE_7___default.a),\n/* harmony export */   cleanUpSurveyItems: () => (/* binding */ cleanUpSurveyItems),\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dnd__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-dnd */ \"./node_modules/react-dnd/dist/esm/common/DndProvider.js\");\n/* harmony import */ var react_dnd_html5_backend__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-dnd-html5-backend */ \"./node_modules/react-dnd-html5-backend/dist/esm/index.js\");\n/* harmony import */ var _preview__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./preview */ \"./src/preview.jsx\");\n/* harmony import */ var _toolbar__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./toolbar */ \"./src/toolbar.jsx\");\n/* harmony import */ var _form__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./form */ \"./src/form.jsx\");\n/* harmony import */ var _form_fields__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./form-fields */ \"./src/form-fields.jsx\");\n/* harmony import */ var _form_steps__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./form-steps */ \"./src/form-steps.jsx\");\n/* harmony import */ var _stores_store__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./stores/store */ \"./src/stores/store.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_7__);\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Container.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Row.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Col.js\");\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\nvar ReactSurveyBuilder = function ReactSurveyBuilder(_ref) {\n  var _ref$items = _ref.items,\n    items = _ref$items === void 0 ? [] : _ref$items,\n    _ref$showCorrectColum = _ref.showCorrectColumn,\n    showCorrectColumn = _ref$showCorrectColum === void 0 ? false : _ref$showCorrectColum,\n    _ref$files = _ref.files,\n    files = _ref$files === void 0 ? [] : _ref$files,\n    _ref$saveAlways = _ref.saveAlways,\n    saveAlways = _ref$saveAlways === void 0 ? false : _ref$saveAlways,\n    _ref$toolbarItems = _ref.toolbarItems,\n    toolbarItems = _ref$toolbarItems === void 0 ? [] : _ref$toolbarItems,\n    _ref$customToolbarIte = _ref.customToolbarItems,\n    customToolbarItems = _ref$customToolbarIte === void 0 ? [] : _ref$customToolbarIte,\n    _ref$showDescription = _ref.showDescription,\n    showDescription = _ref$showDescription === void 0 ? false : _ref$showDescription,\n    _ref$surveyName = _ref.surveyName,\n    surveyName = _ref$surveyName === void 0 ? null : _ref$surveyName,\n    _ref$saveSurveyName = _ref.saveSurveyName,\n    saveSurveyName = _ref$saveSurveyName === void 0 ? null : _ref$saveSurveyName,\n    _ref$previewSurveyBlo = _ref.previewSurveyBlock,\n    previewSurveyBlock = _ref$previewSurveyBlo === void 0 ? null : _ref$previewSurveyBlo,\n    renderEditForm = _ref.renderEditForm,\n    variables = _ref.variables,\n    onPost = _ref.onPost,\n    onLoad = _ref.onLoad,\n    url = _ref.url,\n    saveUrl = _ref.saveUrl;\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState(false),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    editMode = _React$useState2[0],\n    setEditMode = _React$useState2[1];\n  var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState(null),\n    _React$useState4 = _slicedToArray(_React$useState3, 2),\n    editElement = _React$useState4[0],\n    setEditElement = _React$useState4[1];\n  var saveFormData = function saveFormData() {\n    _stores_store__WEBPACK_IMPORTED_MODULE_6__[\"default\"].dispatch('post');\n  };\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_dnd__WEBPACK_IMPORTED_MODULE_8__.DndProvider, {\n    backend: react_dnd_html5_backend__WEBPACK_IMPORTED_MODULE_9__.HTML5Backend\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    fluid: true,\n    className: \"react-survey-builder position-absolute overflow-hidden\",\n    style: {\n      height: '100%'\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_11__[\"default\"], {\n    className: \"overflow-hidden h-100\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n    xs: 9,\n    className: \"overflow-hidden h-100\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_preview__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n    files: files,\n    showCorrectColumn: showCorrectColumn,\n    showDescription: showDescription,\n    items: items,\n    url: url,\n    saveUrl: saveUrl,\n    onLoad: onLoad,\n    onPost: onPost,\n    editMode: editMode,\n    setEditMode: setEditMode,\n    variables: variables,\n    registry: (_stores_registry__WEBPACK_IMPORTED_MODULE_7___default()),\n    editElement: editElement,\n    setEditElement: setEditElement,\n    renderEditForm: renderEditForm,\n    saveAlways: saveAlways\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n    xs: 3,\n    className: \"overflow-hidden h-100\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_toolbar__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n    toolbarTop: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"h3\", null, surveyName !== null && surveyName !== void 0 ? surveyName : 'Preview')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      className: \"d-grid gap-3 mb-3\"\n    }, !!!saveAlways ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Button, {\n      onClick: function onClick() {\n        saveFormData();\n      }\n    }, saveSurveyName || 'Save Survey') : null, previewSurveyBlock ? previewSurveyBlock : null)),\n    showDescription: showDescription,\n    items: toolbarItems,\n    customItems: customToolbarItems\n  })))));\n};\nvar ReactSurveyGenerator = function ReactSurveyGenerator(props) {\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_form__WEBPACK_IMPORTED_MODULE_3__[\"default\"], props);\n};\nvar ReactSurveyFieldGenerator = function ReactSurveyFieldGenerator(props) {\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_form_fields__WEBPACK_IMPORTED_MODULE_4__[\"default\"], props);\n};\nvar ReactSurveyStepGenerator = function ReactSurveyStepGenerator(props) {\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_form_steps__WEBPACK_IMPORTED_MODULE_5__[\"default\"], props);\n};\nvar cleanUpSurveyItems = function cleanUpSurveyItems() {\n  var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];\n  return items.map(function (item) {\n    var _item$element, _item$key;\n    var dataItem = {\n      id: item.id,\n      element: (_item$element = item.element) !== null && _item$element !== void 0 ? _item$element : (_item$key = item.key) !== null && _item$key !== void 0 ? _item$key : '',\n      text: item.text,\n      \"static\": item[\"static\"]\n    };\n    if (item.childItems !== undefined && item.childItems !== null) {\n      dataItem.childItems = item.childItems;\n    }\n    if (item.name !== undefined && item.name !== null) {\n      dataItem.name = item.name;\n    }\n    if (item.conditional !== undefined && item.conditional !== null) {\n      dataItem.conditional = item.conditional;\n    }\n    if (item.conditionalFieldName !== undefined && item.conditionalFieldName !== null) {\n      dataItem.conditionalFieldName = item.conditionalFieldName;\n    }\n    if (item.conditionalFieldValue !== undefined && item.conditionalFieldValue !== null) {\n      dataItem.conditionalFieldValue = item.conditionalFieldValue;\n    }\n    if (item.groupName !== undefined && item.groupName !== null) {\n      dataItem.groupName = item.groupName;\n    }\n    if (item.required !== undefined && item.required !== null) {\n      dataItem.required = item.required;\n    }\n    if (item.description !== undefined && item.description !== null) {\n      dataItem.description = item.description;\n    }\n    if (item.placeholder !== undefined && item.placeholder !== null) {\n      dataItem.placeholder = item.placeholder;\n    }\n    if (item.bold !== undefined && item.bold !== null) {\n      dataItem.bold = item.bold;\n    }\n    if (item.italic !== undefined && item.italic !== null) {\n      dataItem.italic = item.italic;\n    }\n    if (item.labelLocation !== undefined && item.labelLocation !== null) {\n      dataItem.labelLocation = item.labelLocation;\n    }\n    if (item.help !== undefined && item.help !== null) {\n      dataItem.help = item.help;\n    }\n    if (item.hideLabel !== undefined && item.hideLabel !== null) {\n      dataItem.hideLabel = item.hideLabel;\n    }\n    if (item.readOnly !== undefined && item.readOnly !== null) {\n      dataItem.readOnly = item.readOnly;\n    }\n    if (item.defaultToday !== undefined && item.defaultToday !== null) {\n      dataItem.defaultToday = item.defaultToday;\n    }\n    if (item.content !== undefined && item.content !== null) {\n      dataItem.content = item.content;\n    }\n    if (item.href !== undefined && item.href !== null) {\n      dataItem.href = item.href;\n    }\n    if (item.inherited !== undefined && item.inherited !== null) {\n      dataItem.inherited = item.inherited;\n    }\n    if (item.isContainer !== undefined && item.isContainer !== null) {\n      dataItem.isContainer = item.isContainer;\n    }\n    if (item.type === 'custom') {\n      elementOptions.key = item.key;\n      elementOptions.custom = true;\n      elementOptions.forwardRef = item.forwardRef;\n      elementOptions.bare = item.bare;\n      elementOptions.props = item.props;\n      elementOptions.component = item.component || null;\n      elementOptions.customOptions = item.customOptions || [];\n    }\n    if (item.pageBreakBefore !== undefined && item.pageBreakBefore !== null) {\n      dataItem.pageBreakBefore = item.pageBreakBefore;\n    }\n    if (item.alternateForm !== undefined && item.alternateForm !== null) {\n      dataItem.alternateForm = item.alternateForm;\n    }\n    if (item.inline !== undefined && item.inline !== null) {\n      dataItem.inline = item.inline;\n    }\n    if (item.className !== undefined && item.className !== null) {\n      dataItem.className = item.className;\n    }\n    if (item.src !== undefined && item.src !== null) {\n      dataItem.src = item.src;\n    }\n    if (item.dateFormat !== undefined && item.dateFormat !== null) {\n      dataItem.dateFormat = item.dateFormat;\n    }\n    if (item.filePath !== undefined && item.filePath !== null) {\n      dataItem.filePath = item.filePath;\n    }\n    if (item.step !== undefined && item.step !== null) {\n      dataItem.step = item.step;\n    }\n    if (item.minValue !== undefined && item.minValue !== null) {\n      dataItem.minValue = item.minValue;\n    }\n    if (item.maxValue !== undefined && item.maxValue !== null) {\n      dataItem.maxValue = item.maxValue;\n    }\n    if (item.minLabel !== undefined && item.minLabel !== null) {\n      dataItem.minLabel = item.minLabel;\n    }\n    if (item.maxLabel !== undefined && item.maxLabel !== null) {\n      dataItem.maxLabel = item.maxLabel;\n    }\n    if (item.defaultValue !== undefined && item.defaultValue !== null) {\n      dataItem.defaultValue = item.defaultValue;\n    }\n    if (item.colCount !== undefined && item.colCount !== null) {\n      dataItem.colCount = item.colCount;\n    }\n    if (item.fieldName !== undefined && item.fieldName !== null) {\n      dataItem.fieldName = item.fieldName;\n    }\n    if (item.label !== undefined && item.label !== null) {\n      dataItem.label = item.label;\n    }\n    if (item.options !== undefined && item.options !== null) {\n      dataItem.options = item.options;\n    }\n    return dataItem;\n  });\n};\nvar SurveyBuilders = {};\nSurveyBuilders.ReactSurveyBuilder = ReactSurveyBuilder;\nSurveyBuilders.ReactSurveyGenerator = ReactSurveyGenerator;\nSurveyBuilders.ReactSurveyFieldGenerator = ReactSurveyFieldGenerator;\nSurveyBuilders.ReactSurveyStepGenerator = ReactSurveyStepGenerator;\nSurveyBuilders.ElementStore = _stores_store__WEBPACK_IMPORTED_MODULE_6__[\"default\"];\nSurveyBuilders.Registry = (_stores_registry__WEBPACK_IMPORTED_MODULE_7___default());\nSurveyBuilders.cleanUpSurveyItems = cleanUpSurveyItems;\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SurveyBuilders);\n\n\n//# sourceURL=webpack://react-survey-builder/./src/index.jsx?");
 
 /***/ }),
 
@@ -972,7 +972,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dnd__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react-dnd */ \"./node_modules/react-dnd/dist/esm/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _stores_store__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../stores/store */ \"./src/stores/store.js\");\nvar _excluded = [\"onDropSuccess\", \"seq\", \"draggedItem\", \"parentIndex\", \"canDrop\", \"isOver\", \"isOverCurrent\", \"connectDropTarget\", \"items\", \"col\", \"getItemById\"];\nfunction _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); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\n\n\n\n\n\n\n\nfunction getCustomElement(item, props) {\n  var _item$fieldName;\n  if (!item.component || typeof item.component !== 'function') {\n    item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_4___default().get(item.key);\n    if (!item.component) {\n      console.error(\"\".concat(item.element, \" was not registered\"));\n    }\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__[\"default\"], _extends({}, props, {\n    mutable: false,\n    key: \"form_\".concat(item.id),\n    id: item.id,\n    name: (_item$fieldName = item.fieldName) !== null && _item$fieldName !== void 0 ? _item$fieldName : item.name,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n}\nvar getElement = function getElement(item, props) {\n  var _item$fieldName2;\n  if (!item) return null;\n  if (item.custom) {\n    return getCustomElement(item, props);\n  }\n  console.log('getDustbinElement', item);\n  var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_1__[\"default\"][item.element || item.key];\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, _extends({}, props, {\n    id: item.id,\n    key: \"form_\".concat(item.id),\n    name: (_item$fieldName2 = item.fieldName) !== null && _item$fieldName2 !== void 0 ? _item$fieldName2 : item.name,\n    mutable: false,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n};\nvar getStyle = function getStyle(backgroundColor) {\n  return {\n    border: '1px dashed rgba(0,0,0,0.2)',\n    minHeight: '2rem',\n    minWidth: '7rem',\n    width: '100%',\n    backgroundColor: backgroundColor,\n    padding: 0,\n    \"float\": 'left'\n  };\n};\nvar isContainer = function isContainer(containerItem) {\n  if (containerItem.itemType !== _ItemTypes__WEBPACK_IMPORTED_MODULE_2__[\"default\"].CARD) {\n    var item = containerItem.item;\n    if (item) {\n      if (item.isContainer) {\n        return true;\n      }\n      if (item.fieldName) {\n        return item.fieldName.indexOf('_col_row') > -1;\n      }\n    }\n  }\n  return false;\n};\nvar Dustbin = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (_ref, ref) {\n  var onDropSuccess = _ref.onDropSuccess,\n    seq = _ref.seq,\n    draggedItem = _ref.draggedItem,\n    parentIndex = _ref.parentIndex,\n    canDrop = _ref.canDrop,\n    isOver = _ref.isOver,\n    isOverCurrent = _ref.isOverCurrent,\n    connectDropTarget = _ref.connectDropTarget,\n    items = _ref.items,\n    col = _ref.col,\n    getItemById = _ref.getItemById,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var item = getItemById(items[col]);\n  react__WEBPACK_IMPORTED_MODULE_0___default().useImperativeHandle(ref, function () {\n    return {\n      onDrop: function onDrop(dropped) {\n        console.log(\"dropped item\", dropped);\n        var item = dropped.item;\n        if (item) {\n          if (onDropSuccess) {\n            onDropSuccess();\n          }\n          _stores_store__WEBPACK_IMPORTED_MODULE_5__[\"default\"].dispatch('deleteLastItem');\n        }\n      }\n    };\n  }, []);\n  var element = getElement(item, otherProps);\n  var sameCard = draggedItem ? draggedItem.index === parentIndex : false;\n\n  // console.log('dragIndex:',draggedItem?.index)\n  // console.log('HoverIndex:',parentIndex)\n  // console.log('SameCard:',sameCard)\n\n  var backgroundColor = 'rgba(0, 0, 0, .03)';\n  if (!sameCard && isOver && canDrop && !draggedItem.item.isContainer) {\n    backgroundColor = '#F7F589';\n  }\n\n  // console.log('sameCard, canDrop', sameCard, canDrop);\n  return connectDropTarget( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: !sameCard ? getStyle(backgroundColor) : getStyle('rgba(0, 0, 0, .03')\n  }, !element && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"w-100 text-center\",\n    style: {\n      margin: 20\n    }\n  }, \"Drop your element here \"), element));\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,react_dnd__WEBPACK_IMPORTED_MODULE_6__.DropTarget)(function (props) {\n  return props.accepts;\n}, {\n  drop: function drop(props, monitor, component) {\n    console.log('droptargetprops', props);\n    if (!component) {\n      return;\n    }\n\n    // //Do nothing whith busy dustbin\n    // if(props.items[props.col]) return;\n    // Allow swap column if target and source are in same multi column row\n    var isBusy = !!props.items[props.col];\n    var item = monitor.getItem();\n    console.log('dustbin', props, item, isBusy);\n\n    // Do nothing when moving the box inside the same column\n    if (props.col === item.col && props.items[props.col] === item.id) return;\n\n    // Do not allow replace component other than both items in same multi column row\n    if (item.col === undefined && props.items[props.col]) {\n      //store.dispatch('resetLastItem');\n      //console.log('dropping item in dustbin');\n      //store.dispatch('deleteLastItem');\n      return;\n    }\n    if (!isContainer(item)) {\n      component.onDrop(item);\n      console.log(\"calling on Drop from 137\", item);\n      if (item.item && typeof props.setAsChild === 'function') {\n        console.log('setAsChild function being called');\n        var isNew = !item.item.id;\n        var $dataItem = isNew ? item.onCreate(item.item) : item.item;\n        props.setAsChild(props.item, $dataItem, isNew, item.index, props.col, isBusy);\n      }\n    }\n  }\n}, function (connect, monitor) {\n  return {\n    connectDropTarget: connect.dropTarget(),\n    draggedItem: monitor.getItem() ? monitor.getItem() : null,\n    isOver: monitor.isOver(),\n    isOverCurrent: monitor.isOver({\n      shallow: true\n    }),\n    canDrop: monitor.canDrop()\n  };\n})(Dustbin));\n\n//# sourceURL=webpack://react-survey-builder/./src/multi-column/dustbin.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dnd__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-dnd */ \"./node_modules/react-dnd/dist/esm/index.js\");\n/* harmony import */ var _survey_elements__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements */ \"./src/survey-elements/index.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_4__);\n/* harmony import */ var _stores_store__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../stores/store */ \"./src/stores/store.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nvar _excluded = [\"onDropSuccess\", \"seq\", \"draggedItem\", \"parentIndex\", \"canDrop\", \"isOver\", \"isOverCurrent\", \"connectDropTarget\", \"items\", \"col\", \"getItemById\"];\nfunction _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); }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\n\n\n\n\n\n\n\n\nfunction getCustomElement(item, props) {\n  var _item$fieldName;\n  if (!item.component || typeof item.component !== 'function') {\n    item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_4___default().get(item.key);\n    if (!item.component) {\n      console.error(\"\".concat(item.element, \" was not registered\"));\n    }\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_3__[\"default\"], _extends({}, props, {\n    mutable: false,\n    key: \"form_\".concat(item.id),\n    id: item.id,\n    name: (_item$fieldName = item.fieldName) !== null && _item$fieldName !== void 0 ? _item$fieldName : item.name,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n}\nvar getElement = function getElement(item, props) {\n  var _item$fieldName2;\n  if (!item) return null;\n  if (item.custom) {\n    return getCustomElement(item, props);\n  }\n  console.log('getDustbinElement', item);\n  var Element = _survey_elements__WEBPACK_IMPORTED_MODULE_1__[\"default\"][item.element || item.key];\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Element, _extends({}, props, {\n    id: item.id,\n    key: \"form_\".concat(item.id),\n    name: (_item$fieldName2 = item.fieldName) !== null && _item$fieldName2 !== void 0 ? _item$fieldName2 : item.name,\n    mutable: false,\n    item: _objectSpread(_objectSpread({}, item), {}, {\n      mutable: false,\n      readOnly: false,\n      print: false\n    })\n  }));\n};\nvar getStyle = function getStyle(backgroundColor) {\n  return {\n    border: '1px dashed rgba(0,0,0,0.2)',\n    minHeight: '2rem',\n    minWidth: '7rem',\n    width: '100%',\n    backgroundColor: backgroundColor,\n    padding: 0,\n    \"float\": 'left'\n  };\n};\nvar isContainer = function isContainer(containerItem) {\n  if (containerItem.itemType !== _ItemTypes__WEBPACK_IMPORTED_MODULE_2__[\"default\"].CARD) {\n    var item = containerItem.item;\n    if (item) {\n      if (item.isContainer) {\n        return true;\n      }\n      if (item.fieldName) {\n        return item.fieldName.indexOf('_col_row') > -1;\n      }\n    }\n  }\n  return false;\n};\nvar Dustbin = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().forwardRef(function (_ref, ref) {\n  var onDropSuccess = _ref.onDropSuccess,\n    seq = _ref.seq,\n    draggedItem = _ref.draggedItem,\n    parentIndex = _ref.parentIndex,\n    canDrop = _ref.canDrop,\n    isOver = _ref.isOver,\n    isOverCurrent = _ref.isOverCurrent,\n    connectDropTarget = _ref.connectDropTarget,\n    items = _ref.items,\n    col = _ref.col,\n    getItemById = _ref.getItemById,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var item = (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_6__.isListNotEmpty)(items) ? getItemById(items[col]) : null;\n  react__WEBPACK_IMPORTED_MODULE_0___default().useImperativeHandle(ref, function () {\n    return {\n      onDrop: function onDrop(dropped) {\n        console.log(\"dropped item\", dropped);\n        var item = dropped.item;\n        if (item) {\n          if (onDropSuccess) {\n            onDropSuccess();\n          }\n          _stores_store__WEBPACK_IMPORTED_MODULE_5__[\"default\"].dispatch('deleteLastItem');\n        }\n      }\n    };\n  }, []);\n  var element = getElement(item, otherProps);\n  var sameCard = draggedItem ? draggedItem.index === parentIndex : false;\n\n  // console.log('dragIndex:',draggedItem?.index)\n  // console.log('HoverIndex:',parentIndex)\n  // console.log('SameCard:',sameCard)\n\n  var backgroundColor = 'rgba(0, 0, 0, .03)';\n  if (!sameCard && isOver && canDrop && !draggedItem.item.isContainer) {\n    backgroundColor = '#F7F589';\n  }\n\n  // console.log('sameCard, canDrop', sameCard, canDrop);\n  return connectDropTarget( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: !sameCard ? getStyle(backgroundColor) : getStyle('rgba(0, 0, 0, .03')\n  }, !element && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"w-100 text-center\",\n    style: {\n      margin: 20\n    }\n  }, \"Drop your element here \"), element));\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ((0,react_dnd__WEBPACK_IMPORTED_MODULE_7__.DropTarget)(function (props) {\n  return props.accepts;\n}, {\n  drop: function drop(props, monitor, component) {\n    console.log('droptargetprops', props);\n    if (!component) {\n      return;\n    }\n\n    // //Do nothing whith busy dustbin\n    // if(props.items[props.col]) return;\n    // Allow swap column if target and source are in same multi column row\n    var isBusy = !!props.items[props.col];\n    var item = monitor.getItem();\n    console.log('dustbin', props, item, isBusy);\n\n    // Do nothing when moving the box inside the same column\n    if (props.col === item.col && props.items[props.col] === item.id) return;\n\n    // Do not allow replace component other than both items in same multi column row\n    if (item.col === undefined && props.items[props.col]) {\n      //store.dispatch('resetLastItem');\n      //console.log('dropping item in dustbin');\n      //store.dispatch('deleteLastItem');\n      return;\n    }\n    if (!isContainer(item)) {\n      component.onDrop(item);\n      console.log(\"calling on Drop from 137\", item);\n      if (item.item && typeof props.setAsChild === 'function') {\n        console.log('setAsChild function being called');\n        var isNew = !item.item.id;\n        var $dataItem = isNew ? item.onCreate(item.item) : item.item;\n        props.setAsChild(props.item, $dataItem, isNew, item.index, props.col, isBusy);\n      }\n    }\n  }\n}, function (connect, monitor) {\n  return {\n    connectDropTarget: connect.dropTarget(),\n    draggedItem: monitor.getItem() ? monitor.getItem() : null,\n    isOver: monitor.isOver(),\n    isOverCurrent: monitor.isOver({\n      shallow: true\n    }),\n    canDrop: monitor.canDrop()\n  };\n})(Dustbin));\n\n//# sourceURL=webpack://react-survey-builder/./src/multi-column/dustbin.jsx?");
 
 /***/ }),
 
@@ -1027,7 +1027,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../multi-column/dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _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); }\nvar _excluded = [\"item\", \"controls\", \"items\", \"answers\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"index\", \"style\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].CARD];\nvar StepBase = function StepBase(_ref) {\n  var _item$conditional;\n  var item = _ref.item,\n    controls = _ref.controls,\n    items = _ref.items,\n    answers = _ref.answers,\n    editModeOn = _ref.editModeOn,\n    getItemById = _ref.getItemById,\n    setAsChild = _ref.setAsChild,\n    removeChild = _ref.removeChild,\n    seq = _ref.seq,\n    index = _ref.index,\n    style = _ref.style,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = \"SortableItem rfb-item\";\n  if (pageBreakBefore) {\n    baseClasses += \" alwaysbreak\";\n  }\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState((_item$conditional = item === null || item === void 0 ? void 0 : item.conditional) !== null && _item$conditional !== void 0 ? _item$conditional : false),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    hidden = _React$useState2[0],\n    setHidden = _React$useState2[1];\n  var _React$useState3 = react__WEBPACK_IMPORTED_MODULE_0___default().useState((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems) ? _toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems) : [null]),\n    _React$useState4 = _slicedToArray(_React$useState3, 2),\n    childItemIds = _React$useState4[0],\n    setChildItemIds = _React$useState4[1];\n  var _onDropSuccess = function onDropSuccess(droppedIndex) {\n    // let updatedItem = isObjectNotEmpty(item) ? { ...item } : {};\n    // let existingChildItemIds = isListNotEmpty(updatedItem.childItems) ? [...updatedItem.childItems] : [null];\n    // const isLastChild = existingChildItemIds === (droppedIndex + 1);\n    // console.log('onDropSuccess', droppedIndex, existingChildItemIds, childItemIds, item, isLastChild);\n\n    // if (isLastChild) {\n    //     let updatedChildItemIds = Array.from({ length: existingChildItemIds.length + 1 }, (v, i) => { return existingChildItemIds[i] ? existingChildItemIds[i] : null });\n    //     setChildItemIds(updatedChildItemIds);\n    // }\n  };\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems)) {\n      setChildItemIds([].concat(_toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems), [null]));\n    } else {\n      setChildItemIds([null]);\n    }\n  }, [item]);\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    // console.log('all items', items);\n    var hideStep = false;\n    if ((item === null || item === void 0 ? void 0 : item.conditional) === true) {\n      hideStep = true;\n      if (item.conditionalFieldName && item.conditionalFieldValue && answers !== undefined && answers !== null && answers.length > 0) {\n        var answerField = answers.find(function (i) {\n          return i.name === item.conditionalFieldName;\n        });\n        if (answerField !== undefined && (answerField === null || answerField === void 0 ? void 0 : answerField.value) !== undefined) {\n          if (Array.isArray(item.conditionalFieldValue)) {\n            if (Array.isArray(answerField === null || answerField === void 0 ? void 0 : answerField.value)) {\n              var match = item.conditionalFieldValue.some(function (i) {\n                return answerField.value.includes(i);\n              });\n              if (match) {\n                hideStep = false;\n              }\n            } else if (item.conditionalFieldValue.includes(answerField.value)) {\n              hideStep = false;\n            }\n          } else {\n            if (Array.isArray(answerField === null || answerField === void 0 ? void 0 : answerField.value)) {\n              var _match = answerField.value.includes(item.conditionalFieldValue);\n              if (_match) {\n                hideStep = false;\n              }\n            } else if (item.conditionalFieldValue === answerField.value) {\n              hideStep = false;\n            }\n          }\n        }\n      }\n    }\n    setHidden(hideStep);\n  }, [item, answers]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"fieldset\", {\n    className: hidden ? 'w-100 d-none' : 'w-100'\n  }, childItemIds === null || childItemIds === void 0 ? void 0 : childItemIds.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || \"_\")\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n      style: {\n        width: \"100%\"\n      },\n      item: item,\n      accepts: accepts,\n      items: childItemIds,\n      key: childItemIndex,\n      col: childItemIndex,\n      onDropSuccess: function onDropSuccess() {\n        _onDropSuccess(childItemIndex);\n      },\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      rowNo: childItemIndex\n    }));\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StepBase);\n\n//# sourceURL=webpack://react-survey-builder/./src/step/Step.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../survey-elements/component-header */ \"./src/survey-elements/component-header.jsx\");\n/* harmony import */ var _multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../multi-column/dustbin */ \"./src/multi-column/dustbin.jsx\");\n/* harmony import */ var _ItemTypes__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ItemTypes */ \"./src/ItemTypes.js\");\n/* harmony import */ var _utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils/objectUtils */ \"./src/utils/objectUtils.js\");\nfunction _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); }\nvar _excluded = [\"item\", \"controls\", \"items\", \"answers\", \"editModeOn\", \"getItemById\", \"setAsChild\", \"removeChild\", \"seq\", \"index\", \"style\"];\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _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); }\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }\n/* eslint-disable camelcase */\n\n\n\n\n\n\nvar accepts = [_ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].BOX, _ItemTypes__WEBPACK_IMPORTED_MODULE_3__[\"default\"].CARD];\nvar StepBase = function StepBase(_ref) {\n  var item = _ref.item,\n    controls = _ref.controls,\n    items = _ref.items,\n    answers = _ref.answers,\n    editModeOn = _ref.editModeOn,\n    getItemById = _ref.getItemById,\n    setAsChild = _ref.setAsChild,\n    removeChild = _ref.removeChild,\n    seq = _ref.seq,\n    index = _ref.index,\n    style = _ref.style,\n    otherProps = _objectWithoutProperties(_ref, _excluded);\n  var pageBreakBefore = item.pageBreakBefore;\n  var baseClasses = \"SortableItem rfb-item\";\n  if (pageBreakBefore) {\n    baseClasses += \" alwaysbreak\";\n  }\n\n  // const [hidden, setHidden] = React.useState(item?.conditional ?? false);\n  var _React$useState = react__WEBPACK_IMPORTED_MODULE_0___default().useState((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems) ? _toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems) : [null]),\n    _React$useState2 = _slicedToArray(_React$useState, 2),\n    childItemIds = _React$useState2[0],\n    setChildItemIds = _React$useState2[1];\n  var _onDropSuccess = function onDropSuccess(droppedIndex) {\n    // let updatedItem = isObjectNotEmpty(item) ? { ...item } : {};\n    // let existingChildItemIds = isListNotEmpty(updatedItem.childItems) ? [...updatedItem.childItems] : [null];\n    // const isLastChild = existingChildItemIds === (droppedIndex + 1);\n    // console.log('onDropSuccess', droppedIndex, existingChildItemIds, childItemIds, item, isLastChild);\n\n    // if (isLastChild) {\n    //     let updatedChildItemIds = Array.from({ length: existingChildItemIds.length + 1 }, (v, i) => { return existingChildItemIds[i] ? existingChildItemIds[i] : null });\n    //     setChildItemIds(updatedChildItemIds);\n    // }\n  };\n  react__WEBPACK_IMPORTED_MODULE_0___default().useEffect(function () {\n    if ((0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isObjectNotEmpty)(item) && (0,_utils_objectUtils__WEBPACK_IMPORTED_MODULE_4__.isListNotEmpty)(item === null || item === void 0 ? void 0 : item.childItems)) {\n      setChildItemIds([].concat(_toConsumableArray(item === null || item === void 0 ? void 0 : item.childItems), [null]));\n    } else {\n      setChildItemIds([null]);\n    }\n  }, [item]);\n\n  // React.useEffect(() => {\n  // \t// console.log('all items', items);\n  // \tlet hideStep = false;\n  // \tif (item?.conditional === true) {\n  // \t\thideStep = true;\n  // \t\tif (item.conditionalFieldName && item.conditionalFieldValue && answers !== undefined && answers !== null && answers.length > 0) {\n  // \t\t\tconst answerField = answers.find(i => i.name === item.conditionalFieldName);\n  // \t\t\tif (answerField !== undefined && answerField?.value !== undefined) {\n  // \t\t\t\tif (Array.isArray(item.conditionalFieldValue)) {\n  // \t\t\t\t\tif (Array.isArray(answerField?.value)) {\n  // \t\t\t\t\t\tlet match = item.conditionalFieldValue.some(i => answerField.value.includes(i));\n  // \t\t\t\t\t\tif (match) {\n  // \t\t\t\t\t\t\thideStep = false;\n  // \t\t\t\t\t\t}\n  // \t\t\t\t\t} else if (item.conditionalFieldValue.includes(answerField.value)) {\n  // \t\t\t\t\t\thideStep = false;\n  // \t\t\t\t\t}\n  // \t\t\t\t} else {\n  // \t\t\t\t\tif (Array.isArray(answerField?.value)) {\n  // \t\t\t\t\t\tlet match = answerField.value.includes(item.conditionalFieldValue);\n  // \t\t\t\t\t\tif (match) {\n  // \t\t\t\t\t\t\thideStep = false;\n  // \t\t\t\t\t\t}\n  // \t\t\t\t\t} else if (item.conditionalFieldValue === answerField.value) {\n  // \t\t\t\t\t\thideStep = false;\n  // \t\t\t\t\t}\n  // \t\t\t\t}\n  // \t\t\t}\n  // \t\t}\n  // \t}\n\n  // \tsetHidden(hideStep);\n  // }, [item, answers]);\n\n  console.log('controls', controls);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({}, style),\n    className: baseClasses\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_survey_elements_component_header__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _extends({\n    item: item,\n    index: index,\n    editModeOn: editModeOn,\n    setAsChild: setAsChild,\n    isStep: true\n  }, otherProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: 'd-grid w-100'\n  }, childItemIds === null || childItemIds === void 0 ? void 0 : childItemIds.map(function (childItemId, childItemIndex) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n      key: \"\".concat(childItemIndex, \"_\").concat(childItemId || \"_\")\n    }, controls ? controls[childItemIndex] : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_multi_column_dustbin__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n      style: {\n        width: \"100%\"\n      },\n      item: item,\n      accepts: accepts,\n      items: childItemIds,\n      key: childItemIndex,\n      col: childItemIndex,\n      onDropSuccess: function onDropSuccess() {\n        _onDropSuccess(childItemIndex);\n      },\n      parentIndex: index,\n      editModeOn: editModeOn,\n      _onDestroy: function _onDestroy() {\n        removeChild(item, childItemIndex);\n      },\n      getItemById: getItemById,\n      setAsChild: setAsChild,\n      seq: seq,\n      rowNo: childItemIndex\n    }));\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StepBase);\n\n//# sourceURL=webpack://react-survey-builder/./src/step/Step.jsx?");
 
 /***/ }),
 
@@ -1136,7 +1136,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _header_bar__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./header-bar */ \"./src/survey-elements/header-bar.jsx\");\n\n\nvar ComponentHeader = function ComponentHeader(_ref) {\n  var item = _ref.item,\n    isFieldSet = _ref.isFieldSet,\n    index = _ref.index,\n    editModeOn = _ref.editModeOn,\n    setAsChild = _ref.setAsChild,\n    _onDestroy = _ref._onDestroy,\n    onEdit = _ref.onEdit;\n  if (item !== null && item !== void 0 && item.mutable) {\n    return null;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, (item === null || item === void 0 ? void 0 : item.pageBreakBefore) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"preview-page-break\"\n  }, \"Page Break\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_header_bar__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n    isFieldSet: isFieldSet,\n    editModeOn: editModeOn,\n    item: item,\n    index: index,\n    setAsChild: setAsChild,\n    onDestroy: _onDestroy,\n    onEdit: onEdit,\n    \"static\": item === null || item === void 0 ? void 0 : item[\"static\"],\n    required: item === null || item === void 0 ? void 0 : item.required\n  }));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ComponentHeader);\n\n//# sourceURL=webpack://react-survey-builder/./src/survey-elements/component-header.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _header_bar__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./header-bar */ \"./src/survey-elements/header-bar.jsx\");\n\n\nvar ComponentHeader = function ComponentHeader(_ref) {\n  var item = _ref.item,\n    _ref$isFieldSet = _ref.isFieldSet,\n    isFieldSet = _ref$isFieldSet === void 0 ? false : _ref$isFieldSet,\n    _ref$isStep = _ref.isStep,\n    isStep = _ref$isStep === void 0 ? false : _ref$isStep,\n    index = _ref.index,\n    editModeOn = _ref.editModeOn,\n    setAsChild = _ref.setAsChild,\n    _onDestroy = _ref._onDestroy,\n    onEdit = _ref.onEdit;\n  if (item !== null && item !== void 0 && item.mutable) {\n    return null;\n  }\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, (item === null || item === void 0 ? void 0 : item.pageBreakBefore) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"preview-page-break\"\n  }, \"Page Break\"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_header_bar__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n    isFieldSet: isFieldSet,\n    isStep: isStep,\n    editModeOn: editModeOn,\n    item: item,\n    index: index,\n    setAsChild: setAsChild,\n    onDestroy: _onDestroy,\n    onEdit: onEdit,\n    \"static\": item === null || item === void 0 ? void 0 : item[\"static\"],\n    required: item === null || item === void 0 ? void 0 : item.required\n  }));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ComponentHeader);\n\n//# sourceURL=webpack://react-survey-builder/./src/survey-elements/component-header.jsx?");
 
 /***/ }),
 
@@ -1169,7 +1169,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _component_drag_handle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./component-drag-handle */ \"./src/survey-elements/component-drag-handle.jsx\");\n/* harmony import */ var react_icons_fa__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react-icons/fa */ \"./node_modules/react-icons/fa/index.mjs\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/ButtonToolbar.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Badge.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n\n\n\n\nvar HeaderBar = function HeaderBar(_ref) {\n  var item = _ref.item,\n    editModeOn = _ref.editModeOn,\n    onDestroy = _ref.onDestroy,\n    setAsChild = _ref.setAsChild,\n    index = _ref.index;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n    className: \"d-flex toolbar-header align-items-center justify-content-between p-2\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n    bg: \"secondary\"\n  }, item.text), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"toolbar-header-buttons\"\n  }, item.element !== 'LineBreak' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n    variant: \"default\",\n    className: \"is-isolated\",\n    onClick: function onClick(e) {\n      editModeOn(item, e);\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_icons_fa__WEBPACK_IMPORTED_MODULE_5__.FaEdit, {\n    className: \"is-isolated\"\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n    variant: \"default\",\n    className: \"is-isolated\",\n    onClick: function onClick() {\n      onDestroy(item);\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_icons_fa__WEBPACK_IMPORTED_MODULE_5__.FaTrash, {\n    className: \"is-isolated\"\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_component_drag_handle__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n    item: item,\n    index: index,\n    onDestroy: onDestroy,\n    setAsChild: setAsChild\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HeaderBar);\n\n//# sourceURL=webpack://react-survey-builder/./src/survey-elements/header-bar.jsx?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _component_drag_handle__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./component-drag-handle */ \"./src/survey-elements/component-drag-handle.jsx\");\n/* harmony import */ var react_icons_fa__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react-icons/fa */ \"./node_modules/react-icons/fa/index.mjs\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/ButtonToolbar.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Badge.js\");\n/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-bootstrap */ \"./node_modules/react-bootstrap/esm/Button.js\");\n\n\n\n\nvar HeaderBar = function HeaderBar(_ref) {\n  var item = _ref.item,\n    editModeOn = _ref.editModeOn,\n    onDestroy = _ref.onDestroy,\n    setAsChild = _ref.setAsChild,\n    index = _ref.index,\n    _ref$isStep = _ref.isStep,\n    isStep = _ref$isStep === void 0 ? false : _ref$isStep;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n    className: \"d-flex toolbar-header align-items-center justify-content-between p-2\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n    bg: \"secondary\"\n  }, item.text, isStep ? ' ' + (Number(index) + 1) : '', isStep && (item === null || item === void 0 ? void 0 : item.conditional) === true ? ' (Conditional)' : ''), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    className: \"toolbar-header-buttons\"\n  }, item.element !== 'LineBreak' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n    variant: \"default\",\n    className: \"is-isolated\",\n    onClick: function onClick(e) {\n      editModeOn(item, e);\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_icons_fa__WEBPACK_IMPORTED_MODULE_5__.FaEdit, {\n    className: \"is-isolated\"\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n    variant: \"default\",\n    className: \"is-isolated\",\n    onClick: function onClick() {\n      onDestroy(item);\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_icons_fa__WEBPACK_IMPORTED_MODULE_5__.FaTrash, {\n    className: \"is-isolated\"\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_component_drag_handle__WEBPACK_IMPORTED_MODULE_1__[\"default\"], {\n    item: item,\n    index: index,\n    onDestroy: onDestroy,\n    setAsChild: setAsChild\n  })));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HeaderBar);\n\n//# sourceURL=webpack://react-survey-builder/./src/survey-elements/header-bar.jsx?");
 
 /***/ }),