@bigbinary/neeto-form-frontend 4.2.11 → 4.3.0

package/app/javascript/src/translations/en.json

@@ -52,6 +52,7 @@
       "clonedElementLabel": "Copy of {{label, anyCase}}",
       "option": "Option",
       "rating": "Rating",
+      "selection": "Selection",
       "captchaType": "Captcha type",
       "reCaptchaV2": "reCAPTCHA v2",
       "mathCaptcha": "Math captcha",
@@ -82,7 +83,8 @@
       "dif": "Decimal",
       "fileUpload": "File upload",
       "captcha": "Captcha",
-      "smsReminder": "SMS reminder"
+      "smsReminder": "SMS reminder",
+      "opinionScale": "Opinion scale"
     },
     "toasts": {
       "formSubmitted": "Form has been submitted successfully!"
@@ -148,6 +150,13 @@
           }
         }
       },
+      "opinionScale": {
+        "showLabels": "Show labels",
+        "leftLabel": "Left label",
+        "rightLabel": "Right label",
+        "worst": "Worst",
+        "best": "Best"
+      },
       "changeLanguage": "Change language"
     },
     "error": {
@@ -162,6 +171,8 @@
       "minOneEntity": "At least one {{entity}} is required",
       "emailFromRestrictedDomain": "Emails with domain {{domain}} aren't accepted.",
       "mustBeASixDigitNumber": "{{entity}} must be a 6 digit number",
+      "mustBeOrGreaterThanOrEqualTo": "Must be greater than or equal to {{value}}",
+      "mustBeOrLessThanOrEqualTo": "Must be less than or equal to {{value}}",
       "emailNotVerified": "Email verification is required"
     },
     "fileTypes": {

package/dist/BuildForm.js

@@ -3,14 +3,14 @@ import classnames from 'classnames';
 import { isPresent, truncate, findBy, isNotPresent, slugify, existsBy, hyphenate, noop, nullSafe, removeBy } from '@bigbinary/neeto-cist';
 import Spinner from '@bigbinary/neetoui/Spinner';
 import { equals, path, curry, assoc, prop, dissoc, when, includes, isEmpty, reject, keys, pick, omit, evolve, map, mergeLeft, isNil, pipe, filter, isNotNil, uniq, join, pluck, test, paths, difference, split, last, either, T, F } from 'ramda';
-import { k as useDeleteQuestion, Q as QUESTION_TYPES, a as useForm, l as useCreateQuestion, m as useUpdateQuestion, C as CAPTCHA_TYPES, n as useReorderQuestions, i as QUERY_KEYS } from './constants-51SEJjzI.js';
-import { f as buildDisplayLabel, h as INDEPENDENT_LABELS_MAP, i as QUESTION_ACTIONS, j as isElementOverflowing, k as Drag, l as SELECTABLE_KINDS, m as isAutoGeneratedQuestion, n as isRichTextQuestion, N as NON_BASIC_LATIN_CHARACTERS_REGEX, o as RESERVED_FIELD_CODES, d as LABEL_FIELDS, p as isDefaultLanguage, q as buildAddQuestionButtonProps, v as validateEditorContent, F as FIELD_CODES_REJECT_CHARS_REGEX, r as isImmutableField, Q as QUESTIONS_WITHOUT_FIELD_CODE, s as NON_HIDEABLE_FIELDS, t as NON_READ_ONLY_FIELDS, u as RICH_TEXT_QUESTIONS, w as FILE_TYPES_MAP, x as FILE_GROUPS, D as DEFAULT_CHOICE_QUESTION_ATTRIBUTES, M as MINIMUM_OPTIONS, y as IMAGE_HEIGHT_SLIDER_DEFAULTS, z as RATING_OPTIONS, A as STAR_RATING_MIN_VALUE_OPTIONS, B as STAR_RATING_MAX_VALUE_OPTIONS, G as STAR_RATING_ICONS_MAP, H as buildDisabledAddButtonHelpPopoverProps, J as buildReorderPayload, K as isMandatoryField, O as QUESTION_KINDS, a as QUESTION_KIND, T as getActiveQuestionKindDetails, U as DEFAULT_AVAILABLE_LANGUAGES, V as DEFAULT_ADVANCED_FEATURES, W as QUESTIONS_INITIAL_VALUE } from './constants-QPLZ_r-D.js';
+import { k as useDeleteQuestion, Q as QUESTION_TYPES, a as useForm, l as useCreateQuestion, m as useUpdateQuestion, C as CAPTCHA_TYPES, n as useReorderQuestions, i as QUERY_KEYS } from './constants-B_OEW8Yc.js';
+import { f as buildDisplayLabel, h as INDEPENDENT_LABELS_MAP, i as QUESTION_ACTIONS, j as isElementOverflowing, k as Drag, l as SELECTABLE_KINDS, m as isAutoGeneratedQuestion, n as isRichTextQuestion, N as NON_BASIC_LATIN_CHARACTERS_REGEX, o as RESERVED_FIELD_CODES, d as LABEL_FIELDS, p as isDefaultLanguage, q as buildAddQuestionButtonProps, v as validateEditorContent, F as FIELD_CODES_REJECT_CHARS_REGEX, r as isImmutableField, Q as QUESTIONS_WITHOUT_FIELD_CODE, s as NON_HIDEABLE_FIELDS, t as NON_READ_ONLY_FIELDS, u as RICH_TEXT_QUESTIONS, O as OPINION_LABEL_MAX_LENGTH, w as FILE_TYPES_MAP, x as FILE_GROUPS, y as OPINION_SCALE_MIN_VALUE_OPTIONS, z as OPINION_SCALE_MAX_VALUE_OPTIONS, D as DEFAULT_CHOICE_QUESTION_ATTRIBUTES, M as MINIMUM_OPTIONS, A as IMAGE_HEIGHT_SLIDER_DEFAULTS, B as RATING_OPTIONS, G as STAR_RATING_MIN_VALUE_OPTIONS, H as STAR_RATING_MAX_VALUE_OPTIONS, J as STAR_RATING_ICONS_MAP, K as buildDisabledAddButtonHelpPopoverProps, T as buildReorderPayload, U as isMandatoryField, V as QUESTION_KINDS, a as QUESTION_KIND, W as getActiveQuestionKindDetails, X as DEFAULT_AVAILABLE_LANGUAGES, Y as DEFAULT_ADVANCED_FEATURES, Z as QUESTIONS_INITIAL_VALUE } from './constants-Dcy0vCkf.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-DcE5kFvR.js';
+import { a as useBuildFormStore } from './buildForm-DA1LRDwr.js';
 import { shallow } from 'zustand/shallow';
 import Alert from '@bigbinary/neetoui/Alert';
 import { useTranslation, Trans } from 'react-i18next';
@@ -21,7 +21,7 @@ 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-DnHrq-hl.js';
+import { i as isFunction, f as fieldWithFallback, c as isNameQuestion } from './index-DGvqFcqA.js';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import { t } from 'i18next';
 import { v4 } from 'uuid';
@@ -600,12 +600,13 @@ var NAME = QUESTION_TYPES.NAME,
   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;
-var QUESTIONS_WITH_ADDITIONAL_DATA = [].concat(_toConsumableArray(SELECTABLE_KINDS), [STAR_RATING$1, RATING$1, FILE_UPLOAD$1, CAPTCHA$1, EMAIL$1]);
+var QUESTIONS_WITH_ADDITIONAL_DATA = [].concat(_toConsumableArray(SELECTABLE_KINDS), [STAR_RATING$1, OPINION_SCALE$1, RATING$1, FILE_UPLOAD$1, CAPTCHA$1, EMAIL$1]);
 var QUESTIONS_WITH_PLACEHOLDERS = [NAME, PHONE, EMAIL$1, ADDITIONAL_GUESTS, TEXT, TEXTAREA, RICH_TEXT, INTEGER, DECIMAL, DATE, SMS_REMINDER];
 var DEFAULT_PLACEHOLDERS = {
   CHECKBOX: t("neetoForm.questions.common.questionFields.field.labelExample", {
@@ -1153,6 +1154,15 @@ var buildNameLabelValidationSchema = function buildNameLabelValidationSchema(que
   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;
@@ -1177,7 +1187,9 @@ var formValidationSchema = function formValidationSchema(question) {
     }),
     highestRatingLabel: yup.string().nullable(),
     averageRatingLabel: yup.string().nullable(),
-    lowestRatingLabel: yup.string().nullable()
+    lowestRatingLabel: yup.string().nullable(),
+    leftOpinionLabel: buildOpinionScaleLabelValidationSchema(t("neetoForm.questions.opinionScale.leftLabel")),
+    rightOpinionLabel: buildOpinionScaleLabelValidationSchema(t("neetoForm.questions.opinionScale.rightLabel"))
   });
 };
 
@@ -1857,6 +1869,58 @@ var FileUpload = function FileUpload() {
   });
 };
 
+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$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(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 Options = function Options(_ref) {
@@ -2063,6 +2127,7 @@ 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,
@@ -2087,6 +2152,8 @@ var renderAdditionalData = function renderAdditionalData(_ref2) {
       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: