@carbon/ibm-products 2.48.0 → 2.49.0-rc.0

package/lib/components/ConditionBuilder/ConditionPreview/ConditionPreview.d.ts

@@ -1,14 +1,31 @@
-export default ConditionPreview;
-declare function ConditionPreview({ previewType, group, colorIndex }: {
-    previewType: any;
-    group: any;
-    colorIndex: any;
-}): import("react/jsx-runtime").JSX.Element;
-declare namespace ConditionPreview {
-    namespace propTypes {
-        let colorIndex: PropTypes.Requireable<number>;
-        let group: PropTypes.Requireable<object>;
-        let previewType: PropTypes.Requireable<string>;
-    }
-}
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
 import PropTypes from 'prop-types';
+import { ConditionGroup } from '../ConditionBuilder.types';
+interface ConditionPreviewProps {
+    previewType: 'newGroup' | 'subGroup' | 'condition';
+    group: ConditionGroup;
+    colorIndex?: number;
+}
+declare const ConditionPreview: {
+    ({ previewType, group, colorIndex, }: ConditionPreviewProps): import("react/jsx-runtime").JSX.Element;
+    propTypes: {
+        /**
+         * index of the color for next group
+         */
+        colorIndex: PropTypes.Requireable<number>;
+        /**
+         * current conditional group
+         */
+        group: PropTypes.Requireable<object>;
+        /**
+         * type of review to be displayed
+         */
+        previewType: PropTypes.Requireable<string>;
+    };
+};
+export default ConditionPreview;

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

@@ -13,11 +13,11 @@ var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHel
 var React = require('react');
 var cx = require('classnames');
 var index = require('../../../node_modules/prop-types/index.js');
-var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
 var ConditionBuilderItem = require('../ConditionBuilderItem/ConditionBuilderItem.js');
 var ConditionConnector = require('../ConditionBuilderConnector/ConditionConnector.js');
 var useTranslations = require('../utils/useTranslations.js');
 var icons = require('@carbon/react/icons');
+var util = require('../utils/util.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -44,7 +44,7 @@ var ConditionPreview = function ConditionPreview(_ref) {
   }, []);
   var getConditionSection = function getConditionSection() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "".concat(DataConfigs.blockClass, "__preview-condition")
+      className: "".concat(util.blockClass, "__preview-condition")
     }, _ConditionBuilderItem || (_ConditionBuilderItem = /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
       label: propertyText,
       renderIcon: icons.Bee
@@ -55,43 +55,42 @@ var ConditionPreview = function ConditionPreview(_ref) {
     })));
   };
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, previewType == 'newGroup' && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
+    className: cx__default["default"](["".concat(util.blockClass, "__group__row ").concat(util.blockClass, "__group-preview "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
   }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
-    className: "".concat(DataConfigs.blockClass, "__statement-button"),
+    className: "".concat(util.blockClass, "__statement-button"),
     label: group.groupOperator
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     "data-color-index": colorIndex,
     "aria-hidden": true,
-    className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group ").concat(DataConfigs.blockClass, "__condition-wrapper ").concat(DataConfigs.blockClass, "__group-preview ").concat(DataConfigs.blockClass, "__group-wrapper "), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
+    className: cx__default["default"](["".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)])
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(DataConfigs.blockClass, "__gap")
+    className: "".concat(util.blockClass, "__gap")
   }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
-    className: "".concat(DataConfigs.blockClass, "__statement-button"),
+    className: "".concat(util.blockClass, "__statement-button"),
     label: ifText
   })), getConditionSection())), previewType == 'subGroup' && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview ").concat(DataConfigs.blockClass, "__gap-bottom"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
+    className: cx__default["default"](["".concat(util.blockClass, "__group__row ").concat(util.blockClass, "__group-preview ").concat(util.blockClass, "__gap-bottom"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(DataConfigs.blockClass, "__condition-block  ").concat(DataConfigs.blockClass, "__gap")
+    className: "".concat(util.blockClass, "__condition-block  ").concat(util.blockClass, "__gap")
   }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
     label: group.groupOperator,
-    className: "".concat(DataConfigs.blockClass, "__statement-button"),
-    popOverClassName: "".concat(DataConfigs.blockClass, "__gap")
+    className: "".concat(util.blockClass, "__statement-button"),
+    popOverClassName: "".concat(util.blockClass, "__gap")
   }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(DataConfigs.blockClass, "__group ").concat(DataConfigs.blockClass, "__condition-wrapper")
+    className: "".concat(util.blockClass, "__group ").concat(util.blockClass, "__condition-wrapper")
   }, /*#__PURE__*/React__default["default"].createElement(ConditionConnector["default"], {
-    className: "".concat(DataConfigs.blockClass, "__gap ").concat(DataConfigs.blockClass, "__groupConnector"),
+    className: "".concat(util.blockClass, "__gap ").concat(util.blockClass, "__groupConnector"),
     operator: ifText
   }), getConditionSection()))), previewType == 'condition' && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: cx__default["default"](["".concat(DataConfigs.blockClass, "__group__row ").concat(DataConfigs.blockClass, "__group-preview ").concat(DataConfigs.blockClass, "__gap-bottom"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(DataConfigs.blockClass, "__group-preview-animate"), animate)])
+    className: cx__default["default"](["".concat(util.blockClass, "__group__row ").concat(util.blockClass, "__group-preview ").concat(util.blockClass, "__gap-bottom"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(util.blockClass, "__group-preview-animate"), animate)])
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(DataConfigs.blockClass, "__condition-block  ").concat(DataConfigs.blockClass, "__gap")
+    className: "".concat(util.blockClass, "__condition-block  ").concat(util.blockClass, "__gap")
   }, /*#__PURE__*/React__default["default"].createElement(ConditionBuilderItem.ConditionBuilderItem, {
     label: group.groupOperator,
-    className: "".concat(DataConfigs.blockClass, "__statement-button"),
-    popOverClassName: "".concat(DataConfigs.blockClass, "__gap")
+    className: "".concat(util.blockClass, "__statement-button"),
+    popOverClassName: "".concat(util.blockClass, "__gap")
   }), getConditionSection())));
 };
-var ConditionPreview$1 = ConditionPreview;
 ConditionPreview.propTypes = {
   /**
    * index of the color for next group
@@ -107,4 +106,4 @@ ConditionPreview.propTypes = {
   previewType: index["default"].oneOf(['condition', 'subGroup', 'newGroup'])
 };
 
-exports["default"] = ConditionPreview$1;
+exports["default"] = ConditionPreview;

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

@@ -10,13 +10,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
-var DataConfigs = require('../ConditionBuilderContext/DataConfigs.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(DataConfigs.blockClass, "__popover"))) !== null && _activeElement$closes !== void 0 && _activeElement$closes.querySelector('[role="dialog"]'))) {
+  if (!((_activeElement$closes = activeElement.closest(".".concat(util.blockClass, "__popover"))) !== null && _activeElement$closes !== void 0 && _activeElement$closes.querySelector('[role="dialog"]'))) {
     handleKeyPressForMainContent(evt, conditionBuilderRef, variant);
   }
 };
@@ -29,7 +28,7 @@ var handleKeyDownForPopover = function handleKeyDownForPopover(evt, conditionBui
 
 //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(DataConfigs.blockClass, "__item-date")) || evt.target.closest(".".concat(DataConfigs.blockClass, "__item-time")));
+  return !['Escape'].includes(evt.key) && (evt.target.closest(".".concat(util.blockClass, "__item-date")) || evt.target.closest(".".concat(util.blockClass, "__item-time")));
 };
 var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentContainer, conditionBuilderRef) {
   var _parentContainer$quer;
@@ -46,7 +45,7 @@ var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentCont
       });
       //scroll to top when we reach a the top of the list to make search box visible
       if (Array.from(evt.target.closest('ul').querySelectorAll('li')).indexOf(evt.target) === 1) {
-        parentContainer.querySelector(".".concat(DataConfigs.blockClass, "__popover-content-wrapper")).scrollTop = 0;
+        parentContainer.querySelector(".".concat(util.blockClass, "__popover-content-wrapper")).scrollTop = 0;
       }
       break;
     case 'ArrowDown':
@@ -57,7 +56,7 @@ var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentCont
       });
       break;
     case 'Tab':
-      allItems = [].concat(_rollupPluginBabelHelpers.toConsumableArray(Array.from(parentContainer.querySelectorAll(".".concat(DataConfigs.blockClass, "__selectAll-button,[role=\"searchbox\"]")))), [parentContainer.querySelector("[role=\"option\"]")]);
+      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) {
         if (isHoldingShiftKey) {
           util.traverseReverse(eachElem, index, allElements, true, true, conditionBuilderRef);
@@ -82,9 +81,9 @@ var handleKeyPressForPopover = function handleKeyPressForPopover(evt, parentCont
         if (document.activeElement.type !== 'button') {
           var _document$activeEleme2;
           //for button , enter key is click which already handled by framework, for other elements trigger click
+          evt.preventDefault();
           (_document$activeEleme2 = document.activeElement) === null || _document$activeEleme2 === void 0 || _document$activeEleme2.click();
         }
-        evt.preventDefault();
       } else {
         if (document.activeElement.type !== 'button') {
           var _document$activeEleme3;
@@ -105,12 +104,12 @@ var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, co
   switch (evt.key) {
     case 'ArrowRight':
       evt.preventDefault();
-      if (variant == 'tree') {
+      if (variant == util.HIERARCHICAL_VARIANT) {
         var _evt$target$closest;
         var allCellsInRow = Array.from((_evt$target$closest = evt.target.closest('[role="row"]')) === null || _evt$target$closest === void 0 ? void 0 : _evt$target$closest.querySelectorAll('[role="gridcell"] button'));
         if (allCellsInRow.length === 1) {
           evt.target = evt.target.closest('[role="row"]');
-          handleRowNavigationTree(evt, conditionBuilderRef, variant);
+          handleRowNavigationHierarchical(evt, conditionBuilderRef, variant);
           //focus next row
         } else if (evt.target.getAttribute('role') == 'row') {
           //when current focus is on a row, then we need to enter inside and focus the first cell of that row
@@ -132,7 +131,7 @@ var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, co
       break;
     case 'ArrowLeft':
       evt.preventDefault();
-      if (variant == 'tree') {
+      if (variant == util.HIERARCHICAL_VARIANT) {
         if (evt.target.getAttribute('role') !== 'row') {
           var _evt$target$closest2;
           //when any cell is focussed, arrow left will select the previous cell or current row
@@ -154,8 +153,8 @@ var handleKeyPressForMainContent = function handleKeyPressForMainContent(evt, co
     case 'ArrowUp':
     case 'ArrowDown':
       evt.preventDefault();
-      if (variant == 'tree') {
-        handleRowNavigationTree(evt, conditionBuilderRef, variant);
+      if (variant == util.HIERARCHICAL_VARIANT) {
+        handleRowNavigationHierarchical(evt, conditionBuilderRef, variant);
       } else {
         handleRowNavigation(evt, conditionBuilderRef, variant);
       }
@@ -183,7 +182,7 @@ var handleRowNavigation = function handleRowNavigation(evt, conditionBuilderRef,
   var currentRowIndex = getRowIndex(evt.target, conditionBuilderRef);
   navigateToNextRowCell(evt, currentRowIndex, rows, variant, conditionBuilderRef);
 };
-var handleRowNavigationTree = function handleRowNavigationTree(evt, conditionBuilderRef, variant) {
+var handleRowNavigationHierarchical = function handleRowNavigationHierarchical(evt, conditionBuilderRef, variant) {
   var rows = getRows(conditionBuilderRef);
   var currentRowIndex = getRowIndex(evt.target, conditionBuilderRef);
   var nextRowIndex = currentRowIndex;
@@ -221,7 +220,7 @@ var navigateToNextRowCell = function navigateToNextRowCell(evt, currentRowIndex,
   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);
-  } else if (variant === 'tree') {
+  } 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);
   }

package/lib/components/ConditionBuilder/utils/useDataConfigs.d.ts

@@ -0,0 +1,18 @@
+export function useDataConfigs(): {
+    statementConfig: {
+        label: string;
+        id: string;
+        connector: string;
+        text1: any;
+        text2: string;
+    }[];
+    connectorConfig: {
+        label: any;
+        id: string;
+    }[];
+    operatorConfig: {
+        label: any;
+        id: string;
+        type: string;
+    }[];
+};

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

@@ -0,0 +1,124 @@
+/**
+ * Copyright IBM Corp. 2020, 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var useTranslations = require('./useTranslations.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 statementConfig = [{
+    label: 'ifText',
+    id: 'ifAll',
+    connector: 'and',
+    text1: ifAll,
+    text2: '(a && b)'
+  }, {
+    label: 'ifText',
+    id: 'ifAny',
+    connector: 'or',
+    text1: ifAny,
+    text2: '(a || b)'
+  }, {
+    label: 'unlessText',
+    id: 'unlessAll',
+    connector: 'and',
+    text1: unlessAll,
+    text2: '! (a && b)'
+  }, {
+    label: 'unlessText',
+    id: 'unlessAny',
+    connector: 'or',
+    text1: unlessAny,
+    text2: '! (a || b)'
+  }];
+  var connectorConfig = [{
+    label: and,
+    id: 'and'
+  }, {
+    label: or,
+    id: 'or'
+  }];
+  var operatorConfig = [{
+    label: is,
+    id: 'is',
+    type: 'all'
+  }, {
+    label: greater,
+    id: 'greater',
+    type: 'number'
+  }, {
+    label: greaterEqual,
+    id: 'greaterEqual',
+    type: 'number'
+  }, {
+    label: lower,
+    id: 'lower',
+    type: 'number'
+  }, {
+    label: lowerEqual,
+    id: 'lowerEqual',
+    type: 'number'
+  }, {
+    label: startsWith,
+    id: 'startsWith',
+    type: 'text,textarea'
+  }, {
+    label: endsWith,
+    id: 'endsWith',
+    type: 'text,textarea'
+  }, {
+    label: contains,
+    id: 'contains',
+    type: 'text,textarea'
+  }, {
+    label: oneOf,
+    id: 'oneOf',
+    type: 'option'
+  }, {
+    label: before,
+    id: 'before',
+    type: 'date,time'
+  }, {
+    label: after,
+    id: 'after',
+    type: 'date,time'
+  }, {
+    label: between,
+    id: 'between',
+    type: 'date'
+  }];
+  return {
+    statementConfig: statementConfig,
+    connectorConfig: connectorConfig,
+    operatorConfig: operatorConfig
+  };
+};
+
+exports.useDataConfigs = useDataConfigs;

package/lib/components/ConditionBuilder/utils/useTranslations.d.ts

@@ -1 +1 @@
-export function useTranslations(translationKeys: any): any;
+export function useTranslations(translationKeys: any, alterTranslationKeyMap: any): any;

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

@@ -13,10 +13,13 @@ var React = require('react');
 var ConditionBuilderProvider = require('../ConditionBuilderContext/ConditionBuilderProvider.js');
 var translationObject = require('../ConditionBuilderContext/translationObject.js');
 
-var useTranslations = function useTranslations(translationKeys) {
+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]) {
+      translationKey = alterTranslationKeyMap[translationKey];
+    }
     if (translateWithId !== null && translateWithId !== void 0 && translateWithId(translationKey)) {
       return translateWithId(translationKey);
     } else if (translationObject.translationsObject[translationKey]) {

package/lib/components/ConditionBuilder/utils/util.d.ts

@@ -1,3 +1,6 @@
+export const blockClass: string;
+export const NON_HIERARCHICAL_VARIANT: "Non-Hierarchical";
+export const HIERARCHICAL_VARIANT: "Hierarchical";
 export function focusThisField(evt: any, conditionBuilderRef: any): void;
 export function focusThisItem(currentElement: any, conditionBuilderRef: any): void;
 export function traverseClockVise(eachElem: any, index: any, allElements: any, rotate: any, trapFocus: any, conditionBuilderRef: any): void;
@@ -5,3 +8,12 @@ export function traverseReverse(eachElem: any, index: any, allElements: any, rot
 export function checkForHoldingKey(evt: any, key: any): any;
 export function checkIsValid(item: any): any;
 export function manageTabIndexAndFocus(currentElement: any, conditionBuilderRef: any): void;
+export namespace getValue {
+    function text(value: any): any;
+    function textarea(value: any): any;
+    function time(value: any): any;
+    function number(value: any): any;
+    function option(value: any): any;
+    function date(value: any): any;
+    function custom(value: any): any;
+}

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

@@ -9,8 +9,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
+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) {
   if (evt) {
     setTimeout(function () {
@@ -62,19 +65,66 @@ var checkIsValid = function checkIsValid(item) {
 };
 var manageTabIndexAndFocus = function manageTabIndexAndFocus(currentElement, conditionBuilderRef) {
   var _currentElement$close, _conditionBuilderRef$;
-  var contentContainer = (_currentElement$close = currentElement === null || currentElement === void 0 ? void 0 : currentElement.closest(".".concat(DataConfigs.blockClass, "__content-container"))) !== null && _currentElement$close !== void 0 ? _currentElement$close : currentElement === null || currentElement === void 0 ? void 0 : currentElement.closest(".".concat(DataConfigs.blockClass, "__actions-container"));
+  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(DataConfigs.blockClass, "__statement-button"))) === null || _conditionBuilderRef$ === void 0 || _conditionBuilderRef$.setAttribute('tabindex', '1');
+  (_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();
 };
+var formatDate = function formatDate(date) {
+  var day = String(date.getDate()).padStart(2, '0');
+  var month = String(date.getMonth() + 1).padStart(2, '0');
+  var year = date.getFullYear();
+  return "".concat(day, "/").concat(month, "/").concat(year);
+};
+var getValue = {
+  text: function text(value) {
+    return value;
+  },
+  textarea: function textarea(value) {
+    return value;
+  },
+  time: function time(value) {
+    return value;
+  },
+  number: function number(value) {
+    return value;
+  },
+  option: function option(value) {
+    if (value && typeof value !== 'string') {
+      var selectedValues = Array.isArray(value) ? value : [value];
+      return selectedValues.map(function (option) {
+        return option.label;
+      }).join(', ');
+    }
+    return value;
+  },
+  date: function date(value) {
+    if (Array.isArray(value) && value.length > 1) {
+      var start = value !== null && value !== void 0 && value[0] && !isNaN(new Date(value[0])) ? formatDate(new Date(value[0])) : '';
+      var end = value !== null && value !== void 0 && value[1] && !isNaN(new Date(value[1])) ? formatDate(new Date(value[1])) : '';
+      return "".concat(start, " To ").concat(end);
+    } else if (Array.isArray(value) && !isNaN(new Date(value[0]))) {
+      return formatDate(new Date(value[0]));
+    } else {
+      return value;
+    }
+  },
+  custom: function custom(value) {
+    return value;
+  }
+};
 
+exports.HIERARCHICAL_VARIANT = HIERARCHICAL_VARIANT;
+exports.NON_HIERARCHICAL_VARIANT = NON_HIERARCHICAL_VARIANT;
+exports.blockClass = blockClass;
 exports.checkForHoldingKey = checkForHoldingKey;
 exports.checkIsValid = checkIsValid;
 exports.focusThisField = focusThisField;
 exports.focusThisItem = focusThisItem;
+exports.getValue = getValue;
 exports.manageTabIndexAndFocus = manageTabIndexAndFocus;
 exports.traverseClockVise = traverseClockVise;
 exports.traverseReverse = traverseReverse;

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

@@ -21,7 +21,7 @@ interface CreateFullPageStepBaseProps extends PropsWithChildren {
     /**
      * This optional prop will render your form content inside of a fieldset html element
      */
-    hasFieldset: boolean;
+    hasFieldset?: boolean;
     /**
      * This prop is used to help track dynamic steps. If this value is `false` then the step is not included in the visible steps or the ProgressIndicator
      * steps. If this value is `true` then the step will be included in the list of visible steps, as well as being included in the ProgressIndicator step list
@@ -66,6 +66,6 @@ type CreateFullPageStepFieldsetProps = {
     hasFieldset?: true;
     fieldsetLegendText: string;
 };
-type CreateFullPageStepProps = CreateFullPageStepBaseProps & CreateFullPageStepFieldsetProps;
+export type CreateFullPageStepProps = CreateFullPageStepBaseProps & CreateFullPageStepFieldsetProps;
 export declare let CreateFullPageStep: React.ForwardRefExoticComponent<CreateFullPageStepProps & React.RefAttributes<HTMLDivElement>>;
 export {};

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

@@ -7,3 +7,4 @@
 export { CreateFullPage } from './CreateFullPage';
 export { CreateFullPageStep } from './CreateFullPageStep';
 export type { CreateFullPageProps } from './CreateFullPage';
+export type { CreateFullPageStepProps } from './CreateFullPageStep';

package/lib/components/CreateTearsheet/CreateTearsheet.js

@@ -120,10 +120,11 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var contentRef = React.useRef(null);
   React.useEffect(function () {
     var firstItem = stepData.findIndex(function (item) {
-      return item === null || item === void 0 ? void 0 : item.shouldIncludeStep;
+      return item.shouldIncludeStep === true;
     }) + 1;
     var lastItem = lastIndexInArray.lastIndexInArray(stepData, 'shouldIncludeStep', true);
     if (firstItem !== firstIncludedStep) {
+      setCurrentStep(firstItem);
       setFirstIncludedStep(firstItem);
     }
     if (lastItem !== lastIncludedStep) {
@@ -132,10 +133,8 @@ exports.CreateTearsheet = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     if (open && initialStep) {
       var numberOfHiddenSteps = getNumberOfHiddenSteps.getNumberOfHiddenSteps(stepData, initialStep);
       setCurrentStep(Number(initialStep + numberOfHiddenSteps));
-    } else {
-      setCurrentStep(firstIncludedStep);
     }
-  }, [stepData, firstIncludedStep, lastIncludedStep, initialStep, open]);
+  }, [firstIncludedStep, initialStep, lastIncludedStep, open, stepData]);
   useCreateComponentFocus.useCreateComponentFocus({
     previousState: previousState,
     currentStep: currentStep,

package/lib/components/DataSpreadsheet/DataSpreadsheet.js

@@ -23,6 +23,7 @@ var devtools = require('../../global/js/utils/devtools.js');
 var getScrollbarWidth = require('../../global/js/utils/getScrollbarWidth.js');
 var handleEditSubmit = require('./utils/handleEditSubmit.js');
 var handleHeaderCellSelection = require('./utils/handleHeaderCellSelection.js');
+var getNodeTextContent = require('../../global/js/utils/getNodeTextContent.js');
 var commonEventHandlers = require('./utils/commonEventHandlers.js');
 var settings = require('../../settings.js');
 var removeCellSelections = require('./utils/removeCellSelections.js');
@@ -214,7 +215,13 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
     var currentHeaders = [];
     if (Object.keys(currentColumns).length > 0) {
       Object.keys(currentColumns).forEach(function (itemIndex) {
-        if (currentColumns[itemIndex].Header) {
+        if (_rollupPluginBabelHelpers["typeof"](currentColumns[itemIndex].Header) === 'object') {
+          if (currentColumns[itemIndex].column_name) {
+            currentHeaders.push(currentColumns[itemIndex].column_name);
+          } else {
+            currentHeaders.push(getNodeTextContent.getNodeTextContent(currentColumns[itemIndex].Header));
+          }
+        } else if (currentColumns[itemIndex].Header) {
           currentHeaders.push(currentColumns[itemIndex].Header);
         }
       });

package/lib/components/Datagrid/Datagrid/DatagridToolbar.js

@@ -42,6 +42,7 @@ var DatagridBatchActionsToolbar = function DatagridBatchActionsToolbar(datagridS
     selectedRowIds = datagridState.state.selectedRowIds,
     toggleAllRowsSelected = datagridState.toggleAllRowsSelected,
     toolbarBatchActions = datagridState.toolbarBatchActions,
+    toolbarBatchActionsDisplayMin = datagridState.toolbarBatchActionsDisplayMin,
     setGlobalFilter = datagridState.setGlobalFilter,
     rows = datagridState.rows,
     dispatch = datagridState.dispatch,
@@ -89,7 +90,7 @@ var DatagridBatchActionsToolbar = function DatagridBatchActionsToolbar(datagridS
     var minWidthBeforeOverflowIcon = 380;
     // Do not render ButtonMenu when there are 3 or less items
     // and if there is enough available space to render all the items
-    if (toolbarBatchActions && (toolbarBatchActions === null || toolbarBatchActions === void 0 ? void 0 : toolbarBatchActions.length) <= 3 && !displayAllInMenu) {
+    if (toolbarBatchActions && !displayAllInMenu && (!toolbarBatchActionsDisplayMin && (toolbarBatchActions === null || toolbarBatchActions === void 0 ? void 0 : toolbarBatchActions.length) <= 3 || toolbarBatchActionsDisplayMin !== undefined && (toolbarBatchActions === null || toolbarBatchActions === void 0 ? void 0 : toolbarBatchActions.length) <= toolbarBatchActionsDisplayMin)) {
       return;
     }
     var renderItem = function renderItem(batchAction, index) {
@@ -107,7 +108,10 @@ var DatagridBatchActionsToolbar = function DatagridBatchActionsToolbar(datagridS
       tabIndex: totalSelected > 0 ? 0 : -1,
       menuAlignment: "bottom"
     }, toolbarBatchActions === null || toolbarBatchActions === void 0 ? void 0 : toolbarBatchActions.map(function (batchAction, index) {
-      var hidden = index < 2 && !displayAllInMenu;
+      var hidden = toolbarBatchActionsDisplayMin === undefined && index < 2 && !displayAllInMenu;
+      if (toolbarBatchActionsDisplayMin !== undefined && index < toolbarBatchActionsDisplayMin && !displayAllInMenu) {
+        hidden = true;
+      }
       if (!hidden) {
         return renderItem(batchAction, index);
       }
@@ -153,13 +157,14 @@ var DatagridBatchActionsToolbar = function DatagridBatchActionsToolbar(datagridS
     totalCount: rows && rows.length,
     translateWithId: translateWithIdBatchActions
   }, !displayAllInMenu && toolbarBatchActions && (toolbarBatchActions === null || toolbarBatchActions === void 0 ? void 0 : toolbarBatchActions.map(function (batchAction, index) {
-    if (index < 2 && toolbarBatchActions.length > 3 || index < 3 && toolbarBatchActions.length <= 3) {
+    if (!toolbarBatchActionsDisplayMin && index < 2 && toolbarBatchActions.length > 3 || index < 3 && toolbarBatchActions.length <= 3 || toolbarBatchActionsDisplayMin !== undefined && index < toolbarBatchActionsDisplayMin) {
       return /*#__PURE__*/React__default["default"].createElement(react.TableBatchAction, {
         key: "".concat(batchAction.label, "-").concat(index),
         renderIcon: batchAction.renderIcon,
         onClick: function onClick(event) {
           return onClickHandler(event, batchAction);
         },
+        className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty({}, "".concat(settings.carbon.prefix, "--noLabel"), !batchAction.label || batchAction.label === '')),
         iconDescription: batchAction.label,
         tabIndex: totalSelected > 0 ? 0 : -1
       }, batchAction.label);