@carbon/ibm-products 2.65.0 → 2.66.0

package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.js

@@ -9,7 +9,6 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var cx = require('classnames');
 var index = require('../../../_virtual/index.js');
@@ -19,27 +18,21 @@ var useTranslations = require('../utils/useTranslations.js');
 var icons = require('@carbon/react/icons');
 var util = require('../utils/util.js');
 
-var ConditionPreview = function ConditionPreview(_ref) {
+const ConditionPreview = _ref => {
   var _ConditionBuilderItem, _ConditionBuilderItem2, _ConditionBuilderItem3;
-  var previewType = _ref.previewType,
-    group = _ref.group,
-    colorIndex = _ref.colorIndex;
-  var _useState = React.useState(false),
-    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-    animate = _useState2[0],
-    setAnimate = _useState2[1];
-  var _useTranslations = useTranslations.useTranslations(['valueText', 'operatorText', 'propertyText', 'ifText']),
-    _useTranslations2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslations, 4),
-    propertyText = _useTranslations2[0],
-    operatorText = _useTranslations2[1],
-    valueText = _useTranslations2[2],
-    ifText = _useTranslations2[3];
-  React.useEffect(function () {
+  let {
+    previewType,
+    group,
+    colorIndex
+  } = _ref;
+  const [animate, setAnimate] = React.useState(false);
+  const [propertyText, operatorText, valueText, ifText] = useTranslations.useTranslations(['valueText', 'operatorText', 'propertyText', 'ifText']);
+  React.useEffect(() => {
     setAnimate(true);
   }, []);
-  var getConditionSection = function getConditionSection() {
+  const getConditionSection = () => {
     return /*#__PURE__*/React.createElement("div", {
-      className: "".concat(util.blockClass, "__preview-condition")
+      className: `${util.blockClass}__preview-condition`
     }, _ConditionBuilderItem || (_ConditionBuilderItem = /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
       label: propertyText,
       renderIcon: icons.Bee
@@ -50,40 +43,48 @@ var ConditionPreview = function ConditionPreview(_ref) {
     })));
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, previewType == 'newGroup' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: cx(["".concat(util.blockClass, "__group__row ").concat(util.blockClass, "__group-preview "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
+    className: cx([`${util.blockClass}__group__row ${util.blockClass}__group-preview `, {
+      [`${util.blockClass}__group-preview-animate`]: animate
+    }])
   }, /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
-    className: "".concat(util.blockClass, "__statement-button"),
+    className: `${util.blockClass}__statement-button`,
     label: group.groupOperator
   })), /*#__PURE__*/React.createElement("div", {
     "data-color-index": colorIndex,
     "aria-hidden": true,
-    className: cx(["".concat(util.blockClass, "__group ").concat(util.blockClass, "__condition-wrapper ").concat(util.blockClass, "__group-preview ").concat(util.blockClass, "__group-wrapper "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
+    className: cx([`${util.blockClass}__group ${util.blockClass}__condition-wrapper ${util.blockClass}__group-preview ${util.blockClass}__group-wrapper `, {
+      [`${util.blockClass}__group-preview-animate`]: animate
+    }])
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(util.blockClass, "__gap")
+    className: `${util.blockClass}__gap`
   }, /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
-    className: "".concat(util.blockClass, "__statement-button"),
+    className: `${util.blockClass}__statement-button`,
     label: ifText
   })), getConditionSection())), previewType == 'subGroup' && /*#__PURE__*/React.createElement("div", {
-    className: cx(["".concat(util.blockClass, "__group__row ").concat(util.blockClass, "__group-preview ").concat(util.blockClass, "__gap-bottom"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
+    className: cx([`${util.blockClass}__group__row ${util.blockClass}__group-preview ${util.blockClass}__gap-bottom`, {
+      [`${util.blockClass}__group-preview-animate`]: animate
+    }])
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(util.blockClass, "__condition-block  ").concat(util.blockClass, "__gap")
+    className: `${util.blockClass}__condition-block  ${util.blockClass}__gap`
   }, /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
     label: group.groupOperator,
-    className: "".concat(util.blockClass, "__statement-button"),
-    popOverClassName: "".concat(util.blockClass, "__gap")
+    className: `${util.blockClass}__statement-button`,
+    popOverClassName: `${util.blockClass}__gap`
   }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(util.blockClass, "__group ").concat(util.blockClass, "__condition-wrapper")
+    className: `${util.blockClass}__group ${util.blockClass}__condition-wrapper`
   }, /*#__PURE__*/React.createElement(ConditionConnector.default, {
-    className: "".concat(util.blockClass, "__gap ").concat(util.blockClass, "__groupConnector"),
+    className: `${util.blockClass}__gap ${util.blockClass}__groupConnector`,
     operator: ifText
   }), getConditionSection()))), previewType == 'condition' && /*#__PURE__*/React.createElement("div", {
-    className: cx(["".concat(util.blockClass, "__group__row ").concat(util.blockClass, "__group-preview ").concat(util.blockClass, "__gap-bottom"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
+    className: cx([`${util.blockClass}__group__row ${util.blockClass}__group-preview ${util.blockClass}__gap-bottom`, {
+      [`${util.blockClass}__group-preview-animate`]: animate
+    }])
   }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(util.blockClass, "__condition-block  ").concat(util.blockClass, "__gap")
+    className: `${util.blockClass}__condition-block  ${util.blockClass}__gap`
   }, /*#__PURE__*/React.createElement(ConditionBuilderItem.ConditionBuilderItem, {
     label: group.groupOperator,
-    className: "".concat(util.blockClass, "__statement-button"),
-    popOverClassName: "".concat(util.blockClass, "__gap")
+    className: `${util.blockClass}__statement-button`,
+    popOverClassName: `${util.blockClass}__gap`
   }), getConditionSection())));
 };
 ConditionPreview.propTypes = {

package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js

@@ -7,34 +7,31 @@
 
 'use strict';
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var util = require('./util.js');
 
-var handleKeyDown = function handleKeyDown(evt, conditionBuilderRef, variant) {
-  var _activeElement$closes;
-  var activeElement = document.activeElement;
-  if (!((_activeElement$closes = activeElement.closest(".".concat(util.blockClass, "__popover"))) !== null && _activeElement$closes !== void 0 && _activeElement$closes.querySelector('[role="dialog"]'))) {
+const handleKeyDown = (evt, conditionBuilderRef, variant) => {
+  const activeElement = document.activeElement;
+  if (!activeElement.closest(`.${util.blockClass}__popover`)?.querySelector('[role="dialog"]')) {
     handleKeyPressForMainContent(evt, conditionBuilderRef, variant);
   }
 };
-var handleKeyDownForPopover = function handleKeyDownForPopover(evt, conditionBuilderRef, popoverRef) {
+const handleKeyDownForPopover = (evt, conditionBuilderRef, popoverRef) => {
   if (excludeKeyPress(evt)) {
     return;
   }
-  handleKeyPressForPopover(evt, popoverRef === null || popoverRef === void 0 ? void 0 : popoverRef.current, conditionBuilderRef);
+  handleKeyPressForPopover(evt, popoverRef?.current, conditionBuilderRef);
 };
 
 //skipping keyboard handling for date and time fields to get take carbon's
-var excludeKeyPress = function excludeKeyPress(evt) {
-  return !['Escape'].includes(evt.key) && evt.target.closest(".".concat(util.blockClass, "__item-date"));
+const excludeKeyPress = evt => {
+  return !['Escape'].includes(evt.key) && evt.target.closest(`.${util.blockClass}__item-date`);
 };
-var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentContainer, conditionBuilderRef) {
-  var _parentContainer$quer, _parentContainer$quer2, _evt$target$closest$q, _evt$target$closest;
-  var key = evt.key;
-  var isHoldingShiftKey = util.checkForHoldingKey(evt, 'shiftKey');
-  var isMultiSelect = (_parentContainer$quer = parentContainer.querySelector('ul')) === null || _parentContainer$quer === void 0 ? void 0 : _parentContainer$quer.dataset.multiSelect;
-  var isOptionInput = (_parentContainer$quer2 = parentContainer.querySelectorAll("[role=\"option\"]")) === null || _parentContainer$quer2 === void 0 ? void 0 : _parentContainer$quer2.length;
-  var allItems = [];
+const handleKeyPressForPopover = (evt, parentContainer, conditionBuilderRef) => {
+  const key = evt.key;
+  const isHoldingShiftKey = util.checkForHoldingKey(evt, 'shiftKey');
+  const isMultiSelect = parentContainer.querySelector('ul')?.dataset.multiSelect;
+  const isOptionInput = parentContainer.querySelectorAll(`[role="option"]`)?.length;
+  let allItems = [];
   if (key === 'Escape') {
     //focus the corresponding field in which the popover is triggered from
     util.focusThisField(evt, conditionBuilderRef);
@@ -46,24 +43,24 @@ var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentCont
       case 'ArrowUp':
         evt.preventDefault();
         //traverse through the popover options, search box, selectAll button
-        parentContainer.querySelectorAll("[role=\"option\"]").forEach(function (eachElem, index, allElements) {
+        parentContainer.querySelectorAll(`[role="option"]`).forEach((eachElem, index, allElements) => {
           util.traverseReverse(eachElem, index, allElements, null, null, conditionBuilderRef);
         });
         //scroll to top when we reach a the top of the list to make search box visible
-        if (Array.from((_evt$target$closest$q = (_evt$target$closest = evt.target.closest('ul')) === null || _evt$target$closest === void 0 ? void 0 : _evt$target$closest.querySelectorAll('li')) !== null && _evt$target$closest$q !== void 0 ? _evt$target$closest$q : []).indexOf(evt.target) === 1) {
-          parentContainer.querySelector(".".concat(util.blockClass, "__popover-content-wrapper")).scrollTop = 0;
+        if (Array.from(evt.target.closest('ul')?.querySelectorAll('li') ?? []).indexOf(evt.target) === 1) {
+          parentContainer.querySelector(`.${util.blockClass}__popover-content-wrapper`).scrollTop = 0;
         }
         break;
       case 'ArrowDown':
         evt.preventDefault();
         //traverse through the popover options, search box, selectAll button
-        parentContainer.querySelectorAll("[role=\"option\"]").forEach(function (eachElem, index, allElements) {
+        parentContainer.querySelectorAll(`[role="option"]`).forEach((eachElem, index, allElements) => {
           util.traverseClockVise(eachElem, index, allElements, null, null, conditionBuilderRef);
         });
         break;
       case 'Tab':
-        allItems = [].concat(_rollupPluginBabelHelpers.toConsumableArray(Array.from(parentContainer.querySelectorAll(".".concat(util.blockClass, "__selectAll-button,[role=\"searchbox\"]")))), [parentContainer.querySelector("[role=\"option\"]")]);
-        allItems.forEach(function (eachElem, index, allElements) {
+        allItems = [...Array.from(parentContainer.querySelectorAll(`.${util.blockClass}__selectAll-button,[role="searchbox"]`)), parentContainer.querySelector(`[role="option"]`)];
+        allItems.forEach((eachElem, index, allElements) => {
           if (isHoldingShiftKey) {
             util.traverseReverse(eachElem, index, allElements, true, true, conditionBuilderRef);
           } else {
@@ -75,41 +72,36 @@ var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentCont
       case ' ':
         if (isMultiSelect === 'true') {
           if (document.activeElement.type !== 'button') {
-            var _document$activeEleme;
             //for button , enter key is click which already handled by framework, for other elements trigger click
-            (_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 || _document$activeEleme.click();
+            document.activeElement?.click();
           }
           evt.preventDefault();
         }
         break;
       case 'Enter':
         if (document.activeElement.type !== 'button') {
-          var _document$activeEleme2;
           //for button , enter key is click which already handled by framework, else trigger click
           util.focusThisField(evt, conditionBuilderRef);
-          (_document$activeEleme2 = document.activeElement) === null || _document$activeEleme2 === void 0 || _document$activeEleme2.click();
+          document.activeElement?.click();
         }
         break;
     }
   } else {
     if (key === 'Enter' && !isHoldingShiftKey) {
       if (document.activeElement.type !== 'button') {
-        var _document$activeEleme3;
         //for button , enter key is click which already handled by framework, else trigger click
         util.focusThisField(evt, conditionBuilderRef);
-        (_document$activeEleme3 = document.activeElement) === null || _document$activeEleme3 === void 0 || _document$activeEleme3.click();
+        document.activeElement?.click();
       }
     }
   }
 };
-var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, conditionBuilderRef, variant) {
-  var _document$activeEleme4;
+const handleKeyPressForMainContent = (evt, conditionBuilderRef, variant) => {
   switch (evt.key) {
     case 'ArrowRight':
       evt.preventDefault();
       if (variant == util.HIERARCHICAL_VARIANT) {
-        var _evt$target$closest2;
-        var allCellsInRow = Array.from((_evt$target$closest2 = evt.target.closest('[role="row"]')) === null || _evt$target$closest2 === void 0 ? void 0 : _evt$target$closest2.querySelectorAll('[role="gridcell"] button'));
+        let allCellsInRow = Array.from(evt.target.closest('[role="row"]')?.querySelectorAll('[role="gridcell"] button'));
         if (allCellsInRow.length === 1) {
           evt.target = evt.target.closest('[role="row"]');
           handleRowNavigationHierarchical(evt, conditionBuilderRef, variant);
@@ -123,7 +115,7 @@ var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, co
           //finding the next cell to be focussed
           //next cell = current cell index + 1
 
-          var currentItemIndex = allCellsInRow.indexOf(evt.target);
+          let currentItemIndex = allCellsInRow.indexOf(evt.target);
           if (currentItemIndex < allCellsInRow.length - 1) {
             util.focusThisItem(allCellsInRow[currentItemIndex + 1], conditionBuilderRef);
           }
@@ -136,16 +128,15 @@ var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, co
       evt.preventDefault();
       if (variant == util.HIERARCHICAL_VARIANT) {
         if (evt.target.getAttribute('role') !== 'row') {
-          var _evt$target$closest3;
           //when any cell is focussed, arrow left will select the previous cell or current row
 
-          var _allCellsInRow = Array.from((_evt$target$closest3 = evt.target.closest('[role="row"]')) === null || _evt$target$closest3 === void 0 ? void 0 : _evt$target$closest3.querySelectorAll('[role="gridcell"] button'));
-          var _currentItemIndex = _allCellsInRow.indexOf(evt.target);
-          if (_currentItemIndex > 0) {
-            util.focusThisItem(_allCellsInRow[_currentItemIndex - 1], conditionBuilderRef);
+          let allCellsInRow = Array.from(evt.target.closest('[role="row"]')?.querySelectorAll('[role="gridcell"] button'));
+          let currentItemIndex = allCellsInRow.indexOf(evt.target);
+          if (currentItemIndex > 0) {
+            util.focusThisItem(allCellsInRow[currentItemIndex - 1], conditionBuilderRef);
           } else {
             //focus the row
-            var wrapper = evt.target.closest("[role=\"row\"]");
+            let wrapper = evt.target.closest(`[role="row"]`);
             util.manageTabIndexAndFocus(wrapper, conditionBuilderRef);
           }
         }
@@ -163,32 +154,28 @@ var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, co
       }
       break;
     case 'Enter':
-      if (((_document$activeEleme4 = document.activeElement) === null || _document$activeEleme4 === void 0 || (_document$activeEleme4 = _document$activeEleme4.querySelectorAll("button")) === null || _document$activeEleme4 === void 0 ? void 0 : _document$activeEleme4.length) === 1) {
-        var _document$activeEleme5;
-        (_document$activeEleme5 = document.activeElement) === null || _document$activeEleme5 === void 0 || (_document$activeEleme5 = _document$activeEleme5.querySelectorAll("button")[0]) === null || _document$activeEleme5 === void 0 || _document$activeEleme5.click();
+      if (document.activeElement?.querySelectorAll(`button`)?.length === 1) {
+        document.activeElement?.querySelectorAll(`button`)[0]?.click();
       }
       break;
   }
 };
-var getRows = function getRows(conditionBuilderRef) {
-  var _conditionBuilderRef$;
-  return Array.from((_conditionBuilderRef$ = conditionBuilderRef.current) === null || _conditionBuilderRef$ === void 0 ? void 0 : _conditionBuilderRef$.querySelectorAll('[role="row"]'));
+const getRows = conditionBuilderRef => {
+  return Array.from(conditionBuilderRef.current?.querySelectorAll('[role="row"]'));
 };
-var getRowIndex = function getRowIndex(element, conditionBuilderRef) {
-  var rows = getRows(conditionBuilderRef);
-  return rows.findIndex(function (row) {
-    return row.contains(element);
-  });
+const getRowIndex = (element, conditionBuilderRef) => {
+  const rows = getRows(conditionBuilderRef);
+  return rows.findIndex(row => row.contains(element));
 };
-var handleRowNavigation = function handleRowNavigation(evt, conditionBuilderRef, variant) {
-  var rows = getRows(conditionBuilderRef);
-  var currentRowIndex = getRowIndex(evt.target, conditionBuilderRef);
+const handleRowNavigation = (evt, conditionBuilderRef, variant) => {
+  const rows = getRows(conditionBuilderRef);
+  const currentRowIndex = getRowIndex(evt.target, conditionBuilderRef);
   navigateToNextRowCell(evt, currentRowIndex, rows, variant, conditionBuilderRef);
 };
-var handleRowNavigationHierarchical = function handleRowNavigationHierarchical(evt, conditionBuilderRef, variant) {
-  var rows = getRows(conditionBuilderRef);
-  var currentRowIndex = getRowIndex(evt.target, conditionBuilderRef);
-  var nextRowIndex = currentRowIndex;
+const handleRowNavigationHierarchical = (evt, conditionBuilderRef, variant) => {
+  const rows = getRows(conditionBuilderRef);
+  const currentRowIndex = getRowIndex(evt.target, conditionBuilderRef);
+  let nextRowIndex = currentRowIndex;
   if (evt.target.getAttribute('role') == 'row') {
     if (['ArrowDown', 'ArrowRight'].includes(evt.key)) {
       nextRowIndex += 1;
@@ -209,27 +196,27 @@ var handleRowNavigationHierarchical = function handleRowNavigationHierarchical(e
     navigateToNextRowCell(evt, currentRowIndex, rows, variant, conditionBuilderRef);
   }
 };
-var navigateToNextRowCell = function navigateToNextRowCell(evt, currentRowIndex, rows, variant, conditionBuilderRef) {
+const navigateToNextRowCell = (evt, currentRowIndex, rows, variant, conditionBuilderRef) => {
   //when the current focussed element is a cell of any row, arrow up/down will focus the next row same cell.
 
-  var nextRowIndex = currentRowIndex;
+  let nextRowIndex = currentRowIndex;
   if (evt.key === 'ArrowUp') {
     nextRowIndex = currentRowIndex == 0 ? currentRowIndex : currentRowIndex - 1;
   }
   if (evt.key === 'ArrowDown') {
     nextRowIndex = currentRowIndex === rows.length - 1 ? rows.length - 1 : currentRowIndex + 1;
   }
-  var nextRow = rows[nextRowIndex];
-  var itemName = evt.target.dataset.name;
-  if (nextRow !== null && nextRow !== void 0 && nextRow.querySelector("[data-name=\"".concat(itemName, "\"]"))) {
-    util.manageTabIndexAndFocus(nextRow === null || nextRow === void 0 ? void 0 : nextRow.querySelector("[data-name=\"".concat(itemName, "\"]")), conditionBuilderRef);
+  const nextRow = rows[nextRowIndex];
+  const itemName = evt.target.dataset.name;
+  if (nextRow?.querySelector(`[data-name="${itemName}"]`)) {
+    util.manageTabIndexAndFocus(nextRow?.querySelector(`[data-name="${itemName}"]`), conditionBuilderRef);
   } else if (variant === util.HIERARCHICAL_VARIANT) {
     //when the next row is a if statement , then that row is focused. From any cell of last row of an group , arrow down select the next row (if)
     util.manageTabIndexAndFocus(nextRow, conditionBuilderRef);
   }
 };
-var handleCellNavigation = function handleCellNavigation(evt, conditionBuilderRef) {
-  conditionBuilderRef.current.querySelectorAll("[role=\"gridcell\"] button").forEach(function (eachElem, index, allElements) {
+const handleCellNavigation = (evt, conditionBuilderRef) => {
+  conditionBuilderRef.current.querySelectorAll(`[role="gridcell"] button`).forEach((eachElem, index, allElements) => {
     if (evt.key === 'ArrowRight') {
       util.traverseClockVise(eachElem, index, allElements, null, null, conditionBuilderRef);
     } else {

package/lib/components/ConditionBuilder/utils/useDataConfigs.js

@@ -7,35 +7,16 @@
 
 'use strict';
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var useTranslations = require('./useTranslations.js');
 var ConditionBuilderProvider = require('../ConditionBuilderContext/ConditionBuilderProvider.js');
 
-var useDataConfigs = function useDataConfigs() {
-  var _useTranslations = useTranslations.useTranslations(['ifAll', 'ifAny', 'unlessAll', 'unlessAny', 'and', 'or', 'is', 'greater', 'greaterEqual', 'lower', 'lowerEqual', 'startsWith', 'endsWith', 'contains', 'oneOf', 'before', 'after', 'between']),
-    _useTranslations2 = _rollupPluginBabelHelpers.slicedToArray(_useTranslations, 18),
-    ifAll = _useTranslations2[0],
-    ifAny = _useTranslations2[1],
-    unlessAll = _useTranslations2[2],
-    unlessAny = _useTranslations2[3],
-    and = _useTranslations2[4],
-    or = _useTranslations2[5],
-    is = _useTranslations2[6],
-    greater = _useTranslations2[7],
-    greaterEqual = _useTranslations2[8],
-    lower = _useTranslations2[9],
-    lowerEqual = _useTranslations2[10],
-    startsWith = _useTranslations2[11],
-    endsWith = _useTranslations2[12],
-    contains = _useTranslations2[13],
-    oneOf = _useTranslations2[14],
-    before = _useTranslations2[15],
-    after = _useTranslations2[16],
-    between = _useTranslations2[17];
-  var _useContext = React.useContext(ConditionBuilderProvider.ConditionBuilderContext),
-    statementConfigCustom = _useContext.statementConfigCustom;
-  var statementConfigDefault = [{
+const useDataConfigs = () => {
+  const [ifAll, ifAny, unlessAll, unlessAny, and, or, is, greater, greaterEqual, lower, lowerEqual, startsWith, endsWith, contains, oneOf, before, after, between] = useTranslations.useTranslations(['ifAll', 'ifAny', 'unlessAll', 'unlessAny', 'and', 'or', 'is', 'greater', 'greaterEqual', 'lower', 'lowerEqual', 'startsWith', 'endsWith', 'contains', 'oneOf', 'before', 'after', 'between']);
+  const {
+    statementConfigCustom
+  } = React.useContext(ConditionBuilderProvider.ConditionBuilderContext);
+  const statementConfigDefault = [{
     id: 'ifAll',
     connector: 'and',
     label: ifAll,
@@ -56,14 +37,14 @@ var useDataConfigs = function useDataConfigs() {
     label: unlessAny,
     secondaryLabel: '! (a || b)'
   }];
-  var connectorConfig = [{
+  const connectorConfig = [{
     label: and,
     id: 'and'
   }, {
     label: or,
     id: 'or'
   }];
-  var operatorConfig = [{
+  const operatorConfig = [{
     label: is,
     id: 'is',
     type: 'all'
@@ -113,9 +94,9 @@ var useDataConfigs = function useDataConfigs() {
     type: 'date'
   }];
   return {
-    statementConfig: statementConfigCustom !== null && statementConfigCustom !== void 0 ? statementConfigCustom : statementConfigDefault,
-    connectorConfig: connectorConfig,
-    operatorConfig: operatorConfig
+    statementConfig: statementConfigCustom ?? statementConfigDefault,
+    connectorConfig,
+    operatorConfig
   };
 };
 

package/lib/components/ConditionBuilder/utils/useTranslations.js

@@ -11,14 +11,15 @@ var React = require('react');
 var ConditionBuilderProvider = require('../ConditionBuilderContext/ConditionBuilderProvider.js');
 var translationObject = require('../ConditionBuilderContext/translationObject.js');
 
-var useTranslations = function useTranslations(translationKeys, alterTranslationKeyMap) {
-  var _useContext = React.useContext(ConditionBuilderProvider.ConditionBuilderContext),
-    translateWithId = _useContext.translateWithId;
-  return translationKeys.map(function (translationKey) {
-    if (alterTranslationKeyMap !== null && alterTranslationKeyMap !== void 0 && alterTranslationKeyMap[translationKey]) {
+const useTranslations = (translationKeys, alterTranslationKeyMap) => {
+  const {
+    translateWithId
+  } = React.useContext(ConditionBuilderProvider.ConditionBuilderContext);
+  return translationKeys.map(translationKey => {
+    if (alterTranslationKeyMap?.[translationKey]) {
       translationKey = alterTranslationKeyMap[translationKey];
     }
-    if (translateWithId !== null && translateWithId !== void 0 && translateWithId(translationKey)) {
+    if (translateWithId?.(translationKey)) {
       return translateWithId(translationKey);
     } else if (translationObject.translationsObject[translationKey]) {
       return translationObject.translationsObject[translationKey];

package/lib/components/ConditionBuilder/utils/util.js

@@ -9,25 +9,24 @@
 
 var settings = require('../../../settings.js');
 
-var blockClass = "".concat(settings.pkg.prefix, "--condition-builder");
-var NON_HIERARCHICAL_VARIANT = 'Non-Hierarchical';
-var HIERARCHICAL_VARIANT = 'Hierarchical';
-var focusThisField = function focusThisField(evt, conditionBuilderRef) {
+const blockClass = `${settings.pkg.prefix}--condition-builder`;
+const NON_HIERARCHICAL_VARIANT = 'Non-Hierarchical';
+const HIERARCHICAL_VARIANT = 'Hierarchical';
+const focusThisField = (evt, conditionBuilderRef) => {
   if (evt) {
-    setTimeout(function () {
-      var _evt$target$closest, _evt$target$closest2, _evt$target$closest3;
-      manageTabIndexAndFocus((_evt$target$closest = evt.target.closest('[role="gridcell"]')) === null || _evt$target$closest === void 0 ? void 0 : _evt$target$closest.querySelector('button'), conditionBuilderRef);
-      (_evt$target$closest2 = evt.target.closest('[role="gridcell"]')) === null || _evt$target$closest2 === void 0 || (_evt$target$closest2 = _evt$target$closest2.querySelector('button')) === null || _evt$target$closest2 === void 0 || _evt$target$closest2.click();
-      (_evt$target$closest3 = evt.target.closest('[role="gridcell"]')) === null || _evt$target$closest3 === void 0 || (_evt$target$closest3 = _evt$target$closest3.querySelector('button')) === null || _evt$target$closest3 === void 0 || _evt$target$closest3.focus();
+    setTimeout(() => {
+      manageTabIndexAndFocus(evt.target.closest('[role="gridcell"]')?.querySelector('button'), conditionBuilderRef);
+      evt.target.closest('[role="gridcell"]')?.querySelector('button')?.click();
+      evt.target.closest('[role="gridcell"]')?.querySelector('button')?.focus();
     }, 0);
   }
 };
-var focusThisItem = function focusThisItem(currentElement, conditionBuilderRef) {
-  setTimeout(function () {
+const focusThisItem = (currentElement, conditionBuilderRef) => {
+  setTimeout(() => {
     manageTabIndexAndFocus(currentElement, conditionBuilderRef);
   }, 0);
 };
-var traverseClockVise = function traverseClockVise(eachElem, index, allElements, rotate, trapFocus, conditionBuilderRef) {
+const traverseClockVise = (eachElem, index, allElements, rotate, trapFocus, conditionBuilderRef) => {
   if (eachElem == document.activeElement) {
     if (index !== allElements.length - 1) {
       focusThisItem(allElements[index + 1], conditionBuilderRef);
@@ -38,7 +37,7 @@ var traverseClockVise = function traverseClockVise(eachElem, index, allElements,
     focusThisItem(allElements[0], conditionBuilderRef);
   }
 };
-var traverseReverse = function traverseReverse(eachElem, index, allElements, rotate, trapFocus, conditionBuilderRef) {
+const traverseReverse = (eachElem, index, allElements, rotate, trapFocus, conditionBuilderRef) => {
   if (eachElem == document.activeElement) {
     if (index !== 0) {
       focusThisItem(allElements[index - 1], conditionBuilderRef);
@@ -49,31 +48,26 @@ var traverseReverse = function traverseReverse(eachElem, index, allElements, rot
     focusThisItem(allElements[allElements.length - 1], conditionBuilderRef);
   }
 };
-var checkForHoldingKey = function checkForHoldingKey(evt, key) {
+const checkForHoldingKey = (evt, key) => {
   return evt[key];
 };
-var checkIsValid = function checkIsValid(item) {
+const checkIsValid = item => {
   return item && item !== 'INVALID';
 };
-var manageTabIndexAndFocus = function manageTabIndexAndFocus(currentElement, conditionBuilderRef) {
-  var _currentElement$close, _conditionBuilderRef$;
-  var contentContainer = (_currentElement$close = currentElement === null || currentElement === void 0 ? void 0 : currentElement.closest(".".concat(blockClass, "__content-container"))) !== null && _currentElement$close !== void 0 ? _currentElement$close : currentElement === null || currentElement === void 0 ? void 0 : currentElement.closest(".".concat(blockClass, "__actions-container"));
-  contentContainer && Array.from(contentContainer.querySelectorAll('[tabindex="0"]')).map(function (element) {
-    return element === null || element === void 0 ? void 0 : element.setAttribute('tabindex', '-1');
-  });
-  currentElement === null || currentElement === void 0 || currentElement.setAttribute('tabindex', '0');
-  (_conditionBuilderRef$ = conditionBuilderRef.current) === null || _conditionBuilderRef$ === void 0 || (_conditionBuilderRef$ = _conditionBuilderRef$.querySelector(".".concat(blockClass, "__statement-button"))) === null || _conditionBuilderRef$ === void 0 || _conditionBuilderRef$.setAttribute('tabindex', '1');
-  currentElement === null || currentElement === void 0 || currentElement.focus();
+const manageTabIndexAndFocus = (currentElement, conditionBuilderRef) => {
+  const contentContainer = currentElement?.closest(`.${blockClass}__content-container`) ?? currentElement?.closest(`.${blockClass}__actions-container`);
+  contentContainer && Array.from(contentContainer.querySelectorAll('[tabindex="0"]')).map(element => element?.setAttribute('tabindex', '-1'));
+  currentElement?.setAttribute('tabindex', '0');
+  conditionBuilderRef.current?.querySelector(`.${blockClass}__statement-button`)?.setAttribute('tabindex', '1');
+  currentElement?.focus();
 };
-var getValue = function getValue(type, value, config) {
-  if (config !== null && config !== void 0 && config.valueFormatter && ['custom'].includes(type)) {
+const getValue = (type, value, config) => {
+  if (config?.valueFormatter && ['custom'].includes(type)) {
     return config.valueFormatter(value);
   } else if (type === 'option') {
     if (value && typeof value !== 'string') {
-      var selectedValues = Array.isArray(value) ? value : [value];
-      return selectedValues.map(function (option) {
-        return option.label;
-      }).join(', ');
+      const selectedValues = Array.isArray(value) ? value : [value];
+      return selectedValues.map(option => option.label).join(', ');
     }
     return value;
   } else {
@@ -82,14 +76,11 @@ var getValue = function getValue(type, value, config) {
 };
 
 //check if the operator is configured as multiSelect in the input configuration or operator is on of
-var checkForMultiSelectOperator = function checkForMultiSelectOperator(condition, config) {
-  var _config$operators;
-  return (condition === null || condition === void 0 ? void 0 : condition.operator) === 'oneOf' || (config === null || config === void 0 || (_config$operators = config.operators) === null || _config$operators === void 0 ? void 0 : _config$operators.find(function (operator) {
-    return (condition === null || condition === void 0 ? void 0 : condition.operator) === operator.id && operator.isMultiSelect;
-  }));
+const checkForMultiSelectOperator = (condition, config) => {
+  return condition?.operator === 'oneOf' || config?.operators?.find(operator => condition?.operator === operator.id && operator.isMultiSelect);
 };
 //this will close the popover on escape key on search box
-var onKeyDownHandlerForSearch = function onKeyDownHandlerForSearch(evt, conditionBuilderRef) {
+const onKeyDownHandlerForSearch = (evt, conditionBuilderRef) => {
   if (!evt.currentTarget.value && evt.key === 'Escape') {
     focusThisField(evt, conditionBuilderRef);
   }

package/lib/components/CreateFullPage/CreateFullPage.d.ts

@@ -104,8 +104,12 @@ type CreateFullPageBaseProps = {
     /**
      * Specify a handler for submitting the multi step full page (final step).
      * This function can _optionally_ return a promise that is either resolved or rejected and the CreateFullPage will handle the submitting state of the create button.
+     *
+     * @returns Object - if you want to prevent the modal from closing, return an object with the property preventClose set to true
      */
-    onRequestSubmit: () => void;
+    onRequestSubmit: () => {
+        preventClose?: boolean;
+    } | void;
     /**
      * A secondary title of the full page, displayed in the influencer area
      */