@bigbinary/neeto-form-frontend 1.2.43 → 1.2.45

package/dist/index.cjs.js

@@ -165,9 +165,9 @@ function _objectWithoutProperties$1(source, excluded) {
 }
 
 var _excluded$d = ["size"],
-  _excluded2$1 = ["size"],
-  _excluded3$2 = ["size"],
-  _excluded4$1 = ["size"],
+  _excluded2$2 = ["size"],
+  _excluded3$1 = ["size"],
+  _excluded4$2 = ["size"],
   _excluded5 = ["size"];
 var Star = function Star(props) {
   var _props$size = props.size,
@@ -190,7 +190,7 @@ var Star = function Star(props) {
 var Heart = function Heart(props) {
   var _props$size2 = props.size,
     size = _props$size2 === void 0 ? 20 : _props$size2,
-    other = _objectWithoutProperties$1(props, _excluded2$1);
+    other = _objectWithoutProperties$1(props, _excluded2$2);
   return /*#__PURE__*/React__default["default"].createElement("svg", _extends$8({
     fill: "none",
     height: size,
@@ -208,7 +208,7 @@ var Heart = function Heart(props) {
 var Zap = function Zap(props) {
   var _props$size3 = props.size,
     size = _props$size3 === void 0 ? 20 : _props$size3,
-    other = _objectWithoutProperties$1(props, _excluded3$2);
+    other = _objectWithoutProperties$1(props, _excluded3$1);
   return /*#__PURE__*/React__default["default"].createElement("svg", _extends$8({
     fill: "none",
     height: size,
@@ -226,7 +226,7 @@ var Zap = function Zap(props) {
 var Crown = function Crown(_ref) {
   var _ref$size = _ref.size,
     size = _ref$size === void 0 ? 20 : _ref$size,
-    otherProps = _objectWithoutProperties$1(_ref, _excluded4$1);
+    otherProps = _objectWithoutProperties$1(_ref, _excluded4$2);
   return /*#__PURE__*/React__default["default"].createElement("svg", _extends$8({
     fill: "none",
     height: size,
@@ -549,14 +549,16 @@ var updateForm = function updateForm(formId, payload) {
 var destroyForm = function destroyForm(formId) {
   return axios__default["default"]["delete"](getFormsUrl(formId));
 };
-var getQuestions = function getQuestions(formId, language) {
+var getQuestions = function getQuestions(formId) {
+  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : i18next__default["default"].resolvedLanguage;
   return axios__default["default"].get(getQuestionsUrl(formId), {
     params: {
       language: language
     }
   });
 };
-var getPublicQuestions = function getPublicQuestions(formId, language) {
+var getPublicQuestions = function getPublicQuestions(formId) {
+  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : i18next__default["default"].resolvedLanguage;
   return axios__default["default"].get("".concat(BASE_URL, "/api/v1/forms/").concat(formId, "/public/questions/"), {
     params: {
       language: language
@@ -570,13 +572,28 @@ var submitPublicForm = function submitPublicForm(formId, payload) {
   return axios__default["default"].post("".concat(BASE_URL, "/api/v1/forms/").concat(formId, "/public/question_responses"), payload);
 };
 var getPublicSubmission = function getPublicSubmission(formId, submissionId) {
-  return axios__default["default"].get("".concat(BASE_URL, "/api/v1/forms/").concat(formId, "/public/submissions/").concat(submissionId));
+  var language = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : i18next__default["default"].resolvedLanguage;
+  return axios__default["default"].get("".concat(BASE_URL, "/api/v1/forms/").concat(formId, "/public/submissions/").concat(submissionId), {
+    params: {
+      language: language
+    }
+  });
 };
 var getSubmissions = function getSubmissions(formId) {
-  return axios__default["default"].get(getFormSubmissionsUrl(formId));
+  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : i18next__default["default"].resolvedLanguage;
+  return axios__default["default"].get(getFormSubmissionsUrl(formId), {
+    params: {
+      language: language
+    }
+  });
 };
 var getSubmission = function getSubmission(formId, submissionId) {
-  return axios__default["default"].get(getFormSubmissionUrl(formId, submissionId));
+  var language = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : i18next__default["default"].resolvedLanguage;
+  return axios__default["default"].get(getFormSubmissionUrl(formId, submissionId), {
+    params: {
+      language: language
+    }
+  });
 };
 var updateSubmission = function updateSubmission(formId, payload) {
   return axios__default["default"].put(getSubmissionUrl(formId), payload);
@@ -601,26 +618,38 @@ var neetoFormApi = {
 };
 
 var _excluded$c = ["formId", "preview", "language"],
-  _excluded3$1 = ["formId", "submissionId"];
-function ownKeys$h(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; }
-function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+  _excluded2$1 = ["formId", "language"],
+  _excluded4$1 = ["formId", "submissionId"];
+function ownKeys$k(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; }
+function _objectSpread$j(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$k(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$k(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useForm = function useForm(_ref) {
   var formId = _ref.formId,
     _ref$preview = _ref.preview,
     preview = _ref$preview === void 0 ? null : _ref$preview,
     _ref$language = _ref.language,
-    language = _ref$language === void 0 ? "en" : _ref$language,
+    language = _ref$language === void 0 ? i18next__default["default"].resolvedLanguage : _ref$language,
     options = _objectWithoutProperties$1(_ref, _excluded$c);
   return reactQuery.useQuery([QUERY_KEYS.QUESTIONS, preview ? "preview/".concat(formId) : formId, language], function () {
     return neetoFormApi.getPublicQuestions(formId, language);
-  }, _objectSpread$g({
+  }, _objectSpread$j({
+    keepPreviousData: true
+  }, options));
+};
+var useFetchQuestions = function useFetchQuestions(_ref2) {
+  var formId = _ref2.formId,
+    _ref2$language = _ref2.language,
+    language = _ref2$language === void 0 ? i18next__default["default"].resolvedLanguage : _ref2$language,
+    options = _objectWithoutProperties$1(_ref2, _excluded2$1);
+  return reactQuery.useQuery([QUERY_KEYS.QUESTIONS, formId, language], function () {
+    return neetoFormApi.getQuestions(formId, language);
+  }, _objectSpread$j({
     keepPreviousData: true
   }, options));
 };
 var useCreateForm = function useCreateForm(options) {
-  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "en";
+  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : i18next__default["default"].resolvedLanguage;
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(neetoFormApi.createForm, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  return reactQuery.useMutation(neetoFormApi.createForm, _objectSpread$j(_objectSpread$j({}, options), {}, {
     onSuccess: function onSuccess(form) {
       var _options$onSuccess;
       queryClient.setQueryData(QUERY_KEYS.QUESTIONS, function (forms) {
@@ -634,15 +663,15 @@ var useCreateForm = function useCreateForm(options) {
   }));
 };
 var useUpdateForm = function useUpdateForm(options) {
-  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "en";
+  var language = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : i18next__default["default"].resolvedLanguage;
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(function (_ref2) {
-    var id = _ref2.id,
-      values = _ref2.values;
+  return reactQuery.useMutation(function (_ref3) {
+    var id = _ref3.id,
+      values = _ref3.values;
     return neetoFormApi.updateForm(id, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
-    onSuccess: function onSuccess(data, _ref3) {
-      var id = _ref3.id;
+  }, _objectSpread$j(_objectSpread$j({}, options), {}, {
+    onSuccess: function onSuccess(data, _ref4) {
+      var id = _ref4.id;
       queryClient.setQueryData([QUERY_KEYS.QUESTIONS, id, language], ramda.assoc("title", data.title));
       queryClient.setQueryData([QUERY_KEYS.QUESTIONS, "preview/".concat(id), language], ramda.mergeLeft({
         questions: data.questions,
@@ -657,11 +686,11 @@ var useUpdateForm = function useUpdateForm(options) {
 };
 var useUpdateQuestions = function useUpdateQuestions(options, language) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(function (_ref4) {
-    var id = _ref4.id,
-      values = _ref4.values;
+  return reactQuery.useMutation(function (_ref5) {
+    var id = _ref5.id,
+      values = _ref5.values;
     return neetoFormApi.updateQuestions(id, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$j(_objectSpread$j({}, options), {}, {
     onSuccess: function onSuccess() {
       for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
         args[_key] = arguments[_key];
@@ -677,17 +706,17 @@ var useUpdateQuestions = function useUpdateQuestions(options, language) {
   }));
 };
 var useForms = function useForms(options) {
-  return reactQuery.useQuery([QUERY_KEYS.FORMS], neetoFormApi.getForms, _objectSpread$g({
+  return reactQuery.useQuery([QUERY_KEYS.FORMS], neetoFormApi.getForms, _objectSpread$j({
     keepPreviousData: true
   }, options));
 };
 var useDeleteForm = function useDeleteForm(options) {
-  return reactUtils.useMutationWithInvalidation(function (_ref5) {
-    var id = _ref5.id;
+  return reactUtils.useMutationWithInvalidation(function (_ref6) {
+    var id = _ref6.id;
     return neetoFormApi.destroyForm(id);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
-    keysToInvalidate: function keysToInvalidate(_, _ref6) {
-      var id = _ref6.id;
+  }, _objectSpread$j(_objectSpread$j({}, options), {}, {
+    keysToInvalidate: function keysToInvalidate(_, _ref7) {
+      var id = _ref7.id;
       return [QUERY_KEYS.FORMS, [QUERY_KEYS.QUESTIONS, id], [QUERY_KEYS.QUESTIONS, "preview/".concat(id)]];
     },
     onSuccess: function onSuccess() {
@@ -695,23 +724,23 @@ var useDeleteForm = function useDeleteForm(options) {
     }
   }));
 };
-var useSubmission = function useSubmission(_ref8) {
-  var formId = _ref8.formId,
-    submissionId = _ref8.submissionId,
-    options = _objectWithoutProperties$1(_ref8, _excluded3$1);
+var useSubmission = function useSubmission(_ref9) {
+  var formId = _ref9.formId,
+    submissionId = _ref9.submissionId,
+    options = _objectWithoutProperties$1(_ref9, _excluded4$1);
   return reactQuery.useQuery([QUERY_KEYS.SUBMISSION, formId, submissionId], function () {
     return neetoFormApi.getPublicSubmission(formId, submissionId);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$j(_objectSpread$j({}, options), {}, {
     keepPreviousData: true
   }));
 };
 var useCreateSubmission = function useCreateSubmission(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(function (_ref9) {
-    var formId = _ref9.formId,
-      values = _ref9.values;
+  return reactQuery.useMutation(function (_ref10) {
+    var formId = _ref10.formId,
+      values = _ref10.values;
     return neetoFormApi.submitPublicForm(formId, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$j(_objectSpread$j({}, options), {}, {
     onSuccess: function onSuccess() {
       var _data$submission, _data$submission2;
       for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
@@ -728,11 +757,11 @@ var useCreateSubmission = function useCreateSubmission(options) {
 };
 var useUpdateSubmission = function useUpdateSubmission(options) {
   var queryClient = reactQuery.useQueryClient();
-  return reactQuery.useMutation(function (_ref10) {
-    var formId = _ref10.formId,
-      values = _ref10.values;
+  return reactQuery.useMutation(function (_ref11) {
+    var formId = _ref11.formId,
+      values = _ref11.values;
     return neetoFormApi.updatePublicSubmission(formId, values);
-  }, _objectSpread$g(_objectSpread$g({}, options), {}, {
+  }, _objectSpread$j(_objectSpread$j({}, options), {}, {
     onSuccess: function onSuccess() {
       var _data$submission3;
       for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
@@ -836,7 +865,7 @@ function _defineProperty$5(obj, key, value) {
   return obj;
 }
 
-function ownKeys$g(e, r) {
+function ownKeys$j(e, r) {
   var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
     var o = Object.getOwnPropertySymbols(e);
@@ -849,9 +878,9 @@ function ownKeys$g(e, r) {
 function _objectSpread2(e) {
   for (var r = 1; r < arguments.length; r++) {
     var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) {
+    r % 2 ? ownKeys$j(Object(t), !0).forEach(function (r) {
       _defineProperty$5(e, r, t[r]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) {
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$j(Object(t)).forEach(function (r) {
       Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
     });
   }
@@ -9722,8 +9751,8 @@ const ConnectedDroppable = connect(makeMapStateToProps, mapDispatchToProps, (sta
 })(Droppable$1);
 var ConnectedDroppable$1 = ConnectedDroppable;
 
-function ownKeys$f(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; }
-function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$i(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; }
+function _objectSpread$i(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$i(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$i(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var defaultConfig = {
   strict: true,
   matchKey: "value"
@@ -9731,7 +9760,7 @@ var defaultConfig = {
 var findOptionByValue = function findOptionByValue(value) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var configObject = _objectSpread$f(_objectSpread$f({}, defaultConfig), config);
+  var configObject = _objectSpread$i(_objectSpread$i({}, defaultConfig), config);
   var matchKey = configObject.matchKey,
     strict = configObject.strict;
   return options.find(function (option) {
@@ -9745,7 +9774,7 @@ var filterOptionsByValues = function filterOptionsByValues() {
   var values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var configObject = _objectSpread$f(_objectSpread$f({}, defaultConfig), config);
+  var configObject = _objectSpread$i(_objectSpread$i({}, defaultConfig), config);
   var matchKey = configObject.matchKey,
     strict = configObject.strict;
   return options.filter(function (option) {
@@ -9763,7 +9792,7 @@ var destroyFromList = function destroyFromList(items, index) {
     var nextItems = _toConsumableArray$1(items);
     nextItems.splice(index, 1);
     if (itemToRemove.id) {
-      nextItems.push(_objectSpread$f(_objectSpread$f({}, itemToRemove), {}, {
+      nextItems.push(_objectSpread$i(_objectSpread$i({}, itemToRemove), {}, {
         _destroy: true
       }));
     }
@@ -9799,7 +9828,9 @@ var useBuildFormStore = zustand.create(reactUtils.withImmutableActions(function
       isValid: true,
       errors: [],
       submitForm: neetoCist.noop,
-      resetForm: neetoCist.noop
+      resetForm: neetoCist.noop,
+      selectedLanguage: i18next__default["default"].resolvedLanguage,
+      formId: null
     },
     setFormData: function setFormData(payload) {
       return set(ramda.assoc("formState", payload));
@@ -10878,6 +10909,12 @@ var SingleChoice$1 = function SingleChoice(_ref) {
   }));
 };
 
+var validateEditorContent = function validateEditorContent(editorRef) {
+  return function () {
+    var _editorRef$current;
+    return (_editorRef$current = editorRef.current) !== null && _editorRef$current !== void 0 && (_editorRef$current = _editorRef$current.editor) !== null && _editorRef$current !== void 0 && _editorRef$current.isEmpty ? i18next.t("neetoForm.common.thisFieldIsRequired") : "";
+  };
+};
 var validateStarRatingCount = function validateStarRatingCount(value) {
   try {
     var schema = yup__namespace.number().integer().transform(function (value) {
@@ -10967,20 +11004,35 @@ var StarRating$3 = function StarRating(_ref) {
   }));
 };
 
+var useUpdateEditorContent = function useUpdateEditorContent(editorRef, fieldName) {
+  var _useBuildFormState = useBuildFormState(),
+    formId = _useBuildFormState.formId,
+    language = _useBuildFormState.selectedLanguage;
+  useFetchQuestions({
+    formId: formId,
+    language: language,
+    onSuccess: function onSuccess(data) {
+      var _editorRef$current$ed;
+      var pathArray = fieldName.split(".").map(function (part) {
+        var parsedPart = parseInt(part);
+        return isNaN(parsedPart) ? part : parsedPart;
+      });
+      (_editorRef$current$ed = editorRef.current.editor) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.commands) === null || _editorRef$current$ed === void 0 || _editorRef$current$ed.setContent(ramda.path(pathArray, data));
+    }
+  });
+};
+
 var Terms$1 = function Terms(_ref) {
   var name = _ref.name,
     isLabelDisabled = _ref.isLabelDisabled;
-  var editorRef = React$2.useRef(null);
-  var validateContent = function validateContent() {
-    var _editorRef$current;
-    if ((_editorRef$current = editorRef.current) !== null && _editorRef$current !== void 0 && (_editorRef$current = _editorRef$current.editor) !== null && _editorRef$current !== void 0 && _editorRef$current.isEmpty) {
-      return "This field is required";
-    }
-    return "";
-  };
+  var editorRef = React$2.useRef({
+    editor: {}
+  });
+  var fieldName = "".concat(name, ".label");
+  useUpdateEditorContent(editorRef, fieldName);
   var _useField = formik.useField({
-      name: "".concat(name, ".label"),
-      validate: validateContent
+      name: fieldName,
+      validate: validateEditorContent(editorRef)
     }),
     _useField2 = _slicedToArray$3(_useField, 3),
     value = _useField2[0].value,
@@ -10989,16 +11041,14 @@ var Terms$1 = function Terms(_ref) {
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "w-full cursor-auto"
   }, /*#__PURE__*/React__default["default"].createElement(neetoEditor.Editor, {
-    disabled: isLabelDisabled,
     error: error,
+    disabled: isLabelDisabled,
     id: "editor",
     initialValue: value,
-    key: "".concat(name, ".label"),
-    name: "".concat(name, ".label"),
+    key: fieldName,
+    name: fieldName,
     ref: editorRef,
-    onChange: function onChange(text) {
-      setValue(text);
-    }
+    onChange: setValue
   }));
 };
 
@@ -11022,31 +11072,23 @@ var Fields = {
 var Editor = function Editor(_ref) {
   var name = _ref.name,
     isLabelDisabled = _ref.isLabelDisabled;
-  var _useFormikContext = formik.useFormikContext(),
-    setFieldValue = _useFormikContext.setFieldValue;
   var editorRef = React$2.useRef({
     editor: {}
   });
-  var _useTranslation = reactI18next.useTranslation(),
-    t = _useTranslation.t;
-  var validateContent = function validateContent() {
-    var _editorRef$current;
-    if ((_editorRef$current = editorRef.current) !== null && _editorRef$current !== void 0 && (_editorRef$current = _editorRef$current.editor) !== null && _editorRef$current !== void 0 && _editorRef$current.isEmpty) {
-      return t("neetoForm.common.thisFieldIsRequired");
-    }
-    return "";
-  };
   var fieldName = "".concat(name, ".label");
+  useUpdateEditorContent(editorRef, fieldName);
   var _useField = formik.useField({
       name: fieldName,
-      validate: validateContent
+      validate: validateEditorContent(editorRef)
     }),
     _useField2 = _slicedToArray$3(_useField, 3),
     value = _useField2[0].value,
     _useField2$ = _useField2[1],
     touched = _useField2$.touched,
     error = _useField2$.error,
-    setTouched = _useField2[2].setTouched;
+    _useField2$2 = _useField2[2],
+    setTouched = _useField2$2.setTouched,
+    setValue = _useField2$2.setValue;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "w-full cursor-auto"
   }, /*#__PURE__*/React__default["default"].createElement(neetoEditor.Editor, {
@@ -11061,12 +11103,9 @@ var Editor = function Editor(_ref) {
     name: fieldName,
     ref: editorRef,
     onBlur: function onBlur() {
-      setTouched(true);
+      return setTouched(true);
     },
-    onChange: function onChange(text) {
-      var _editorRef$current$ed;
-      setFieldValue((_editorRef$current$ed = editorRef.current.editor) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.contentComponent) === null || _editorRef$current$ed === void 0 || (_editorRef$current$ed = _editorRef$current$ed.props) === null || _editorRef$current$ed === void 0 ? void 0 : _editorRef$current$ed.name, text);
-    }
+    onChange: setValue
   }));
 };
 
@@ -11296,6 +11335,8 @@ var INDEPENDENT_LABELS_MAP = {
 };
 var PADDED_FIELDS = ["paragraph", "termsandcondition"];
 
+function ownKeys$h(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; }
+function _objectSpread$h(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$h(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$h(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var FormField = function FormField(props) {
   var _INDEPENDENT_LABELS_M;
   var item = props.item,
@@ -11324,21 +11365,21 @@ var FormField = function FormField(props) {
     isSingular = _getActiveKindDetails.isSingular;
   return /*#__PURE__*/React__default["default"].createElement(Accordion, {
     disabledAddButtonTooltipProps: disabledAddButtonTooltipProps,
-    icon: FieldIcon,
     isDeletable: isDeletable,
     isExpanded: isExpanded,
     kindUniqueOn: kindUniqueOn,
-    label: (_INDEPENDENT_LABELS_M = INDEPENDENT_LABELS_MAP[kind]) !== null && _INDEPENDENT_LABELS_M !== void 0 ? _INDEPENDENT_LABELS_M : label,
-    padded: !PADDED_FIELDS.includes(kind),
     questionKinds: questionKinds,
     showAddQuestionDivider: showAddQuestionDivider,
+    icon: FieldIcon,
+    label: (_INDEPENDENT_LABELS_M = INDEPENDENT_LABELS_MAP[kind]) !== null && _INDEPENDENT_LABELS_M !== void 0 ? _INDEPENDENT_LABELS_M : label,
+    padded: !PADDED_FIELDS.includes(kind),
     onAdd: onAddNew,
     onDelete: onRemove,
     onDuplicate: !isSingular && onDuplicate,
     onToggle: function onToggle() {
       return onChangeExpanded(!isExpanded);
     }
-  }, /*#__PURE__*/React__default["default"].createElement(FieldComponent, _extends$8({
+  }, /*#__PURE__*/React__default["default"].createElement(FieldComponent, _objectSpread$h({
     isRequired: isRequired
   }, props)));
 };
@@ -11465,8 +11506,8 @@ var arrayHelpers = {
   moveItem: moveItem
 };
 
-function ownKeys$e(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; }
-function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$g(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; }
+function _objectSpread$g(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$g(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$g(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var generateUniqueFieldCode = function generateUniqueFieldCode(type, questions) {
   var fieldCodes = ramda.pluck("fieldCode", neetoCist.filterBy({
     kind: type
@@ -11502,7 +11543,7 @@ var handleFieldDragEnd = function handleFieldDragEnd(_ref2) {
   var nextItems = _toConsumableArray$1(items);
   arrayHelpers.moveItem(nextItems, source.index, destination.index);
   var orderedItems = nextItems.map(function (item, index) {
-    return _objectSpread$e(_objectSpread$e({}, item), {}, {
+    return _objectSpread$g(_objectSpread$g({}, item), {}, {
       displayOrder: index
     });
   });
@@ -11516,7 +11557,7 @@ var createFieldData = function createFieldData(_ref3) {
     _ref3$isRequired = _ref3.isRequired,
     isRequired = _ref3$isRequired === void 0 ? undefined : _ref3$isRequired,
     questions = _ref3.questions;
-  return _objectSpread$e(_objectSpread$e({}, defaults), {}, {
+  return _objectSpread$g(_objectSpread$g({}, defaults), {}, {
     metadata: metadata,
     isRequired: isRequired,
     kind: type,
@@ -11537,7 +11578,7 @@ var duplicateFieldData = function duplicateFieldData(_ref4) {
     optionsAttributes = item.optionsAttributes;
   var defaultAttributeNames = ramda.keys(questionKind.defaults || {});
   var defaultAttributes = ramda.pick(defaultAttributeNames, item);
-  return _objectSpread$e(_objectSpread$e({}, defaultAttributes), {}, {
+  return _objectSpread$g(_objectSpread$g({}, defaultAttributes), {}, {
     isRequired: isRequired,
     kind: kind,
     label: label,
@@ -11639,8 +11680,8 @@ var List = function List(_ref) {
 };
 
 var _excluded$6 = ["questionKinds", "showAddQuestionDivider", "onValueChange", "showActionBlock", "formId", "isDeletable", "isRequiredField", "submitButtonProps", "cancelButtonProps", "isKindAlreadyActive", "getActiveKindDetails", "kindUniqueOn", "isDisabledFieldLabel", "disabledAddButtonTooltipProps", "enableFieldCode", "formTitle", "formDescription", "selectedLanguage", "availableLanguages", "onLanguageChange"];
-function ownKeys$d(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; }
-function _objectSpread$d(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$d(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$d(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$f(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; }
+function _objectSpread$f(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$f(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$f(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Form = function Form(_ref) {
   var questionKinds = _ref.questionKinds,
     showAddQuestionDivider = _ref.showAddQuestionDivider,
@@ -11685,15 +11726,17 @@ var Form = function Form(_ref) {
   var setFormData = useBuildFormStore(ramda.prop("setFormData"));
   React$2.useEffect(function () {
     setFormData({
+      formId: formId,
       values: values,
       dirty: dirty,
       isSubmitting: isSubmitting,
       isValid: isValid,
       errors: errors,
       submitForm: submitForm,
-      resetForm: resetForm
+      resetForm: resetForm,
+      selectedLanguage: selectedLanguage
     });
-  }, [formId, setFormData, values, dirty, isSubmitting, isValid, errors, submitForm, resetForm]);
+  }, [formId, setFormData, values, dirty, isSubmitting, isValid, errors, submitForm, resetForm, selectedLanguage]);
   var questions = values.questions;
   React$2.useEffect(function () {
     onValueChange === null || onValueChange === void 0 || onValueChange(questions);
@@ -11732,7 +11775,7 @@ var Form = function Form(_ref) {
           questions: questions
         }), values.questions);
         setFieldValue("questions", newQuestions.map(function (question, index) {
-          return _objectSpread$d(_objectSpread$d({}, question), {}, {
+          return _objectSpread$f(_objectSpread$f({}, question), {}, {
             displayOrder: index + 1
           });
         }));
@@ -11851,10 +11894,10 @@ var Form = function Form(_ref) {
     className: "neeto-ui-border-gray-300 flex-shrink-0 border-t py-4"
   }, /*#__PURE__*/React__default["default"].createElement(formik$1.ActionBlock, {
     className: "space-x-2",
-    cancelButtonProps: _objectSpread$d({
+    cancelButtonProps: _objectSpread$f({
       label: t("neetoForm.common.reset")
     }, cancelButtonProps),
-    submitButtonProps: _objectSpread$d({
+    submitButtonProps: _objectSpread$f({
       disabled: isSubmitting || !dirty
     }, submitButtonProps)
   }))));
@@ -11919,8 +11962,8 @@ var formValidationSchema = yup.object().shape({
   })).required()
 });
 
-function ownKeys$c(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; }
-function _objectSpread$c(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$c(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$c(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$e(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; }
+function _objectSpread$e(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$e(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$e(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var BuildForm = function BuildForm(_ref) {
   var id = _ref.id,
     onUpdate = _ref.onUpdate,
@@ -11971,7 +12014,7 @@ var BuildForm = function BuildForm(_ref) {
       onSuccess: utils.showThumbsUpToastr
     }),
     updateQuestions = _useUpdateQuestions.mutateAsync;
-  var _useForm = useForm({
+  var _useFetchQuestions = useFetchQuestions({
       formId: id,
       language: selectedLanguage,
       onSuccess: function onSuccess(data) {
@@ -11990,15 +12033,15 @@ var BuildForm = function BuildForm(_ref) {
         }]
       }
     }),
-    _useForm$data = _useForm.data,
-    _useForm$data2 = _useForm$data === void 0 ? {
+    _useFetchQuestions$da = _useFetchQuestions.data,
+    _useFetchQuestions$da2 = _useFetchQuestions$da === void 0 ? {
       title: "",
       questions: []
-    } : _useForm$data,
-    questions = _useForm$data2.questions,
-    isQuestionsLoading = _useForm$data2.isQuestionsLoading,
-    isLoading = _useForm.isLoading,
-    refetch = _useForm.refetch;
+    } : _useFetchQuestions$da,
+    questions = _useFetchQuestions$da2.questions,
+    isQuestionsLoading = _useFetchQuestions$da2.isQuestionsLoading,
+    isLoading = _useFetchQuestions.isLoading,
+    refetch = _useFetchQuestions.refetch;
   if (isLoading || showLoader && isQuestionsLoading) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "flex h-full w-full items-center justify-center py-6"
@@ -12007,7 +12050,7 @@ var BuildForm = function BuildForm(_ref) {
   var handleSubmit = function handleSubmit(payload) {
     updateQuestions({
       id: id,
-      values: _objectSpread$c({
+      values: _objectSpread$e({
         language: selectedLanguage,
         neetoFormQuestion: payload
       }, buildRequestArgs)
@@ -12047,7 +12090,7 @@ var BuildForm = function BuildForm(_ref) {
   }, function (_ref3) {
     var errors = _ref3.errors,
       setFieldError = _ref3.setFieldError;
-    return /*#__PURE__*/React__default["default"].createElement(Form, _extends$8({}, _objectSpread$c(_objectSpread$c({}, formDomProps), {}, {
+    return /*#__PURE__*/React__default["default"].createElement(Form, _extends$8({}, _objectSpread$e(_objectSpread$e({}, formDomProps), {}, {
       availableLanguages: availableLanguages,
       cancelButtonProps: cancelButtonProps,
       disabledAddButtonTooltipProps: disabledAddButtonTooltipProps,
@@ -14255,9 +14298,9 @@ function _unsupportedIterableToArray$6(o, minLen) { if (!o) return; if (typeof o
 
 function _arrayLikeToArray$6(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; }
 
-function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$d(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty$4(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread$d(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$d(Object(source), !0).forEach(function (key) { _defineProperty$4(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$d(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty$4(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 var DEFAULT_OPTIONS = {
@@ -14284,7 +14327,7 @@ var DEFAULT_OPTIONS = {
 function formatNumber(input, format, options, metadata) {
   // Apply default options.
   if (options) {
-    options = _objectSpread$b(_objectSpread$b({}, DEFAULT_OPTIONS), options);
+    options = _objectSpread$d(_objectSpread$d({}, DEFAULT_OPTIONS), options);
   } else {
     options = DEFAULT_OPTIONS;
   }
@@ -14429,9 +14472,9 @@ function formatIDD(nationalNumber, carrierCode, countryCallingCode, fromCountry,
   }
 }
 
-function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$c(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty$3(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread$c(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$c(Object(source), !0).forEach(function (key) { _defineProperty$3(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$c(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -14543,7 +14586,7 @@ var PhoneNumber = /*#__PURE__*/function () {
   }, {
     key: "format",
     value: function format(_format, options) {
-      return formatNumber(this, _format, options ? _objectSpread$a(_objectSpread$a({}, options), {}, {
+      return formatNumber(this, _format, options ? _objectSpread$c(_objectSpread$c({}, options), {}, {
         v2: true
       }) : {
         v2: true
@@ -15586,20 +15629,20 @@ function parsePhoneNumber(formattedPhoneNumber, defaultCountry, defaultCallingCo
   };
 }
 
-function ownKeys$9(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$b(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread$b(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$b(Object(source), !0).forEach(function (key) { _defineProperty$2(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$b(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function parsePhoneNumberWithError$2(text, options, metadata) {
-  return parse$1(text, _objectSpread$9(_objectSpread$9({}, options), {}, {
+  return parse$1(text, _objectSpread$b(_objectSpread$b({}, options), {}, {
     v2: true
   }), metadata);
 }
 
-function ownKeys$8(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$8(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$8(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$a(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -15647,7 +15690,7 @@ function normalizeArguments(args) {
     }
 
     if (arg_2) {
-      options = _objectSpread$8({
+      options = _objectSpread$a({
         defaultCountry: arg_2
       }, options);
     }
@@ -15708,8 +15751,8 @@ var getInvalidTypeError = function getInvalidTypeError(label, type) {
 
 var _excluded$4 = ["kind", "label", "isRequired", "customValidator"];
 var _fieldKindValidatorMa;
-function ownKeys$7(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; }
-function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$9(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; }
+function _objectSpread$9(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$9(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$9(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 yup__namespace.addMethod(yup__namespace.array, "unique", function () {
   var field, message;
   if (arguments.length > 1) {
@@ -15846,7 +15889,7 @@ var validateFieldValue = function validateFieldValue(_ref12) {
   return function (value) {
     if (!(kind in fieldKindValidatorMap)) return;
     var validator = fieldKindValidatorMap[kind];
-    var schema = customValidator || validator(_objectSpread$7({
+    var schema = customValidator || validator(_objectSpread$9({
       kind: kind,
       label: label,
       isRequired: isRequired
@@ -15887,10 +15930,9 @@ var MultipleEmailInput = function MultipleEmailInput(_ref) {
     customValidator = _ref.customValidator;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
-    placeholder = question.placeholder,
     isRequired = question.isRequired,
     nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
   var _useField = formik.useField({
       name: name || nodeId,
       validate: validateFieldValue({
@@ -15915,18 +15957,16 @@ var MultipleEmailInput = function MultipleEmailInput(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-ui-w-full"
   }, isInputVisible ? /*#__PURE__*/React__default["default"].createElement(neetoui.MultiEmailInput, {
-    error: meta.touched ? meta.error : "",
     isRequired: isRequired,
     label: label,
+    error: meta.touched ? meta.error : "",
     name: field.name,
-    placeholder: placeholder,
+    placeholder: fieldWithFallback(question, "placeholder"),
     value: field.value,
     onBlur: function onBlur() {
       return setTouched(true);
     },
-    onChange: function onChange(emails) {
-      return setValue(emails);
-    }
+    onChange: setValue
   }) : /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
     label: label,
     style: "secondary",
@@ -15936,16 +15976,16 @@ var MultipleEmailInput = function MultipleEmailInput(_ref) {
   })));
 };
 
-function ownKeys$6(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; }
-function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$8(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; }
+function _objectSpread$8(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$8(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$8(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ConditionField = function ConditionField(_ref) {
   var question = _ref.question,
     customValidator = _ref.customValidator;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
     isRequired = question.isRequired,
     nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
   return /*#__PURE__*/React__default["default"].createElement(formik.Field, {
     name: name || nodeId,
     validate: validateFieldValue({
@@ -15957,7 +15997,7 @@ var ConditionField = function ConditionField(_ref) {
   }, function (_ref2) {
     var meta = _ref2.meta,
       field = _ref2.field;
-    return /*#__PURE__*/React__default["default"].createElement(neetoui.Checkbox, _extends$8({}, _objectSpread$6(_objectSpread$6({}, field), {}, {
+    return /*#__PURE__*/React__default["default"].createElement(neetoui.Checkbox, _extends$8({}, _objectSpread$8(_objectSpread$8({}, field), {}, {
       label: label,
       name: name
     }), {
@@ -15968,8 +16008,8 @@ var ConditionField = function ConditionField(_ref) {
   });
 };
 
-function ownKeys$5(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; }
-function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$7(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; }
+function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$7(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$7(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var toEmailValues = function toEmailValues() {
   var values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   return values.map(function (value) {
@@ -16062,7 +16102,7 @@ var generateInitValues = function generateInitValues(_ref7) {
   var valuesMap = {};
   if (initialValues) {
     valuesMap = initialValues.reduce(function (acc, answer) {
-      return _objectSpread$5(_objectSpread$5({}, acc), {}, _defineProperty$6({}, answer.questionId, {
+      return _objectSpread$7(_objectSpread$7({}, acc), {}, _defineProperty$6({}, answer.questionId, {
         value: answer.value,
         optionIds: answer.optionIds
       }));
@@ -16288,6 +16328,8 @@ var renderButtonsInOrder = function renderButtonsInOrder(buttonsArray, shouldRev
 };
 
 var _excluded$3 = ["value"];
+function ownKeys$6(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; }
+function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 dayjs__default["default"].extend(weekOfYear__default["default"]);
 dayjs__default["default"].extend(weekday__default["default"]);
 dayjs__default["default"].extend(localeData__default["default"]);
@@ -16298,10 +16340,9 @@ var DateField = function DateField(_ref) {
     customValidator = _ref.customValidator;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
-    placeholder = question.placeholder,
     isRequired = question.isRequired,
     nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
   var _QUESTION_KIND$kind$t = QUESTION_KIND[kind.toUpperCase()],
     prefix = _QUESTION_KIND$kind$t.prefix,
     _QUESTION_KIND$kind$t2 = _QUESTION_KIND$kind$t.type,
@@ -16328,17 +16369,17 @@ var DateField = function DateField(_ref) {
       value = _ref2$field.value,
       field = _objectWithoutProperties$1(_ref2$field, _excluded$3),
       form = _ref2.form;
-    return /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends$8({
-      placeholder: placeholder,
-      type: type,
+    return /*#__PURE__*/React__default["default"].createElement(neetoui.DatePicker, _extends$8({}, _objectSpread$6(_objectSpread$6({}, field), {}, {
+      type: type
+    }), {
       dateFormat: "MMM D, YYYY",
       error: meta.touched ? meta.error : "",
+      placeholder: fieldWithFallback(question, "placeholder"),
       popupClassName: "neeto-form-engine-date-picker-popup",
       prefix: showPrefixIcon && prefix,
       required: isRequired,
       size: "small",
-      value: getValidDate(value)
-    }, field, {
+      value: getValidDate(value),
       onChange: function onChange(date) {
         form.setFieldValue(name, date ? date.toISOString() : "");
       }
@@ -17836,9 +17877,9 @@ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
@@ -17874,7 +17915,7 @@ var Dropzone = /*#__PURE__*/React$2.forwardRef(function (_ref, ref) {
     };
   }, [open]); // TODO: Figure out why react-styleguidist cannot create docs if we don't return a jsx element
 
-  return /*#__PURE__*/React__default["default"].createElement(React$2.Fragment, null, children(_objectSpread$4(_objectSpread$4({}, props), {}, {
+  return /*#__PURE__*/React__default["default"].createElement(React$2.Fragment, null, children(_objectSpread$5(_objectSpread$5({}, props), {}, {
     open: open
   })));
 });
@@ -18208,7 +18249,7 @@ var initialState = {
 function useDropzone() {
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
-  var _defaultProps$options = _objectSpread$4(_objectSpread$4({}, defaultProps), options),
+  var _defaultProps$options = _objectSpread$5(_objectSpread$5({}, defaultProps), options),
       accept = _defaultProps$options.accept,
       disabled = _defaultProps$options.disabled,
       getFilesFromEvent = _defaultProps$options.getFilesFromEvent,
@@ -18525,7 +18566,7 @@ function useDropzone() {
           onDrop = _ref2.onDrop,
           rest = _objectWithoutProperties(_ref2, ["refKey", "onKeyDown", "onFocus", "onBlur", "onClick", "onDragEnter", "onDragOver", "onDragLeave", "onDrop"]);
 
-      return _objectSpread$4(_objectSpread$4(_defineProperty({
+      return _objectSpread$5(_objectSpread$5(_defineProperty({
         onKeyDown: composeKeyboardHandler(composeEventHandlers(onKeyDown, onKeyDownCb)),
         onFocus: composeKeyboardHandler(composeEventHandlers(onFocus, onFocusCb)),
         onBlur: composeKeyboardHandler(composeEventHandlers(onBlur, onBlurCb)),
@@ -18564,7 +18605,7 @@ function useDropzone() {
         tabIndex: -1
       }, refKey, inputRef);
 
-      return _objectSpread$4(_objectSpread$4({}, inputProps), rest);
+      return _objectSpread$5(_objectSpread$5({}, inputProps), rest);
     };
   }, [inputRef, accept, multiple, onDropCb, disabled]);
   var fileCount = draggedFiles.length;
@@ -18577,7 +18618,7 @@ function useDropzone() {
     maxFiles: maxFiles
   });
   var isDragReject = fileCount > 0 && !isDragAccept;
-  return _objectSpread$4(_objectSpread$4({}, state), {}, {
+  return _objectSpread$5(_objectSpread$5({}, state), {}, {
     isDragAccept: isDragAccept,
     isDragReject: isDragReject,
     isFocused: isFocused && !disabled,
@@ -18593,22 +18634,22 @@ function reducer(state, action) {
   /* istanbul ignore next */
   switch (action.type) {
     case 'focus':
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         isFocused: true
       });
 
     case 'blur':
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         isFocused: false
       });
 
     case 'openDialog':
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         isFileDialogActive: true
       });
 
     case 'closeDialog':
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         isFileDialogActive: false
       });
 
@@ -18616,19 +18657,19 @@ function reducer(state, action) {
       /* eslint no-case-declarations: 0 */
       var isDragActive = action.isDragActive,
           draggedFiles = action.draggedFiles;
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         draggedFiles: draggedFiles,
         isDragActive: isDragActive
       });
 
     case 'setFiles':
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         acceptedFiles: action.acceptedFiles,
         fileRejections: action.fileRejections
       });
 
     case 'reset':
-      return _objectSpread$4(_objectSpread$4({}, state), {}, {
+      return _objectSpread$5(_objectSpread$5({}, state), {}, {
         isFileDialogActive: false,
         isDragActive: false,
         draggedFiles: [],
@@ -18641,8 +18682,8 @@ function reducer(state, action) {
   }
 }
 
-function ownKeys$3(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; }
-function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$4(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; }
+function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFileUpload = function useFileUpload(_ref) {
   var disabled = _ref.disabled,
     accept = _ref.accept,
@@ -18742,7 +18783,7 @@ var useFileUpload = function useFileUpload(_ref) {
                   var uploadedFile = neetoCist.findBy({
                     name: file.name
                   }, newFiles);
-                  return _objectSpread$3(_objectSpread$3({}, file), uploadedFile);
+                  return _objectSpread$4(_objectSpread$4({}, file), uploadedFile);
                 })
               });
             } else {
@@ -26317,12 +26358,12 @@ var FileUploadField = function FileUploadField(_ref) {
     customValidator = _ref.customValidator;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
     isRequired = question.isRequired,
     nodeId = question.nodeId,
     allowedFileTypes = question.allowedFileTypes,
     multipleFilesAllowed = question.multipleFilesAllowed,
     maxFileSize = question.maxFileSize;
+  var label = fieldWithFallback(question, "label");
   var _useField = formik.useField({
       name: name || nodeId,
       validate: validateFieldValue({
@@ -26433,6 +26474,8 @@ var Choices = function Choices(_ref) {
 };
 var Choices$1 = /*#__PURE__*/React__default["default"].memo(Choices);
 
+function ownKeys$3(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; }
+function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty$6(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var OptionsField = function OptionsField(_ref) {
   var question = _ref.question,
     customValidator = _ref.customValidator;
@@ -26442,18 +26485,23 @@ var OptionsField = function OptionsField(_ref) {
     validateField = _useFormikContext.validateField;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
     isRequired = question.isRequired,
     _question$optionsAttr = question.optionsAttributes,
     options = _question$optionsAttr === void 0 ? [] : _question$optionsAttr;
-  var Component = kind === QUESTION_KIND.DROPDOWN.value ? neetoui.Select : Choices$1;
-  var transformedOptions = kind === QUESTION_KIND.DROPDOWN.value ? options.map(function (option) {
+  var isDropdown = kind === QUESTION_KIND.DROPDOWN.value;
+  var label = fieldWithFallback(question, "label");
+  var Component = isDropdown ? neetoui.Select : Choices$1;
+  var transformedOptions = isDropdown ? options.map(function (option) {
     return {
-      label: option.label,
+      label: fieldWithFallback(option, "label"),
       displayOrder: option.displayOrder,
       value: option.id
     };
-  }) : options;
+  }) : options.map(function (option) {
+    return _objectSpread$3(_objectSpread$3({}, option), {}, {
+      label: fieldWithFallback(option, "label")
+    });
+  });
   var handleSelect = function handleSelect(option) {
     setFieldValue(name, option.value, false);
     setFieldTouched(name, true, false);
@@ -26481,10 +26529,10 @@ var OptionsField = function OptionsField(_ref) {
       label: getLabel$1(label, isRequired),
       options: transformedOptions,
       type: kind,
-      value: kind === QUESTION_KIND.DROPDOWN.value ? neetoCist.findBy({
+      value: isDropdown ? neetoCist.findBy({
         value: value
       }, transformedOptions) || null : value,
-      onChange: kind === QUESTION_KIND.DROPDOWN.value ? handleSelect : onChange
+      onChange: isDropdown ? handleSelect : onChange
     });
   });
 };
@@ -26495,10 +26543,9 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
     autoComplete = _ref.autoComplete;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
-    placeholder = question.placeholder,
     isRequired = question.isRequired,
     nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
   var _useField = formik.useField({
       name: name || nodeId,
       validate: validateFieldValue({
@@ -26518,16 +26565,16 @@ var PhoneNumberField = function PhoneNumberField(_ref) {
   return /*#__PURE__*/React__default["default"].createElement(PhoneNumber$1.PhoneNumberInput, {
     autoComplete: autoComplete,
     label: label,
-    placeholder: placeholder,
     value: value,
     className: "neeto-form-engine-input__wrapper items-stretch",
     error: touched ? error : "",
     initialCountryCode: (_getPhoneData = getPhoneData(value)) === null || _getPhoneData === void 0 ? void 0 : _getPhoneData.country,
+    placeholder: fieldWithFallback(question, "placeholder"),
     required: isRequired,
-    onChange: setValue,
     onBlur: function onBlur() {
-      setTouched(true);
-    }
+      return setTouched(true);
+    },
+    onChange: setValue
   });
 };
 
@@ -26586,12 +26633,9 @@ var RatingField = function RatingField(_ref) {
   var question = _ref.question,
     customValidator = _ref.customValidator;
   var name = question.id,
-    label = question.label,
     kind = question.kind,
-    isRequired = question.isRequired,
-    lowestRatingLabel = question.lowestRatingLabel,
-    averageRatingLabel = question.averageRatingLabel,
-    highestRatingLabel = question.highestRatingLabel;
+    isRequired = question.isRequired;
+  var label = fieldWithFallback(question, "label");
   return /*#__PURE__*/React__default["default"].createElement(formik.Field, {
     name: name,
     validate: validateFieldValue({
@@ -26603,13 +26647,13 @@ var RatingField = function RatingField(_ref) {
   }, function (_ref2) {
     var meta = _ref2.meta,
       field = _ref2.field;
-    return /*#__PURE__*/React__default["default"].createElement(Rating$1, _extends$8({
-      averageRatingLabel: averageRatingLabel || RATING_VALUES.AVERAGE.label,
+    return /*#__PURE__*/React__default["default"].createElement(Rating$1, _extends$8({}, field, {
       error: meta.touched ? meta.error : "",
-      highestRatingLabel: highestRatingLabel || RATING_VALUES.GOOD.label,
       label: getLabel$1(label, isRequired),
-      lowestRatingLabel: lowestRatingLabel || RATING_VALUES.BAD.label
-    }, field));
+      averageRatingLabel: fieldWithFallback(question, "averageRatingLabel") || RATING_VALUES.AVERAGE.label,
+      highestRatingLabel: fieldWithFallback(question, "highestRatingLabel") || RATING_VALUES.GOOD.label,
+      lowestRatingLabel: fieldWithFallback(question, "lowestRatingLabel") || RATING_VALUES.BAD.label
+    }));
   });
 };
 
@@ -26623,11 +26667,10 @@ var RichTextEditor = function RichTextEditor(_ref) {
     errors = _useFormikContext.errors;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
     isRequired = question.isRequired,
-    nodeId = question.nodeId,
-    placeholder = question.placeholder;
-  var debouncedPlaceholder = reactUtils.useDebounce(placeholder, 300);
+    nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
+  var debouncedPlaceholder = reactUtils.useDebounce(fieldWithFallback(question, "placeholder"), 300);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "neeto-form-engine-input__wrapper"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -26737,11 +26780,11 @@ var StarRatingField = function StarRatingField(_ref) {
   var question = _ref.question,
     customValidator = _ref.customValidator;
   var name = question.id,
-    label = question.label,
     kind = question.kind,
     isRequired = question.isRequired,
     count = question.count,
     shape = question.shape;
+  var label = fieldWithFallback(question, "label");
   var sanitizedCount = ramda.clamp(0, 10, parseInt(count)) || 0;
   return /*#__PURE__*/React__default["default"].createElement(formik.Field, {
     name: name,
@@ -26771,9 +26814,9 @@ var TermsField = function TermsField(_ref) {
     customValidator = _ref.customValidator;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
     isRequired = question.isRequired,
     nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
   return /*#__PURE__*/React__default["default"].createElement(formik.Field, {
     name: name || nodeId,
     validate: validateFieldValue({
@@ -26808,10 +26851,9 @@ var TextField = function TextField(_ref) {
     autoComplete = _ref.autoComplete;
   var name = question.id,
     kind = question.kind,
-    label = question.label,
-    placeholder = question.placeholder,
     isRequired = question.isRequired,
     nodeId = question.nodeId;
+  var label = fieldWithFallback(question, "label");
   var _QUESTION_KIND$kind$t = QUESTION_KIND[kind.toUpperCase()],
     prefix = _QUESTION_KIND$kind$t.prefix,
     _QUESTION_KIND$kind$t2 = _QUESTION_KIND$kind$t.type,
@@ -26837,23 +26879,22 @@ var TextField = function TextField(_ref) {
     setValue = _useField2$2.setValue,
     setTouched = _useField2$2.setTouched;
   var handleFieldChange = utils.withEventTargetValue(setValue);
-  return /*#__PURE__*/React__default["default"].createElement(Component, _extends$8({
-    error: touched ? error : "",
-    prefix: showPrefixIcon && prefix,
-    required: isRequired
-  }, _objectSpread$1(_objectSpread$1({
-    label: label,
-    placeholder: placeholder,
+  return /*#__PURE__*/React__default["default"].createElement(Component, _extends$8({}, _objectSpread$1(_objectSpread$1({
     type: type
   }, field), {}, {
     autoComplete: autoComplete,
+    label: label,
     onKeyDown: onKeyDown
   }), {
+    error: touched ? error : "",
     name: ["email", "name"].includes(kind) ? kind : neetoCist.slugify(label),
-    onChange: (_otherProps$onChange = otherProps === null || otherProps === void 0 ? void 0 : otherProps.onChange(handleFieldChange)) !== null && _otherProps$onChange !== void 0 ? _otherProps$onChange : handleFieldChange,
+    placeholder: fieldWithFallback(question, "placeholder"),
+    prefix: showPrefixIcon && prefix,
+    required: isRequired,
     onBlur: function onBlur() {
-      setTouched(true);
-    }
+      return setTouched(true);
+    },
+    onChange: (_otherProps$onChange = otherProps === null || otherProps === void 0 ? void 0 : otherProps.onChange(handleFieldChange)) !== null && _otherProps$onChange !== void 0 ? _otherProps$onChange : handleFieldChange
   }));
 };
 
@@ -26861,10 +26902,15 @@ var _QUESTION_TO_COMPONEN;
 var QUESTION_TO_COMPONENT_MAP = (_QUESTION_TO_COMPONEN = {}, _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.TEXT.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.NAME.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.EMAIL.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.INTEGER.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.DECIMAL.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.PHONE.value, PhoneNumberField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.QUESTION.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.TEXTAREA.value, TextField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.CHECKBOX.value, OptionsField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.RADIO.value, OptionsField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.DROPDOWN.value, OptionsField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.RATING.value, RatingField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.PARAGRAPH.value, function (_ref) {
   var question = _ref.question;
   return /*#__PURE__*/React__default["default"].createElement(neetoEditor.EditorContent, {
-    content: question.label
+    content: ramda.isEmpty(question.label) ? question.labelFallback : question.label
   });
 }), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.TERMS.value, TermsField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.DATE.value, DateField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.STAR_RATING.value, StarRatingField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.ADDITIONAL_GUESTS.value, MultipleEmailInput), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.RICH_TEXT.value, RichTextEditor), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.CONDITION.value, ConditionField), _defineProperty$6(_QUESTION_TO_COMPONEN, QUESTION_KIND.FILE_UPLOAD.value, FileUploadField), _QUESTION_TO_COMPONEN);
 
+var fieldWithFallback = function fieldWithFallback(question, fieldName) {
+  var fallback = question["".concat(fieldName, "Fallback")];
+  var field = question[fieldName];
+  return ramda.isEmpty(field) && ramda.isNotNil(fallback) ? fallback : field;
+};
 var getFieldComponent = function getFieldComponent(_ref) {
   var kind = _ref.kind;
   if (kind in QUESTION_TO_COMPONENT_MAP) return QUESTION_TO_COMPONENT_MAP[kind];
@@ -26978,7 +27024,7 @@ var ExternalForm = function ExternalForm(_ref) {
     _ref$enablePreFilling = _ref.enablePreFilling,
     enablePreFilling = _ref$enablePreFilling === void 0 ? false : _ref$enablePreFilling,
     _ref$language = _ref.language,
-    language = _ref$language === void 0 ? "en" : _ref$language;
+    language = _ref$language === void 0 ? i18next__default["default"].resolvedLanguage : _ref$language;
   var _useState = React$2.useState(false),
     _useState2 = _slicedToArray$3(_useState, 2),
     isSubmitted = _useState2[0],