react-survey-builder 1.0.71 → 1.0.72

package/dist/bundle.js

@@ -906,7 +906,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.jsx\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_7__ = __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 _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 _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 _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 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\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    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 _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.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      } 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    // console.log('handleChange');\n    // Call submit function on change\n    if (onChange) {\n      var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n      onChange($data);\n    }\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;\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      });\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    });\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_7__.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        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var controls = 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    });\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    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_6___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_7__.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_5__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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 'Rating':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\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 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_7__.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_7__.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            });\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_7__.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_7__.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_7__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__[\"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.jsx\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_7__ = __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 _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 _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 _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 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\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    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 _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.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      } 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    // console.log('handleChange');\n    // Call submit function on change\n    if (onChange) {\n      var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n      onChange($data);\n    }\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;\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      });\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    });\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_7__.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.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    });\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    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_6___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_7__.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_5__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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 'Rating':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\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 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_7__.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_7__.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_7__.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_7__.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_7__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__[\"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?");
 
 /***/ }),
 
@@ -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.jsx\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_7__ = __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 _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 _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 _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 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\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    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_7__.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 _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.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      } 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    // console.log('handleChange');\n    // Call submit function on change\n    if (onChange) {\n      var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n      onChange($data);\n    }\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;\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      });\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    });\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_7__.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        });\n      }\n    });\n  };\n  var getContainerElement = function getContainerElement(item, Element) {\n    var controls = 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    });\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    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_6___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_7__.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_5__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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 'Rating':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\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 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_7__.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_7__.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            });\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_7__.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_7__.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_7__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__[\"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.jsx\");\n/* harmony import */ var _survey_elements_custom_element__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./survey-elements/custom-element */ \"./src/survey-elements/custom-element.jsx\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./stores/registry */ \"./src/stores/registry.js\");\n/* harmony import */ var _stores_registry__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_stores_registry__WEBPACK_IMPORTED_MODULE_6__);\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Button.js\");\n/* harmony import */ var react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-bootstrap/esm */ \"./node_modules/react-bootstrap/esm/Form.js\");\n/* harmony import */ var react_hook_form__WEBPACK_IMPORTED_MODULE_7__ = __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 _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 _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 _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 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\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    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_7__.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 _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.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      } 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    // console.log('handleChange');\n    // Call submit function on change\n    if (onChange) {\n      var $data = _collectFormData(items, (methods === null || methods === void 0 ? void 0 : methods.getValues()) || []);\n      onChange($data);\n    }\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;\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      });\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    });\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_7__.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.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    });\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    });\n  };\n  var getCustomElement = function getCustomElement(item) {\n    if (!item.component || typeof item.component !== 'function') {\n      item.component = _stores_registry__WEBPACK_IMPORTED_MODULE_6___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_7__.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_5__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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_esm__WEBPACK_IMPORTED_MODULE_8__[\"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 'Rating':\n      case 'Range':\n      case 'Checkbox':\n        return getInputElement(item);\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 'FieldSet':\n        return getContainerElement(item, _fieldset__WEBPACK_IMPORTED_MODULE_4__[\"default\"]);\n      case 'Signature':\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_hook_form__WEBPACK_IMPORTED_MODULE_7__.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_7__.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_7__.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_7__.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_7__.FormProvider, methods, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_bootstrap_esm__WEBPACK_IMPORTED_MODULE_9__[\"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?");
 
 /***/ }),
 

package/lib/form-fields.js

@@ -317,7 +317,8 @@ var ReactSurveyFormFields = function ReactSurveyFormFields(_ref) {
           },
           isInvalid: invalid,
           item: item,
-          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null
+          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,
+          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null
         });
       }
     });
@@ -538,7 +539,8 @@ var ReactSurveyFormFields = function ReactSurveyFormFields(_ref) {
               },
               isInvalid: invalid,
               item: item,
-              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null
+              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,
+              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null
             });
           }
         });

package/lib/form.js

@@ -327,7 +327,8 @@ var ReactSurvey = function ReactSurvey(_ref) {
           },
           isInvalid: invalid,
           item: item,
-          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null
+          className: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null,
+          checkboxButtonClassName: item.element === 'RadioButtons' || item.element === 'Checkbox' ? checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null : null
         });
       }
     });
@@ -548,7 +549,8 @@ var ReactSurvey = function ReactSurvey(_ref) {
               },
               isInvalid: invalid,
               item: item,
-              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null
+              className: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null,
+              checkboxButtonClassName: checkboxButtonClassName !== null && checkboxButtonClassName !== void 0 ? checkboxButtonClassName : null
             });
           }
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-survey-builder",
-  "version": "1.0.71",
+  "version": "1.0.72",
   "description": "A complete survey builder for react.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",