@bigbinary/neeto-form-frontend 3.9.1 → 3.9.3

package/dist/cjs/BuildForm.js

@@ -9,25 +9,25 @@ var neetoCist = require('@bigbinary/neeto-cist');
 var utils = require('@bigbinary/neeto-commons-frontend/utils');
 var PageLoader = require('@bigbinary/neeto-molecules/PageLoader');
 var ramda = require('ramda');
-var useFormApi = require('../useFormApi-24e05ed2.js');
-var constants$1 = require('../constants-4d9fc943.js');
-var constants = require('../constants-771cca31.js');
+var useFormApi = require('../useFormApi-DAiOGCeD.js');
+var constants$1 = require('../constants-D-XSuLo2.js');
+var constants = require('../constants-DXZnQ_E9.js');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var dnd = require('@hello-pangea/dnd');
 var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
+var HelpPopover = require('@bigbinary/neeto-molecules/HelpPopover');
 var ActionBlock = require('@bigbinary/neetoui/formik/ActionBlock');
 var reactI18next = require('react-i18next');
-var buildForm = require('../buildForm-b8eb931e.js');
+var buildForm = require('../buildForm-CthgTgsm.js');
 var shallow = require('zustand/shallow');
 var Alert = require('@bigbinary/neetoui/Alert');
-var index = require('../index-b6bb805c.js');
+var index = require('../index-2caW4Cx0.js');
 var jsxRuntime = require('react/jsx-runtime');
 var MoreDropdown = require('@bigbinary/neeto-molecules/MoreDropdown');
 var Typography = require('@bigbinary/neetoui/Typography');
 var Dropdown = require('@bigbinary/neetoui/Dropdown');
 var Tooltip = require('@bigbinary/neetoui/Tooltip');
-var HelpPopover = require('@bigbinary/neeto-molecules/HelpPopover');
 var i18next = require('i18next');
 var Plus = require('@bigbinary/neeto-icons/Plus');
 var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
@@ -62,10 +62,7 @@ require('dompurify');
 require('zustand');
 require('@babel/runtime/helpers/typeof');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
+function _interopNamespaceDefault(e) {
   var n = Object.create(null);
   if (e) {
     Object.keys(e).forEach(function (k) {
@@ -78,46 +75,11 @@ function _interopNamespace(e) {
       }
     });
   }
-  n["default"] = e;
+  n.default = e;
   return Object.freeze(n);
 }
 
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var classnames__default = /*#__PURE__*/_interopDefaultLegacy(classnames);
-var PageLoader__default = /*#__PURE__*/_interopDefaultLegacy(PageLoader);
-var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var ActionBlock__default = /*#__PURE__*/_interopDefaultLegacy(ActionBlock);
-var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
-var MoreDropdown__default = /*#__PURE__*/_interopDefaultLegacy(MoreDropdown);
-var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
-var Dropdown__default = /*#__PURE__*/_interopDefaultLegacy(Dropdown);
-var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip);
-var HelpPopover__default = /*#__PURE__*/_interopDefaultLegacy(HelpPopover);
-var Plus__default = /*#__PURE__*/_interopDefaultLegacy(Plus);
-var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
-var NoData__default = /*#__PURE__*/_interopDefaultLegacy(NoData);
-var Pane__default = /*#__PURE__*/_interopDefaultLegacy(Pane);
-var Form__default = /*#__PURE__*/_interopDefaultLegacy(Form$2);
-var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
-var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch);
-var Textarea__default = /*#__PURE__*/_interopDefaultLegacy(Textarea);
-var NeetoEditor__default = /*#__PURE__*/_interopDefaultLegacy(NeetoEditor);
-var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
-var Accordion__default = /*#__PURE__*/_interopDefaultLegacy(Accordion);
-var Input__default = /*#__PURE__*/_interopDefaultLegacy(Input);
-var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
-var Radio__default = /*#__PURE__*/_interopDefaultLegacy(Radio);
-var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
-var CreatableSelect__default = /*#__PURE__*/_interopDefaultLegacy(CreatableSelect);
-var _toArray__default = /*#__PURE__*/_interopDefaultLegacy(_toArray);
-var Close__default = /*#__PURE__*/_interopDefaultLegacy(Close);
-var Tag__default = /*#__PURE__*/_interopDefaultLegacy(Tag);
-var _asyncToGenerator__default = /*#__PURE__*/_interopDefaultLegacy(_asyncToGenerator);
-var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime);
-var Checkbox__default$1 = /*#__PURE__*/_interopDefaultLegacy(Checkbox$1);
-var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
-var Delete__default = /*#__PURE__*/_interopDefaultLegacy(Delete);
+var yup__namespace = /*#__PURE__*/_interopNamespaceDefault(yup);
 
 var DeleteAlert = function DeleteAlert(_ref) {
   var selectedQuestion = _ref.selectedQuestion,
@@ -166,7 +128,7 @@ var DeleteAlert = function DeleteAlert(_ref) {
       }
     });
   };
-  return /*#__PURE__*/jsxRuntime.jsx(Alert__default["default"], {
+  return /*#__PURE__*/jsxRuntime.jsx(Alert, {
     isOpen: isOpen,
     onClose: onClose,
     isSubmitting: isDeleting,
@@ -189,11 +151,11 @@ var ChangeLanguageDropdown = function ChangeLanguageDropdown(_ref) {
     languages = _ref.languages,
     onChange = _ref.onChange;
   var _useState = React.useState(false),
-    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    _useState2 = _slicedToArray(_useState, 2),
     isUnsavedChangesAlertOpen = _useState2[0],
     setIsUnsavedChangesAlertOpen = _useState2[1];
   var _useState3 = React.useState(currentLanguage),
-    _useState4 = _slicedToArray__default["default"](_useState3, 2),
+    _useState4 = _slicedToArray(_useState3, 2),
     selectedLanguage = _useState4[0],
     setSelectedLanguage = _useState4[1];
   var _useTranslation = reactI18next.useTranslation(),
@@ -212,17 +174,17 @@ var ChangeLanguageDropdown = function ChangeLanguageDropdown(_ref) {
     code: currentLanguage
   }, languages)) === null || _findBy === void 0 ? void 0 : _findBy.name;
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(Tooltip__default["default"], {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Tooltip, {
       content: t("neetoForm.questions.changeLanguage"),
       children: /*#__PURE__*/jsxRuntime.jsx("div", {
-        children: /*#__PURE__*/jsxRuntime.jsx(Dropdown__default["default"], {
+        children: /*#__PURE__*/jsxRuntime.jsx(Dropdown, {
           buttonStyle: "secondary",
           label: selectedLanguageName,
-          children: /*#__PURE__*/jsxRuntime.jsx(Dropdown__default["default"].Menu, {
+          children: /*#__PURE__*/jsxRuntime.jsx(Dropdown.Menu, {
             children: languages.map(function (_ref2) {
               var code = _ref2.code,
                 name = _ref2.name;
-              return /*#__PURE__*/jsxRuntime.jsx(Dropdown__default["default"].MenuItem.Button, {
+              return /*#__PURE__*/jsxRuntime.jsx(Dropdown.MenuItem.Button, {
                 isActive: currentLanguage === code,
                 onClick: function onClick() {
                   return languageChangeHandler(code);
@@ -233,7 +195,7 @@ var ChangeLanguageDropdown = function ChangeLanguageDropdown(_ref) {
           })
         })
       })
-    }), /*#__PURE__*/jsxRuntime.jsx(Alert__default["default"], {
+    }), /*#__PURE__*/jsxRuntime.jsx(Alert, {
       isOpen: isUnsavedChangesAlertOpen,
       message: t("neetoForm.questions.unsavedChangesAlert.message"),
       submitButtonLabel: t("neetoForm.questions.unsavedChangesAlert.discard"),
@@ -260,7 +222,7 @@ var Overview = function Overview(_ref) {
     className: "neeto-form-nano-form-wrapper__overview mb-4 w-full flex-shrink-0 space-y-4 px-6 pt-6",
     children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex items-center justify-between",
-      children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+      children: [/*#__PURE__*/jsxRuntime.jsx(Typography, {
         "data-cy": "neeto-form-engine-overview-title",
         lineHeight: "neeto-ui-leading-normal",
         style: "h2",
@@ -272,7 +234,7 @@ var Overview = function Overview(_ref) {
           currentLanguage: selectedLanguage,
           languages: availableLanguages,
           onChange: onLanguageChange
-        }), neetoCist.isPresent(additionalActionOptions) && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], {
+        }), neetoCist.isPresent(additionalActionOptions) && /*#__PURE__*/jsxRuntime.jsx(MoreDropdown, {
           dropdownButtonProps: {
             isRounded: true,
             style: "tertiary"
@@ -284,7 +246,7 @@ var Overview = function Overview(_ref) {
           menuItems: additionalActionOptions
         })]
       })]
-    }), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+    }), /*#__PURE__*/jsxRuntime.jsx(Typography, {
       "data-cy": "neeto-form-engine-overview-description",
       style: "body2",
       children: description
@@ -293,7 +255,7 @@ var Overview = function Overview(_ref) {
 };
 
 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__default["default"](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; }
+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(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 validateEditorContent = function validateEditorContent(editorRef) {
   return function () {
     var _editorRef$current, _editorRef$current$ed;
@@ -317,7 +279,7 @@ var buildAddQuestionButtonProps = function buildAddQuestionButtonProps(onAdd, is
     "data-cy": "neeto-form-engine-add-question-button",
     disabled: isDisabled,
     label: i18next.t("neetoForm.questions.common.primaryPanel.addQuestion"),
-    icon: Plus__default["default"],
+    icon: Plus,
     iconPosition: "left",
     style: "link",
     onClick: onAdd
@@ -335,7 +297,7 @@ var buildDisabledAddButtonTooltipProps = function buildDisabledAddButtonTooltipP
 };
 
 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__default["default"](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; }
+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(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 Card = function Card(_ref) {
   var _ref$question = _ref.question,
     question = _ref$question === void 0 ? {} : _ref$question,
@@ -347,7 +309,7 @@ var Card = function Card(_ref) {
     onClone = _ref.onClone,
     onDelete = _ref.onDelete;
   var _useState = React.useState(false),
-    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    _useState2 = _slicedToArray(_useState, 2),
     isTooltipEnabled = _useState2[0],
     setIsTooltipEnabled = _useState2[1];
   var questionLabelRef = React.useRef(null);
@@ -370,7 +332,7 @@ var Card = function Card(_ref) {
   }, [questionLabel]);
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     "data-cy": "neeto-form-engine-".concat(neetoCist.slugify(questionLabel)),
-    className: classnames__default["default"]("neeto-ui-rounded neeto-ui-border-gray-300 neeto-ui-bg-white neeto-form-nano-form__card flex h-10 w-full items-center justify-between gap-1 border p-2", {
+    className: classnames("neeto-ui-rounded neeto-ui-border-gray-300 neeto-ui-bg-white neeto-form-nano-form__card flex h-10 w-full items-center justify-between gap-1 border p-2", {
       "neeto-ui-border-primary-500 neeto-form-nano-form__card--active": isActive
     }),
     onClick: function onClick() {
@@ -380,11 +342,11 @@ var Card = function Card(_ref) {
       className: "flex min-w-0 flex-grow items-center gap-1",
       children: [/*#__PURE__*/jsxRuntime.jsx(constants.Drag, {
         className: "neeto-ui-text-gray-600 flex-shrink-0"
-      }), /*#__PURE__*/jsxRuntime.jsx(Tooltip__default["default"], {
+      }), /*#__PURE__*/jsxRuntime.jsx(Tooltip, {
         content: questionLabel,
         disabled: !isTooltipEnabled,
         position: "top",
-        children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+        children: /*#__PURE__*/jsxRuntime.jsx(Typography, {
           className: "line-clamp-2 min-w-0 flex-grow truncate break-words",
           lineHeight: "snug",
           ref: questionLabelRef,
@@ -395,7 +357,7 @@ var Card = function Card(_ref) {
       })]
     }), /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex items-center gap-1",
-      children: [isSmsReminderQuestion && /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], _objectSpread$g({
+      children: [isSmsReminderQuestion && /*#__PURE__*/jsxRuntime.jsx(HelpPopover, _objectSpread$g({
         description: t("neetoForm.smsReminder.popoverDescription"),
         popoverProps: {
           position: "top"
@@ -404,7 +366,7 @@ var Card = function Card(_ref) {
         helpLinkProps: {
           href: smsReminderHelpDocUrl
         }
-      })), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default["default"], {
+      })), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown, {
         dropdownButtonProps: {
           className: "shrink-0"
         },
@@ -435,7 +397,7 @@ var Card = function Card(_ref) {
 };
 
 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__default["default"](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 _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(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 Questions = function Questions(_ref) {
   var questions = _ref.questions,
     isDeletable = _ref.isDeletable,
@@ -498,22 +460,47 @@ var arrayHelpers = {
 };
 
 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__default["default"](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 _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(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 isChoiceQuestion = function isChoiceQuestion(question) {
   return ramda.includes(question === null || question === void 0 ? void 0 : question.kind, constants.SELECTABLE_KINDS);
 };
-var generateUniqueFieldCode = function generateUniqueFieldCode(type, questions) {
-  var fieldCodes = ramda.pluck("fieldCode", neetoCist.filterBy({
-    kind: type
-  }, questions));
-  var uniqueNumber = fieldCodes.length;
+var underscoredWithoutSpecialCharacters = function underscoredWithoutSpecialCharacters(string) {
+  return string.toLowerCase().replace(/[\s-]/g, "_").replace(/[\W]/gi, "").replace(/_+/g, "_").replace(/^_+|_+$/, "");
+};
+var addSuffixForReservedFieldCode = function addSuffixForReservedFieldCode(fieldCode) {
+  return constants.RESERVED_FIELD_CODES.includes(fieldCode) ? "".concat(fieldCode, "_field") : fieldCode;
+};
+var getUniqueNumbersFromExistingFieldCodes = function getUniqueNumbersFromExistingFieldCodes(prefix, questions) {
+  return questions.filter(function (question) {
+    return question.fieldCode.startsWith(prefix);
+  }).map(function (question) {
+    return parseInt(question.fieldCode.replace(prefix, "")) || 0;
+  });
+};
+var generateFieldCodePrefix = function generateFieldCodePrefix(label, kind) {
+  var prefix;
+  if (constants.NON_BASIC_LATIN_CHARACTERS_REGEX.test(label) || ramda.isEmpty(label)) {
+    prefix = kind;
+  } else {
+    var sanitizedLabel = underscoredWithoutSpecialCharacters(label).slice(0, 30);
+    prefix = ramda.isEmpty(sanitizedLabel) ? kind : sanitizedLabel;
+  }
+  return addSuffixForReservedFieldCode(prefix) || "";
+};
+var generateUniqueFieldCode = function generateUniqueFieldCode(_ref) {
+  var questions = _ref.questions,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? "" : _ref$label,
+    _ref$kind = _ref.kind,
+    kind = _ref$kind === void 0 ? "" : _ref$kind;
+  var prefix = generateFieldCodePrefix(label, kind);
+  var uniqueNumber = Math.max.apply(Math, [0].concat(_toConsumableArray(getUniqueNumbersFromExistingFieldCodes(prefix, questions))));
   var candidateFieldCode = "";
-  var prefix = constants.RESERVED_FIELD_CODES.includes(type) ? "".concat(type, "_field") : type;
 
   //We need to continue this while loop until we can generate a unique fieldCode
   // eslint-disable-next-line no-constant-condition
   while (true) {
-    candidateFieldCode = "".concat(prefix).concat(uniqueNumber || "");
+    candidateFieldCode = "".concat(prefix).concat(uniqueNumber === 0 ? "" : uniqueNumber);
     if (!neetoCist.findBy({
       fieldCode: candidateFieldCode
     }, questions)) break;
@@ -521,20 +508,20 @@ var generateUniqueFieldCode = function generateUniqueFieldCode(type, questions)
   }
   return candidateFieldCode;
 };
-var isQuestionKindAlreadyActive = function isQuestionKindAlreadyActive(_ref) {
-  var activeQuestions = _ref.activeQuestions,
-    kind = _ref.kind;
+var isQuestionKindAlreadyActive = function isQuestionKindAlreadyActive(_ref2) {
+  var activeQuestions = _ref2.activeQuestions,
+    kind = _ref2.kind;
   return activeQuestions.some(function (activeQuestion) {
     return activeQuestion.kind === kind.type && activeQuestion._destroy !== true;
   });
 };
-var handleFieldDragEnd = function handleFieldDragEnd(_ref2) {
-  var items = _ref2.items,
-    setValue = _ref2.setValue,
-    source = _ref2.source,
-    destination = _ref2.destination;
+var handleFieldDragEnd = function handleFieldDragEnd(_ref3) {
+  var items = _ref3.items,
+    setValue = _ref3.setValue,
+    source = _ref3.source,
+    destination = _ref3.destination;
   if (!(destination && items instanceof Array)) return;
-  var nextItems = _toConsumableArray__default["default"](items);
+  var nextItems = _toConsumableArray(items);
   arrayHelpers.moveItem(nextItems, source.index, destination.index);
   var orderedItems = nextItems.map(function (item, index) {
     return _objectSpread$e(_objectSpread$e({}, item), {}, {
@@ -543,32 +530,36 @@ var handleFieldDragEnd = function handleFieldDragEnd(_ref2) {
   });
   setValue("questions", orderedItems);
 };
-var createFieldData = function createFieldData(_ref3) {
-  var _ref3$kind = _ref3.kind,
-    defaults = _ref3$kind.defaults,
-    type = _ref3$kind.type,
-    metadata = _ref3$kind.metadata,
-    _ref3$isRequired = _ref3.isRequired,
-    isRequired = _ref3$isRequired === void 0 ? undefined : _ref3$isRequired,
-    questions = _ref3.questions;
+var createFieldData = function createFieldData(_ref4) {
+  var _ref4$kind = _ref4.kind,
+    defaults = _ref4$kind.defaults,
+    type = _ref4$kind.type,
+    metadata = _ref4$kind.metadata,
+    _ref4$isRequired = _ref4.isRequired,
+    isRequired = _ref4$isRequired === void 0 ? undefined : _ref4$isRequired,
+    questions = _ref4.questions;
   return _objectSpread$e(_objectSpread$e({}, defaults), {}, {
     metadata: metadata,
     isRequired: isRequired,
     kind: type,
     nodeId: uuid.v4(),
-    fieldCode: generateUniqueFieldCode(type, questions)
+    fieldCode: generateUniqueFieldCode({
+      questions: questions,
+      kind: type,
+      label: defaults["label"]
+    })
   });
 };
-var duplicateFieldData = function duplicateFieldData(_ref4) {
-  var item = _ref4.item,
-    questionKinds = _ref4.questionKinds,
-    questions = _ref4.questions;
-  var questionKind = neetoCist.findBy({
-    type: item.kind
-  }, questionKinds);
+var duplicateFieldData = function duplicateFieldData(_ref5) {
+  var item = _ref5.item,
+    questionKinds = _ref5.questionKinds,
+    questions = _ref5.questions;
   var isRequired = item.isRequired,
     kind = item.kind,
     optionsAttributes = item.optionsAttributes;
+  var questionKind = neetoCist.findBy({
+    type: kind
+  }, questionKinds);
   var label = index.fieldWithFallback(item, "label");
   var defaultAttributeNames = ramda.keys(questionKind.defaults || {});
   var defaultAttributes = ramda.pick(defaultAttributeNames, item);
@@ -581,15 +572,19 @@ var duplicateFieldData = function duplicateFieldData(_ref4) {
     label: newQuestionLabel,
     optionsAttributes: optionsAttributes && optionsAttributes.map(ramda.omit(["id"])),
     nodeId: uuid.v4(),
-    fieldCode: generateUniqueFieldCode(item.kind, questions),
+    fieldCode: generateUniqueFieldCode({
+      questions: questions,
+      kind: kind,
+      label: newQuestionLabel
+    }),
     displayOrder: item.displayOrder + 1
   });
 };
-var getAvailableQuestionKinds = function getAvailableQuestionKinds(_ref5) {
-  var allQuestionKinds = _ref5.allQuestionKinds,
-    _ref5$activeQuestions = _ref5.activeQuestions,
-    activeQuestions = _ref5$activeQuestions === void 0 ? [] : _ref5$activeQuestions,
-    isKindAlreadyActive = _ref5.isKindAlreadyActive;
+var getAvailableQuestionKinds = function getAvailableQuestionKinds(_ref6) {
+  var allQuestionKinds = _ref6.allQuestionKinds,
+    _ref6$activeQuestions = _ref6.activeQuestions,
+    activeQuestions = _ref6$activeQuestions === void 0 ? [] : _ref6$activeQuestions,
+    isKindAlreadyActive = _ref6.isKindAlreadyActive;
   if (ramda.isEmpty(activeQuestions)) return allQuestionKinds;
   return ramda.reject(function (kind) {
     var isSingularKind = kind.isSingular;
@@ -610,7 +605,7 @@ var AddFirstQuestion = function AddFirstQuestion(_ref) {
   var tooltipProps = buildDisabledAddButtonTooltipProps(isDisabled, disabledAddButtonTooltipProps);
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "flex h-full flex-col items-center justify-center py-8",
-    children: /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], {
+    children: /*#__PURE__*/jsxRuntime.jsx(NoData, {
       showTooltipWhenButtonDisabled: true,
       className: "min-h-80",
       title: t("neetoForm.questions.common.noData"),
@@ -634,7 +629,7 @@ var NAME = constants.QUESTION_TYPES.NAME,
   FILE_UPLOAD$1 = constants.QUESTION_TYPES.FILE_UPLOAD,
   CAPTCHA$1 = constants.QUESTION_TYPES.CAPTCHA,
   SMS_REMINDER = constants.QUESTION_TYPES.SMS_REMINDER;
-var QUESTIONS_WITH_ADDITIONAL_DATA = [].concat(_toConsumableArray__default["default"](constants.SELECTABLE_KINDS), [STAR_RATING$1, RATING$1, FILE_UPLOAD$1, CAPTCHA$1, EMAIL$1]);
+var QUESTIONS_WITH_ADDITIONAL_DATA = [].concat(_toConsumableArray(constants.SELECTABLE_KINDS), [STAR_RATING$1, RATING$1, FILE_UPLOAD$1, CAPTCHA$1, EMAIL$1]);
 var QUESTIONS_WITH_PLACEHOLDERS = [NAME, PHONE, EMAIL$1, ADDITIONAL_GUESTS, TEXT, TEXTAREA, RICH_TEXT, INTEGER, DECIMAL, DATE, SMS_REMINDER];
 var DEFAULT_PLACEHOLDERS = {
   CHECKBOX: i18next.t("neetoForm.questions.common.questionFields.field.labelExample", {
@@ -652,14 +647,15 @@ var INITIAL_VALUES = {
   label: "",
   fieldCode: ""
 };
+var VALID_FIELD_CODE_REGEX = /^[a-z0-9]+(_[a-z0-9]+)*$/;
 
 var _excluded$8 = ["label", "name"];
 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__default["default"](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 _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(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; }
 var FormikAdaptiveInput = function FormikAdaptiveInput(_ref) {
   var label = _ref.label,
     name = _ref.name,
-    otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$8);
+    otherProps = _objectWithoutProperties(_ref, _excluded$8);
   var _useFormikContext = formik.useFormikContext(),
     dirty = _useFormikContext.dirty,
     isValid = _useFormikContext.isValid,
@@ -674,7 +670,7 @@ var FormikAdaptiveInput = function FormikAdaptiveInput(_ref) {
     var end = element.value.length;
     element.setSelectionRange(end, end);
   };
-  return /*#__PURE__*/jsxRuntime.jsx(Textarea__default["default"], _objectSpread$d({
+  return /*#__PURE__*/jsxRuntime.jsx(Textarea, _objectSpread$d({
     label: label,
     name: name,
     className: "neeto-form-nano-adaptive-input",
@@ -698,7 +694,7 @@ var Block = function Block(_ref) {
     children: [/*#__PURE__*/jsxRuntime.jsx("div", {
       className: "flex items-center justify-between",
       "data-cy": "properties-header",
-      children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+      children: /*#__PURE__*/jsxRuntime.jsx(Typography, {
         lineHeight: "normal",
         style: "body1",
         weight: "semibold",
@@ -784,7 +780,7 @@ var Editor = function Editor() {
       name: fieldName,
       validate: validateEditorContent(editorRef)
     }),
-    _useField2 = _slicedToArray__default["default"](_useField, 3),
+    _useField2 = _slicedToArray(_useField, 3),
     value = _useField2[0].value,
     _useField2$ = _useField2[1],
     touched = _useField2$.touched,
@@ -802,7 +798,7 @@ var Editor = function Editor() {
   });
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "w-full cursor-auto",
-    children: /*#__PURE__*/jsxRuntime.jsx(NeetoEditor__default["default"], {
+    children: /*#__PURE__*/jsxRuntime.jsx(NeetoEditor, {
       required: true,
       error: touched ? error : "",
       id: "editor",
@@ -821,7 +817,7 @@ var RequiredSwitch = reactUtils.withT(function (_ref) {
   var t = _ref.t;
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "w-full",
-    children: /*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], {
+    children: /*#__PURE__*/jsxRuntime.jsx(Switch, {
       label: t("neetoForm.common.required"),
       name: "isRequired"
     })
@@ -830,12 +826,12 @@ var RequiredSwitch = reactUtils.withT(function (_ref) {
 
 var _excluded$7 = ["maxLength"];
 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__default["default"](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 _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(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; }
 var InputWithMaxLength = function InputWithMaxLength(_ref) {
   var maxLength = _ref.maxLength,
-    props = _objectWithoutProperties__default["default"](_ref, _excluded$7);
+    props = _objectWithoutProperties(_ref, _excluded$7);
   var _useField = formik.useField(props),
-    _useField2 = _slicedToArray__default["default"](_useField, 3),
+    _useField2 = _slicedToArray(_useField, 3),
     value = _useField2[0].value,
     setValue = _useField2[2].setValue;
   React.useEffect(function () {
@@ -844,7 +840,7 @@ var InputWithMaxLength = function InputWithMaxLength(_ref) {
     }
   }, [value, maxLength, setValue]);
   var shouldShowMaxLength = value && value.length > maxLength - 10;
-  return /*#__PURE__*/jsxRuntime.jsx(Input__default["default"], _objectSpread$c(_objectSpread$c({}, props), shouldShowMaxLength && {
+  return /*#__PURE__*/jsxRuntime.jsx(Input, _objectSpread$c(_objectSpread$c({}, props), shouldShowMaxLength && {
     maxLength: maxLength
   }));
 };
@@ -853,19 +849,20 @@ var FieldCode = function FieldCode() {
   var helpDocUrl = buildForm.useBuildFormStore(ramda.path(["formState", "helpDocUrls", "fieldCode"]));
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
-  return /*#__PURE__*/jsxRuntime.jsx(Accordion__default["default"], {
+  return /*#__PURE__*/jsxRuntime.jsx(Accordion, {
     className: "neeto-form-nano-advanced-properties-accordion",
     "data-cy": "advanced-properties-card",
-    children: /*#__PURE__*/jsxRuntime.jsx(Accordion__default["default"].Item, {
+    children: /*#__PURE__*/jsxRuntime.jsx(Accordion.Item, {
       title: t("neetoForm.common.advancedProperties"),
       children: /*#__PURE__*/jsxRuntime.jsx(InputWithMaxLength, {
         required: true,
         label: t("neetoForm.questions.common.questionFields.field.fieldCode"),
         name: "fieldCode",
+        rejectCharsRegex: constants.FIELD_CODES_REJECT_CHARS_REGEX,
         helpText: helpDocUrl && /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
           i18nKey: "neetoForm.questions.common.questionFields.field.fieldCodeHelpDescription",
           components: {
-            Link: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+            Link: /*#__PURE__*/jsxRuntime.jsx(Button, {
               className: "text-xs",
               href: helpDocUrl,
               style: "link",
@@ -896,7 +893,8 @@ var Form$1 = function Form(_ref) {
     values = _useFormikContext.values,
     setValues = _useFormikContext.setValues,
     setErrors = _useFormikContext.setErrors,
-    setTouched = _useFormikContext.setTouched;
+    setTouched = _useFormikContext.setTouched,
+    setFieldValue = _useFormikContext.setFieldValue;
   var hideQuestionHelpDoc = buildForm.useBuildFormStore(ramda.path(["formState", "helpDocUrls", "hideQuestion"]));
   var _useBuildFormStore = buildForm.useBuildFormStore(function (store) {
       var _store$formState, _store$formState2;
@@ -913,7 +911,7 @@ var Form$1 = function Form(_ref) {
     type: kind
   });
   var _useStateWithDependen = reactUtils.useStateWithDependency(getQuestionKind(questionKinds, questionKindUniquenessPattern), [kind]),
-    _useStateWithDependen2 = _slicedToArray__default["default"](_useStateWithDependen, 1),
+    _useStateWithDependen2 = _slicedToArray(_useStateWithDependen, 1),
     questionKind = _useStateWithDependen2[0];
   var _ref2 = questionKind ? getActiveKindDetails({
       allQuestionKinds: allQuestionKinds,
@@ -955,10 +953,20 @@ var Form$1 = function Form(_ref) {
     setErrors({});
     setTouched({});
   };
-  return /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Body, {
+  var handleLabelChange = function handleLabelChange(label) {
+    setFieldValue("label", label);
+    if (isEdit) return;
+    var uniqueFieldCode = generateUniqueFieldCode({
+      questions: questions,
+      label: label,
+      kind: kind
+    });
+    setFieldValue("fieldCode", uniqueFieldCode);
+  };
+  return /*#__PURE__*/jsxRuntime.jsx(Pane.Body, {
     children: /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "w-full space-y-4",
-      children: [/*#__PURE__*/jsxRuntime.jsx(Select__default["default"], {
+      children: [/*#__PURE__*/jsxRuntime.jsx(Select, {
         isClearable: true,
         isSearchable: true,
         defaultValue: buildDefaultValueForKind(questionKind),
@@ -979,7 +987,8 @@ var Form$1 = function Form(_ref) {
             disabled: isLabelDisabled,
             name: "label",
             placeholder: DEFAULT_PLACEHOLDERS[kind],
-            label: t("neetoForm.questions.common.questionFields.field.question")
+            label: t("neetoForm.questions.common.questionFields.field.question"),
+            onChange: utils.withEventTargetValue(handleLabelChange)
           }), shouldShowPlaceholder && /*#__PURE__*/jsxRuntime.jsx(FormikAdaptiveInput, {
             name: "placeholder",
             label: t("neetoForm.questions.common.questionFields.field.placeholder")
@@ -992,7 +1001,7 @@ var Form$1 = function Form(_ref) {
         }), isSettingsBlockVisible && /*#__PURE__*/jsxRuntime.jsxs(Block, {
           dataCy: "settings-card",
           title: t("neetoForm.common.settings"),
-          children: [!isImmutable && /*#__PURE__*/jsxRuntime.jsx(RequiredSwitch, {}), shouldShowHideSwitch && /*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], {
+          children: [!isImmutable && /*#__PURE__*/jsxRuntime.jsx(RequiredSwitch, {}), shouldShowHideSwitch && /*#__PURE__*/jsxRuntime.jsx(Switch, {
             label: t("neetoForm.common.hideQuestion"),
             labelProps: hideSwitchLabelProps(hideQuestionHelpDoc),
             name: "isHidden"
@@ -1009,42 +1018,52 @@ var requiredLabelValidation = function requiredLabelValidation(schema, field) {
     field: field
   }));
 };
+var fieldCodeValidation = function fieldCodeValidation(schema, field) {
+  return schema.trim().required(i18next.t("neetoForm.common.fieldReq", {
+    field: field
+  })).matches(VALID_FIELD_CODE_REGEX, i18next.t("neetoForm.error.invalidField", {
+    label: field
+  }));
+};
 var richTextFieldMissingErrorMessage = function richTextFieldMissingErrorMessage(kind) {
   var field = ramda.equals(kind, constants.QUESTION_TYPES.PARAGRAPH) ? i18next.t("neetoForm.fields.def") : i18next.t("neetoForm.fields.tcf");
   return i18next.t("neetoForm.error.fieldCantBeEmpty", {
     field: field
   });
 };
-var formValidationSchema = yup__namespace.object().shape({
-  kind: yup__namespace.string().trim().required(i18next.t("neetoForm.common.fieldReq", {
-    field: i18next.t("neetoForm.questions.common.questionFields.field.questionType")
-  })),
-  label: yup__namespace.string().when("kind", function (kind, schema) {
-    return ramda.includes(kind, constants.RICH_TEXT_QUESTIONS) ? schema.test("required", richTextFieldMissingErrorMessage(kind), function (value) {
-      return !utils$1.isEditorEmpty(value);
-    }) : requiredLabelValidation(schema, i18next.t("neetoForm.questions.common.questionFields.field.question"));
-  }),
-  fieldCode: yup__namespace.string().trim().notOneOf(constants.RESERVED_FIELD_CODES, i18next.t("neetoForm.error.invalidFieldCode")).when("kind", function (kind, schema) {
-    return ramda.includes(kind, constants.QUESTIONS_WITHOUT_FIELD_CODE) ? schema.notRequired() : requiredLabelValidation(schema, i18next.t("neetoForm.questions.common.questionFields.field.fieldCode"));
-  }),
-  optionsAttributes: yup__namespace.array().when("_destroy", {
-    is: true,
-    otherwise: function otherwise(schema) {
-      return schema.when("kind", function (kind, schema) {
-        return ramda.includes(kind, constants.SELECTABLE_KINDS) ? schema.of(yup__namespace.object().shape({
-          label: requiredLabelValidation(yup__namespace.string(), i18next.t("neetoForm.questions.common.questionFields.field.option"))
-        })) : schema.notRequired();
-      });
-    }
-  }),
-  highestRatingLabel: yup__namespace.string().nullable(),
-  averageRatingLabel: yup__namespace.string().nullable(),
-  lowestRatingLabel: yup__namespace.string().nullable()
-});
+var formValidationSchema = function formValidationSchema() {
+  var enableFieldCode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  return yup__namespace.object().shape({
+    kind: yup__namespace.string().trim().required(i18next.t("neetoForm.common.fieldReq", {
+      field: i18next.t("neetoForm.questions.common.questionFields.field.questionType")
+    })),
+    label: yup__namespace.string().when("kind", function (kind, schema) {
+      return ramda.includes(kind, constants.RICH_TEXT_QUESTIONS) ? schema.test(richTextFieldMissingErrorMessage(kind), function (value) {
+        return !utils$1.isEditorEmpty(value);
+      }) : requiredLabelValidation(schema, i18next.t("neetoForm.questions.common.questionFields.field.question"));
+    }),
+    fieldCode: yup__namespace.string().trim().notOneOf(constants.RESERVED_FIELD_CODES, i18next.t("neetoForm.error.invalidFieldCode")).when("kind", function (kind, schema) {
+      return enableFieldCode && !ramda.includes(kind, constants.QUESTIONS_WITHOUT_FIELD_CODE) ? fieldCodeValidation(schema, i18next.t("neetoForm.questions.common.questionFields.field.fieldCode")) : schema.notRequired();
+    }),
+    optionsAttributes: yup__namespace.array().when("_destroy", {
+      is: true,
+      otherwise: function otherwise(schema) {
+        return schema.when("kind", function (kind, schema) {
+          return ramda.includes(kind, constants.SELECTABLE_KINDS) ? schema.of(yup__namespace.object().shape({
+            label: requiredLabelValidation(yup__namespace.string(), i18next.t("neetoForm.questions.common.questionFields.field.option"))
+          })) : schema.notRequired();
+        });
+      }
+    }),
+    highestRatingLabel: yup__namespace.string().nullable(),
+    averageRatingLabel: yup__namespace.string().nullable(),
+    lowestRatingLabel: yup__namespace.string().nullable()
+  });
+};
 
 var _excluded$6 = ["question", "onClose", "questions", "handleSelect", "buildRequestArgs", "isOpen"];
 function ownKeys$b(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$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$b(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$b(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$b(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Add = function Add(_ref) {
   var question = _ref.question,
     onClose = _ref.onClose,
@@ -1052,7 +1071,7 @@ var Add = function Add(_ref) {
     handleSelect = _ref.handleSelect,
     buildRequestArgs = _ref.buildRequestArgs,
     isOpen = _ref.isOpen,
-    props = _objectWithoutProperties__default["default"](_ref, _excluded$6);
+    props = _objectWithoutProperties(_ref, _excluded$6);
   var _useBuildFormStore = buildForm.useBuildFormStore(function (store) {
       var _store$formState, _store$formState2;
       return {
@@ -1091,24 +1110,24 @@ var Add = function Add(_ref) {
     });
   };
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Header, {
-      children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Pane.Header, {
+      children: /*#__PURE__*/jsxRuntime.jsx(Typography, {
         "data-cy": "add-question-pane-header",
         style: "h2",
         children: t("neetoForm.questions.common.primaryPanel.addQuestion")
       })
-    }), /*#__PURE__*/jsxRuntime.jsx(Form__default["default"], {
+    }), /*#__PURE__*/jsxRuntime.jsx(Form$2, {
       formikProps: {
         initialValues: INITIAL_VALUES,
-        validationSchema: formValidationSchema,
+        validationSchema: formValidationSchema(props["enableFieldCode"]),
         onSubmit: handleSubmit
       },
       children: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [/*#__PURE__*/jsxRuntime.jsx(Form$1, _objectSpread$b({}, _objectSpread$b(_objectSpread$b({}, props), {}, {
           question: question,
           questions: questions
-        }))), /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Footer, {
-          children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock__default["default"], {
+        }))), /*#__PURE__*/jsxRuntime.jsx(Pane.Footer, {
+          children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock, {
             cancelButtonProps: {
               onClick: onClose
             },
@@ -1122,12 +1141,12 @@ var Add = function Add(_ref) {
 
 var _excluded$5 = ["question", "isOpen", "onClose"];
 function ownKeys$a(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$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$a(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$a(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$a(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Edit = function Edit(_ref) {
   var question = _ref.question,
     isOpen = _ref.isOpen,
     onClose = _ref.onClose,
-    props = _objectWithoutProperties__default["default"](_ref, _excluded$5);
+    props = _objectWithoutProperties(_ref, _excluded$5);
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var _useBuildFormStore = buildForm.useBuildFormStore(function (store) {
@@ -1161,16 +1180,16 @@ var Edit = function Edit(_ref) {
     });
   };
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Header, {
-      children: /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Pane.Header, {
+      children: /*#__PURE__*/jsxRuntime.jsx(Typography, {
         "data-cy": "edit-question-pane-header",
         style: "h2",
         children: t("neetoForm.questions.common.editQuestion")
       })
-    }), /*#__PURE__*/jsxRuntime.jsx(Form__default["default"], {
+    }), /*#__PURE__*/jsxRuntime.jsx(Form$2, {
       formikProps: {
         initialValues: question,
-        validationSchema: formValidationSchema,
+        validationSchema: formValidationSchema(props["enableFieldCode"]),
         onSubmit: handleSubmit
       },
       children: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
@@ -1178,8 +1197,8 @@ var Edit = function Edit(_ref) {
           question: question
         }, props)), {}, {
           isEdit: true
-        })), /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"].Footer, {
-          children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock__default["default"], {
+        })), /*#__PURE__*/jsxRuntime.jsx(Pane.Footer, {
+          children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock, {
             cancelButtonProps: {
               onClick: onClose
             },
@@ -1193,16 +1212,16 @@ var Edit = function Edit(_ref) {
 
 var Captcha = reactUtils.withT(function (_ref) {
   var t = _ref.t;
-  return /*#__PURE__*/jsxRuntime.jsxs(Radio__default["default"], {
+  return /*#__PURE__*/jsxRuntime.jsxs(Radio, {
     label: t("neetoForm.common.captchaType"),
     labelProps: {
       required: true
     },
     name: "variant",
-    children: [/*#__PURE__*/jsxRuntime.jsx(Radio__default["default"].Item, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Radio.Item, {
       label: t("neetoForm.common.reCaptchaV2"),
       value: constants.CAPTCHA_TYPES.RECAPTCHA_V2
-    }), /*#__PURE__*/jsxRuntime.jsx(Radio__default["default"].Item, {
+    }), /*#__PURE__*/jsxRuntime.jsx(Radio.Item, {
       label: t("neetoForm.common.mathCaptcha"),
       value: constants.CAPTCHA_TYPES.MATH_CAPTCHA
     })]
@@ -1211,21 +1230,21 @@ var Captcha = reactUtils.withT(function (_ref) {
 
 var _excluded$4 = ["name", "title", "className"];
 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__default["default"](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; }
+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(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; }
 var SwitchBlock = function SwitchBlock(_ref) {
   var name = _ref.name,
     title = _ref.title,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
-    otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$4);
-  return /*#__PURE__*/jsxRuntime.jsxs(Label__default["default"], {
-    className: classnames__default["default"]("flex items-center justify-start gap-2 ", className),
+    otherProps = _objectWithoutProperties(_ref, _excluded$4);
+  return /*#__PURE__*/jsxRuntime.jsxs(Label, {
+    className: classnames("flex items-center justify-start gap-2 ", className),
     "data-cy": "neeto-form-engine-".concat(neetoCist.hyphenate(title && name), "-toggle-label"),
-    children: [/*#__PURE__*/jsxRuntime.jsx(Switch__default["default"], _objectSpread$9(_objectSpread$9({}, _objectSpread$9(_objectSpread$9({}, otherProps), {}, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(Switch, _objectSpread$9(_objectSpread$9({}, _objectSpread$9(_objectSpread$9({}, otherProps), {}, {
       name: name
     })), {}, {
       "data-cy": "neeto-form-engine-".concat(neetoCist.hyphenate(title && name), "-switch")
-    })), /*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+    })), /*#__PURE__*/jsxRuntime.jsx(Typography, {
       component: "span",
       style: "body1",
       children: title
@@ -1234,14 +1253,14 @@ var SwitchBlock = function SwitchBlock(_ref) {
 };
 
 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__default["default"](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; }
+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(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 TitleWithHelpPopover = function TitleWithHelpPopover(_ref) {
   var title = _ref.title,
     description = _ref.description,
     helpLink = _ref.helpLink;
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: "flex gap-2",
-    children: [title, /*#__PURE__*/jsxRuntime.jsx(HelpPopover__default["default"], _objectSpread$8({
+    children: [title, /*#__PURE__*/jsxRuntime.jsx(HelpPopover, _objectSpread$8({
       description: description,
       popoverProps: {
         position: "top"
@@ -1269,7 +1288,7 @@ var DOMAIN_RESTRICTION_TRANSLATIONS = {
 
 var _excluded$3 = ["children"];
 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__default["default"](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 _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(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 STYLES = {
   border: {
     "default": "1px solid rgb(var(--neeto-ui-gray-400))",
@@ -1282,15 +1301,15 @@ var STYLES = {
 };
 var MultiValueRemove = function MultiValueRemove(props) {
   return /*#__PURE__*/jsxRuntime.jsx(reactSelect.components.MultiValueRemove, _objectSpread$7(_objectSpread$7({}, props), {}, {
-    innerProps: _objectSpread$7(_objectSpread$7({}, props.innerProps), {}, _defineProperty__default["default"]({}, "data-cy", "".concat(utils.hyphenize(props.data.label), "-remove-icon"))),
-    children: /*#__PURE__*/jsxRuntime.jsx(Close__default["default"], {
+    innerProps: _objectSpread$7(_objectSpread$7({}, props.innerProps), {}, _defineProperty({}, "data-cy", "".concat(utils.hyphenize(props.data.label), "-remove-icon"))),
+    children: /*#__PURE__*/jsxRuntime.jsx(Close, {
       size: 16
     })
   }));
 };
 var ValueContainer = function ValueContainer(_ref) {
   var children = _ref.children,
-    props = _objectWithoutProperties__default["default"](_ref, _excluded$3);
+    props = _objectWithoutProperties(_ref, _excluded$3);
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var getValue = props.getValue,
@@ -1298,13 +1317,13 @@ var ValueContainer = function ValueContainer(_ref) {
     isFocused = _props$selectProps.isFocused,
     visibleDomainsCount = _props$selectProps.visibleDomainsCount;
   var value = getValue();
-  var _children = _toArray__default["default"](children),
+  var _children = _toArray(children),
     firstChild = _children[0],
     rest = _children.slice(1);
   var shouldCollapse = !isFocused && value.length > visibleDomainsCount;
   return /*#__PURE__*/jsxRuntime.jsxs(reactSelect.components.ValueContainer, _objectSpread$7(_objectSpread$7({}, props), {}, {
-    innerProps: _objectSpread$7(_objectSpread$7({}, props.innerProps), {}, _defineProperty__default["default"]({}, "data-cy", "multi-domain-input-container")),
-    children: [shouldCollapse ? firstChild.slice(0, visibleDomainsCount) : firstChild, shouldCollapse && /*#__PURE__*/jsxRuntime.jsx(Tag__default["default"], {
+    innerProps: _objectSpread$7(_objectSpread$7({}, props.innerProps), {}, _defineProperty({}, "data-cy", "multi-domain-input-container")),
+    children: [shouldCollapse ? firstChild.slice(0, visibleDomainsCount) : firstChild, shouldCollapse && /*#__PURE__*/jsxRuntime.jsx(Tag, {
       style: "secondary",
       label: t("neetoForm.common.remainingItemsCount", {
         count: value.length - visibleDomainsCount
@@ -1314,8 +1333,8 @@ var ValueContainer = function ValueContainer(_ref) {
 };
 var ClearIndicator = function ClearIndicator(props) {
   return /*#__PURE__*/jsxRuntime.jsx(reactSelect.components.ClearIndicator, _objectSpread$7(_objectSpread$7({}, props), {}, {
-    innerProps: _objectSpread$7(_objectSpread$7({}, props.innerProps), {}, _defineProperty__default["default"]({}, "data-cy", "clear-all-button")),
-    children: /*#__PURE__*/jsxRuntime.jsx(Close__default["default"], {
+    innerProps: _objectSpread$7(_objectSpread$7({}, props.innerProps), {}, _defineProperty({}, "data-cy", "clear-all-button")),
+    children: /*#__PURE__*/jsxRuntime.jsx(Close, {
       className: "cursor-pointer",
       size: 16
     })
@@ -1379,7 +1398,7 @@ var formatErrorMessage = function formatErrorMessage(error) {
 
 var _excluded$2 = ["label", "value", "onChange", "error", "onBlur"];
 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__default["default"](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 _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(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; }
 var MultiDomainInput = function MultiDomainInput(_ref) {
   var _ref$label = _ref.label,
     label = _ref$label === void 0 ? "" : _ref$label,
@@ -1391,13 +1410,13 @@ var MultiDomainInput = function MultiDomainInput(_ref) {
     error = _ref$error === void 0 ? "" : _ref$error,
     _ref$onBlur = _ref.onBlur,
     onBlur = _ref$onBlur === void 0 ? neetoCist.noop : _ref$onBlur,
-    otherProps = _objectWithoutProperties__default["default"](_ref, _excluded$2);
+    otherProps = _objectWithoutProperties(_ref, _excluded$2);
   var _useState = React.useState(""),
-    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    _useState2 = _slicedToArray(_useState, 2),
     inputValue = _useState2[0],
     setInputValue = _useState2[1];
   var _useState3 = React.useState(false),
-    _useState4 = _slicedToArray__default["default"](_useState3, 2),
+    _useState4 = _slicedToArray(_useState3, 2),
     isFocused = _useState4[0],
     setIsFocused = _useState4[1];
   var _useTranslation = reactI18next.useTranslation(),
@@ -1409,7 +1428,7 @@ var MultiDomainInput = function MultiDomainInput(_ref) {
     var inputValues = inputValue.match(DOMAIN_SEPARATION_REGEX) || [];
     var domainMatches = ramda.filter(ramda.test(FLEXIBLE_DOMAIN_REGEX), inputValues);
     var domains = domainMatches.map(formatDomainInputOptions);
-    onChange(pruneDuplicates([].concat(_toConsumableArray__default["default"](value), _toConsumableArray__default["default"](domains))));
+    onChange(pruneDuplicates([].concat(_toConsumableArray(value), _toConsumableArray(domains))));
     setInputValue("");
   };
   var handleKeyDown = function handleKeyDown(event) {
@@ -1422,7 +1441,7 @@ var MultiDomainInput = function MultiDomainInput(_ref) {
   };
   var onCreateOption = function onCreateOption(input) {
     var domain = formatDomainInputOptions(input);
-    onChange(pruneDuplicates([].concat(_toConsumableArray__default["default"](value), [domain])));
+    onChange(pruneDuplicates([].concat(_toConsumableArray(value), [domain])));
   };
   var handleBlur = function handleBlur(event) {
     inputValue ? handleDomainChange() : onBlur(event);
@@ -1433,19 +1452,19 @@ var MultiDomainInput = function MultiDomainInput(_ref) {
     className: "neeto-ui-input__wrapper neeto-ui-email-input__wrapper",
     children: [/*#__PURE__*/jsxRuntime.jsx("div", {
       className: "neeto-ui-email-input__label-wrapper",
-      children: /*#__PURE__*/jsxRuntime.jsx(Label__default["default"], {
+      children: /*#__PURE__*/jsxRuntime.jsx(Label, {
         className: "neeto-ui-email-input__label",
         "data-cy": "".concat(utils.hyphenize(label), "-input-label"),
         children: label
       })
-    }), /*#__PURE__*/jsxRuntime.jsx(CreatableSelect__default["default"], _objectSpread$6({
+    }), /*#__PURE__*/jsxRuntime.jsx(CreatableSelect, _objectSpread$6({
       isMulti: true,
       required: true,
       classNamePrefix: "neeto-ui-react-select",
       components: CUSTOM_COMPONENTS,
       menuIsOpen: false,
       visibleDomainsCount: 3,
-      className: classnames__default["default"]("neeto-ui-react-select__container neeto-ui-react-select__container--medium neeto-ui-email-input__select", {
+      className: classnames("neeto-ui-react-select__container neeto-ui-react-select__container--medium neeto-ui-email-input__select", {
         "neeto-ui-react-select__container--error": !!error
       }),
       styles: _objectSpread$6(_objectSpread$6({}, CUSTOM_STYLES), {}, {
@@ -1491,8 +1510,8 @@ var validateDomains = function validateDomains(value) {
 
   // eslint-disable-next-line no-async-promise-executor
   return new Promise(/*#__PURE__*/function () {
-    var _ref = _asyncToGenerator__default["default"](/*#__PURE__*/_regeneratorRuntime__default["default"].mark(function _callee(resolve) {
-      return _regeneratorRuntime__default["default"].wrap(function _callee$(_context) {
+    var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee(resolve) {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             _context.prev = 0;
@@ -1527,7 +1546,7 @@ var EmailDomains = function EmailDomains(_ref) {
       name: name,
       validate: validateDomains
     }),
-    _useField2 = _slicedToArray__default["default"](_useField, 3),
+    _useField2 = _slicedToArray(_useField, 3),
     _useField2$0$value = _useField2[0].value,
     domains = _useField2$0$value === void 0 ? [] : _useField2$0$value,
     meta = _useField2[1],
@@ -1608,7 +1627,7 @@ var FileGroup = function FileGroup(_ref) {
     label = _ref.label,
     checked = _ref.checked,
     handleAllowedFileTypesChange = _ref.handleAllowedFileTypesChange;
-  return /*#__PURE__*/jsxRuntime.jsx(Checkbox__default["default"], {
+  return /*#__PURE__*/jsxRuntime.jsx(Checkbox, {
     checked: checked,
     label: label,
     name: name,
@@ -1627,7 +1646,7 @@ var getAllowedFileTypes = function getAllowedFileTypes(_ref) {
     allowedFileTypes = _ref.allowedFileTypes;
   var fileTypes = buildFileTypesList(allowedFileTypes);
   if (isChecked) {
-    var fileTypesSet = new Set([].concat(_toConsumableArray__default["default"](constants.FILE_TYPES_MAP[type]), _toConsumableArray__default["default"](fileTypes)));
+    var fileTypesSet = new Set([].concat(_toConsumableArray(constants.FILE_TYPES_MAP[type]), _toConsumableArray(fileTypes)));
     return Array.from(fileTypesSet).join(", ");
   }
   var newFileTypes = ramda.difference(fileTypes, constants.FILE_TYPES_MAP[type]);
@@ -1658,14 +1677,14 @@ var FileUpload = function FileUpload() {
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsx("div", {
       className: "w-full",
-      children: /*#__PURE__*/jsxRuntime.jsx(Checkbox__default$1["default"], {
+      children: /*#__PURE__*/jsxRuntime.jsx(Checkbox$1, {
         id: "multipleFilesAllowed",
         label: t("neetoForm.fileUpload.enableMultipleFilesUpload"),
         name: "multipleFilesAllowed"
       })
     }), /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex flex-col space-y-3",
-      children: [/*#__PURE__*/jsxRuntime.jsx(Typography__default["default"], {
+      children: [/*#__PURE__*/jsxRuntime.jsx(Typography, {
         style: "body1",
         weight: "semibold",
         children: t("neetoForm.fileUpload.fileTypes")
@@ -1688,7 +1707,7 @@ var FileUpload = function FileUpload() {
 };
 
 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__default["default"](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 _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(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; }
 var defaultConfig = {
   strict: true,
   matchKey: "value"
@@ -1725,7 +1744,7 @@ var filterOptionsByValues = function filterOptionsByValues() {
 var destroyFromList = function destroyFromList(items, index) {
   var itemToRemove = items[index];
   if (itemToRemove) {
-    var nextItems = _toConsumableArray__default["default"](items);
+    var nextItems = _toConsumableArray(items);
     nextItems.splice(index, 1);
     if (itemToRemove.id) {
       nextItems.push(_objectSpread$5(_objectSpread$5({}, itemToRemove), {}, {
@@ -1737,12 +1756,12 @@ var destroyFromList = function destroyFromList(items, index) {
   return items;
 };
 var insertToList = function insertToList(items, item, index) {
-  var nextItems = _toConsumableArray__default["default"](items !== null && items !== void 0 ? items : []);
+  var nextItems = _toConsumableArray(items !== null && items !== void 0 ? items : []);
   nextItems.splice(index, 0, item);
   return nextItems;
 };
 var pushToList = function pushToList(items, item) {
-  var nextItems = _toConsumableArray__default["default"](items !== null && items !== void 0 ? items : []);
+  var nextItems = _toConsumableArray(items !== null && items !== void 0 ? items : []);
   nextItems.push(item);
   return nextItems;
 };
@@ -1755,7 +1774,7 @@ var formHelpers = {
 };
 
 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__default["default"](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; }
+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(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 Options = function Options(_ref) {
   var questionProps = _ref.questionProps;
   var _useTranslation = reactI18next.useTranslation(),
@@ -1768,7 +1787,7 @@ var Options = function Options(_ref) {
     }, shallow.shallow),
     selectedLanguage = _useBuildFormStore.selectedLanguage;
   var _useField = formik.useField("optionsAttributes"),
-    _useField2 = _slicedToArray__default["default"](_useField, 3),
+    _useField2 = _slicedToArray(_useField, 3),
     optionsAttributes = _useField2[0].value;
     _useField2[1];
     var setOptionsAttributes = _useField2[2].setValue;
@@ -1795,7 +1814,7 @@ var Options = function Options(_ref) {
       children: function children(_ref3) {
         var handlePush = _ref3.handlePush;
         return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(Label__default["default"], _objectSpread$4(_objectSpread$4({
+          children: [/*#__PURE__*/jsxRuntime.jsx(Label, _objectSpread$4(_objectSpread$4({
             className: "mb-1 block"
           }, optionLabelProps), {}, {
             children: t("neetoForm.questions.common.questionFields.field.options")
@@ -1813,12 +1832,12 @@ var Options = function Options(_ref) {
                   placeholder: t("neetoForm.questions.common.questionFields.field.numberedOption", {
                     number: index + 1
                   })
-                }), !isRemoveOptionDisabled && /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+                }), !isRemoveOptionDisabled && /*#__PURE__*/jsxRuntime.jsx(Button, {
                   "data-cy": "neeto-form-engine-delete-option-button",
-                  icon: Delete__default["default"],
+                  icon: Delete,
                   size: "small",
                   style: "text",
-                  className: classnames__default["default"]({
+                  className: classnames({
                     invisible: index < constants.MINIMUM_OPTIONS
                   }),
                   tooltipProps: {
@@ -1833,9 +1852,9 @@ var Options = function Options(_ref) {
             })
           }), !isAddOptionDisabled && /*#__PURE__*/jsxRuntime.jsx("div", {
             className: "mt-3 w-full",
-            children: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], {
+            children: /*#__PURE__*/jsxRuntime.jsx(Button, {
               "data-cy": "neeto-form-engine-add-option-button",
-              icon: Plus__default["default"],
+              icon: Plus,
               iconPosition: "left",
               size: "small",
               style: "text",
@@ -1890,14 +1909,14 @@ var StarRating = function StarRating() {
   var _useFormikContext = formik.useFormikContext(),
     setFieldValue = _useFormikContext.setFieldValue;
   var _useField = formik.useField("iconType"),
-    _useField2 = _slicedToArray__default["default"](_useField, 3),
+    _useField2 = _slicedToArray(_useField, 3),
     iconType = _useField2[0].value;
     _useField2[1];
     var setIconType = _useField2[2].setValue;
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex space-x-4",
-      children: [/*#__PURE__*/jsxRuntime.jsx(Select__default["default"], {
+      children: [/*#__PURE__*/jsxRuntime.jsx(Select, {
         className: "w-1/2",
         "data-cy": "neeto-form-engine-star-rating-min-value",
         label: t("neetoForm.common.start"),
@@ -1906,7 +1925,7 @@ var StarRating = function StarRating() {
         onChange: function onChange(option) {
           return setFieldValue("minValue", option === null || option === void 0 ? void 0 : option.value);
         }
-      }), /*#__PURE__*/jsxRuntime.jsx(Select__default["default"], {
+      }), /*#__PURE__*/jsxRuntime.jsx(Select, {
         className: "w-1/2",
         "data-cy": "neeto-form-engine-star-rating-max-value",
         label: t("neetoForm.common.end"),
@@ -1916,18 +1935,18 @@ var StarRating = function StarRating() {
           return setFieldValue("maxValue", option === null || option === void 0 ? void 0 : option.value);
         }
       })]
-    }), /*#__PURE__*/jsxRuntime.jsx(Label__default["default"], {
+    }), /*#__PURE__*/jsxRuntime.jsx(Label, {
       children: t("neetoForm.common.shape")
     }), /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "flex gap-2",
       children: Object.entries(constants.STAR_RATING_ICONS_MAP).map(function (_ref) {
-        var _ref2 = _slicedToArray__default["default"](_ref, 2),
+        var _ref2 = _slicedToArray(_ref, 2),
           name = _ref2[0],
           IconType = _ref2[1];
         var isActive = name === iconType;
         return /*#__PURE__*/jsxRuntime.jsx("div", {
           "data-cy": "neeto-form-engine-rating-icon-".concat(name),
-          className: classnames__default["default"]("flex h-10 w-10 items-center justify-center gap-2", "neeto-ui-border-gray-800 neeto-ui-rounded-full cursor-pointer border", "transition-all duration-300 ease-in-out", {
+          className: classnames("flex h-10 w-10 items-center justify-center gap-2", "neeto-ui-border-gray-800 neeto-ui-rounded-full cursor-pointer border", "transition-all duration-300 ease-in-out", {
             "neeto-ui-text-gray-800 neeto-ui-bg-gray-200": !isActive,
             "neeto-ui-text-white neeto-ui-bg-gray-800": isActive
           }),
@@ -2025,17 +2044,17 @@ var hideSwitchLabelProps = function hideSwitchLabelProps(helpUrl) {
 
 var _excluded$1 = ["isOpen", "onClose", "action", "question", "availableQuestionKinds"];
 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__default["default"](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 _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(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 ManageQuestionPane = function ManageQuestionPane(_ref) {
   var isOpen = _ref.isOpen,
     onClose = _ref.onClose,
     action = _ref.action,
     question = _ref.question,
     availableQuestionKinds = _ref.availableQuestionKinds,
-    props = _objectWithoutProperties__default["default"](_ref, _excluded$1);
+    props = _objectWithoutProperties(_ref, _excluded$1);
   var initialFocusRef = React.useRef(null);
   var Component = resolveActionComponent(action);
-  return /*#__PURE__*/jsxRuntime.jsx(Pane__default["default"], {
+  return /*#__PURE__*/jsxRuntime.jsx(Pane, {
     initialFocusRef: initialFocusRef,
     isOpen: isOpen,
     onClose: onClose,
@@ -2050,22 +2069,22 @@ var ManageQuestionPane = function ManageQuestionPane(_ref) {
 };
 
 function ownKeys$2(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$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var AddQuestion = function AddQuestion(_ref) {
   var onAdd = _ref.onAdd,
     disabledAddButtonTooltipProps = _ref.disabledAddButtonTooltipProps,
     isDisabled = _ref.isDisabled;
   var tooltipProps = buildDisabledAddButtonTooltipProps(isDisabled, disabledAddButtonTooltipProps);
-  return /*#__PURE__*/jsxRuntime.jsx(Tooltip__default["default"], _objectSpread$2(_objectSpread$2({}, tooltipProps), {}, {
+  return /*#__PURE__*/jsxRuntime.jsx(Tooltip, _objectSpread$2(_objectSpread$2({}, tooltipProps), {}, {
     children: /*#__PURE__*/jsxRuntime.jsx("span", {
-      children: /*#__PURE__*/jsxRuntime.jsx(Button__default["default"], _objectSpread$2({}, buildAddQuestionButtonProps(onAdd, isDisabled)))
+      children: /*#__PURE__*/jsxRuntime.jsx(Button, _objectSpread$2({}, buildAddQuestionButtonProps(onAdd, isDisabled)))
     })
   }));
 };
 
-var _excluded = ["questionKinds", "onValueChange", "formId", "isDeletable", "isRequiredField", "submitButtonProps", "cancelButtonProps", "isKindAlreadyActive", "getActiveKindDetails", "isDisabledFieldLabel", "disabledAddButtonTooltipProps", "enableFieldCode", "isFormEnabled", "savedTitle", "formTitle", "formDescription", "selectedLanguage", "availableLanguages", "onLanguageChange", "additionalActionOptions", "isReordering", "additionalQuestionKindPattern", "showActionBlock", "buildRequestArgs", "enableDomainBlacklisting", "enableDomainWhitelisting", "helpDocUrls"];
+var _excluded = ["questionKinds", "onValueChange", "formId", "isDeletable", "isRequiredField", "submitButtonProps", "cancelButtonProps", "isKindAlreadyActive", "getActiveKindDetails", "isDisabledFieldLabel", "disabledAddButtonTooltipProps", "enableFieldCode", "isFormEnabled", "savedTitle", "formTitle", "formDescription", "selectedLanguage", "availableLanguages", "onLanguageChange", "additionalActionOptions", "isReordering", "additionalQuestionKindPattern", "showActionBlock", "buildRequestArgs", "enableDomainBlacklisting", "enableDomainWhitelisting", "helpDocUrls", "questionsHelpProps"];
 function ownKeys$1(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$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Form = function Form(_ref) {
   var questionKinds = _ref.questionKinds,
     onValueChange = _ref.onValueChange,
@@ -2094,25 +2113,26 @@ var Form = function Form(_ref) {
     enableDomainBlacklisting = _ref.enableDomainBlacklisting,
     enableDomainWhitelisting = _ref.enableDomainWhitelisting,
     helpDocUrls = _ref.helpDocUrls,
-    formDomProps = _objectWithoutProperties__default["default"](_ref, _excluded);
+    questionsHelpProps = _ref.questionsHelpProps,
+    formDomProps = _objectWithoutProperties(_ref, _excluded);
   var containerRef = React.useRef();
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var formikContext = formik.useFormikContext();
   var _useState = React.useState(null),
-    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    _useState2 = _slicedToArray(_useState, 2),
     selectedQuestion = _useState2[0],
     setSelectedQuestion = _useState2[1];
   var _useState3 = React.useState(""),
-    _useState4 = _slicedToArray__default["default"](_useState3, 2),
+    _useState4 = _slicedToArray(_useState3, 2),
     selectedAction = _useState4[0],
     setSelectedAction = _useState4[1];
   var _useState5 = React.useState(false),
-    _useState6 = _slicedToArray__default["default"](_useState5, 2),
+    _useState6 = _slicedToArray(_useState5, 2),
     isDeleteAlertOpen = _useState6[0],
     setIsDeleteAlertOpen = _useState6[1];
   var _useState7 = React.useState(false),
-    _useState8 = _slicedToArray__default["default"](_useState7, 2),
+    _useState8 = _slicedToArray(_useState7, 2),
     isManageQuestionPaneOpen = _useState8[0],
     setIsManageQuestionPaneOpen = _useState8[1];
   var values = formikContext.values,
@@ -2224,7 +2244,7 @@ var Form = function Form(_ref) {
         return setIsDeleteAlertOpen(false);
       }
     }), /*#__PURE__*/jsxRuntime.jsxs(formik.Form, _objectSpread$1(_objectSpread$1({
-      className: "flex flex-col h-full neeto-form-nano-form-wrapper"
+      className: "neeto-form-nano-form-wrapper flex h-full flex-col"
     }, formDomProps), {}, {
       noValidate: true,
       children: [formTitle && /*#__PURE__*/jsxRuntime.jsx(Overview, {
@@ -2235,7 +2255,7 @@ var Form = function Form(_ref) {
         title: formTitle,
         onLanguageChange: handleLanguageChange
       }), /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "flex-grow w-full min-h-0 pb-6 space-y-6 overflow-y-auto neeto-form-nano-form-wrapper__body md:px-6",
+        className: "neeto-form-nano-form-wrapper__body min-h-0 w-full flex-grow space-y-6 overflow-y-auto pb-6 md:px-6",
         children: hasActiveQuestions ? /*#__PURE__*/jsxRuntime.jsxs("div", {
           className: "space-y-6",
           ref: containerRef,
@@ -2261,13 +2281,15 @@ var Form = function Form(_ref) {
               onEdit: handleEdit,
               onSelect: handleSelect
             })
-          }), /*#__PURE__*/jsxRuntime.jsx("div", {
-            className: "w-full mb-8",
-            children: /*#__PURE__*/jsxRuntime.jsx(AddQuestion, {
+          }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+            className: "mb-8 flex w-full items-center gap-x-1",
+            children: [/*#__PURE__*/jsxRuntime.jsx(AddQuestion, {
               disabledAddButtonTooltipProps: disabledAddButtonTooltipProps,
               isDisabled: ramda.isEmpty(availableQuestionKinds),
               onAdd: handleAdd
-            })
+            }), neetoCist.isPresent(questionsHelpProps) && /*#__PURE__*/jsxRuntime.jsx("span", {
+              children: /*#__PURE__*/jsxRuntime.jsx(HelpPopover, _objectSpread$1({}, questionsHelpProps))
+            })]
           })]
         }) : /*#__PURE__*/jsxRuntime.jsx(AddFirstQuestion, {
           disabledAddButtonTooltipProps: disabledAddButtonTooltipProps,
@@ -2275,8 +2297,8 @@ var Form = function Form(_ref) {
           onAdd: handleAdd
         })
       }), (showActionBlock || dirty) && /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: "sticky bottom-0 flex justify-end flex-shrink-0 px-6 py-4 border-t neeto-ui-border-gray-300 neeto-form-nano-form-wrapper__footer neeto-ui-bg-white",
-        children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock__default["default"], {
+        className: "neeto-ui-border-gray-300 neeto-form-nano-form-wrapper__footer neeto-ui-bg-white sticky bottom-0 flex flex-shrink-0 justify-end border-t px-6 py-4",
+        children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock, {
           submitButtonProps: submitButtonProps,
           isSubmitting: isReordering,
           cancelButtonProps: _objectSpread$1({
@@ -2307,7 +2329,7 @@ var Form = function Form(_ref) {
 };
 
 function 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; }
-function _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__default["default"](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; }
+function _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; }
 var BuildForm = function BuildForm(_ref) {
   var id = _ref.id,
     onUpdate = _ref.onUpdate,
@@ -2355,7 +2377,9 @@ var BuildForm = function BuildForm(_ref) {
     _ref$enableDomainWhit = _ref.enableDomainWhitelisting,
     enableDomainWhitelisting = _ref$enableDomainWhit === void 0 ? true : _ref$enableDomainWhit,
     helpDocUrls = _ref.helpDocUrls,
-    className = _ref.className;
+    className = _ref.className,
+    _ref$questionsHelpPro = _ref.questionsHelpProps,
+    questionsHelpProps = _ref$questionsHelpPro === void 0 ? {} : _ref$questionsHelpPro;
   var queryClient = reactQuery.useQueryClient();
   var _useReorderQuestions = useFormApi.useReorderQuestions(id, {
       onSuccess: utils.showThumbsUpToastr
@@ -2382,7 +2406,7 @@ var BuildForm = function BuildForm(_ref) {
   if (isLoading || showLoader && isQuestionsLoading && !isQuestionsPending) {
     return /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "flex h-full w-full items-center justify-center py-6",
-      children: /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {})
+      children: /*#__PURE__*/jsxRuntime.jsx(PageLoader, {})
     });
   }
   var handleSubmit = function handleSubmit(_ref3, _ref4) {
@@ -2420,7 +2444,7 @@ var BuildForm = function BuildForm(_ref) {
     type: constants$1.QUESTION_KIND.ADDITIONAL_GUESTS.value
   }, constants.QUESTION_KINDS);
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
-    className: classnames__default["default"]("neeto-form-nano-form-outer-wrapper relative", className),
+    className: classnames("neeto-form-nano-form-outer-wrapper relative", className),
     children: [/*#__PURE__*/jsxRuntime.jsx(formik.Formik, {
       enableReinitialize: true,
       initialValues: {
@@ -2453,6 +2477,7 @@ var BuildForm = function BuildForm(_ref) {
           kindUniqueOn: kindUniqueOn,
           onLanguageChange: onLanguageChange,
           onValueChange: onValueChange,
+          questionsHelpProps: questionsHelpProps,
           savedTitle: savedTitle,
           selectedLanguage: selectedLanguage,
           showActionBlock: showActionBlock,
@@ -2468,7 +2493,7 @@ var BuildForm = function BuildForm(_ref) {
       }
     }), isQuestionsLoading && !isQuestionsPending && /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "neeto-ui-bg-white absolute inset-0 flex items-center justify-center",
-      children: /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {})
+      children: /*#__PURE__*/jsxRuntime.jsx(PageLoader, {})
     })]
   });
 };