@bigbinary/neeto-rules-frontend 0.7.0 → 0.7.2

package/dist/index.js

@@ -279,10 +279,70 @@ var ActionsDetail = function ActionsDetail(_ref) {
   });
 };
 
+var OPERATORS$1 = {
+  or: "or_operator",
+  and: "and_operator"
+};
+var OPERATOR_LABELS = {
+  or_operator: t$5("neetoRules.operators.or"),
+  and_operator: t$5("neetoRules.operators.and")
+};
+var VERB_LABELS = {
+  is: t$5("neetoRules.conditionVerbs.is"),
+  is_not: t$5("neetoRules.conditionVerbs.isNot"),
+  contains: t$5("neetoRules.conditionVerbs.contains"),
+  does_not_contain: t$5("neetoRules.conditionVerbs.doesNotContain"),
+  contains_any_of: t$5("neetoRules.conditionVerbs.containsAnyOf"),
+  contains_all_of: t$5("neetoRules.conditionVerbs.containsAllOf"),
+  contains_none_of: t$5("neetoRules.conditionVerbs.containsNoneOf"),
+  starts_with: t$5("neetoRules.conditionVerbs.startsWith"),
+  ends_with: t$5("neetoRules.conditionVerbs.endsWith"),
+  less_than: t$5("neetoRules.conditionVerbs.lessThan"),
+  greater_than: t$5("neetoRules.conditionVerbs.greaterThan"),
+  any_time: t$5("neetoRules.conditionVerbs.anyTime"),
+  during: t$5("neetoRules.conditionVerbs.during"),
+  not_during: t$5("neetoRules.conditionVerbs.notDuring"),
+  any_of: t$5("neetoRules.conditionVerbs.anyOf"),
+  none_of: t$5("neetoRules.conditionVerbs.noneOf"),
+  is_before: t$5("neetoRules.conditionVerbs.isBefore"),
+  is_after: t$5("neetoRules.conditionVerbs.isAfter")
+};
+var CONDITION_VALUE_TYPES = {
+  text: "text",
+  number: "number",
+  decimal: "decimal",
+  url: "url",
+  email: "email",
+  dropdown: "dropdown",
+  multiSelect: "multi-select",
+  multiSelectCreate: "multi-select-create",
+  date: "date",
+  regex: "regex",
+  textarea: "textarea"
+};
+var INPUT_FIELD_TYPES = ["email", "text", "number", "decimal", "url", "regex"];
+var MAXIMUM_OPTION_LENGTH$3 = 7;
+
+var PREVIEW_CONDITION_LIMIT = 3;
+
+function ownKeys$r(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$p(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$r(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$r(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ConditionsDetail = function ConditionsDetail(_ref) {
   var conditions = _ref.conditions,
     conditionOptions = _ref.conditionOptions,
-    conditionVerbs = _ref.conditionVerbs;
+    _ref$conditionVerbs = _ref.conditionVerbs,
+    conditionVerbs = _ref$conditionVerbs === void 0 ? {} : _ref$conditionVerbs,
+    _ref$hasEvent = _ref.hasEvent,
+    hasEvent = _ref$hasEvent === void 0 ? true : _ref$hasEvent;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray$1(_useState, 2),
+    viewMore = _useState2[0],
+    setViewMore = _useState2[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var conditionsList = conditions.value;
+  var allConditions = viewMore && conditionsList.length > PREVIEW_CONDITION_LIMIT ? conditionsList : conditionsList.slice(0, PREVIEW_CONDITION_LIMIT);
+  var allConditionVerbs = _objectSpread$p(_objectSpread$p({}, VERB_LABELS), conditionVerbs);
   var getLogicOperator = function getLogicOperator(joinType) {
     return joinType === "or_operator" ? "or" : "and";
   };
@@ -303,7 +363,7 @@ var ConditionsDetail = function ConditionsDetail(_ref) {
       }));
       return /*#__PURE__*/jsx$1(MultiSelectValues, {
         values: values,
-        separator: t$5("neetoRules.common.or")
+        separator: t("neetoRules.common.or")
       });
     }
     if (conditionOption.type === "dropdown") {
@@ -317,12 +377,12 @@ var ConditionsDetail = function ConditionsDetail(_ref) {
     return null;
   };
   var renderCondition = function renderCondition(condition) {
-    var _conditionVerbs$condi;
+    var _allConditionVerbs$co;
     var conditionOption = findBy({
       value: condition.field
     }, conditionOptions);
     if (!conditionOption) return null;
-    var conditionVerb = (_conditionVerbs$condi = conditionVerbs[condition.verb]) === null || _conditionVerbs$condi === void 0 ? void 0 : _conditionVerbs$condi.toLowerCase();
+    var conditionVerb = (_allConditionVerbs$co = allConditionVerbs[condition.verb]) === null || _allConditionVerbs$co === void 0 ? void 0 : _allConditionVerbs$co.toLowerCase();
     return /*#__PURE__*/jsxs(Fragment, {
       children: [/*#__PURE__*/jsx$1(Typography, {
         className: "neeto-ui-text-gray-800",
@@ -337,31 +397,46 @@ var ConditionsDetail = function ConditionsDetail(_ref) {
       }), renderConditionValues(condition, conditionOption)]
     });
   };
-  return /*#__PURE__*/jsx$1("div", {
-    className: "mt-2",
-    children: conditions.map(function (condition, index) {
-      return /*#__PURE__*/jsxs("div", {
-        className: "mb-2 flex flex-wrap gap-x-2 gap-y-2",
-        children: [!index && /*#__PURE__*/jsx$1(Typography, {
-          className: "neeto-ui-text-gray-700",
-          style: "h5",
-          weight: "normal",
-          children: t$5("neetoRules.common.and", {
-            what: ""
-          })
-        }), !!index && /*#__PURE__*/jsx$1(Typography, {
-          className: "neeto-ui-text-gray-800",
-          style: "h5",
-          weight: "semibold",
-          children: getLogicOperator(condition.joinType)
-        }), /*#__PURE__*/jsx$1(Typography, {
-          className: "neeto-ui-text-gray-700",
-          style: "h5",
-          weight: "normal",
-          children: t$5("neetoRules.common.when").toLowerCase()
-        }), renderCondition(condition)]
-      }, condition.id);
-    })
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx$1("div", {
+      className: "mt-2",
+      children: allConditions.map(function (condition, index) {
+        return /*#__PURE__*/jsxs("div", {
+          className: "mb-2 flex flex-wrap gap-x-2 gap-y-2",
+          children: [!index && hasEvent && /*#__PURE__*/jsx$1(Typography, {
+            className: "neeto-ui-text-gray-700",
+            style: "h5",
+            weight: "normal",
+            children: t("neetoRules.common.and", {
+              what: ""
+            })
+          }), !!index && /*#__PURE__*/jsx$1(Typography, {
+            className: "neeto-ui-text-gray-800",
+            style: "h5",
+            weight: "semibold",
+            children: getLogicOperator(condition.joinType)
+          }), /*#__PURE__*/jsx$1(Typography, {
+            className: "neeto-ui-text-gray-700",
+            style: "h5",
+            weight: "normal",
+            children: t("neetoRules.common.when")
+          }), renderCondition(condition)]
+        }, condition.id);
+      })
+    }), conditionsList.length > 3 && /*#__PURE__*/jsx$1("div", {
+      className: "mt-3 w-full",
+      children: /*#__PURE__*/jsx$1(Button, {
+        icon: !viewMore ? Down : Up,
+        size: "small",
+        style: "link",
+        label: !viewMore ? t("neetoRules.common.viewMore") : t("neetoRules.common.viewLess"),
+        onClick: function onClick() {
+          return setViewMore(function (prevState) {
+            return !prevState;
+          });
+        }
+      })
+    })]
   });
 };
 
@@ -370,21 +445,17 @@ var EventsDetail = function EventsDetail(_ref) {
   var events = _ref.events,
     performer = _ref.performer,
     conditions = _ref.conditions;
-  var _useState = useState(false),
-    _useState2 = _slicedToArray$1(_useState, 2),
-    viewMore = _useState2[0],
-    setViewMore = _useState2[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
   var eventNames = pluck("name", events.value);
   var allEvents = events.eventOptions.filter(function (event) {
     return eventNames === null || eventNames === void 0 ? void 0 : eventNames.includes(event.value);
   });
-  var conditionsList = conditions.value;
-  var allConditions = viewMore && conditionsList.length > 3 ? conditionsList : conditionsList.slice(0, 3);
   var currentPerformer = findBy({
     value: performer.value
   }, performer.options);
   return /*#__PURE__*/jsxs(Title, {
-    title: t$5("neetoRules.common.when"),
+    title: t("neetoRules.common.when"),
     children: [/*#__PURE__*/jsxs("div", {
       className: "flex flex-wrap gap-x-2 gap-y-2",
       children: [allEvents.map(function (event, index) {
@@ -394,12 +465,12 @@ var EventsDetail = function EventsDetail(_ref) {
             className: "neeto-ui-text-gray-700 my-auto",
             style: "h5",
             weight: "normal",
-            children: t$5("neetoRules.common.when")
+            children: t("neetoRules.common.when")
           }), !!index && /*#__PURE__*/jsx$1(Typography, {
             className: "neeto-ui-text-gray-700 my-auto",
             style: "h5",
             weight: "normal",
-            children: t$5("neetoRules.common.or")
+            children: t("neetoRules.common.or")
           }), /*#__PURE__*/jsx$1(Typography, {
             className: "neeto-ui-text-gray-800",
             style: "h5",
@@ -411,7 +482,7 @@ var EventsDetail = function EventsDetail(_ref) {
         className: "neeto-ui-text-gray-700",
         style: "h5",
         weight: "normal",
-        children: t$5("neetoRules.common.by")
+        children: t("neetoRules.common.by")
       }), /*#__PURE__*/jsx$1(Typography, {
         className: "neeto-ui-text-gray-800",
         style: "h5",
@@ -419,22 +490,9 @@ var EventsDetail = function EventsDetail(_ref) {
         children: currentPerformer === null || currentPerformer === void 0 || (_currentPerformer$lab = currentPerformer.label) === null || _currentPerformer$lab === void 0 ? void 0 : _currentPerformer$lab.toLowerCase()
       })]
     }), /*#__PURE__*/jsx$1(ConditionsDetail, {
+      conditions: conditions,
       conditionOptions: conditions.conditionOptions,
-      conditionVerbs: conditions.verbs,
-      conditions: allConditions
-    }), conditionsList.length > 3 && /*#__PURE__*/jsx$1("div", {
-      className: "mt-3 w-full",
-      children: /*#__PURE__*/jsx$1(Button, {
-        icon: !viewMore ? Down : Up,
-        size: "small",
-        style: "link",
-        label: !viewMore ? t$5("neetoRules.common.viewMore") : t$5("neetoRules.common.viewLess"),
-        onClick: function onClick() {
-          return setViewMore(function (prevState) {
-            return !prevState;
-          });
-        }
-      })
+      conditionVerbs: conditions.verbs
     })]
   });
 };
@@ -457,73 +515,47 @@ var RulePreview = withT(function (_ref) {
         children: /*#__PURE__*/jsxs("div", {
           className: "flex items-center justify-between gap-x-3",
           children: [/*#__PURE__*/jsx$1(Typography, {
-            style: "h2",
+            className: "line-clamp-2",
+            style: "h4",
             weight: "semibold",
-            children: t("neetoRules.labels.ruleSummary")
+            children: ruleDetails.name.value
           }), isNotEmpty(moreDropdownProps) && /*#__PURE__*/jsx$1(MoreDropdown, _objectSpread$o({}, moreDropdownProps))]
         })
       }), /*#__PURE__*/jsx$1(Pane.Body, {
         children: /*#__PURE__*/jsxs("div", {
-          className: "w-full",
+          className: "mt-2 w-full",
           children: [/*#__PURE__*/jsxs("div", {
-            className: "neeto-ui-rounded mb-4 border p-4",
-            children: [/*#__PURE__*/jsxs("div", {
-              className: "mb-3 flex flex-wrap justify-between gap-x-4",
+            className: "mb-6",
+            children: [ruleDetails.description && /*#__PURE__*/jsx$1(Typography, {
+              className: "my-auto mb-4",
+              style: "body2",
+              children: ruleDetails.description.value
+            }), ruleDetails.entity && /*#__PURE__*/jsxs("div", {
+              className: "flex space-x-8",
               children: [/*#__PURE__*/jsx$1(Typography, {
-                className: "neeto-ui-text-gray-700 my-auto",
+                className: "neeto-ui-text-gray-800 col-span-1",
                 style: "h5",
                 weight: "semibold",
-                children: t("neetoRules.common.name")
-              }), /*#__PURE__*/jsx$1("div", {
-                className: "flex w-72 flex-wrap",
-                children: /*#__PURE__*/jsx$1(Typography, {
-                  className: "neeto-ui-text-gray-800 my-auto",
-                  style: "h5",
-                  weight: "normal",
-                  children: ruleDetails.name.value
-                })
-              })]
-            }), ruleDetails.description && /*#__PURE__*/jsxs(Fragment, {
-              children: [/*#__PURE__*/jsx$1("hr", {}), /*#__PURE__*/jsxs("div", {
-                className: "my-3 flex flex-wrap justify-between gap-x-2",
-                children: [/*#__PURE__*/jsx$1(Typography, {
-                  className: "neeto-ui-text-gray-700 my-auto",
-                  style: "h5",
-                  weight: "semibold",
-                  children: t("neetoRules.common.description")
-                }), /*#__PURE__*/jsx$1("div", {
-                  className: "flex w-72 flex-wrap",
-                  children: /*#__PURE__*/jsx$1(Typography, {
-                    className: "neeto-ui-text-gray-800 my-auto",
-                    style: "h5",
-                    weight: "normal",
-                    children: ruleDetails.description.value
-                  })
-                })]
-              })]
-            }), ruleDetails.entity && /*#__PURE__*/jsxs(Fragment, {
-              children: [/*#__PURE__*/jsx$1("hr", {}), /*#__PURE__*/jsxs("div", {
-                className: "my-3 flex flex-wrap justify-between gap-x-2",
-                children: [/*#__PURE__*/jsx$1(Typography, {
-                  className: "neeto-ui-text-gray-700 my-auto",
-                  style: "h5",
-                  weight: "semibold",
-                  children: ruleDetails.entity.label
-                }), /*#__PURE__*/jsx$1("div", {
-                  className: "flex w-72 flex-wrap",
-                  children: /*#__PURE__*/jsx$1(Typography, {
-                    className: "neeto-ui-text-gray-800 my-auto",
-                    style: "h5",
-                    weight: "normal",
-                    children: ruleDetails.entity.value
-                  })
-                })]
+                children: ruleDetails.entity.label
+              }), /*#__PURE__*/jsx$1(Typography, {
+                className: "neeto-ui-text-gray-800 col-span-2",
+                style: "h5",
+                weight: "normal",
+                children: ruleDetails.entity.value
               })]
             })]
-          }), /*#__PURE__*/jsx$1(EventsDetail, {
+          }), ruleDetails.events && isNotEmpty(ruleDetails.events) ? /*#__PURE__*/jsx$1(EventsDetail, {
             conditions: ruleDetails.conditions,
             events: ruleDetails.events,
             performer: ruleDetails.performer
+          }) : /*#__PURE__*/jsx$1(Title, {
+            title: t("neetoRules.common.when"),
+            children: /*#__PURE__*/jsx$1(ConditionsDetail, {
+              conditionOptions: ruleDetails.conditions.conditionOptions,
+              conditionVerbs: ruleDetails.conditions.verbs,
+              conditions: ruleDetails.conditions,
+              hasEvent: false
+            })
           }), /*#__PURE__*/jsx$1(ActionsDetail, {
             actions: ruleDetails.actions
           })]
@@ -9921,52 +9953,8 @@ var DEFAULT_RULE_ACTION = {
 };
 var EDITOR_ADDONS = ["code-block", "block-quote", "image-upload"];
 var EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-var MAXIMUM_OPTION_LENGTH$3 = 7;
-var ACTION_INPUT_TYPES = ["text", "number", "decimal", "regex"];
-
-var OPERATORS$1 = {
-  or: "or_operator",
-  and: "and_operator"
-};
-var OPERATOR_LABELS = {
-  or_operator: t$5("neetoRules.operators.or"),
-  and_operator: t$5("neetoRules.operators.and")
-};
-var VERB_LABELS = {
-  is: t$5("neetoRules.conditionVerbs.is"),
-  is_not: t$5("neetoRules.conditionVerbs.isNot"),
-  contains: t$5("neetoRules.conditionVerbs.contains"),
-  does_not_contain: t$5("neetoRules.conditionVerbs.doesNotContain"),
-  contains_any_of: t$5("neetoRules.conditionVerbs.containsAnyOf"),
-  contains_all_of: t$5("neetoRules.conditionVerbs.containsAllOf"),
-  contains_none_of: t$5("neetoRules.conditionVerbs.containsNoneOf"),
-  starts_with: t$5("neetoRules.conditionVerbs.startsWith"),
-  ends_with: t$5("neetoRules.conditionVerbs.endsWith"),
-  less_than: t$5("neetoRules.conditionVerbs.lessThan"),
-  greater_than: t$5("neetoRules.conditionVerbs.greaterThan"),
-  any_time: t$5("neetoRules.conditionVerbs.anyTime"),
-  during: t$5("neetoRules.conditionVerbs.during"),
-  not_during: t$5("neetoRules.conditionVerbs.notDuring"),
-  any_of: t$5("neetoRules.conditionVerbs.anyOf"),
-  none_of: t$5("neetoRules.conditionVerbs.noneOf"),
-  is_before: t$5("neetoRules.conditionVerbs.isBefore"),
-  is_after: t$5("neetoRules.conditionVerbs.isAfter")
-};
-var CONDITION_VALUE_TYPES = {
-  text: "text",
-  number: "number",
-  decimal: "decimal",
-  url: "url",
-  email: "email",
-  dropdown: "dropdown",
-  multiSelect: "multi-select",
-  multiSelectCreate: "multi-select-create",
-  date: "date",
-  regex: "regex",
-  textarea: "textarea"
-};
-var INPUT_FIELD_TYPES = ["email", "text", "number", "decimal", "url", "regex"];
 var MAXIMUM_OPTION_LENGTH$2 = 7;
+var ACTION_INPUT_TYPES = ["text", "number", "decimal", "regex"];
 
 function ownKeys$l(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$k(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$l(Object(t), !0).forEach(function (r) { _defineProperty$2(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$l(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -11050,7 +11038,7 @@ var DropdownField$1 = function DropdownField(_ref) {
       onClose: handleClose,
       children: /*#__PURE__*/jsxs(Menu$a, {
         className: "max-h-60 max-w-2xl p-3",
-        children: [dropdownOptions.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsx$1(Input$2, {
+        children: [dropdownOptions.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsx$1(Input$2, {
           autoFocus: true,
           className: "mb-1",
           "data-cy": "search-text-field",
@@ -11064,7 +11052,7 @@ var DropdownField$1 = function DropdownField(_ref) {
             return e.stopPropagation();
           }
         }), /*#__PURE__*/jsx$1(OptionsWrapper, {
-          hasScroll: dropdownOptions.length > MAXIMUM_OPTION_LENGTH$3,
+          hasScroll: dropdownOptions.length > MAXIMUM_OPTION_LENGTH$2,
           children: searchedOptions.map(function (option, idx) {
             return /*#__PURE__*/jsx$1(MenuItem$9.Button, {
               "data-cy": "".concat(joinHyphenCase(option.label), "-menu-item"),
@@ -11698,7 +11686,7 @@ var MultiSelect$1 = function MultiSelect(_ref) {
       onClose: handleClose,
       children: /*#__PURE__*/jsxs(Menu$9, {
         className: "max-h-60 max-w-2xl p-3",
-        children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsx$1(Input$2, {
+        children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsx$1(Input$2, {
           autoFocus: true,
           className: "mb-1",
           "data-cy": "search-text-field",
@@ -11709,7 +11697,7 @@ var MultiSelect$1 = function MultiSelect(_ref) {
             return setSearchTerm(e.target.value);
           }
         }), /*#__PURE__*/jsx$1(OptionsWrapper, {
-          hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3,
+          hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2,
           children: searchedOptions.map(function (option, idx) {
             return /*#__PURE__*/jsx$1(MenuItem$8.Button, {
               "data-cy": "".concat(joinHyphenCase(option.label), "-menu-item"),
@@ -20393,7 +20381,7 @@ var DropdownField = function DropdownField(_ref) {
     onClose: handleClose,
     children: /*#__PURE__*/jsxs(Menu$6, {
       className: "max-h-60 max-w-2xl p-3",
-      children: [options.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsx$1(Input$2, {
+      children: [options.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsx$1(Input$2, {
         autoFocus: true,
         className: "mb-1",
         "data-cy": "search-text-field",
@@ -20407,7 +20395,7 @@ var DropdownField = function DropdownField(_ref) {
           return e.stopPropagation();
         }
       }), /*#__PURE__*/jsx$1(OptionsWrapper, {
-        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$2,
+        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$3,
         children: searchedOptions.map(function (option, idx) {
           return /*#__PURE__*/jsx$1(MenuItem$6.Button, {
             "data-cy": "".concat(joinHyphenCase(option.label), "-menu-item"),
@@ -20515,7 +20503,7 @@ var Dropdown = function Dropdown(_ref) {
     onClose: handleClose,
     children: /*#__PURE__*/jsxs(Menu$5, {
       className: "max-h-60 max-w-2xl p-3",
-      children: [options.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsx$1(Input$2, {
+      children: [options.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsx$1(Input$2, {
         autoFocus: true,
         className: "mb-1",
         "data-cy": "search-text-field",
@@ -20529,7 +20517,7 @@ var Dropdown = function Dropdown(_ref) {
           return e.stopPropagation();
         }
       }), /*#__PURE__*/jsx$1(OptionsWrapper, {
-        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$2,
+        hasScroll: options.length > MAXIMUM_OPTION_LENGTH$3,
         children: searchedOptions.map(function (option, idx) {
           return /*#__PURE__*/jsx$1(MenuItem$5.Button, {
             "data-cy": "".concat(joinHyphenCase(option.label), "-menu-item"),
@@ -20689,7 +20677,7 @@ var MultiSelect = function MultiSelect(_ref) {
     onClose: handleClose,
     children: /*#__PURE__*/jsxs(Menu$4, {
       className: "max-h-60 max-w-2xl p-3",
-      children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2 && /*#__PURE__*/jsx$1(Input$2, {
+      children: [dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3 && /*#__PURE__*/jsx$1(Input$2, {
         autoFocus: true,
         className: "mb-1",
         "data-cy": "search-text-field",
@@ -20700,7 +20688,7 @@ var MultiSelect = function MultiSelect(_ref) {
           return setSearchTerm(e.target.value);
         }
       }), /*#__PURE__*/jsx$1(OptionsWrapper, {
-        hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$2,
+        hasScroll: dropDownOptions.length > MAXIMUM_OPTION_LENGTH$3,
         children: searchedOptions.map(function (option, idx) {
           return /*#__PURE__*/jsx$1(MenuItem$4.Button, {
             "data-cy": "".concat(joinHyphenCase(option.label), "-menu-item"),