@bigbinary/neeto-form-frontend 4.4.9 → 4.4.10

package/dist/BuildForm.js

@@ -0,0 +1,3077 @@
+import { useQueryClient } from '@tanstack/react-query';
+import classnames from 'classnames';
+import { isPresent, truncate, findBy, isNotPresent, slugify, existsBy, findById, findIndexById, hyphenate, noop, nullSafe, modifyBy, removeBy } from '@bigbinary/neeto-cist';
+import Spinner from '@bigbinary/neetoui/Spinner';
+import { equals, path, when, assoc, includes, isEmpty, reject, keys, pick, omit, evolve, map, mergeLeft, isNil, pipe, filter, isNotNil, values, uniq, join, pathSatisfies, assocPath, dissoc, append, pluck, test, paths, difference, prop, startsWith, split, last, either, F, T } from 'ramda';
+import { k as useDeleteQuestion, Q as QUESTION_TYPES, b as useForm, l as useCreateQuestion, m as useUpdateQuestion, C as CAPTCHA_TYPES, n as useReorderQuestions, i as QUERY_KEYS } from './constants-Cj0XxE8a.js';
+import { j as QUESTION_ACTIONS, k as INDEPENDENT_LABELS_MAP, l as buildDisplayLabel, m as isElementOverflowing, n as Drag, o as SELECTABLE_KINDS, p as isAutoGeneratedQuestion, q as isRichTextQuestion, r as SPOT_QUESTION_FIELD_CODE, N as NON_BASIC_LATIN_CHARACTERS_REGEX, s as RESERVED_FIELD_CODES, t as renameKey, f as LABEL_FIELDS, u as isDefaultLanguage, v as buildAddQuestionButtonProps, w as validateEditorContent, F as FIELD_CODES_REJECT_CHARS_REGEX, x as isImmutableField, Q as QUESTIONS_WITHOUT_FIELD_CODE, y as NON_HIDEABLE_FIELDS, z as NON_READ_ONLY_FIELDS, O as OPINION_LABEL_MAX_LENGTH, B as RICH_TEXT_QUESTIONS, e as ADDRESS_FIELD_WIDTHS, A as ADDRESS_FIELD_TYPES, G as generateDefaultOptions, M as MINIMUM_ADDRESS_FIELDS, H as getDeletedRecords, J as randomId, K as getActiveRecords, T as FILE_TYPES_MAP, U as FILE_GROUPS, V as OPINION_SCALE_MIN_VALUE_OPTIONS, W as OPINION_SCALE_MAX_VALUE_OPTIONS, D as DEFAULT_CHOICE_QUESTION_ATTRIBUTES, X as MINIMUM_OPTIONS, Y as IMAGE_HEIGHT_SLIDER_DEFAULTS, Z as RATING_OPTIONS, _ as STAR_RATING_MIN_VALUE_OPTIONS, $ as STAR_RATING_MAX_VALUE_OPTIONS, a0 as STAR_RATING_ICONS_MAP, a1 as buildDisabledAddButtonHelpPopoverProps, a2 as buildReorderPayload, a3 as QUESTIONS_INITIAL_VALUE, a4 as isMandatoryField, a5 as QUESTION_KINDS, a as QUESTION_KIND, a6 as getActiveQuestionKindDetails, a7 as DEFAULT_AVAILABLE_LANGUAGES, a8 as DEFAULT_ADVANCED_FEATURES } from './yup-CSYHMEsr.js';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { useState, useRef, useEffect, createElement } from 'react';
+import { Droppable, Draggable, DragDropContext } from '@hello-pangea/dnd';
+import { withT, isMetaKeyPressed, useStateWithDependency, useFuncDebounce, useOnClickOutside } from '@bigbinary/neeto-commons-frontend/react-utils';
+import { showThumbsUpToastr, withEventTargetValue, hyphenize } from '@bigbinary/neeto-commons-frontend/utils';
+import { a as useBuildFormStore } from './buildForm-CrOWLvLE.js';
+import { shallow } from 'zustand/shallow';
+import Alert from '@bigbinary/neetoui/Alert';
+import { useTranslation, Trans } from 'react-i18next';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import Typography from '@bigbinary/neetoui/Typography';
+import Modal from '@bigbinary/neetoui/Modal';
+import MoreDropdown from '@bigbinary/neeto-molecules/MoreDropdown';
+import Dropdown from '@bigbinary/neetoui/Dropdown';
+import Tooltip from '@bigbinary/neetoui/Tooltip';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import { i as isFunction, f as fieldWithFallback, c as isNameQuestion } from './index-DhtQJpD_.js';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import { t } from 'i18next';
+import { v4 } from 'uuid';
+import NoData from '@bigbinary/neetoui/NoData';
+import Button from '@bigbinary/neetoui/Button';
+import Pane from '@bigbinary/neetoui/Pane';
+import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
+import Form$2 from '@bigbinary/neetoui/formik/Form';
+import { useFormikContext, useField } from 'formik';
+import Accordion from '@bigbinary/neetoui/Accordion';
+import Select from '@bigbinary/neetoui/formik/Select';
+import Switch from '@bigbinary/neetoui/formik/Switch';
+import Textarea from '@bigbinary/neetoui/formik/Textarea';
+import NeetoEditor from '@bigbinary/neeto-editor/Editor';
+import Input from '@bigbinary/neetoui/formik/Input';
+import { isEditorEmpty } from '@bigbinary/neeto-editor/utils';
+import * as yup from 'yup';
+import OptionFields from '@bigbinary/neeto-molecules/OptionFields';
+import { AnimatePresence, motion } from 'framer-motion';
+import Radio from '@bigbinary/neetoui/formik/Radio';
+import Label from '@bigbinary/neetoui/Label';
+import CreatableSelect from 'react-select/creatable';
+import _toArray from '@babel/runtime/helpers/toArray';
+import Close from '@bigbinary/neeto-icons/Close';
+import Tag from '@bigbinary/neetoui/Tag';
+import { components } from 'react-select';
+import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
+import _regeneratorRuntime from '@babel/runtime/regenerator';
+import Checkbox$1 from '@bigbinary/neetoui/formik/Checkbox';
+import Checkbox from '@bigbinary/neetoui/Checkbox';
+import Slider from '@bigbinary/neetoui/Slider';
+import HelpPopover from '@bigbinary/neeto-molecules/HelpPopover';
+import '@bigbinary/neeto-commons-frontend/constants';
+import 'axios';
+import 'dompurify';
+import '@bigbinary/neeto-icons/Plus';
+import 'zustand';
+import '@babel/runtime/helpers/typeof';
+
+var DeleteAlert = function DeleteAlert(_ref) {
+  var selectedQuestion = _ref.selectedQuestion,
+    isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    languagesCount = _ref.languagesCount,
+    handleSelect = _ref.handleSelect;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2;
+      return {
+        selectedLanguage: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["selectedLanguage"],
+        onMutateSuccess: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["onMutateSuccess"]
+      };
+    }, shallow),
+    selectedLanguage = _useBuildFormStore.selectedLanguage,
+    onMutateSuccess = _useBuildFormStore.onMutateSuccess;
+  var renderQuestionLabel = function renderQuestionLabel() {
+    var questionKind = selectedQuestion.kind;
+    var independentLabel = INDEPENDENT_LABELS_MAP[questionKind];
+    if (isPresent(independentLabel)) return independentLabel;
+    var questionLabel = buildDisplayLabel(selectedQuestion);
+    return truncate(questionLabel, 40);
+  };
+  var _useDeleteQuestion = useDeleteQuestion(selectedQuestion === null || selectedQuestion === void 0 ? void 0 : selectedQuestion.formId, selectedLanguage, {
+      onSuccess: function onSuccess() {
+        showThumbsUpToastr();
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        onMutateSuccess === null || onMutateSuccess === void 0 || onMutateSuccess.apply(void 0, [QUESTION_ACTIONS.DELETE].concat(args));
+        onClose();
+      }
+    }),
+    deleteQuestion = _useDeleteQuestion.mutate,
+    isDeleting = _useDeleteQuestion.isPending;
+  var selectNextQuestion = function selectNextQuestion(questions) {
+    var selectedQuestionIndex = selectedQuestion.displayOrder;
+    var wasLastQuestion = equals(selectedQuestionIndex, questions.length);
+    var newDisplayOrder = wasLastQuestion ? selectedQuestionIndex - 1 : selectedQuestionIndex;
+    var newQuestion = findBy({
+      displayOrder: newDisplayOrder
+    }, questions);
+    handleSelect(newQuestion);
+  };
+  var handleSubmit = function handleSubmit() {
+    deleteQuestion(selectedQuestion.id, {
+      onSuccess: function onSuccess(_ref2) {
+        var questions = _ref2.questions;
+        return selectNextQuestion(questions);
+      }
+    });
+  };
+  return /*#__PURE__*/jsx(Alert, {
+    isOpen: isOpen,
+    onClose: onClose,
+    isSubmitting: isDeleting,
+    submitButtonLabel: t("neetoForm.common.delete"),
+    title: t("neetoForm.questions.deleteAlert.title"),
+    message: isPresent(selectedQuestion) && /*#__PURE__*/jsx(Trans, {
+      i18nKey: "neetoForm.questions.deleteAlert.message",
+      values: {
+        count: languagesCount,
+        label: renderQuestionLabel()
+      }
+    }),
+    onSubmit: handleSubmit
+  });
+};
+
+var DeleteSmsReminderModal = function DeleteSmsReminderModal(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    _ref$hostSpecificData = _ref.hostSpecificData,
+    hostSpecificData = _ref$hostSpecificData === void 0 ? {} : _ref$hostSpecificData;
+  return /*#__PURE__*/jsxs(Modal, {
+    isOpen: isOpen,
+    onClose: onClose,
+    children: [/*#__PURE__*/jsx(Modal.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "delete-sms-reminder-modal-header",
+        style: "h2",
+        weight: "medium",
+        children: path(["smsReminder", "deleteModal", "title"], hostSpecificData)
+      })
+    }), /*#__PURE__*/jsx(Modal.Body, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "delete-sms-reminder-modal-description",
+        style: "body2",
+        children: path(["smsReminder", "deleteModal", "description"], hostSpecificData)
+      })
+    })]
+  });
+};
+
+var DeleteSpotModal = function DeleteSpotModal(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    _ref$hostSpecificData = _ref.hostSpecificData,
+    hostSpecificData = _ref$hostSpecificData === void 0 ? {} : _ref$hostSpecificData;
+  var title = path(["spot", "deleteModal", "title"], hostSpecificData);
+  var description = path(["spot", "deleteModal", "description"], hostSpecificData);
+  return /*#__PURE__*/jsxs(Modal, {
+    isOpen: isOpen,
+    onClose: onClose,
+    children: [/*#__PURE__*/jsx(Modal.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "delete-spot-modal-header",
+        style: "h2",
+        weight: "medium",
+        children: title
+      })
+    }), /*#__PURE__*/jsx(Modal.Body, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "delete-spot-modal-description",
+        style: "body2",
+        children: description
+      })
+    })]
+  });
+};
+
+var ChangeLanguageDropdown = function ChangeLanguageDropdown(_ref) {
+  var _findBy;
+  var availableLanguages = _ref.availableLanguages;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2, _store$formState3;
+      return {
+        selectedLanguage: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["selectedLanguage"],
+        onLanguageChange: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["onLanguageChange"],
+        isReorderingQuestions: (_store$formState3 = store["formState"]) === null || _store$formState3 === void 0 ? void 0 : _store$formState3["isReorderingQuestions"]
+      };
+    }, shallow),
+    selectedLanguage = _useBuildFormStore.selectedLanguage,
+    onLanguageChange = _useBuildFormStore.onLanguageChange,
+    isReorderingQuestions = _useBuildFormStore.isReorderingQuestions;
+  var selectedLanguageName = (_findBy = findBy({
+    code: selectedLanguage
+  }, availableLanguages)) === null || _findBy === void 0 ? void 0 : _findBy.name;
+  return /*#__PURE__*/jsx(Tooltip, {
+    content: t("neetoForm.questions.changeLanguage"),
+    children: /*#__PURE__*/jsx("div", {
+      children: /*#__PURE__*/jsx(Dropdown, {
+        buttonStyle: "secondary",
+        disabled: isReorderingQuestions,
+        label: selectedLanguageName,
+        children: /*#__PURE__*/jsx(Dropdown.Menu, {
+          children: availableLanguages.map(function (_ref2) {
+            var code = _ref2.code,
+              name = _ref2.name;
+            return /*#__PURE__*/jsx(Dropdown.MenuItem.Button, {
+              isActive: selectedLanguage === code,
+              onClick: function onClick() {
+                return onLanguageChange(code);
+              },
+              children: name
+            }, code);
+          })
+        })
+      })
+    })
+  });
+};
+
+var Overview = function Overview(_ref) {
+  var title = _ref.title,
+    description = _ref.description,
+    availableLanguages = _ref.availableLanguages,
+    additionalActionOptions = _ref.additionalActionOptions;
+  return /*#__PURE__*/jsxs("div", {
+    className: "neeto-form-nano-form-wrapper__overview mb-4 w-full shrink-0 space-y-4 pt-6",
+    children: [/*#__PURE__*/jsxs("div", {
+      className: "flex items-center justify-between",
+      children: [/*#__PURE__*/jsx(Typography, {
+        "data-testid": "neeto-form-engine-overview-title",
+        lineHeight: "neeto-ui-leading-normal",
+        style: "h2",
+        weight: "neeto-ui-font-semibold",
+        children: title
+      }), /*#__PURE__*/jsxs("div", {
+        className: "flex shrink-0 items-center justify-between space-x-1",
+        children: [availableLanguages.length > 1 && /*#__PURE__*/jsx(ChangeLanguageDropdown, {
+          availableLanguages: availableLanguages
+        }), isPresent(additionalActionOptions) && /*#__PURE__*/jsx(MoreDropdown, {
+          dropdownButtonProps: {
+            isRounded: true,
+            style: "tertiary"
+          },
+          dropdownProps: {
+            strategy: "fixed",
+            position: "bottom-start"
+          },
+          menuItems: additionalActionOptions
+        })]
+      })]
+    }), /*#__PURE__*/jsx(Typography, {
+      "data-testid": "neeto-form-engine-overview-description",
+      style: "body2",
+      children: description
+    })]
+  });
+};
+
+var Card = function Card(_ref) {
+  var _ref$question = _ref.question,
+    question = _ref$question === void 0 ? {} : _ref$question,
+    allQuestionKinds = _ref.allQuestionKinds,
+    getActiveKindDetails = _ref.getActiveKindDetails,
+    isActive = _ref.isActive,
+    onSelect = _ref.onSelect,
+    onEdit = _ref.onEdit,
+    onClone = _ref.onClone,
+    onDelete = _ref.onDelete,
+    canManageQuestions = _ref.canManageQuestions;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isTooltipEnabled = _useState2[0],
+    setIsTooltipEnabled = _useState2[1];
+  var questionLabelRef = useRef(null);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _getActiveKindDetails = getActiveKindDetails({
+      allQuestionKinds: allQuestionKinds,
+      item: question
+    }),
+    isSingular = _getActiveKindDetails.isSingular;
+  var questionLabel = buildDisplayLabel(question);
+  useEffect(function () {
+    var element = questionLabelRef.current;
+    if (isNotPresent(element)) return;
+    setIsTooltipEnabled(isElementOverflowing(element));
+  }, [questionLabel]);
+  return /*#__PURE__*/jsxs("div", {
+    "data-testid": "neeto-form-engine-".concat(slugify(questionLabel)),
+    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() {
+      return onSelect(question);
+    },
+    children: [/*#__PURE__*/jsxs("div", {
+      className: "flex min-w-0 grow items-center gap-1",
+      children: [canManageQuestions && /*#__PURE__*/jsx(Drag, {
+        className: "neeto-ui-text-gray-600 shrink-0"
+      }), /*#__PURE__*/jsx(Tooltip, {
+        content: questionLabel,
+        disabled: !isTooltipEnabled,
+        position: "top",
+        children: /*#__PURE__*/jsx(Typography, {
+          className: "line-clamp-2 min-w-0 grow truncate break-words",
+          "data-testid": "".concat(slugify(questionLabel), "-question-card-label"),
+          lineHeight: "snug",
+          ref: questionLabelRef,
+          style: "body2",
+          weight: "medium",
+          children: questionLabel
+        })
+      })]
+    }), canManageQuestions && /*#__PURE__*/jsx(MoreDropdown, {
+      dropdownButtonProps: {
+        className: "shrink-0"
+      },
+      dropdownProps: {
+        strategy: "fixed"
+      },
+      menuItems: [{
+        "data-testid": "edit-question",
+        key: "edit",
+        label: t("neetoForm.common.edit"),
+        onClick: onEdit
+      }, {
+        "data-testid": "clone-question",
+        key: "clone",
+        label: t("neetoForm.common.clone"),
+        isVisible: !isSingular && isFunction(onClone),
+        onClick: onClone
+      }, {
+        "data-testid": "delete-question",
+        key: "delete",
+        label: t("neetoForm.common.delete"),
+        isVisible: isFunction(onDelete),
+        onClick: function onClick() {
+          return onDelete(question);
+        }
+      }]
+    })]
+  });
+};
+
+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), true).forEach(function (r) { _defineProperty(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 Questions = function Questions(_ref) {
+  var questions = _ref.questions,
+    isDeletable = _ref.isDeletable,
+    allQuestionKinds = _ref.allQuestionKinds,
+    getActiveKindDetails = _ref.getActiveKindDetails,
+    selectedQuestion = _ref.selectedQuestion,
+    onEdit = _ref.onEdit,
+    onClone = _ref.onClone,
+    onDelete = _ref.onDelete,
+    onSelect = _ref.onSelect,
+    canManageQuestions = _ref.canManageQuestions;
+  return /*#__PURE__*/jsx(Droppable, {
+    droppableId: "droppable",
+    isDropDisabled: !canManageQuestions,
+    children: function children(_ref2) {
+      var droppableProps = _ref2.droppableProps,
+        placeholder = _ref2.placeholder,
+        innerRef = _ref2.innerRef;
+      return /*#__PURE__*/jsxs("div", _objectSpread$i(_objectSpread$i({}, droppableProps), {}, {
+        className: "space-y-2",
+        ref: innerRef,
+        children: [questions.map(function (question, index) {
+          var _question$id, _question$id2;
+          return /*#__PURE__*/createElement(Draggable, {
+            index: index,
+            draggableId: "question-".concat((_question$id = question.id) !== null && _question$id !== void 0 ? _question$id : question.nodeId),
+            isDragDisabled: !canManageQuestions,
+            key: "question-".concat((_question$id2 = question.id) !== null && _question$id2 !== void 0 ? _question$id2 : question.nodeId)
+          }, function (_ref3) {
+            var draggableProps = _ref3.draggableProps,
+              dragHandleProps = _ref3.dragHandleProps,
+              innerRef = _ref3.innerRef;
+            return /*#__PURE__*/jsx("div", _objectSpread$i(_objectSpread$i(_objectSpread$i({}, draggableProps), dragHandleProps), {}, {
+              ref: innerRef,
+              children: /*#__PURE__*/jsx(Card, {
+                allQuestionKinds: allQuestionKinds,
+                canManageQuestions: canManageQuestions,
+                getActiveKindDetails: getActiveKindDetails,
+                onClone: onClone,
+                onEdit: onEdit,
+                onSelect: onSelect,
+                question: question,
+                isActive: equals(selectedQuestion, question),
+                onDelete: isDeletable(question) && onDelete
+              })
+            }));
+          });
+        }), placeholder]
+      }));
+    }
+  });
+};
+
+var moveItem = function moveItem(arr, sourceIndex, destinationIndex) {
+  if (sourceIndex === destinationIndex) return arr;
+  if (arr instanceof Array && arr[sourceIndex] !== undefined) {
+    var removedItem = arr.splice(sourceIndex, 1)[0];
+    arr.splice(destinationIndex, 0, removedItem);
+  }
+  return arr;
+};
+var arrayHelpers = {
+  moveItem: moveItem
+};
+
+var _excluded$b = ["fields"];
+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), true).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 isChoiceQuestion = function isChoiceQuestion(question) {
+  return includes(question === null || question === void 0 ? void 0 : question.kind, SELECTABLE_KINDS);
+};
+var isAddressQuestion = function isAddressQuestion(question) {
+  return (question === null || question === void 0 ? void 0 : question.kind) === QUESTION_TYPES.ADDRESS;
+};
+var underscoredWithoutSpecialCharacters = function underscoredWithoutSpecialCharacters(string) {
+  return string.toLowerCase().replace(/[\s-]/g, "_").replace(/[\W]/gi, "").replace(/_+/g, "_").replace(/^_+|_+$/, "");
+};
+var addSuffixForReservedFieldCode = function addSuffixForReservedFieldCode(fieldCode) {
+  return 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) {
+  if (kind === QUESTION_TYPES.SPOT) {
+    return SPOT_QUESTION_FIELD_CODE;
+  }
+  var prefix;
+  if (isNameQuestion(kind) || NON_BASIC_LATIN_CHARACTERS_REGEX.test(label) || isEmpty(label)) {
+    prefix = kind;
+  } else {
+    var sanitizedLabel = underscoredWithoutSpecialCharacters(label).slice(0, 30);
+    prefix = isEmpty(sanitizedLabel) ? kind : sanitizedLabel;
+  }
+  return addSuffixForReservedFieldCode(prefix) || "";
+};
+var modifyDefaultValues = function modifyDefaultValues(_ref) {
+  var values = _ref.values,
+    kind = _ref.kind,
+    selectedLanguage = _ref.selectedLanguage,
+    isUsingDefaultQuestionKinds = _ref.isUsingDefaultQuestionKinds;
+  if (isNameQuestion(kind)) {
+    return renameKey(LABEL_FIELDS.DEFAULT, LABEL_FIELDS.FULL_NAME, values);
+  }
+  if (!includes(kind, SELECTABLE_KINDS) || isDefaultLanguage(selectedLanguage) || !isUsingDefaultQuestionKinds) {
+    return values;
+  }
+  return evolve({
+    optionsAttributes: map(assoc("label", ""))
+  }, values);
+};
+var generateUniqueFieldCode = function generateUniqueFieldCode(_ref2) {
+  var questions = _ref2.questions,
+    _ref2$label = _ref2.label,
+    label = _ref2$label === void 0 ? "" : _ref2$label,
+    _ref2$kind = _ref2.kind,
+    kind = _ref2$kind === void 0 ? "" : _ref2$kind;
+  var prefix = generateFieldCodePrefix(label, kind);
+  var uniqueNumber = Math.max.apply(Math, [0].concat(_toConsumableArray(getUniqueNumbersFromExistingFieldCodes(prefix, questions))));
+  var candidateFieldCode = "";
+
+  //We need to continue this while loop until we can generate a unique fieldCode
+
+  while (true) {
+    candidateFieldCode = "".concat(prefix).concat(uniqueNumber === 0 ? "" : uniqueNumber);
+    if (!findBy({
+      fieldCode: candidateFieldCode
+    }, questions)) break;
+    uniqueNumber += 1;
+  }
+  return candidateFieldCode;
+};
+var isQuestionKindAlreadyActive = function isQuestionKindAlreadyActive(_ref3) {
+  var activeQuestions = _ref3.activeQuestions,
+    kind = _ref3.kind;
+  return existsBy({
+    kind: kind.type
+  }, activeQuestions);
+};
+var handleFieldDragEnd = function handleFieldDragEnd(_ref4) {
+  var items = _ref4.items,
+    setValue = _ref4.setValue,
+    source = _ref4.source,
+    destination = _ref4.destination;
+  if (!(destination && items instanceof Array)) return;
+  var nextItems = _toConsumableArray(items);
+  arrayHelpers.moveItem(nextItems, source.index, destination.index);
+  var orderedItems = nextItems.map(function (item, index) {
+    return _objectSpread$h(_objectSpread$h({}, item), {}, {
+      displayOrder: index
+    });
+  });
+  setValue(orderedItems);
+};
+var createFieldData = function createFieldData(_ref5) {
+  var _ref5$kind = _ref5.kind,
+    defaults = _ref5$kind.defaults,
+    type = _ref5$kind.type,
+    metadata = _ref5$kind.metadata,
+    _ref5$isRequired = _ref5.isRequired,
+    isRequired = _ref5$isRequired === void 0 ? undefined : _ref5$isRequired,
+    questions = _ref5.questions,
+    selectedLanguage = _ref5.selectedLanguage,
+    isUsingDefaultQuestionKinds = _ref5.isUsingDefaultQuestionKinds;
+  var modifiedDefaultValues = modifyDefaultValues({
+    values: defaults,
+    kind: type,
+    selectedLanguage: selectedLanguage,
+    isUsingDefaultQuestionKinds: isUsingDefaultQuestionKinds
+  });
+  return _objectSpread$h(_objectSpread$h({}, modifiedDefaultValues), {}, {
+    metadata: metadata,
+    isRequired: isRequired,
+    kind: type,
+    nodeId: v4(),
+    fieldCode: generateUniqueFieldCode({
+      questions: questions,
+      kind: type,
+      label: defaults["label"]
+    })
+  });
+};
+var duplicateFieldData = function duplicateFieldData(_ref6) {
+  var item = _ref6.item,
+    questionKinds = _ref6.questionKinds,
+    questions = _ref6.questions;
+  var isRequired = item.isRequired,
+    kind = item.kind,
+    optionsAttributes = item.optionsAttributes;
+  var questionKind = findBy({
+    type: kind
+  }, questionKinds);
+  var label = fieldWithFallback(item, "label");
+  var defaultAttributeNames = keys(questionKind.defaults || {});
+  var _pick = pick(defaultAttributeNames, item),
+    fields = _pick.fields,
+    defaultAttributes = _objectWithoutProperties(_pick, _excluded$b);
+  var newQuestionLabel = isRichTextQuestion(kind) ? label : t("neetoForm.common.clonedElementLabel", {
+    label: label
+  });
+  return _objectSpread$h(_objectSpread$h({}, defaultAttributes), {}, {
+    isRequired: isRequired,
+    kind: kind,
+    label: newQuestionLabel,
+    optionsAttributes: optionsAttributes && optionsAttributes.map(omit(["id"])),
+    fieldsAttributes: fields && fields.map(omit(["id"])),
+    nodeId: v4(),
+    fieldCode: generateUniqueFieldCode({
+      questions: questions,
+      kind: kind,
+      label: newQuestionLabel
+    }),
+    displayOrder: item.displayOrder + 1
+  });
+};
+var getAvailableQuestionKinds = function getAvailableQuestionKinds(_ref7) {
+  var allQuestionKinds = _ref7.allQuestionKinds,
+    _ref7$activeQuestions = _ref7.activeQuestions,
+    activeQuestions = _ref7$activeQuestions === void 0 ? [] : _ref7$activeQuestions,
+    isKindAlreadyActive = _ref7.isKindAlreadyActive;
+  if (isEmpty(activeQuestions)) return allQuestionKinds;
+  return reject(function (kind) {
+    var isSingularKind = kind.isSingular;
+    return isAutoGeneratedQuestion(kind.type) || isSingularKind && isKindAlreadyActive({
+      activeQuestions: activeQuestions,
+      kind: kind
+    });
+  }, allQuestionKinds);
+};
+var formatQuestionAttributesForClone = when(function (question) {
+  return isChoiceQuestion(question) || isAddressQuestion(question);
+}, assoc("isCloning", true));
+
+var HelpText = withT(function (_ref) {
+  var t = _ref.t,
+    href = _ref.href;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [t("neetoForm.questions.common.helpText.learnAbout"), " ", /*#__PURE__*/jsx(Button, {
+      href: href,
+      label: t("neetoForm.questions.common.helpText.howToAddNewQuestions"),
+      style: "link",
+      target: "_blank"
+    })]
+  });
+});
+
+var AddFirstQuestion = function AddFirstQuestion(_ref) {
+  var onAdd = _ref.onAdd,
+    isDisabled = _ref.isDisabled,
+    disabledAddButtonHelpPopoverProps = _ref.disabledAddButtonHelpPopoverProps;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _disabledAddButtonHel = disabledAddButtonHelpPopoverProps.helpLinkProps,
+    _disabledAddButtonHel2 = _disabledAddButtonHel === void 0 ? {} : _disabledAddButtonHel,
+    href = _disabledAddButtonHel2.href;
+  return /*#__PURE__*/jsx("div", {
+    className: "flex h-full flex-col items-center justify-center py-8",
+    children: /*#__PURE__*/jsx(NoData, {
+      className: "min-h-80",
+      helpText: isPresent(href) ? /*#__PURE__*/jsx(HelpText, {
+        href: href
+      }) : null,
+      primaryButtonProps: buildAddQuestionButtonProps(onAdd, isDisabled),
+      title: t("neetoForm.questions.common.noData")
+    })
+  });
+};
+
+var NAME = QUESTION_TYPES.NAME,
+  PHONE = QUESTION_TYPES.PHONE,
+  EMAIL$1 = QUESTION_TYPES.EMAIL,
+  ADDITIONAL_GUESTS = QUESTION_TYPES.ADDITIONAL_GUESTS,
+  TEXT = QUESTION_TYPES.TEXT,
+  TEXTAREA = QUESTION_TYPES.TEXTAREA,
+  RICH_TEXT = QUESTION_TYPES.RICH_TEXT,
+  INTEGER = QUESTION_TYPES.INTEGER,
+  DECIMAL = QUESTION_TYPES.DECIMAL,
+  STAR_RATING$1 = QUESTION_TYPES.STAR_RATING,
+  OPINION_SCALE$1 = QUESTION_TYPES.OPINION_SCALE,
+  RATING$1 = QUESTION_TYPES.RATING,
+  DATE = QUESTION_TYPES.DATE,
+  FILE_UPLOAD$1 = QUESTION_TYPES.FILE_UPLOAD,
+  CAPTCHA$1 = QUESTION_TYPES.CAPTCHA,
+  SMS_REMINDER = QUESTION_TYPES.SMS_REMINDER,
+  ADDRESS$1 = QUESTION_TYPES.ADDRESS;
+var QUESTIONS_WITH_ADDITIONAL_DATA = [].concat(_toConsumableArray(SELECTABLE_KINDS), [STAR_RATING$1, OPINION_SCALE$1, RATING$1, FILE_UPLOAD$1, CAPTCHA$1, EMAIL$1, ADDRESS$1]);
+var QUESTIONS_WITH_PLACEHOLDERS = [NAME, PHONE, EMAIL$1, ADDITIONAL_GUESTS, TEXT, TEXTAREA, RICH_TEXT, INTEGER, DECIMAL, DATE, SMS_REMINDER];
+var DEFAULT_PLACEHOLDERS = {
+  CHECKBOX: t("neetoForm.questions.common.questionFields.field.labelExample", {
+    what: t("neetoForm.common.hobbies")
+  }),
+  RADIO: t("neetoForm.questions.common.questionFields.field.labelExample", {
+    what: t("neetoForm.common.country")
+  }),
+  DROPDOWN: t("neetoForm.questions.common.questionFields.field.labelExample", {
+    what: t("neetoForm.common.company")
+  })
+};
+var INITIAL_VALUES = {
+  kind: "",
+  label: "",
+  fieldCode: "",
+  isSplitMode: false
+};
+var VALID_FIELD_CODE_REGEX = /^[a-z0-9]+(_[a-z0-9]+)*$/;
+var DRAFT_ID_PREFIX = "draft-";
+
+var useHelpDoc = function useHelpDoc(key) {
+  return useBuildFormStore(path(["formState", "helpDocUrls", key]));
+};
+
+var _excluded$a = ["label", "name"];
+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), true).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 FormikAdaptiveInput = function FormikAdaptiveInput(_ref) {
+  var label = _ref.label,
+    name = _ref.name,
+    otherProps = _objectWithoutProperties(_ref, _excluded$a);
+  var _useFormikContext = useFormikContext(),
+    dirty = _useFormikContext.dirty,
+    isValid = _useFormikContext.isValid,
+    submitForm = _useFormikContext.submitForm;
+  var handleKeyDown = function handleKeyDown(event) {
+    if (event.key !== "Enter" || event.shiftKey) return;
+    event.preventDefault();
+    if (isMetaKeyPressed(event)) return;
+    dirty && isValid && submitForm();
+  };
+  var handleFocus = function handleFocus(element) {
+    var end = element.value.length;
+    element.setSelectionRange(end, end);
+  };
+  return /*#__PURE__*/jsx(Textarea, _objectSpread$g({
+    label: label,
+    name: name,
+    className: "neeto-form-nano-adaptive-input",
+    resize: "none",
+    size: "small",
+    onFocus: function onFocus(_ref2) {
+      var target = _ref2.target;
+      return handleFocus(target);
+    },
+    onKeyDown: handleKeyDown
+  }, otherProps));
+};
+
+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), true).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 LabelWithPlaceholder = function LabelWithPlaceholder(_ref) {
+  var kind = _ref.kind,
+    isLabelDisabled = _ref.isLabelDisabled,
+    handleLabelChange = _ref.handleLabelChange,
+    _ref$labelProps = _ref.labelProps,
+    labelProps = _ref$labelProps === void 0 ? {} : _ref$labelProps,
+    _ref$placeholderProps = _ref.placeholderProps,
+    placeholderProps = _ref$placeholderProps === void 0 ? {} : _ref$placeholderProps;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var shouldShowPlaceholder = includes(kind, QUESTIONS_WITH_PLACEHOLDERS);
+  return /*#__PURE__*/jsxs("div", {
+    className: "space-y-4",
+    children: [/*#__PURE__*/jsx(FormikAdaptiveInput, _objectSpread$f({
+      required: true,
+      disabled: isLabelDisabled,
+      label: t("neetoForm.questions.common.questionFields.field.question"),
+      name: "label",
+      placeholder: DEFAULT_PLACEHOLDERS[kind],
+      onChange: withEventTargetValue(handleLabelChange)
+    }, labelProps)), shouldShowPlaceholder && /*#__PURE__*/jsx(FormikAdaptiveInput, _objectSpread$f({
+      className: "neeto-form-nano-placeholder-input neeto-form-nano-placeholder-input-".concat(kind),
+      name: "placeholder",
+      label: t("neetoForm.questions.common.questionFields.field.placeholder")
+    }, placeholderProps))]
+  });
+};
+
+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), true).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 Name = function Name(_ref) {
+  var isLabelDisabled = _ref.isLabelDisabled,
+    _handleLabelChange = _ref.handleLabelChange;
+  var _useFormikContext = useFormikContext(),
+    _useFormikContext$val = _useFormikContext.values.isSplitMode,
+    isSplitMode = _useFormikContext$val === void 0 ? false : _useFormikContext$val;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var usesCustomSubmissionComponent = useBuildFormStore(path(["formState", "usesCustomSubmissionComponent"]));
+  var commonProps = {
+    kind: QUESTION_TYPES.NAME,
+    isLabelDisabled: isLabelDisabled
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: "space-y-4",
+    children: [!usesCustomSubmissionComponent && /*#__PURE__*/jsx(Switch, {
+      label: t("neetoForm.common.splitAsFirstAndLastNames"),
+      name: "isSplitMode"
+    }), isSplitMode && !usesCustomSubmissionComponent ? /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsx(LabelWithPlaceholder, _objectSpread$e(_objectSpread$e({}, commonProps), {}, {
+        handleLabelChange: function handleLabelChange(value) {
+          return _handleLabelChange(value, LABEL_FIELDS.FIRST_NAME);
+        },
+        labelProps: {
+          label: t("neetoForm.questions.common.questionFields.field.firstNameQuestion"),
+          name: LABEL_FIELDS.FIRST_NAME
+        },
+        placeholderProps: {
+          label: t("neetoForm.questions.common.questionFields.field.firstNamePlaceholder"),
+          name: "firstNamePlaceholder"
+        }
+      })), /*#__PURE__*/jsx(LabelWithPlaceholder, _objectSpread$e(_objectSpread$e({}, commonProps), {}, {
+        handleLabelChange: function handleLabelChange(value) {
+          return _handleLabelChange(value, LABEL_FIELDS.LAST_NAME);
+        },
+        labelProps: {
+          label: t("neetoForm.questions.common.questionFields.field.lastNameQuestion"),
+          name: LABEL_FIELDS.LAST_NAME
+        },
+        placeholderProps: {
+          label: t("neetoForm.questions.common.questionFields.field.lastNamePlaceholder"),
+          name: "lastNamePlaceholder"
+        }
+      }))]
+    }) : /*#__PURE__*/jsx(LabelWithPlaceholder, _objectSpread$e(_objectSpread$e({}, commonProps), {}, {
+      labelProps: {
+        name: LABEL_FIELDS.FULL_NAME
+      },
+      placeholderProps: {
+        name: "fullNamePlaceholder"
+      },
+      handleLabelChange: function handleLabelChange(value) {
+        return _handleLabelChange(value, LABEL_FIELDS.FULL_NAME);
+      }
+    }))]
+  });
+};
+
+var Properties = function Properties(_ref) {
+  var kind = _ref.kind,
+    isLabelDisabled = _ref.isLabelDisabled,
+    handleLabelChange = _ref.handleLabelChange,
+    questionProps = _ref.questionProps;
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState;
+      return {
+        usesCustomSubmissionComponent: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["usesCustomSubmissionComponent"]
+      };
+    }, shallow),
+    usesCustomSubmissionComponent = _useBuildFormStore.usesCustomSubmissionComponent;
+  var hasAdditionalData = includes(kind, QUESTIONS_WITH_ADDITIONAL_DATA);
+  if (isNameQuestion(kind)) {
+    return /*#__PURE__*/jsx(Name, {
+      handleLabelChange: handleLabelChange,
+      isLabelDisabled: isLabelDisabled
+    });
+  }
+  return /*#__PURE__*/jsxs("div", {
+    className: "space-y-4",
+    children: [/*#__PURE__*/jsx(LabelWithPlaceholder, {
+      handleLabelChange: handleLabelChange,
+      isLabelDisabled: isLabelDisabled,
+      kind: kind
+    }), hasAdditionalData && renderAdditionalData({
+      kind: kind,
+      questionProps: questionProps,
+      usesCustomSubmissionComponent: usesCustomSubmissionComponent
+    })]
+  });
+};
+
+var Block = function Block(_ref) {
+  var title = _ref.title,
+    children = _ref.children,
+    dataTestid = _ref.dataTestid;
+  return /*#__PURE__*/jsxs("div", {
+    className: "mt-4 space-y-3",
+    "data-testid": dataTestid,
+    children: [/*#__PURE__*/jsx("div", {
+      className: "flex items-center justify-between",
+      "data-testid": "properties-header",
+      children: /*#__PURE__*/jsx(Typography, {
+        lineHeight: "normal",
+        style: "body1",
+        weight: "semibold",
+        children: title
+      })
+    }), /*#__PURE__*/jsx("div", {
+      className: "space-y-4",
+      children: children
+    })]
+  });
+};
+
+var useUpdateEditorContent = function useUpdateEditorContent(_ref) {
+  var editorRef = _ref.editorRef,
+    fieldName = _ref.fieldName,
+    value = _ref.value;
+  var initialStateRef = useRef({
+    language: "",
+    value: null
+  });
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2;
+      return {
+        formId: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["formId"],
+        selectedLanguage: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["selectedLanguage"]
+      };
+    }, shallow),
+    formId = _useBuildFormStore.formId,
+    language = _useBuildFormStore.selectedLanguage;
+  var setEditorContent = function setEditorContent(content) {
+    var _editorRef$current$ed;
+    return (_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 ? void 0 : _editorRef$current$ed.setContent(content);
+  };
+  var _useForm = useForm({
+      formId: formId,
+      language: language
+    }),
+    data = _useForm.data;
+  useEffect(function () {
+    if (!data) return;
+    var pathArray = fieldName.split(".").map(function (part) {
+      var parsedPart = parseInt(part);
+      return isNaN(parsedPart) ? part : parsedPart;
+    });
+    setEditorContent(path(pathArray, data));
+  }, [data]);
+  useEffect(function () {
+    if (initialStateRef.current["language"] !== language) {
+      initialStateRef.current["language"] = language;
+      initialStateRef.current["value"] = null;
+      return;
+    }
+    if (initialStateRef.current["value"] === null && value !== null) {
+      setEditorContent(value);
+      initialStateRef.current["value"] = value;
+    }
+  }, [language, value]);
+};
+
+var Editor = function Editor() {
+  var editorRef = useRef({
+    editor: {}
+  });
+  var fieldName = "label";
+  var _useField = useField({
+      name: fieldName,
+      validate: validateEditorContent(editorRef)
+    }),
+    _useField2 = _slicedToArray(_useField, 3),
+    value = _useField2[0].value,
+    _useField2$ = _useField2[1],
+    touched = _useField2$.touched,
+    error = _useField2$.error,
+    _useField2$2 = _useField2[2],
+    setTouched = _useField2$2.setTouched,
+    setValue = _useField2$2.setValue;
+  useUpdateEditorContent({
+    editorRef: editorRef,
+    fieldName: fieldName,
+    value: value
+  });
+  return /*#__PURE__*/jsx("div", {
+    className: "w-full cursor-auto",
+    children: /*#__PURE__*/jsx(NeetoEditor, {
+      required: true,
+      error: touched ? error : "",
+      id: "editor",
+      initialValue: value,
+      name: fieldName,
+      ref: editorRef,
+      onBlur: function onBlur() {
+        return setTouched(true);
+      },
+      onChange: setValue
+    })
+  });
+};
+
+var RequiredSwitch = withT(function (_ref) {
+  var t = _ref.t;
+  return /*#__PURE__*/jsx("div", {
+    className: "w-full",
+    children: /*#__PURE__*/jsx(Switch, {
+      label: t("neetoForm.common.required"),
+      name: "isRequired"
+    })
+  });
+});
+
+var _excluded$9 = ["maxLength"];
+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), true).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 InputWithMaxLength = function InputWithMaxLength(_ref) {
+  var maxLength = _ref.maxLength,
+    props = _objectWithoutProperties(_ref, _excluded$9);
+  var _useField = useField(props),
+    _useField2 = _slicedToArray(_useField, 3),
+    value = _useField2[0].value,
+    setValue = _useField2[2].setValue;
+  useEffect(function () {
+    if (value && value.length > maxLength) {
+      setValue(value.substring(0, maxLength));
+    }
+  }, [value, maxLength, setValue]);
+  var shouldShowMaxLength = value && value.length > maxLength - 10;
+  return /*#__PURE__*/jsx(Input, _objectSpread$d(_objectSpread$d({}, props), shouldShowMaxLength && {
+    maxLength: maxLength
+  }));
+};
+
+var FieldCode = function FieldCode() {
+  var helpDocUrl = useHelpDoc("fieldCode");
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  return /*#__PURE__*/jsx(InputWithMaxLength, {
+    required: true,
+    label: t("neetoForm.questions.common.questionFields.field.fieldCode"),
+    name: "fieldCode",
+    rejectCharsRegex: FIELD_CODES_REJECT_CHARS_REGEX,
+    helpText: helpDocUrl && /*#__PURE__*/jsx(Trans, {
+      i18nKey: "neetoForm.questions.common.questionFields.field.fieldCodeHelpDescription",
+      components: {
+        Link: /*#__PURE__*/jsx(Button, {
+          className: "text-xs",
+          href: helpDocUrl,
+          style: "link",
+          target: "_blank"
+        })
+      }
+    })
+  });
+};
+
+var Form$1 = function Form(_ref) {
+  var questions = _ref.questions,
+    initialFocusRef = _ref.initialFocusRef,
+    isRequiredField = _ref.isRequiredField,
+    isDisabledFieldLabel = _ref.isDisabledFieldLabel,
+    allQuestionKinds = _ref.allQuestionKinds,
+    availableQuestionKinds = _ref.availableQuestionKinds,
+    getActiveKindDetails = _ref.getActiveKindDetails,
+    kindUniqueOn = _ref.kindUniqueOn,
+    _ref$isEdit = _ref.isEdit,
+    isEdit = _ref$isEdit === void 0 ? false : _ref$isEdit;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isFieldCodeInvalid = _useState2[0],
+    setIsFieldCodeInvalid = _useState2[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useFormikContext = useFormikContext(),
+    values = _useFormikContext.values,
+    setValues = _useFormikContext.setValues,
+    setErrors = _useFormikContext.setErrors,
+    setTouched = _useFormikContext.setTouched,
+    setFieldValue = _useFormikContext.setFieldValue,
+    errors = _useFormikContext.errors,
+    submitCount = _useFormikContext.submitCount;
+  var hideQuestionHelpDocUrl = useHelpDoc("hideQuestion");
+  var readOnlyHelpDocUrl = useHelpDoc("readOnly");
+  var responseVisibleOnlyToHostHelpDocUrl = useHelpDoc("responseVisibleOnlyToHost");
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2, _store$formState3, _store$formState4;
+      return {
+        advancedFeatures: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["advancedFeatures"],
+        selectedLanguage: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["selectedLanguage"],
+        isUsingDefaultQuestionKinds: (_store$formState3 = store["formState"]) === null || _store$formState3 === void 0 ? void 0 : _store$formState3["isUsingDefaultQuestionKinds"],
+        usesCustomSubmissionComponent: (_store$formState4 = store["formState"]) === null || _store$formState4 === void 0 ? void 0 : _store$formState4["usesCustomSubmissionComponent"]
+      };
+    }, shallow),
+    advancedFeatures = _useBuildFormStore.advancedFeatures,
+    selectedLanguage = _useBuildFormStore.selectedLanguage,
+    isUsingDefaultQuestionKinds = _useBuildFormStore.isUsingDefaultQuestionKinds,
+    usesCustomSubmissionComponent = _useBuildFormStore.usesCustomSubmissionComponent;
+  var isFieldCodeEnabled = advancedFeatures.fieldCode,
+    markResponsesAsReadOnly = advancedFeatures.markResponsesAsReadOnly,
+    restrictResponseVisibilityToHost = advancedFeatures.restrictResponseVisibilityToHost;
+  var kind = values.kind;
+  var questionKinds = isEdit ? allQuestionKinds : availableQuestionKinds;
+  var questionKindUniquenessPattern = mergeLeft(isEdit && kindUniqueOn ? kindUniqueOn(values) : {}, {
+    type: kind
+  });
+  var _useStateWithDependen = useStateWithDependency(getQuestionKind(questionKinds, questionKindUniquenessPattern), [kind]),
+    _useStateWithDependen2 = _slicedToArray(_useStateWithDependen, 1),
+    questionKind = _useStateWithDependen2[0];
+  var _ref2 = questionKind ? getActiveKindDetails({
+      allQuestionKinds: allQuestionKinds,
+      item: questionKind
+    }) : {},
+    _ref2$questionProps = _ref2.questionProps,
+    questionProps = _ref2$questionProps === void 0 ? {} : _ref2$questionProps;
+  useEffect(function () {
+    if (submitCount > 0 && isPresent(errors === null || errors === void 0 ? void 0 : errors.fieldCode)) {
+      setIsFieldCodeInvalid(true);
+    }
+  }, [submitCount]);
+  var isRequired = questionKind && isRequiredField(questionKind);
+  var isLabelDisabled = questionKind && isDisabledFieldLabel(questionKind);
+  var isImmutable = questionKind && isImmutableField(questionKind);
+  var shouldShowFieldCode = isFieldCodeEnabled && !includes(kind, QUESTIONS_WITHOUT_FIELD_CODE);
+  var shouldShowHideSwitch = isFieldCodeEnabled && !usesCustomSubmissionComponent && !includes(kind, NON_HIDEABLE_FIELDS);
+  var canRestrictResponseVisibilityToHost = restrictResponseVisibilityToHost && !includes(kind, NON_HIDEABLE_FIELDS);
+  var canMarkResponsesAsReadOnly = markResponsesAsReadOnly && !includes(kind, NON_READ_ONLY_FIELDS);
+  var isBasicSettingsVisible = !isRequired && (!isImmutable || shouldShowHideSwitch);
+  var isSettingsBlockVisible = kind !== QUESTION_TYPES.SPOT && (isBasicSettingsVisible || canMarkResponsesAsReadOnly);
+  var handleKindChange = function handleKindChange(option) {
+    var data = buildQuestionData(option);
+    updateFormState(data);
+  };
+  var buildQuestionData = function buildQuestionData(option) {
+    if (isNil(option)) {
+      return INITIAL_VALUES;
+    }
+    var label = option.label,
+      value = option.value;
+    var kind = extractKindFromOption(value);
+    var questionKind = getQuestionKind(availableQuestionKinds, {
+      type: kind,
+      label: label
+    });
+    return createFieldData({
+      kind: questionKind,
+      isRequired: isRequired,
+      questions: questions,
+      selectedLanguage: selectedLanguage,
+      isUsingDefaultQuestionKinds: isUsingDefaultQuestionKinds
+    });
+  };
+  var updateFormState = function updateFormState(data) {
+    setValues(data);
+    setErrors({});
+    setTouched({});
+  };
+  var handleLabelChange = function handleLabelChange(label) {
+    var name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : LABEL_FIELDS.DEFAULT;
+    setFieldValue(name, label);
+    if (isEdit) return;
+    var uniqueFieldCode = generateUniqueFieldCode({
+      questions: questions,
+      label: label,
+      kind: kind
+    });
+    setFieldValue("fieldCode", uniqueFieldCode);
+  };
+  return /*#__PURE__*/jsx(Pane.Body, {
+    children: /*#__PURE__*/jsxs("div", {
+      className: "w-full space-y-4",
+      children: [/*#__PURE__*/jsx(Select, {
+        isClearable: true,
+        isSearchable: true,
+        defaultValue: buildDefaultValueForKind(questionKind),
+        innerRef: initialFocusRef,
+        isDisabled: isEdit,
+        name: "kind",
+        options: buildKindOptions(questionKinds),
+        label: t("neetoForm.questions.common.questionFields.field.questionType"),
+        onChange: handleKindChange
+      }), isRichTextQuestion(kind) ? /*#__PURE__*/jsx(Editor, {
+        isLabelDisabled: isLabelDisabled
+      }) : /*#__PURE__*/jsxs("div", {
+        className: "space-y-6",
+        children: [/*#__PURE__*/jsx(Properties, {
+          handleLabelChange: handleLabelChange,
+          isLabelDisabled: isLabelDisabled,
+          kind: kind,
+          questionProps: questionProps
+        }), isSettingsBlockVisible && /*#__PURE__*/jsxs(Block, {
+          dataTestid: "settings-card",
+          title: t("neetoForm.common.settings"),
+          children: [isBasicSettingsVisible && /*#__PURE__*/jsxs(Fragment, {
+            children: [!isImmutable && kind !== QUESTION_TYPES.ADDRESS && kind !== QUESTION_TYPES.SPOT && /*#__PURE__*/jsx(RequiredSwitch, {}), shouldShowHideSwitch && /*#__PURE__*/jsx(Switch, {
+              label: t("neetoForm.common.hideQuestion"),
+              name: "isHidden",
+              labelProps: hideSwitchLabelProps(hideQuestionHelpDocUrl)
+            }), canRestrictResponseVisibilityToHost && /*#__PURE__*/jsx(Switch, {
+              label: t("neetoForm.common.responseVisibleOnlyToHost"),
+              name: "isResponseVisibleOnlyToHost",
+              labelProps: responseVisibleOnlyToHostSwitchLabelProps(responseVisibleOnlyToHostHelpDocUrl)
+            })]
+          }), canMarkResponsesAsReadOnly && /*#__PURE__*/jsx(Switch, {
+            label: t("neetoForm.common.readOnly"),
+            labelProps: readOnlySwitchLabelProps(readOnlyHelpDocUrl),
+            name: "isReadOnly"
+          })]
+        }), shouldShowFieldCode && /*#__PURE__*/jsx(Accordion, {
+          className: "neeto-form-nano-advanced-properties-accordion",
+          "data-testid": "advanced-properties-card",
+          defaultActiveKey: isFieldCodeInvalid ? 0 : null // This is to open the accordion when field code is invalid
+          ,
+          children: /*#__PURE__*/jsx(Accordion.Item, {
+            title: t("neetoForm.common.advancedProperties"),
+            children: /*#__PURE__*/jsx("div", {
+              className: "flex flex-col space-y-4",
+              children: shouldShowFieldCode && /*#__PURE__*/jsx(FieldCode, {})
+            })
+          })
+        })]
+      })]
+    })
+  });
+};
+
+/* eslint-disable @bigbinary/neeto/file-name-and-export-name-standards */
+var requiredLabelValidation = function requiredLabelValidation(schema, field) {
+  return schema.trim().required(t("neetoForm.common.fieldReq", {
+    field: field
+  }));
+};
+var fieldCodeValidation = function fieldCodeValidation(schema, field) {
+  return schema.trim().required(t("neetoForm.common.fieldReq", {
+    field: field
+  })).matches(VALID_FIELD_CODE_REGEX, t("neetoForm.error.invalidField", {
+    label: field
+  }));
+};
+var richTextFieldMissingErrorMessage = function richTextFieldMissingErrorMessage(kind) {
+  var field = equals(kind, QUESTION_TYPES.PARAGRAPH) ? t("neetoForm.fields.def") : t("neetoForm.fields.tcf");
+  return t("neetoForm.error.fieldCantBeEmpty", {
+    field: field
+  });
+};
+var buildLabelValidationSchema = function buildLabelValidationSchema(kind, schema) {
+  if (isNameQuestion(kind)) {
+    return schema.notRequired();
+  }
+  return includes(kind, RICH_TEXT_QUESTIONS) ? schema.test("required", richTextFieldMissingErrorMessage(kind), function (value) {
+    return !isEditorEmpty(value);
+  }) : requiredLabelValidation(schema, t("neetoForm.questions.common.questionFields.field.question"));
+};
+var buildNameLabelValidationSchema = function buildNameLabelValidationSchema(question, schema) {
+  var isFullName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  var isRequired = isFullName ? !question.isSplitMode : question.isSplitMode;
+  return isNameQuestion(question.kind) && isRequired ? requiredLabelValidation(schema, t("neetoForm.questions.common.questionFields.field.question")) : schema.notRequired();
+};
+var buildOpinionScaleLabelValidationSchema = function buildOpinionScaleLabelValidationSchema(label) {
+  return stringSchema.when("hasOpinionLabels", {
+    is: true,
+    then: requiredLabelValidation(stringSchema, label).max(OPINION_LABEL_MAX_LENGTH, t("neetoForm.error.mustBeOrLessThanOrEqualTo", {
+      value: OPINION_LABEL_MAX_LENGTH
+    })),
+    otherwise: stringSchema.notRequired()
+  });
+};
+var stringSchema = yup.string();
+var formValidationSchema = function formValidationSchema(question) {
+  var isFieldCodeEnabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  return yup.object().shape({
+    kind: yup.string().trim().required(t("neetoForm.common.fieldReq", {
+      field: t("neetoForm.questions.common.questionFields.field.questionType")
+    })),
+    label: yup.string().when("kind", buildLabelValidationSchema),
+    fullNameLabel: buildNameLabelValidationSchema(question, stringSchema, true),
+    firstNameLabel: buildNameLabelValidationSchema(question, stringSchema),
+    lastNameLabel: buildNameLabelValidationSchema(question, stringSchema),
+    fieldCode: yup.string().trim().notOneOf(RESERVED_FIELD_CODES, t("neetoForm.error.invalidFieldCode")).when("kind", function (kind, schema) {
+      return isFieldCodeEnabled && !includes(kind, QUESTIONS_WITHOUT_FIELD_CODE) ? fieldCodeValidation(schema, t("neetoForm.questions.common.questionFields.field.fieldCode")) : schema.notRequired();
+    }),
+    optionsAttributes: yup.array().when("kind", function (kind, schema) {
+      return includes(kind, SELECTABLE_KINDS) ? schema.of(yup.object().shape({
+        label: yup.string().when("_destroy", {
+          is: true,
+          otherwise: requiredLabelValidation(yup.string(), t("neetoForm.questions.common.questionFields.field.option"))
+        })
+      })) : schema.notRequired();
+    }),
+    fields: yup.array().when("kind", function (kind, schema) {
+      return kind === QUESTION_TYPES.ADDRESS ? schema.of(yup.object().shape({
+        label: yup.string().when("_destroy", {
+          is: true,
+          otherwise: yup.string().trim().required(t("neetoForm.error.allFieldsRequired"))
+        })
+      })) : schema.notRequired();
+    }),
+    highestRatingLabel: yup.string().nullable(),
+    averageRatingLabel: yup.string().nullable(),
+    lowestRatingLabel: yup.string().nullable(),
+    leftOpinionLabel: buildOpinionScaleLabelValidationSchema(t("neetoForm.questions.opinionScale.leftLabel")),
+    rightOpinionLabel: buildOpinionScaleLabelValidationSchema(t("neetoForm.questions.opinionScale.rightLabel"))
+  });
+};
+
+var _excluded$8 = ["question", "onClose", "questions", "handleSelect", "isOpen"];
+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), true).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 Add = function Add(_ref) {
+  var question = _ref.question,
+    onClose = _ref.onClose,
+    questions = _ref.questions,
+    handleSelect = _ref.handleSelect,
+    isOpen = _ref.isOpen,
+    props = _objectWithoutProperties(_ref, _excluded$8);
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2, _store$formState3;
+      return {
+        formId: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["formId"],
+        selectedLanguage: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["selectedLanguage"],
+        onMutateSuccess: (_store$formState3 = store["formState"]) === null || _store$formState3 === void 0 ? void 0 : _store$formState3["onMutateSuccess"]
+      };
+    }, shallow),
+    formId = _useBuildFormStore.formId,
+    language = _useBuildFormStore.selectedLanguage,
+    onMutateSuccess = _useBuildFormStore.onMutateSuccess;
+  var isFieldCodeEnabled = useBuildFormStore(path(["advancedFeatures", "fieldCode"]));
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useCreateQuestion = useCreateQuestion(formId, language, {
+      onSuccess: function onSuccess() {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        onMutateSuccess === null || onMutateSuccess === void 0 || onMutateSuccess.apply(void 0, [QUESTION_ACTIONS.ADD].concat(args));
+        showThumbsUpToastr();
+        onClose();
+      }
+    }),
+    createQuestion = _useCreateQuestion.mutate,
+    isCreating = _useCreateQuestion.isPending;
+  var handleSubmit = function handleSubmit(values) {
+    if (isCreating || !isOpen) return;
+    var displayOrder = question ? question.displayOrder + 1 : questions.length;
+    createQuestion({
+      language: language,
+      neetoFormQuestion: mergeLeft({
+        displayOrder: displayOrder
+      }, transformValues(values))
+    }, {
+      onSuccess: function onSuccess(_ref2) {
+        var questions = _ref2.questions;
+        var newQuestion = findBy({
+          displayOrder: displayOrder
+        }, questions);
+        handleSelect(newQuestion);
+      }
+    });
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx(Pane.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "add-question-pane-header",
+        style: "h2",
+        children: t("neetoForm.questions.common.primaryPanel.addQuestion")
+      })
+    }), /*#__PURE__*/jsx(Form$2, {
+      formikProps: {
+        initialValues: INITIAL_VALUES,
+        validationSchema: formValidationSchema(INITIAL_VALUES, isFieldCodeEnabled),
+        onSubmit: handleSubmit
+      },
+      children: /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Form$1, _objectSpread$c({}, _objectSpread$c(_objectSpread$c({}, props), {}, {
+          question: question,
+          questions: questions
+        }))), /*#__PURE__*/jsx(Pane.Footer, {
+          children: /*#__PURE__*/jsx(ActionBlock, {
+            cancelButtonProps: {
+              onClick: onClose
+            },
+            isSubmitting: isCreating
+          })
+        })]
+      })
+    })]
+  });
+};
+
+var _excluded$7 = ["question", "isOpen", "onClose"];
+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), true).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 Edit = function Edit(_ref) {
+  var question = _ref.question,
+    isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    props = _objectWithoutProperties(_ref, _excluded$7);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2;
+      return {
+        selectedLanguage: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["selectedLanguage"],
+        onMutateSuccess: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["onMutateSuccess"]
+      };
+    }, shallow),
+    language = _useBuildFormStore.selectedLanguage,
+    onMutateSuccess = _useBuildFormStore.onMutateSuccess;
+  var isFieldCodeEnabled = useBuildFormStore(path(["advancedFeatures", "fieldCode"]));
+  var _useUpdateQuestion = useUpdateQuestion(question === null || question === void 0 ? void 0 : question.formId, language),
+    updateQuestion = _useUpdateQuestion.mutate,
+    isUpdating = _useUpdateQuestion.isPending;
+  var handleSubmit = function handleSubmit(values, _ref2) {
+    var setSubmitting = _ref2.setSubmitting;
+    if (isUpdating || !isOpen) return;
+    var payload = {
+      language: language,
+      neetoFormQuestion: transformValues(values)
+    };
+    updateQuestion({
+      questionId: question.id,
+      payload: payload
+    }, {
+      onSuccess: function onSuccess() {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        onMutateSuccess === null || onMutateSuccess === void 0 || onMutateSuccess.apply(void 0, [QUESTION_ACTIONS.EDIT].concat(args));
+        showThumbsUpToastr();
+        onClose();
+      },
+      onSettled: function onSettled() {
+        return setSubmitting(false);
+      }
+    });
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx(Pane.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "edit-question-pane-header",
+        style: "h2",
+        children: t("neetoForm.questions.common.editQuestion")
+      })
+    }), /*#__PURE__*/jsx(Form$2, {
+      formikProps: {
+        initialValues: question,
+        validationSchema: formValidationSchema(question, isFieldCodeEnabled),
+        onSubmit: handleSubmit
+      },
+      children: /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Form$1, _objectSpread$b(_objectSpread$b({}, _objectSpread$b({
+          question: question
+        }, props)), {}, {
+          isEdit: true
+        })), /*#__PURE__*/jsx(Pane.Footer, {
+          children: /*#__PURE__*/jsx(ActionBlock, {
+            cancelButtonProps: {
+              onClick: onClose
+            },
+            isSubmitting: isUpdating
+          })
+        })]
+      })
+    })]
+  });
+};
+
+var VARIANTS = {
+  hidden: {
+    opacity: 0,
+    height: 0,
+    overflow: "hidden"
+  },
+  visible: {
+    opacity: 1,
+    height: "auto"
+  }
+};
+
+var _excluded$6 = ["open", "className", "children"];
+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), true).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 Collapsible = function Collapsible(_ref) {
+  var open = _ref.open,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    children = _ref.children,
+    otherProps = _objectWithoutProperties(_ref, _excluded$6);
+  return /*#__PURE__*/jsx(AnimatePresence, {
+    children: open && /*#__PURE__*/jsx(motion.div, _objectSpread$a(_objectSpread$a({
+      animate: "visible",
+      exit: "hidden",
+      initial: "hidden",
+      transition: {
+        duration: 0.3
+      },
+      variants: VARIANTS
+    }, otherProps), {}, {
+      children: /*#__PURE__*/jsx("div", {
+        className: className,
+        children: children
+      })
+    }))
+  });
+};
+
+var ADDRESS_FIELD_WIDTH_OPTIONS = _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ADDRESS_FIELD_WIDTHS.FULL, {
+  label: t("neetoForm.questions.address.widths.full"),
+  value: ADDRESS_FIELD_WIDTHS.FULL
+}), ADDRESS_FIELD_WIDTHS.HALF, {
+  label: t("neetoForm.questions.address.widths.half"),
+  value: ADDRESS_FIELD_WIDTHS.HALF
+}), ADDRESS_FIELD_WIDTHS.ONE_FOURTH, {
+  label: t("neetoForm.questions.address.widths.oneFourth"),
+  value: ADDRESS_FIELD_WIDTHS.ONE_FOURTH
+}), ADDRESS_FIELD_WIDTHS.THREE_FOURTH, {
+  label: t("neetoForm.questions.address.widths.threeFourth"),
+  value: ADDRESS_FIELD_WIDTHS.THREE_FOURTH
+});
+var ADDRESS_FIELD_TYPE_OPTIONS = _defineProperty(_defineProperty({}, ADDRESS_FIELD_TYPES.INPUT, {
+  label: t("neetoForm.questions.address.types.textInput"),
+  value: ADDRESS_FIELD_TYPES.INPUT
+}), ADDRESS_FIELD_TYPES.SELECT, {
+  label: t("neetoForm.questions.address.types.dropdown"),
+  value: ADDRESS_FIELD_TYPES.SELECT
+});
+var ADDRESS_FIELD_FORM_VALIDATION_SCHEMA = yup.object().shape({
+  label: yup.string().trim().required(t("neetoForm.error.requiredField", {
+    label: t("neetoForm.questions.common.questionFields.field.label")
+  })),
+  width: yup.object().nullable().required(t("neetoForm.error.requiredField", {
+    label: t("neetoForm.questions.address.width")
+  })),
+  fieldType: yup.object().nullable().required(t("neetoForm.error.requiredField", {
+    label: t("neetoForm.questions.address.type")
+  })),
+  properties: yup.object().shape({
+    options: yup.array().of(yup.object().shape({
+      label: yup.string().required(t("neetoForm.error.requiredField", {
+        label: t("neetoForm.common.option")
+      }))
+    })).unique("label", t("neetoForm.error.removeDuplicates"))
+  })
+});
+var ERROR_MESSAGE_DELIMITER$1 = ". ";
+
+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), true).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 removeDuplicateErrorMessages$1 = pipe(filter(isNotNil), map(values), uniq, join(ERROR_MESSAGE_DELIMITER$1));
+var getAddressModalInitialValues = function getAddressModalInitialValues(field) {
+  return field ? _objectSpread$9(_objectSpread$9({}, field), {}, {
+    width: ADDRESS_FIELD_WIDTH_OPTIONS[field.width],
+    fieldType: ADDRESS_FIELD_TYPE_OPTIONS[field.fieldType]
+  }) : {
+    label: "",
+    isRequired: false,
+    width: ADDRESS_FIELD_WIDTH_OPTIONS[ADDRESS_FIELD_WIDTHS.FULL],
+    fieldType: ADDRESS_FIELD_TYPE_OPTIONS[ADDRESS_FIELD_TYPES.INPUT]
+  };
+};
+var sanitizeAddressField = function sanitizeAddressField(field, isSelectField, defaultOptions) {
+  var hasOptions = pathSatisfies(isPresent, ["properties", "options"], field);
+  if (isSelectField && !hasOptions) {
+    return assocPath(["properties", "options"], defaultOptions, field);
+  }
+  if (!isSelectField && hasOptions) {
+    return dissoc("properties", field);
+  }
+  return field;
+};
+var formatErrorMessage$1 = function formatErrorMessage(error) {
+  if (typeof error === "string") return error;
+  return removeDuplicateErrorMessages$1(error);
+};
+
+var _excluded$5 = ["width", "fieldType"];
+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), true).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 ManagePane = function ManagePane(_ref) {
+  var isOpen = _ref.isOpen,
+    selectedFieldId = _ref.selectedFieldId,
+    onClose = _ref.onClose,
+    title = _ref.title,
+    fields = _ref.fields,
+    initialFocusRef = _ref.initialFocusRef;
+  var _useField = useField("fields"),
+    _useField2 = _slicedToArray(_useField, 3),
+    allFields = _useField2[0].value,
+    setValue = _useField2[2].setValue;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var defaultOptions = generateDefaultOptions(MINIMUM_ADDRESS_FIELDS);
+  var editingField = findById(selectedFieldId, fields);
+  var initialValues = getAddressModalInitialValues(editingField);
+  var handleSubmit = function handleSubmit(_ref2) {
+    var width = _ref2.width,
+      fieldType = _ref2.fieldType,
+      field = _objectWithoutProperties(_ref2, _excluded$5);
+    var deletedFields = getDeletedRecords(allFields);
+    var isSelectField = fieldType.value === ADDRESS_FIELD_TYPES.SELECT;
+    var sanitizedField = sanitizeAddressField(field, isSelectField, defaultOptions);
+    if (isNil(selectedFieldId)) {
+      var position = fields.length;
+      var id = "draft-".concat(randomId());
+      var newField = _objectSpread$8(_objectSpread$8({
+        id: id
+      }, sanitizedField), {}, {
+        altId: "alt-".concat(randomId()),
+        position: position,
+        width: width.value,
+        fieldType: fieldType.value
+      });
+      var nextFields = append(newField, fields);
+      setValue([].concat(_toConsumableArray(nextFields), _toConsumableArray(deletedFields)));
+    } else {
+      var selectedFieldIndex = findIndexById(selectedFieldId, fields);
+      setValue(assoc(selectedFieldIndex, _objectSpread$8(_objectSpread$8({}, sanitizedField), {}, {
+        width: width.value,
+        fieldType: fieldType.value
+      }), [].concat(_toConsumableArray(fields), _toConsumableArray(deletedFields))));
+    }
+    onClose();
+  };
+  var handleFieldTypeChange = function handleFieldTypeChange(setFieldValue, values) {
+    return function (fieldType) {
+      var _values$properties;
+      setFieldValue("fieldType", fieldType);
+      if (fieldType.value === ADDRESS_FIELD_TYPES.SELECT && isNotPresent((_values$properties = values.properties) === null || _values$properties === void 0 ? void 0 : _values$properties.options)) {
+        setFieldValue("properties.options", defaultOptions);
+      }
+    };
+  };
+  return /*#__PURE__*/jsxs(Pane, {
+    initialFocusRef: initialFocusRef,
+    isOpen: isOpen,
+    onClose: onClose,
+    children: [/*#__PURE__*/jsx(Pane.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-testid": "add-address-field-title",
+        style: "h2",
+        weight: "semibold",
+        children: title
+      })
+    }), /*#__PURE__*/jsx(Form$2, {
+      formikProps: {
+        initialValues: initialValues,
+        validationSchema: ADDRESS_FIELD_FORM_VALIDATION_SCHEMA,
+        onSubmit: handleSubmit
+      },
+      children: function children(_ref3) {
+        var _values$fieldType;
+        var values = _ref3.values,
+          setFieldValue = _ref3.setFieldValue;
+        return /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsx(Pane.Body, {
+            children: /*#__PURE__*/jsxs("div", {
+              className: "w-full space-y-6",
+              children: [/*#__PURE__*/jsx(Input, {
+                name: "label",
+                ref: initialFocusRef,
+                label: t("neetoForm.questions.common.questionFields.field.label"),
+                placeholder: t("neetoForm.questions.address.fieldLabelPlaceholder")
+              }), /*#__PURE__*/jsxs("div", {
+                className: "grid grid-cols-2 gap-6",
+                children: [/*#__PURE__*/jsx(Select, {
+                  label: t("neetoForm.questions.address.width"),
+                  name: "width",
+                  options: Object.values(ADDRESS_FIELD_WIDTH_OPTIONS)
+                }), /*#__PURE__*/jsx(Select, {
+                  label: t("neetoForm.questions.address.type"),
+                  name: "fieldType",
+                  options: Object.values(ADDRESS_FIELD_TYPE_OPTIONS),
+                  onChange: handleFieldTypeChange(setFieldValue, values)
+                })]
+              }), /*#__PURE__*/jsx(Collapsible, {
+                open: (values === null || values === void 0 || (_values$fieldType = values.fieldType) === null || _values$fieldType === void 0 ? void 0 : _values$fieldType.value) === ADDRESS_FIELD_TYPES.SELECT,
+                children: /*#__PURE__*/jsx("div", {
+                  className: "flex flex-col",
+                  children: /*#__PURE__*/jsx(OptionFields, {
+                    draggable: true,
+                    minOptions: MINIMUM_ADDRESS_FIELDS,
+                    name: "properties.options"
+                  })
+                })
+              }), /*#__PURE__*/jsx("div", {
+                className: "flex items-center gap-4",
+                children: /*#__PURE__*/jsx(Switch, {
+                  label: t("neetoForm.common.required"),
+                  name: "isRequired"
+                })
+              })]
+            })
+          }), /*#__PURE__*/jsx(Pane.Footer, {
+            children: /*#__PURE__*/jsx("div", {
+              className: "flex items-center gap-2",
+              children: /*#__PURE__*/jsx(ActionBlock, {
+                className: "flex gap-x-2",
+                cancelButtonProps: {
+                  type: "reset",
+                  onClick: onClose,
+                  disabled: false
+                },
+                submitButtonProps: {
+                  label: t("neetoForm.common.saveChanges")
+                }
+              })
+            })
+          })]
+        });
+      }
+    })]
+  });
+};
+
+var Address = function Address() {
+  var _findById;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isAddressFieldPaneOpen = _useState2[0],
+    setIsAddressFieldPaneOpen = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isDeleteAddressFieldAlertOpen = _useState4[0],
+    setIsDeleteAddressFieldAlertOpen = _useState4[1];
+  var _useState5 = useState(null),
+    _useState6 = _slicedToArray(_useState5, 2),
+    selectedFieldId = _useState6[0],
+    setSelectedFieldId = _useState6[1];
+  var initialFocusRef = useRef(null);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState;
+      return {
+        selectedLanguage: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["selectedLanguage"]
+      };
+    }, shallow),
+    selectedLanguage = _useBuildFormStore.selectedLanguage;
+  var name = "fields";
+  var _useField = useField(name),
+    _useField2 = _slicedToArray(_useField, 3),
+    fields = _useField2[0].value,
+    _useField2$ = _useField2[1],
+    error = _useField2$.error,
+    touched = _useField2$.touched,
+    setFields = _useField2[2].setValue;
+  var handleDelete = function handleDelete() {
+    var deletedFields = getDeletedRecords(fields);
+    var nextFields = getActiveRecords(fields);
+    var selectedFieldIndex = findIndexById(selectedFieldId, nextFields);
+    nextFields = assocPath([selectedFieldIndex, "deleted"], true, nextFields);
+    setFields([].concat(_toConsumableArray(nextFields), _toConsumableArray(deletedFields)));
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx(Block, {
+      dataTestid: "address-fields-block",
+      title: t("neetoForm.questions.address.fields"),
+      children: /*#__PURE__*/jsxs("div", {
+        children: [/*#__PURE__*/jsx(OptionFields, {
+          name: name,
+          draggable: true,
+          shouldDestroy: true,
+          editable: false,
+          isNewItemsPrefilled: isDefaultLanguage(selectedLanguage),
+          itemLabel: t("neetoForm.common.field"),
+          minOptions: MINIMUM_ADDRESS_FIELDS,
+          shouldResetEmptyOptionOnBlur: false,
+          buttonProps: {
+            label: t("neetoForm.questions.address.addField"),
+            onClick: function onClick() {
+              return setIsAddressFieldPaneOpen(true);
+            }
+          },
+          onDelete: function onDelete(id) {
+            setSelectedFieldId(id);
+            setIsDeleteAddressFieldAlertOpen(true);
+          },
+          onEdit: function onEdit(id) {
+            setSelectedFieldId(id);
+            setIsAddressFieldPaneOpen(true);
+          }
+        }), touched && error && /*#__PURE__*/jsx("p", {
+          className: "neeto-form-engine-input__error",
+          "data-testid": "neeto-form-engine-address-fields-error",
+          children: formatErrorMessage$1(error)
+        })]
+      })
+    }), /*#__PURE__*/jsx(ManagePane, {
+      initialFocusRef: initialFocusRef,
+      selectedFieldId: selectedFieldId,
+      fields: getActiveRecords(fields),
+      isOpen: isAddressFieldPaneOpen,
+      title: isNotNil(selectedFieldId) ? t("neetoForm.questions.address.editField") : t("neetoForm.questions.address.addField"),
+      onClose: function onClose() {
+        setIsAddressFieldPaneOpen(false);
+        setSelectedFieldId(null);
+      }
+    }), /*#__PURE__*/jsx(Alert, {
+      isOpen: isDeleteAddressFieldAlertOpen,
+      submitButtonLabel: t("neetoForm.common.delete"),
+      title: t("neetoForm.questions.address.deleteAlert.title"),
+      message: /*#__PURE__*/jsx(Trans, {
+        i18nKey: "neetoForm.questions.address.deleteAlert.message",
+        values: {
+          label: (_findById = findById(selectedFieldId, fields)) === null || _findById === void 0 ? void 0 : _findById.label
+        }
+      }),
+      onClose: function onClose() {
+        setIsDeleteAddressFieldAlertOpen(false);
+        setSelectedFieldId(null);
+      },
+      onSubmit: function onSubmit() {
+        setIsDeleteAddressFieldAlertOpen(false);
+        handleDelete();
+        setSelectedFieldId(null);
+      }
+    })]
+  });
+};
+
+var Captcha = withT(function (_ref) {
+  var t = _ref.t;
+  return /*#__PURE__*/jsxs(Radio, {
+    label: t("neetoForm.common.captchaType"),
+    labelProps: {
+      required: true
+    },
+    name: "variant",
+    children: [/*#__PURE__*/jsx(Radio.Item, {
+      label: t("neetoForm.common.reCaptchaV2"),
+      value: CAPTCHA_TYPES.RECAPTCHA_V2
+    }), /*#__PURE__*/jsx(Radio.Item, {
+      label: t("neetoForm.common.mathCaptcha"),
+      value: CAPTCHA_TYPES.MATH_CAPTCHA
+    })]
+  });
+});
+
+var _excluded$4 = ["name", "title", "className"];
+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), true).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 SwitchBlock = function SwitchBlock(_ref) {
+  var name = _ref.name,
+    title = _ref.title,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    otherProps = _objectWithoutProperties(_ref, _excluded$4);
+  return /*#__PURE__*/jsxs(Label, {
+    className: classnames("flex items-center justify-start gap-2 ", className),
+    "data-testid": "neeto-form-engine-".concat(hyphenate(title && name), "-toggle-label"),
+    children: [/*#__PURE__*/jsx(Switch, _objectSpread$7(_objectSpread$7({}, _objectSpread$7(_objectSpread$7({}, otherProps), {}, {
+      name: name
+    })), {}, {
+      "data-testid": "neeto-form-engine-".concat(hyphenate(title && name), "-switch")
+    })), /*#__PURE__*/jsx(Typography, {
+      component: "span",
+      style: "body1",
+      children: title
+    })]
+  });
+};
+
+var DOMAIN_RESTRICTION_TRANSLATIONS = {
+  whitelistedDomains: {
+    title: t("neetoForm.domainRestriction.whitelistedDomains.label"),
+    description: t("neetoForm.domainRestriction.whitelistedDomains.description"),
+    popoverDescription: t("neetoForm.domainRestriction.whitelistedDomains.popoverDescription")
+  },
+  blacklistedDomains: {
+    title: t("neetoForm.domainRestriction.blacklistedDomains.label"),
+    description: t("neetoForm.domainRestriction.blacklistedDomains.description"),
+    popoverDescription: t("neetoForm.domainRestriction.blacklistedDomains.popoverDescription")
+  }
+};
+var EMAIL_VERIFICATION_TRANSLATIONS = {
+  title: t("neetoForm.emailVerification.label"),
+  popoverDescription: t("neetoForm.emailVerification.popoverDescription")
+};
+
+var _excluded$3 = ["children"];
+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), true).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 STYLES = {
+  border: {
+    "default": "1px solid rgb(var(--neeto-ui-gray-400))",
+    error: "1px solid rgb(var(--neeto-ui-error-800)) !important"
+  },
+  color: {
+    "default": "rgb(var(--neeto-ui-gray-800))",
+    error: "rgb(var(--neeto-ui-error-800)) !important"
+  }
+};
+var MultiValueRemove = function MultiValueRemove(props) {
+  return /*#__PURE__*/jsx(components.MultiValueRemove, _objectSpread$6(_objectSpread$6({}, props), {}, {
+    innerProps: _objectSpread$6(_objectSpread$6({}, props.innerProps), {}, _defineProperty({}, "data-testid", "".concat(hyphenize(props.data.label), "-remove-icon"))),
+    children: /*#__PURE__*/jsx(Close, {
+      size: 16
+    })
+  }));
+};
+var ValueContainer = function ValueContainer(_ref) {
+  var children = _ref.children,
+    props = _objectWithoutProperties(_ref, _excluded$3);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var getValue = props.getValue,
+    _props$selectProps = props.selectProps,
+    isFocused = _props$selectProps.isFocused,
+    visibleDomainsCount = _props$selectProps.visibleDomainsCount;
+  var value = getValue();
+  var _children = _toArray(children),
+    firstChild = _children[0],
+    rest = _children.slice(1);
+  var shouldCollapse = !isFocused && value.length > visibleDomainsCount;
+  return /*#__PURE__*/jsxs(components.ValueContainer, _objectSpread$6(_objectSpread$6({}, props), {}, {
+    innerProps: _objectSpread$6(_objectSpread$6({}, props.innerProps), {}, _defineProperty({}, "data-testid", "multi-domain-input-container")),
+    children: [shouldCollapse ? firstChild.slice(0, visibleDomainsCount) : firstChild, shouldCollapse && /*#__PURE__*/jsx(Tag, {
+      style: "secondary",
+      label: t("neetoForm.common.remainingItemsCount", {
+        count: value.length - visibleDomainsCount
+      })
+    }), rest]
+  }));
+};
+var ClearIndicator = function ClearIndicator(props) {
+  return /*#__PURE__*/jsx(components.ClearIndicator, _objectSpread$6(_objectSpread$6({}, props), {}, {
+    innerProps: _objectSpread$6(_objectSpread$6({}, props.innerProps), {}, _defineProperty({}, "data-testid", "clear-all-button")),
+    children: /*#__PURE__*/jsx(Close, {
+      className: "cursor-pointer",
+      size: 16
+    })
+  }));
+};
+var ERROR_MESSAGE_DELIMITER = ". ";
+var DELIMITER_KEYS = ["Enter", "Tab", ",", " "];
+var DOMAIN_SEPARATION_REGEX = /[^\s,]+/g;
+var FLEXIBLE_DOMAIN_REGEX = /^[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)+$/;
+var VALID_DOMAIN_REGEX = /^(?:[a-zA-Z0-9-]{1,63}\.)+[a-zA-Z0-9-]{2,63}$/;
+var DOMAIN_VALIDATION_SCHEMA = yup.string().required(t("neetoForm.error.requiredField", {
+  label: t("neetoForm.common.domain")
+})).test("verify domains", t("neetoForm.error.invalidDomain"), function (domain) {
+  return VALID_DOMAIN_REGEX.test(domain);
+});
+var CUSTOM_STYLES = {
+  input: assoc("overflow", "hidden"),
+  multiValue: function multiValue(styles, _ref2) {
+    var valid = _ref2.data.valid;
+    return _objectSpread$6(_objectSpread$6({}, styles), {}, {
+      border: valid ? STYLES.border["default"] : STYLES.border.error,
+      color: valid ? STYLES.color["default"] : STYLES.color.error
+    });
+  }
+};
+var CUSTOM_COMPONENTS = {
+  DropdownIndicator: null,
+  MultiValueRemove: MultiValueRemove,
+  ValueContainer: ValueContainer,
+  ClearIndicator: ClearIndicator
+};
+
+var removeDuplicateErrorMessages = pipe(filter(isNotNil), uniq, join(ERROR_MESSAGE_DELIMITER));
+var formatDomainInputOptions = function formatDomainInputOptions(domain) {
+  var isValid;
+  try {
+    DOMAIN_VALIDATION_SCHEMA.validateSync(domain);
+    isValid = true;
+  } catch (_unused) {
+    isValid = false;
+  }
+  return {
+    label: domain,
+    value: domain,
+    valid: isValid
+  };
+};
+var pruneDuplicates = pipe(pluck("value"), uniq, map(formatDomainInputOptions));
+var getValidDomains = function getValidDomains(domains) {
+  return domains.filter(function (domain) {
+    return domain === null || domain === void 0 ? void 0 : domain.valid;
+  });
+};
+var getValidDomainsCount = function getValidDomainsCount(domains) {
+  return getValidDomains(domains).length;
+};
+var formatErrorMessage = function formatErrorMessage(error) {
+  if (typeof error === "string") return error;
+  return removeDuplicateErrorMessages(error);
+};
+
+var _excluded$2 = ["label", "value", "onChange", "error", "onBlur"];
+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), true).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 MultiDomainInput = function MultiDomainInput(_ref) {
+  var _ref$label = _ref.label,
+    label = _ref$label === void 0 ? "" : _ref$label,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? [] : _ref$value,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? noop : _ref$onChange,
+    _ref$error = _ref.error,
+    error = _ref$error === void 0 ? "" : _ref$error,
+    _ref$onBlur = _ref.onBlur,
+    onBlur = _ref$onBlur === void 0 ? noop : _ref$onBlur,
+    otherProps = _objectWithoutProperties(_ref, _excluded$2);
+  var _useState = useState(""),
+    _useState2 = _slicedToArray(_useState, 2),
+    inputValue = _useState2[0],
+    setInputValue = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isFocused = _useState4[0],
+    setIsFocused = _useState4[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var handleFilterDomains = function handleFilterDomains() {
+    return onChange(getValidDomains(value));
+  };
+  var handleDomainChange = function handleDomainChange() {
+    var inputValues = inputValue.match(DOMAIN_SEPARATION_REGEX) || [];
+    var domainMatches = filter(test(FLEXIBLE_DOMAIN_REGEX), inputValues);
+    var domains = domainMatches.map(formatDomainInputOptions);
+    onChange(pruneDuplicates([].concat(_toConsumableArray(value), _toConsumableArray(domains))));
+    setInputValue("");
+  };
+  var handleKeyDown = function handleKeyDown(event) {
+    if (!inputValue) return;
+    if (includes(event.key, DELIMITER_KEYS)) {
+      handleDomainChange();
+      event.preventDefault();
+      event.stopPropagation();
+    }
+  };
+  var onCreateOption = function onCreateOption(input) {
+    var domain = formatDomainInputOptions(input);
+    onChange(pruneDuplicates([].concat(_toConsumableArray(value), [domain])));
+  };
+  var handleBlur = function handleBlur(event) {
+    inputValue ? handleDomainChange() : onBlur(event);
+    setIsFocused(false);
+  };
+  var isFilterDomainsLinkVisible = value.length > getValidDomainsCount(value);
+  return /*#__PURE__*/jsxs("div", {
+    className: "neeto-ui-input__wrapper neeto-ui-email-input__wrapper",
+    children: [/*#__PURE__*/jsx("div", {
+      className: "neeto-ui-email-input__label-wrapper",
+      children: /*#__PURE__*/jsx(Label, {
+        className: "neeto-ui-email-input__label",
+        "data-testid": "".concat(hyphenize(label), "-input-label"),
+        children: label
+      })
+    }), /*#__PURE__*/jsx(CreatableSelect, _objectSpread$5({
+      isMulti: true,
+      required: true,
+      classNamePrefix: "neeto-ui-react-select",
+      components: CUSTOM_COMPONENTS,
+      menuIsOpen: false,
+      visibleDomainsCount: 3,
+      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$5(_objectSpread$5({}, CUSTOM_STYLES), {}, {
+        control: mergeLeft({
+          maxHeight: "200px",
+          overflowY: "auto"
+        })
+      }),
+      onBlur: handleBlur,
+      onFocus: function onFocus() {
+        return setIsFocused(true);
+      },
+      onInputChange: setInputValue,
+      onKeyDown: handleKeyDown
+    }, _objectSpread$5({
+      inputValue: inputValue,
+      isFocused: isFocused,
+      onChange: onChange,
+      onCreateOption: onCreateOption,
+      value: value
+    }, otherProps))), !!error && /*#__PURE__*/jsxs("p", {
+      className: "neeto-ui-input__error",
+      "data-testid": "".concat(hyphenize(label), "-input-error"),
+      children: [formatErrorMessage(error), isFilterDomainsLinkVisible && /*#__PURE__*/jsxs("span", {
+        className: "neeto-ui-font-semibold cursor-pointer",
+        onClick: handleFilterDomains,
+        children: [ERROR_MESSAGE_DELIMITER, t("neetoForm.domainRestriction.removeInvalidDomains")]
+      })]
+    }), /*#__PURE__*/jsx("p", {
+      className: "neeto-ui-input__help-text",
+      "data-testid": "".concat(hyphenize(label), "-input-help"),
+      children: t("neetoForm.domainRestriction.helpText")
+    })]
+  });
+};
+
+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), true).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 validateDomains = function validateDomains(value) {
+  var schema = yup.array().of(yup.string().test("verify domains", t("neetoForm.error.invalidDomain"), function (domain) {
+    return VALID_DOMAIN_REGEX.test(domain);
+  })).ensure().compact().min(1, t("neetoForm.error.minOneEntity", {
+    entity: t("neetoForm.common.domain")
+  }));
+
+  // eslint-disable-next-line no-async-promise-executor
+  return new Promise(/*#__PURE__*/function () {
+    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;
+            _context.next = 3;
+            return schema.validate(value);
+          case 3:
+            resolve(undefined);
+            _context.next = 9;
+            break;
+          case 6:
+            _context.prev = 6;
+            _context.t0 = _context["catch"](0);
+            resolve(_context.t0.message);
+          case 9:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, null, [[0, 6]]);
+    }));
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }());
+};
+var buildHelpPopoverLabelProps = function buildHelpPopoverLabelProps(popoverDescription, helpLink) {
+  return {
+    helpIconProps: {
+      "data-testid": "help-popover-button",
+      popoverProps: _objectSpread$4({
+        description: popoverDescription
+      }, helpLink && {
+        helpLinkProps: {
+          href: helpLink,
+          label: t("neetoForm.common.viewHelpArticle")
+        }
+      })
+    }
+  };
+};
+
+var EmailDomains = function EmailDomains(_ref) {
+  var name = _ref.name,
+    label = _ref.label;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useField = useField({
+      name: name,
+      validate: validateDomains
+    }),
+    _useField2 = _slicedToArray(_useField, 3),
+    _useField2$0$value = _useField2[0].value,
+    domains = _useField2$0$value === void 0 ? [] : _useField2$0$value,
+    meta = _useField2[1],
+    _useField2$ = _useField2[2],
+    setValue = _useField2$.setValue,
+    setTouched = _useField2$.setTouched;
+  var formattedDomains = map(formatDomainInputOptions, domains);
+  return /*#__PURE__*/jsx("div", {
+    className: "mb-4",
+    children: /*#__PURE__*/jsx(MultiDomainInput, {
+      label: label,
+      name: name,
+      error: meta.touched ? meta.error : "",
+      placeholder: t("neetoForm.domainRestriction.placeholder"),
+      value: formattedDomains,
+      onBlur: function onBlur() {
+        return setTouched(true);
+      },
+      onChange: function onChange(value) {
+        return setValue(nullSafe(pluck)("value", value));
+      }
+    })
+  });
+};
+
+var RestrictDomainsBlock = function RestrictDomainsBlock(_ref) {
+  var switchName = _ref.switchName,
+    domainName = _ref.domainName,
+    isDomainRestrictionEnabled = _ref.isDomainRestrictionEnabled;
+  var _useBuildFormStore = useBuildFormStore(paths([["formState", "helpDocUrls", domainName], ["formState", "hostSpecificData", domainName]])),
+    _useBuildFormStore2 = _slicedToArray(_useBuildFormStore, 2),
+    helpLink = _useBuildFormStore2[0],
+    hostSpecificTranslations = _useBuildFormStore2[1];
+  var _mergeLeft = mergeLeft(hostSpecificTranslations, DOMAIN_RESTRICTION_TRANSLATIONS[domainName]),
+    title = _mergeLeft.title,
+    description = _mergeLeft.description,
+    popoverDescription = _mergeLeft.popoverDescription;
+  return /*#__PURE__*/jsxs("div", {
+    className: "flex flex-col space-y-4",
+    "data-testid": "".concat(hyphenate(switchName), "-container"),
+    children: [/*#__PURE__*/jsx(SwitchBlock, {
+      label: title,
+      labelProps: buildHelpPopoverLabelProps(popoverDescription, helpLink),
+      name: switchName
+    }), isDomainRestrictionEnabled && /*#__PURE__*/jsx(EmailDomains, {
+      label: description,
+      name: domainName
+    })]
+  });
+};
+
+var VerifyEmails = function VerifyEmails() {
+  var _useBuildFormStore = useBuildFormStore(paths([["formState", "helpDocUrls", "emailVerification"], ["formState", "hostSpecificData", "emailVerification"]])),
+    _useBuildFormStore2 = _slicedToArray(_useBuildFormStore, 2),
+    helpLink = _useBuildFormStore2[0],
+    hostSpecificTranslations = _useBuildFormStore2[1];
+  var _mergeLeft = mergeLeft(hostSpecificTranslations, EMAIL_VERIFICATION_TRANSLATIONS),
+    title = _mergeLeft.title,
+    popoverDescription = _mergeLeft.popoverDescription;
+  return /*#__PURE__*/jsx("div", {
+    "data-testid": "email-verification-switch-container",
+    children: /*#__PURE__*/jsx(Switch, {
+      label: title,
+      labelProps: buildHelpPopoverLabelProps(popoverDescription, helpLink),
+      name: "isVerificationEnabled"
+    })
+  });
+};
+
+var Email = function Email(_ref) {
+  var usesCustomSubmissionComponent = _ref.usesCustomSubmissionComponent;
+  var _useFormikContext = useFormikContext(),
+    _useFormikContext$val = _useFormikContext.values,
+    _useFormikContext$val2 = _useFormikContext$val.isDomainWhitelistingEnabled,
+    isDomainWhitelistingEnabled = _useFormikContext$val2 === void 0 ? false : _useFormikContext$val2,
+    _useFormikContext$val3 = _useFormikContext$val.isDomainBlacklistingEnabled,
+    isDomainBlacklistingEnabled = _useFormikContext$val3 === void 0 ? false : _useFormikContext$val3;
+  return /*#__PURE__*/jsx("div", {
+    className: "flex flex-col space-y-4",
+    children: !usesCustomSubmissionComponent && /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsx(RestrictDomainsBlock, {
+        domainName: "whitelistedDomains",
+        isDomainRestrictionEnabled: isDomainWhitelistingEnabled,
+        switchName: "isDomainWhitelistingEnabled"
+      }), /*#__PURE__*/jsx(RestrictDomainsBlock, {
+        domainName: "blacklistedDomains",
+        isDomainRestrictionEnabled: isDomainBlacklistingEnabled,
+        switchName: "isDomainBlacklistingEnabled"
+      }), /*#__PURE__*/jsx(VerifyEmails, {})]
+    })
+  });
+};
+
+var FileGroup = function FileGroup(_ref) {
+  var name = _ref.name,
+    label = _ref.label,
+    checked = _ref.checked,
+    handleAllowedFileTypesChange = _ref.handleAllowedFileTypesChange;
+  return /*#__PURE__*/jsx(Checkbox, {
+    checked: checked,
+    label: label,
+    name: name,
+    "data-testid": "neeto-form-engine-file-type-".concat(name),
+    id: name,
+    onChange: handleAllowedFileTypesChange
+  });
+};
+
+var buildFileTypesList = function buildFileTypesList(fileTypes) {
+  return (fileTypes !== null && fileTypes !== void 0 ? fileTypes : "").split(", ");
+};
+var getAllowedFileTypes = function getAllowedFileTypes(_ref) {
+  var type = _ref.type,
+    isChecked = _ref.isChecked,
+    allowedFileTypes = _ref.allowedFileTypes;
+  var fileTypes = buildFileTypesList(allowedFileTypes);
+  if (isChecked) {
+    var fileTypesSet = new Set([].concat(_toConsumableArray(FILE_TYPES_MAP[type]), _toConsumableArray(fileTypes)));
+    return Array.from(fileTypesSet).join(", ");
+  }
+  var newFileTypes = difference(fileTypes, FILE_TYPES_MAP[type]);
+  return newFileTypes.join(", ");
+};
+var isFileTypeEnabled = function isFileTypeEnabled(type, allowedFileTypes) {
+  var fileTypes = buildFileTypesList(allowedFileTypes);
+  return isEmpty(difference(FILE_TYPES_MAP[type], fileTypes));
+};
+
+var FileUpload = function FileUpload() {
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useFormikContext = useFormikContext(),
+    values = _useFormikContext.values,
+    setFieldValue = _useFormikContext.setFieldValue;
+  var allowedFileTypes = prop("allowedFileTypes", values);
+  var handleAllowedFileTypesChange = function handleAllowedFileTypesChange(_ref) {
+    var _ref$target = _ref.target,
+      fileType = _ref$target.name,
+      checked = _ref$target.checked;
+    return setFieldValue("allowedFileTypes", getAllowedFileTypes({
+      type: fileType,
+      isChecked: checked,
+      allowedFileTypes: allowedFileTypes
+    }));
+  };
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx("div", {
+      className: "w-full",
+      children: /*#__PURE__*/jsx(Checkbox$1, {
+        id: "multipleFilesAllowed",
+        label: t("neetoForm.fileUpload.enableMultipleFilesUpload"),
+        name: "multipleFilesAllowed"
+      })
+    }), /*#__PURE__*/jsxs("div", {
+      className: "flex flex-col space-y-3",
+      children: [/*#__PURE__*/jsx(Typography, {
+        style: "body1",
+        weight: "semibold",
+        children: t("neetoForm.fileUpload.fileTypes")
+      }), /*#__PURE__*/jsx("div", {
+        className: "flex space-x-4",
+        children: FILE_GROUPS.map(function (_ref2) {
+          var name = _ref2.name,
+            label = _ref2.label;
+          return /*#__PURE__*/createElement(FileGroup, {
+            handleAllowedFileTypesChange: handleAllowedFileTypesChange,
+            label: label,
+            name: name,
+            checked: isFileTypeEnabled(name, allowedFileTypes),
+            key: name
+          });
+        })
+      })]
+    })]
+  });
+};
+
+var OpinionScale = function OpinionScale() {
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useFormikContext = useFormikContext(),
+    setFieldValue = _useFormikContext.setFieldValue,
+    _useFormikContext$val = _useFormikContext.values.hasOpinionLabels,
+    hasOpinionLabels = _useFormikContext$val === void 0 ? false : _useFormikContext$val;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      className: "flex space-x-4",
+      children: [/*#__PURE__*/jsx(Select, {
+        className: "w-1/2",
+        "data-testid": "neeto-form-engine-opinion-scale-min-value",
+        label: t("neetoForm.common.start"),
+        name: "minValue",
+        options: OPINION_SCALE_MIN_VALUE_OPTIONS,
+        onChange: function onChange(option) {
+          return setFieldValue("minValue", option === null || option === void 0 ? void 0 : option.value);
+        }
+      }), /*#__PURE__*/jsx(Select, {
+        className: "w-1/2",
+        "data-testid": "neeto-form-engine-opinion-scale-max-value",
+        label: t("neetoForm.common.end"),
+        name: "maxValue",
+        options: OPINION_SCALE_MAX_VALUE_OPTIONS,
+        onChange: function onChange(option) {
+          return setFieldValue("maxValue", option === null || option === void 0 ? void 0 : option.value);
+        }
+      })]
+    }), /*#__PURE__*/jsx(Switch, {
+      "data-testid": "neeto-form-engine-opinion-scale-show-labels-switch",
+      label: t("neetoForm.questions.opinionScale.showLabels"),
+      name: "hasOpinionLabels"
+    }), hasOpinionLabels && /*#__PURE__*/jsxs("div", {
+      className: "flex space-x-4",
+      children: [/*#__PURE__*/jsx(Input, {
+        className: "w-1/2",
+        "data-testid": "neeto-form-engine-opinion-scale-left-label",
+        label: t("neetoForm.questions.opinionScale.leftLabel"),
+        maxLength: OPINION_LABEL_MAX_LENGTH,
+        name: "leftOpinionLabel"
+      }), /*#__PURE__*/jsx(Input, {
+        className: "w-1/2",
+        "data-testid": "neeto-form-engine-opinion-scale-right-label",
+        label: t("neetoForm.questions.opinionScale.rightLabel"),
+        maxLength: OPINION_LABEL_MAX_LENGTH,
+        name: "rightOpinionLabel"
+      })]
+    })]
+  });
+};
+
+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), true).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 Options = function Options(_ref) {
+  var questionProps = _ref.questionProps;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useBuildFormStore = useBuildFormStore(function (store) {
+      var _store$formState, _store$formState2;
+      return {
+        selectedLanguage: (_store$formState = store["formState"]) === null || _store$formState === void 0 ? void 0 : _store$formState["selectedLanguage"],
+        isPictureChoiceEnabled: (_store$formState2 = store["formState"]) === null || _store$formState2 === void 0 ? void 0 : _store$formState2["isPictureChoiceEnabled"]
+      };
+    }, shallow),
+    selectedLanguage = _useBuildFormStore.selectedLanguage,
+    isPictureChoiceEnabled = _useBuildFormStore.isPictureChoiceEnabled;
+  var bulkAddHelpDocUrl = useHelpDoc("bulkAddOptions");
+  var _useFormikContext = useFormikContext(),
+    values = _useFormikContext.values,
+    setFieldValue = _useFormikContext.setFieldValue;
+  var name = "optionsAttributes";
+  var _useField = useField(name),
+    _useField2 = _slicedToArray(_useField, 3);
+    _useField2[0];
+    _useField2[1];
+    var setOptionsAttributes = _useField2[2].setValue;
+  var _ref2 = questionProps || {},
+    _ref2$optionLabelProp = _ref2.optionLabelProps,
+    optionLabelProps = _ref2$optionLabelProp === void 0 ? {} : _ref2$optionLabelProp,
+    _ref2$freezeOptions = _ref2.freezeOptions,
+    freezeOptions = _ref2$freezeOptions === void 0 ? false : _ref2$freezeOptions,
+    _ref2$disableAddOptio = _ref2.disableAddOption,
+    disableAddOption = _ref2$disableAddOptio === void 0 ? false : _ref2$disableAddOptio,
+    _ref2$disableRemoveOp = _ref2.disableRemoveOption,
+    disableRemoveOption = _ref2$disableRemoveOp === void 0 ? false : _ref2$disableRemoveOp;
+  var isManageOptionDisabled = isFunction(freezeOptions) ? freezeOptions(selectedLanguage) : freezeOptions;
+  var isAddOptionDisabled = disableAddOption || isManageOptionDisabled;
+  var isRemoveOptionDisabled = disableRemoveOption || isManageOptionDisabled;
+  var isDropdown = values.kind === QUESTION_TYPES.DROPDOWN;
+  var isPictureChoice = isPictureChoiceEnabled && !isDropdown && (values.isPictureChoice || DEFAULT_CHOICE_QUESTION_ATTRIBUTES.isPictureChoice);
+  var imageHeight = values.imageHeight || DEFAULT_CHOICE_QUESTION_ATTRIBUTES.imageHeight;
+  var handleImageHeightChange = function handleImageHeightChange(value) {
+    setFieldValue("imageHeight", value);
+  };
+  return /*#__PURE__*/jsxs("div", {
+    className: "w-full space-y-4",
+    children: [/*#__PURE__*/jsxs("div", {
+      children: [/*#__PURE__*/jsx(Label, _objectSpread$3(_objectSpread$3({
+        className: "mb-2 block"
+      }, optionLabelProps), {}, {
+        children: t("neetoForm.questions.common.questionFields.field.options")
+      })), /*#__PURE__*/jsx("div", {
+        className: classnames(["neeto-form-engine-fields-wrapper", {
+          "neeto-form-engine-fields-wrapper--fit-image": values.shouldFitImages
+        }]),
+        style: {
+          "--neeto-form-engine-picture-choice-image-height": "".concat(values.imageHeight, "px")
+        },
+        children: /*#__PURE__*/jsx(OptionFields, {
+          isPictureChoice: isPictureChoice,
+          name: name,
+          shouldDestroy: true,
+          bulkActionProps: {
+            enabled: true,
+            bulkAddHelpDocUrl: bulkAddHelpDocUrl
+          },
+          destroyFlagName: "_destroy",
+          disabled: isManageOptionDisabled,
+          draggable: !isManageOptionDisabled,
+          isAddOptionEnabled: !isAddOptionDisabled,
+          isDeleteOptionEnabled: !isRemoveOptionDisabled,
+          isNewItemsPrefilled: isDefaultLanguage(selectedLanguage),
+          minOptions: MINIMUM_OPTIONS,
+          shouldResetEmptyOptionOnBlur: false,
+          onChange: setOptionsAttributes
+        })
+      })]
+    }), !isDropdown && isPictureChoiceEnabled && /*#__PURE__*/jsxs(Block, {
+      title: t("neetoForm.questions.common.questionFields.field.pictureChoiceSettings"),
+      children: [/*#__PURE__*/jsx(Switch, {
+        name: "isPictureChoice",
+        label: t("neetoForm.questions.common.questionFields.field.addPicturesToOptions")
+      }), isPictureChoice && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Switch, {
+          name: "shouldFitImages",
+          label: t("neetoForm.questions.common.questionFields.field.fitImages"),
+          labelProps: {
+            helpIconProps: {
+              "data-testid": "fit-images-help-popover-button",
+              popoverProps: {
+                position: "top",
+                description: t("neetoForm.questions.common.questionFields.field.fitImagesHelpDescription")
+              }
+            }
+          }
+        }), /*#__PURE__*/jsxs("div", {
+          className: "mt-4",
+          children: [/*#__PURE__*/jsx(Typography, {
+            style: "body2",
+            weight: "medium",
+            children: t("neetoForm.questions.common.questionFields.field.imageHeight")
+          }), /*#__PURE__*/jsx(Slider, {
+            max: IMAGE_HEIGHT_SLIDER_DEFAULTS.max,
+            min: IMAGE_HEIGHT_SLIDER_DEFAULTS.min,
+            value: imageHeight,
+            onChange: handleImageHeightChange
+          })]
+        })]
+      })]
+    })]
+  });
+};
+
+var RatingItem = function RatingItem(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/jsx("div", {
+    className: "flex w-16 flex-col items-center gap-3",
+    children: children
+  });
+};
+var Rating = function Rating() {
+  return /*#__PURE__*/jsx("div", {
+    className: "flex flex-col",
+    children: /*#__PURE__*/jsx("div", {
+      className: "w-full",
+      children: /*#__PURE__*/jsx("div", {
+        className: "flex gap-6",
+        children: RATING_OPTIONS.map(function (_ref2) {
+          var Icon = _ref2.icon,
+            name = _ref2.name,
+            color = _ref2.color;
+          return /*#__PURE__*/jsxs(RatingItem, {
+            children: [/*#__PURE__*/jsx(Icon, {
+              color: color,
+              size: 48
+            }), /*#__PURE__*/jsx(InputWithMaxLength, {
+              name: name,
+              "data-testid": "neeto-form-engine-".concat(hyphenate(name))
+            })]
+          }, name);
+        })
+      })
+    })
+  });
+};
+
+var StarRating = function StarRating() {
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useFormikContext = useFormikContext(),
+    setFieldValue = _useFormikContext.setFieldValue;
+  var _useField = useField("iconType"),
+    _useField2 = _slicedToArray(_useField, 3),
+    iconType = _useField2[0].value;
+    _useField2[1];
+    var setIconType = _useField2[2].setValue;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsxs("div", {
+      className: "flex space-x-4",
+      children: [/*#__PURE__*/jsx(Select, {
+        className: "w-1/2",
+        "data-testid": "neeto-form-engine-star-rating-min-value",
+        label: t("neetoForm.common.start"),
+        name: "minValue",
+        options: STAR_RATING_MIN_VALUE_OPTIONS,
+        onChange: function onChange(option) {
+          return setFieldValue("minValue", option === null || option === void 0 ? void 0 : option.value);
+        }
+      }), /*#__PURE__*/jsx(Select, {
+        className: "w-1/2",
+        "data-testid": "neeto-form-engine-star-rating-max-value",
+        label: t("neetoForm.common.end"),
+        name: "maxValue",
+        options: STAR_RATING_MAX_VALUE_OPTIONS,
+        onChange: function onChange(option) {
+          return setFieldValue("maxValue", option === null || option === void 0 ? void 0 : option.value);
+        }
+      })]
+    }), /*#__PURE__*/jsx(Label, {
+      children: t("neetoForm.common.shape")
+    }), /*#__PURE__*/jsx("div", {
+      className: "flex gap-2",
+      children: Object.entries(STAR_RATING_ICONS_MAP).map(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+          name = _ref2[0],
+          IconType = _ref2[1];
+        var isActive = name === iconType;
+        return /*#__PURE__*/jsx("div", {
+          "data-testid": "neeto-form-engine-star-rating-icon-".concat(name),
+          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
+          }),
+          onClick: function onClick() {
+            return setIconType(name);
+          },
+          children: /*#__PURE__*/jsx(IconType, {})
+        }, name);
+      })
+    })]
+  });
+};
+
+var _excluded$1 = ["fields"];
+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), true).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 CHECKBOX = QUESTION_TYPES.CHECKBOX,
+  RADIO = QUESTION_TYPES.RADIO,
+  DROPDOWN = QUESTION_TYPES.DROPDOWN,
+  STAR_RATING = QUESTION_TYPES.STAR_RATING,
+  OPINION_SCALE = QUESTION_TYPES.OPINION_SCALE,
+  RATING = QUESTION_TYPES.RATING,
+  FILE_UPLOAD = QUESTION_TYPES.FILE_UPLOAD,
+  CAPTCHA = QUESTION_TYPES.CAPTCHA,
+  EMAIL = QUESTION_TYPES.EMAIL,
+  ADDRESS = QUESTION_TYPES.ADDRESS;
+var transformValueForOption = function transformValueForOption(_ref) {
+  var label = _ref.label,
+    type = _ref.type;
+  return "".concat(slugify(label), "-").concat(type);
+};
+var omitDraftId = modifyBy({
+  id: startsWith(DRAFT_ID_PREFIX)
+}, omit(["id"]));
+var renderAdditionalData = function renderAdditionalData(_ref2) {
+  var kind = _ref2.kind,
+    questionProps = _ref2.questionProps,
+    usesCustomSubmissionComponent = _ref2.usesCustomSubmissionComponent;
+  switch (kind) {
+    case CHECKBOX:
+    case RADIO:
+    case DROPDOWN:
+      return /*#__PURE__*/jsx(Options, {
+        questionProps: questionProps
+      });
+    case RATING:
+      return /*#__PURE__*/jsx(Rating, {});
+    case STAR_RATING:
+      return /*#__PURE__*/jsx(StarRating, {});
+    case OPINION_SCALE:
+      return /*#__PURE__*/jsx(OpinionScale, {});
+    case FILE_UPLOAD:
+      return /*#__PURE__*/jsx(FileUpload, {});
+    case CAPTCHA:
+      return /*#__PURE__*/jsx(Captcha, {});
+    case ADDRESS:
+      return /*#__PURE__*/jsx(Address, {});
+    case EMAIL:
+      return !usesCustomSubmissionComponent && /*#__PURE__*/jsx(Email, {
+        usesCustomSubmissionComponent: usesCustomSubmissionComponent
+      });
+    default:
+      return null;
+  }
+};
+var resolveActionComponent = function resolveActionComponent(action) {
+  return equals(action, QUESTION_ACTIONS.ADD) ? Add : Edit;
+};
+var getQuestionKind = function getQuestionKind(questionKinds, pattern) {
+  var questionKind = findBy(pattern, questionKinds);
+  return questionKind ? assoc("kind", questionKind.type, questionKind) : null;
+};
+var buildKindOptions = function buildKindOptions(kinds) {
+  return kinds.map(function (_ref3) {
+    var label = _ref3.label,
+      type = _ref3.type;
+    return {
+      label: label,
+      value: transformValueForOption({
+        label: label,
+        type: type
+      })
+    };
+  });
+};
+var extractKindFromOption = pipe(split("-"), last);
+var buildDefaultValueForKind = function buildDefaultValueForKind(questionKind) {
+  return isPresent(questionKind) ? {
+    value: transformValueForOption(questionKind)
+  } : undefined;
+};
+var hideSwitchLabelProps = function hideSwitchLabelProps(helpUrl) {
+  return helpUrl ? {
+    helpIconProps: {
+      "data-testid": "help-popover-button",
+      popoverProps: {
+        description: t("neetoForm.questions.common.questionFields.field.hideQuestionHelpDescription"),
+        helpLinkProps: {
+          href: helpUrl,
+          label: t("neetoForm.common.viewHelpArticle")
+        }
+      }
+    }
+  } : undefined;
+};
+var responseVisibleOnlyToHostSwitchLabelProps = function responseVisibleOnlyToHostSwitchLabelProps(helpUrl) {
+  return {
+    helpIconProps: {
+      "data-testid": "help-popover-button",
+      popoverProps: {
+        description: t("neetoForm.questions.common.questionFields.field.responseVisibleOnlyToHostHelpDescription"),
+        helpLinkProps: {
+          href: helpUrl,
+          label: t("neetoForm.common.viewHelpArticle")
+        }
+      }
+    }
+  };
+};
+var readOnlySwitchLabelProps = function readOnlySwitchLabelProps(helpUrl) {
+  return {
+    helpIconProps: {
+      "data-testid": "help-popover-button",
+      popoverProps: {
+        description: t("neetoForm.questions.common.questionFields.field.readOnlyHelpDescription"),
+        helpLinkProps: helpUrl ? {
+          href: helpUrl,
+          label: t("neetoForm.common.viewHelpArticle")
+        } : undefined
+      }
+    }
+  };
+};
+var transformValues = function transformValues(values) {
+  switch (values.kind) {
+    case QUESTION_TYPES.ADDRESS:
+      {
+        var _values$fields = values.fields,
+          fields = _values$fields === void 0 ? [] : _values$fields,
+          rest = _objectWithoutProperties(values, _excluded$1);
+        return _objectSpread$2(_objectSpread$2({}, rest), {}, {
+          fieldsAttributes: map(renameKey("deleted", "_destroy"), omitDraftId(fields))
+        });
+      }
+    default:
+      return values;
+  }
+};
+
+var _excluded = ["isOpen", "onClose", "action", "question", "availableQuestionKinds"];
+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), true).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 ManageQuestionPane = function ManageQuestionPane(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    action = _ref.action,
+    question = _ref.question,
+    availableQuestionKinds = _ref.availableQuestionKinds,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var initialFocusRef = useRef(null);
+  var Component = resolveActionComponent(action);
+  return /*#__PURE__*/jsx(Pane, {
+    initialFocusRef: initialFocusRef,
+    isOpen: isOpen,
+    onClose: onClose,
+    children: /*#__PURE__*/jsx(Component, _objectSpread$1({}, _objectSpread$1({
+      availableQuestionKinds: availableQuestionKinds,
+      initialFocusRef: initialFocusRef,
+      isOpen: isOpen,
+      onClose: onClose,
+      question: question
+    }, props)))
+  });
+};
+
+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), true).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 AddQuestion = function AddQuestion(_ref) {
+  var onAdd = _ref.onAdd,
+    disabledAddButtonHelpPopoverProps = _ref.disabledAddButtonHelpPopoverProps,
+    isDisabled = _ref.isDisabled,
+    addQuestionHelpProps = _ref.addQuestionHelpProps;
+  var helpPopoverProps = isDisabled ? buildDisabledAddButtonHelpPopoverProps(disabledAddButtonHelpPopoverProps) : {};
+  return /*#__PURE__*/jsxs("div", {
+    className: "mb-8 flex w-full items-center gap-x-1",
+    children: [/*#__PURE__*/jsx(Button, _objectSpread({}, buildAddQuestionButtonProps(onAdd, isDisabled))), isDisabled && /*#__PURE__*/jsx(HelpPopover, _objectSpread({}, helpPopoverProps)), isPresent(addQuestionHelpProps) && !isDisabled && /*#__PURE__*/jsx("span", {
+      children: /*#__PURE__*/jsx(HelpPopover, _objectSpread({}, addQuestionHelpProps))
+    })]
+  });
+};
+
+var Form = function Form(_ref) {
+  var questionKinds = _ref.questionKinds,
+    onValueChange = _ref.onValueChange,
+    formId = _ref.formId,
+    isDeletable = _ref.isDeletable,
+    isRequiredField = _ref.isRequiredField,
+    isKindAlreadyActive = _ref.isKindAlreadyActive,
+    getActiveKindDetails = _ref.getActiveKindDetails,
+    isDisabledFieldLabel = _ref.isDisabledFieldLabel,
+    disabledAddButtonHelpPopoverProps = _ref.disabledAddButtonHelpPopoverProps,
+    isFormEnabled = _ref.isFormEnabled,
+    canManageQuestions = _ref.canManageQuestions,
+    savedTitle = _ref.savedTitle,
+    formTitle = _ref.formTitle,
+    formDescription = _ref.formDescription,
+    selectedLanguage = _ref.selectedLanguage,
+    availableLanguages = _ref.availableLanguages,
+    onLanguageChange = _ref.onLanguageChange,
+    additionalActionOptions = _ref.additionalActionOptions,
+    kindUniqueOn = _ref.kindUniqueOn,
+    helpDocUrls = _ref.helpDocUrls,
+    hostSpecificData = _ref.hostSpecificData,
+    addQuestionHelpProps = _ref.addQuestionHelpProps,
+    isUsingDefaultQuestionKinds = _ref.isUsingDefaultQuestionKinds,
+    usesCustomSubmissionComponent = _ref.usesCustomSubmissionComponent,
+    questionsFromCache = _ref.questionsFromCache,
+    onMutateSuccess = _ref.onMutateSuccess,
+    advancedFeatures = _ref.advancedFeatures,
+    isPictureChoiceEnabled = _ref.isPictureChoiceEnabled;
+  var containerRef = useRef();
+  var _useStateWithDependen = useStateWithDependency(questionsFromCache),
+    _useStateWithDependen2 = _slicedToArray(_useStateWithDependen, 2),
+    questions = _useStateWithDependen2[0],
+    setQuestions = _useStateWithDependen2[1];
+  var _useState = useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    selectedQuestion = _useState2[0],
+    setSelectedQuestion = _useState2[1];
+  var _useState3 = useState(""),
+    _useState4 = _slicedToArray(_useState3, 2),
+    selectedAction = _useState4[0],
+    setSelectedAction = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    isDeleteAlertOpen = _useState6[0],
+    setIsDeleteAlertOpen = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isDeleteSmsReminderModalOpen = _useState8[0],
+    setIsDeleteSmsReminderModalOpen = _useState8[1];
+  var _useState9 = useState(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    isDeleteSpotModalOpen = _useState10[0],
+    setIsDeleteSpotModalOpen = _useState10[1];
+  var _useState11 = useState(false),
+    _useState12 = _slicedToArray(_useState11, 2),
+    isManageQuestionPaneOpen = _useState12[0],
+    setIsManageQuestionPaneOpen = _useState12[1];
+  var setFormData = useBuildFormStore(prop("setFormData"));
+  var _useCreateQuestion = useCreateQuestion(formId, selectedLanguage, {
+      onSuccess: function onSuccess() {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        onMutateSuccess === null || onMutateSuccess === void 0 || onMutateSuccess.apply(void 0, [QUESTION_ACTIONS.CLONE].concat(args));
+        showThumbsUpToastr();
+      }
+    }),
+    createQuestion = _useCreateQuestion.mutate;
+  var _useReorderQuestions = useReorderQuestions(formId, selectedLanguage, {
+      onSuccess: function onSuccess() {
+        for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+          args[_key2] = arguments[_key2];
+        }
+        onMutateSuccess === null || onMutateSuccess === void 0 || onMutateSuccess.apply(void 0, [QUESTION_ACTIONS.REORDER].concat(args));
+        setFormData({
+          isReorderingQuestions: false
+        });
+      }
+    }),
+    reorderQuestions = _useReorderQuestions.mutate;
+  var debouncedReorderQuestions = useFuncDebounce(reorderQuestions, 1000);
+  var handleReorder = function handleReorder(questions) {
+    var payload = {
+      neetoFormQuestions: {
+        questions: buildReorderPayload(questions)
+      },
+      language: selectedLanguage
+    };
+    setFormData({
+      isReorderingQuestions: true
+    });
+    debouncedReorderQuestions(payload);
+  };
+  useEffect(function () {
+    setFormData({
+      formId: formId,
+      enabled: isFormEnabled,
+      title: savedTitle,
+      selectedLanguage: selectedLanguage,
+      helpDocUrls: helpDocUrls,
+      isUsingDefaultQuestionKinds: isUsingDefaultQuestionKinds,
+      usesCustomSubmissionComponent: usesCustomSubmissionComponent,
+      hostSpecificData: hostSpecificData,
+      onMutateSuccess: onMutateSuccess,
+      advancedFeatures: advancedFeatures,
+      onLanguageChange: onLanguageChange,
+      isPictureChoiceEnabled: isPictureChoiceEnabled
+    });
+  }, [formId, isFormEnabled, savedTitle, setFormData, selectedLanguage, helpDocUrls, isUsingDefaultQuestionKinds, usesCustomSubmissionComponent, hostSpecificData, onMutateSuccess, advancedFeatures, onLanguageChange, isPictureChoiceEnabled]);
+  var handleSelect = function handleSelect(question) {
+    setSelectedQuestion(question);
+  };
+  var handleAdd = function handleAdd() {
+    setSelectedAction(QUESTION_ACTIONS.ADD);
+    setIsManageQuestionPaneOpen(true);
+  };
+  var handleEdit = function handleEdit() {
+    setSelectedAction(QUESTION_ACTIONS.EDIT);
+    setIsManageQuestionPaneOpen(true);
+  };
+  var handleClone = function handleClone() {
+    var values = duplicateFieldData({
+      item: selectedQuestion,
+      questionKinds: availableQuestionKinds,
+      questions: questions
+    });
+    var displayOrder = selectedQuestion.displayOrder + 1;
+    var attributes = mergeLeft({
+      displayOrder: displayOrder
+    }, values);
+    var payload = {
+      language: selectedLanguage,
+      neetoFormQuestion: formatQuestionAttributesForClone(attributes)
+    };
+    createQuestion(payload, {
+      onSuccess: function onSuccess(_ref2) {
+        var questions = _ref2.questions;
+        var newQuestion = findBy({
+          displayOrder: displayOrder
+        }, questions);
+        handleSelect(newQuestion);
+      }
+    });
+  };
+  var handleDelete = function handleDelete(question) {
+    if (question.kind === QUESTION_TYPES.SMS_REMINDER) {
+      setIsDeleteSmsReminderModalOpen(true);
+    } else if (question.kind === QUESTION_TYPES.SPOT) {
+      setIsDeleteSpotModalOpen(true);
+    } else {
+      setIsDeleteAlertOpen(true);
+    }
+  };
+  useOnClickOutside(containerRef, function () {
+    return handleSelect({});
+  }, {
+    enabled: !(isDeleteAlertOpen || isManageQuestionPaneOpen || isDeleteSmsReminderModalOpen || isDeleteSpotModalOpen)
+  });
+  useEffect(function () {
+    onValueChange === null || onValueChange === void 0 || onValueChange(questions);
+  }, [questions]);
+  var availableQuestionKinds = getAvailableQuestionKinds({
+    allQuestionKinds: questionKinds,
+    activeQuestions: questions,
+    isKindAlreadyActive: isKindAlreadyActive
+  });
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx(DeleteAlert, {
+      handleSelect: handleSelect,
+      selectedQuestion: selectedQuestion,
+      isOpen: isDeleteAlertOpen,
+      languagesCount: availableLanguages.length,
+      onClose: function onClose() {
+        return setIsDeleteAlertOpen(false);
+      }
+    }), /*#__PURE__*/jsx(DeleteSmsReminderModal, {
+      hostSpecificData: hostSpecificData,
+      isOpen: isDeleteSmsReminderModalOpen,
+      onClose: function onClose() {
+        return setIsDeleteSmsReminderModalOpen(false);
+      }
+    }), /*#__PURE__*/jsx(DeleteSpotModal, {
+      hostSpecificData: hostSpecificData,
+      isOpen: isDeleteSpotModalOpen,
+      onClose: function onClose() {
+        return setIsDeleteSpotModalOpen(false);
+      }
+    }), /*#__PURE__*/jsxs("div", {
+      className: "neeto-form-nano-form-wrapper flex h-full flex-col",
+      children: [formTitle && /*#__PURE__*/jsx(Overview, {
+        additionalActionOptions: additionalActionOptions,
+        availableLanguages: availableLanguages,
+        description: formDescription,
+        title: formTitle
+      }), /*#__PURE__*/jsx("div", {
+        className: "neeto-form-nano-form-wrapper__body min-h-0 w-full grow space-y-6 overflow-y-auto pb-6",
+        children: isPresent(questions) ? /*#__PURE__*/jsxs("div", {
+          className: "space-y-6",
+          ref: containerRef,
+          children: [/*#__PURE__*/jsx(DragDropContext, {
+            onDragEnd: function onDragEnd(_ref3) {
+              var source = _ref3.source,
+                destination = _ref3.destination;
+              return handleFieldDragEnd({
+                source: source,
+                destination: destination,
+                items: questions,
+                setValue: function setValue(orderedQuestions) {
+                  setQuestions(orderedQuestions);
+                  handleReorder(orderedQuestions);
+                }
+              });
+            },
+            children: /*#__PURE__*/jsx(Questions, {
+              canManageQuestions: canManageQuestions,
+              getActiveKindDetails: getActiveKindDetails,
+              isDeletable: isDeletable,
+              questions: questions,
+              selectedQuestion: selectedQuestion,
+              allQuestionKinds: questionKinds,
+              onClone: handleClone,
+              onDelete: handleDelete,
+              onEdit: handleEdit,
+              onSelect: handleSelect
+            })
+          }), canManageQuestions && /*#__PURE__*/jsx("div", {
+            className: "mb-8 flex w-full items-center gap-x-1",
+            children: /*#__PURE__*/jsx(AddQuestion, {
+              addQuestionHelpProps: addQuestionHelpProps,
+              disabledAddButtonHelpPopoverProps: disabledAddButtonHelpPopoverProps,
+              isDisabled: isEmpty(availableQuestionKinds),
+              onAdd: handleAdd
+            })
+          })]
+        }) : /*#__PURE__*/jsx(AddFirstQuestion, {
+          disabledAddButtonHelpPopoverProps: disabledAddButtonHelpPopoverProps,
+          isDisabled: isEmpty(availableQuestionKinds) || !canManageQuestions,
+          onAdd: handleAdd
+        })
+      }), /*#__PURE__*/jsx(ManageQuestionPane, {
+        availableQuestionKinds: availableQuestionKinds,
+        getActiveKindDetails: getActiveKindDetails,
+        handleSelect: handleSelect,
+        isDisabledFieldLabel: isDisabledFieldLabel,
+        isRequiredField: isRequiredField,
+        kindUniqueOn: kindUniqueOn,
+        questions: questions,
+        action: selectedAction,
+        allQuestionKinds: questionKinds,
+        isOpen: isManageQuestionPaneOpen,
+        question: selectedQuestion,
+        onClose: function onClose() {
+          return setIsManageQuestionPaneOpen(false);
+        }
+      })]
+    })]
+  });
+};
+
+var BuildForm = function BuildForm(_ref) {
+  var id = _ref.id,
+    questionKinds = _ref.questionKinds,
+    _ref$isKindAlreadyAct = _ref.isKindAlreadyActive,
+    isKindAlreadyActive = _ref$isKindAlreadyAct === void 0 ? isQuestionKindAlreadyActive : _ref$isKindAlreadyAct,
+    _ref$getActiveKindDet = _ref.getActiveKindDetails,
+    getActiveKindDetails = _ref$getActiveKindDet === void 0 ? getActiveQuestionKindDetails : _ref$getActiveKindDet,
+    kindUniqueOn = _ref.kindUniqueOn,
+    _ref$isQuestionDeleta = _ref.isQuestionDeletable,
+    isQuestionDeletable = _ref$isQuestionDeleta === void 0 ? T : _ref$isQuestionDeleta,
+    _ref$isFieldRequired = _ref.isFieldRequired,
+    isFieldRequired = _ref$isFieldRequired === void 0 ? F : _ref$isFieldRequired,
+    isFieldLabelDisabled = _ref.isFieldLabelDisabled,
+    _ref$formTitle = _ref.formTitle,
+    formTitle = _ref$formTitle === void 0 ? "" : _ref$formTitle,
+    formDescription = _ref.formDescription,
+    _ref$availableLanguag = _ref.availableLanguages,
+    availableLanguages = _ref$availableLanguag === void 0 ? DEFAULT_AVAILABLE_LANGUAGES : _ref$availableLanguag,
+    _ref$selectedLanguage = _ref.selectedLanguage,
+    selectedLanguage = _ref$selectedLanguage === void 0 ? "en" : _ref$selectedLanguage,
+    _ref$onLanguageChange = _ref.onLanguageChange,
+    onLanguageChange = _ref$onLanguageChange === void 0 ? noop : _ref$onLanguageChange,
+    _ref$addQuestionHelpP = _ref.addQuestionHelpProps,
+    addQuestionHelpProps = _ref$addQuestionHelpP === void 0 ? {} : _ref$addQuestionHelpP,
+    _ref$disabledAddButto = _ref.disabledAddButtonHelpPopoverProps,
+    disabledAddButtonHelpPopoverProps = _ref$disabledAddButto === void 0 ? {} : _ref$disabledAddButto,
+    _ref$additionalAction = _ref.additionalActionOptions,
+    additionalActionOptions = _ref$additionalAction === void 0 ? [] : _ref$additionalAction,
+    _ref$allowAdditionalG = _ref.allowAdditionalGuests,
+    allowAdditionalGuests = _ref$allowAdditionalG === void 0 ? false : _ref$allowAdditionalG,
+    _ref$advancedFeatures = _ref.advancedFeatures,
+    advancedFeatures = _ref$advancedFeatures === void 0 ? DEFAULT_ADVANCED_FEATURES : _ref$advancedFeatures,
+    helpDocUrls = _ref.helpDocUrls,
+    className = _ref.className,
+    _ref$usesCustomSubmis = _ref.usesCustomSubmissionComponent,
+    usesCustomSubmissionComponent = _ref$usesCustomSubmis === void 0 ? false : _ref$usesCustomSubmis,
+    _ref$onMutateSuccess = _ref.onMutateSuccess,
+    onMutateSuccess = _ref$onMutateSuccess === void 0 ? noop : _ref$onMutateSuccess,
+    hostSpecificData = _ref.hostSpecificData,
+    _ref$canManageQuestio = _ref.canManageQuestions,
+    canManageQuestions = _ref$canManageQuestio === void 0 ? false : _ref$canManageQuestio,
+    _ref$isPictureChoiceE = _ref.isPictureChoiceEnabled,
+    isPictureChoiceEnabled = _ref$isPictureChoiceE === void 0 ? false : _ref$isPictureChoiceE;
+  var queryClient = useQueryClient();
+  var _useForm = useForm({
+      formId: id,
+      language: selectedLanguage
+    }),
+    data = _useForm.data,
+    isLoading = _useForm.isLoading,
+    isQuestionsPending = _useForm.isPending;
+  var _ref2 = data || QUESTIONS_INITIAL_VALUE,
+    isFormEnabled = _ref2.enabled,
+    savedTitle = _ref2.title,
+    questionsFromCache = _ref2.questions,
+    isQuestionsLoading = _ref2.isQuestionsLoading;
+  if (isLoading || isQuestionsLoading && !isQuestionsPending) {
+    return /*#__PURE__*/jsx("div", {
+      className: "flex h-full w-full items-center justify-center py-6",
+      children: /*#__PURE__*/jsx(Spinner, {})
+    });
+  }
+  var onValueChange = function onValueChange(questions) {
+    var _queryClient$getQuery = queryClient.getQueryState([QUERY_KEYS.QUESTIONS, id, selectedLanguage]),
+      dataUpdateCount = _queryClient$getQuery.dataUpdateCount;
+    if (dataUpdateCount > 0) {
+      queryClient.setQueryData([QUERY_KEYS.QUESTIONS, "preview/".concat(id), selectedLanguage], assoc("questions", questions));
+    }
+  };
+  var isRequiredField = either(isMandatoryField, isFieldRequired);
+  var isDisabledFieldLabel = function isDisabledFieldLabel(field) {
+    return isImmutableField(field) || (isFieldLabelDisabled !== null && isFieldLabelDisabled !== void 0 ? isFieldLabelDisabled : F)(field);
+  };
+  var defaultQuestionKinds = allowAdditionalGuests ? QUESTION_KINDS : removeBy({
+    type: QUESTION_KIND.ADDITIONAL_GUESTS.value
+  }, QUESTION_KINDS);
+  var isUsingDefaultQuestionKinds = isNil(questionKinds);
+  return /*#__PURE__*/jsx("div", {
+    className: classnames("neeto-form-nano-form-outer-wrapper relative", className),
+    children: /*#__PURE__*/jsx(Form, {
+      addQuestionHelpProps: addQuestionHelpProps,
+      additionalActionOptions: additionalActionOptions,
+      advancedFeatures: advancedFeatures,
+      availableLanguages: availableLanguages,
+      canManageQuestions: canManageQuestions,
+      disabledAddButtonHelpPopoverProps: disabledAddButtonHelpPopoverProps,
+      formDescription: formDescription,
+      formTitle: formTitle,
+      getActiveKindDetails: getActiveKindDetails,
+      helpDocUrls: helpDocUrls,
+      hostSpecificData: hostSpecificData,
+      isDisabledFieldLabel: isDisabledFieldLabel,
+      isFormEnabled: isFormEnabled,
+      isKindAlreadyActive: isKindAlreadyActive,
+      isPictureChoiceEnabled: isPictureChoiceEnabled,
+      isRequiredField: isRequiredField,
+      isUsingDefaultQuestionKinds: isUsingDefaultQuestionKinds,
+      kindUniqueOn: kindUniqueOn,
+      onLanguageChange: onLanguageChange,
+      onMutateSuccess: onMutateSuccess,
+      onValueChange: onValueChange,
+      questionsFromCache: questionsFromCache,
+      savedTitle: savedTitle,
+      selectedLanguage: selectedLanguage,
+      usesCustomSubmissionComponent: usesCustomSubmissionComponent,
+      formId: id,
+      isDeletable: isQuestionDeletable,
+      questionKinds: isUsingDefaultQuestionKinds ? defaultQuestionKinds : questionKinds
+    })
+  });
+};
+
+export { BuildForm as default };
+//# sourceMappingURL=BuildForm.js.map