@carbon/ibm-products 2.37.0 → 2.38.0

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

@@ -1,4 +1,4 @@
-export function ConditionBuilderItem({ children, className, label, renderIcon, title, type, showToolTip, state, popOverClassName, config, ...rest }: {
+export function ConditionBuilderItem({ children, className, label, renderIcon, title, type, showToolTip, condition, popOverClassName, config, ...rest }: {
     [x: string]: any;
     children: any;
     className: any;
@@ -7,7 +7,7 @@ export function ConditionBuilderItem({ children, className, label, renderIcon, t
     title: any;
     type: any;
     showToolTip: any;
-    state: any;
+    condition: any;
     popOverClassName: any;
     config: any;
 }): import("react/jsx-runtime").JSX.Element;
@@ -15,12 +15,12 @@ export namespace ConditionBuilderItem {
     namespace propTypes {
         let children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         let className: PropTypes.Requireable<string>;
+        let condition: PropTypes.Requireable<object>;
         let config: PropTypes.Requireable<object>;
         let label: PropTypes.Requireable<NonNullable<string | any[] | null | undefined>>;
         let popOverClassName: PropTypes.Requireable<string>;
         let renderIcon: PropTypes.Requireable<object>;
         let showToolTip: PropTypes.Requireable<boolean>;
-        let state: PropTypes.Requireable<object>;
         let title: PropTypes.Requireable<string>;
         let type: PropTypes.Requireable<string>;
     }

package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js

@@ -21,7 +21,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["children", "className", "label", "renderIcon", "title", "type", "showToolTip", "state", "popOverClassName", "config"];
+var _excluded = ["children", "className", "label", "renderIcon", "title", "type", "showToolTip", "condition", "popOverClassName", "config"];
 var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
   var children = _ref.children,
     className = _ref.className,
@@ -30,7 +30,7 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
     title = _ref.title,
     type = _ref.type,
     showToolTip = _ref.showToolTip,
-    state = _ref.state,
+    condition = _ref.condition,
     popOverClassName = _ref.popOverClassName,
     config = _ref.config,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
@@ -53,17 +53,17 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
      * rest['data-name'] holds the current field name
      * popoverToOpen hold the next popover to be opened if required
      */
-    if (state) {
+    if (condition) {
       var currentField = rest['data-name'];
       //if any condition is changed, state prop is triggered
-      if (state.popoverToOpen && currentField !== state.popoverToOpen) {
+      if (condition.popoverToOpen && currentField !== condition.popoverToOpen) {
         // close the previous popover
         setOpen(false);
-      } else if (currentField == 'valueField' && type == 'option' && state.operator !== 'one-of') {
+      } else if (currentField == 'valueField' && type == 'option' && condition.operator !== 'one-of') {
         //close the current popover if the field is valueField and  is a single select dropdown. For all other inputs ,popover need to be open on value changes.
         setOpen(false);
       }
-      if (state.popoverToOpen == currentField) {
+      if (condition.popoverToOpen == currentField) {
         //current popover need to be opened
         setOpen(true);
       }
@@ -73,7 +73,7 @@ var ConditionBuilderItem = function ConditionBuilderItem(_ref) {
       setOpen(false);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [state, label]);
+  }, [condition, label]);
   React.useEffect(function () {
     //this will focus the first input field in the popover
     if (open && contentRef.current) {
@@ -121,6 +121,10 @@ ConditionBuilderItem.propTypes = {
    * Provide an optional class to be applied to the containing node.
    */
   className: index["default"].string,
+  /**
+   * current condition state object
+   */
+  condition: index["default"].object,
   /**
    * this is the config object again the current property from inputConfig
    */
@@ -142,10 +146,6 @@ ConditionBuilderItem.propTypes = {
    * show tool tip
    */
   showToolTip: index["default"].bool,
-  /**
-   * current condition state object
-   */
-  state: index["default"].object,
   /**
    * title of the popover
    */

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

@@ -5,20 +5,22 @@ export default ConditionGroupBuilder;
  * All the inner components of group are called from here.
  * @returns
  */
-declare function ConditionGroupBuilder({ state, aria, onRemove, onChange, conditionBuilderRef, }: {
-    state: any;
+declare function ConditionGroupBuilder({ group, aria, onRemove, onChange, conditionBuilderRef, className, }: {
+    group: any;
     aria: any;
     onRemove: any;
     onChange: any;
     conditionBuilderRef: any;
+    className: any;
 }): import("react/jsx-runtime").JSX.Element;
 declare namespace ConditionGroupBuilder {
     namespace propTypes {
         let aria: PropTypes.Requireable<object>;
+        let className: PropTypes.Requireable<string>;
         let conditionBuilderRef: PropTypes.Requireable<object>;
+        let group: PropTypes.Requireable<object>;
         let onChange: PropTypes.Requireable<(...args: any[]) => any>;
         let onRemove: PropTypes.Requireable<(...args: any[]) => any>;
-        let state: PropTypes.Requireable<object>;
     }
 }
 import PropTypes from 'prop-types';

package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js

@@ -14,6 +14,7 @@ var React = require('react');
 var ConditionBlock = require('../ConditionBlock/ConditionBlock.js');
 var index = require('../../../node_modules/prop-types/index.js');
 var DataConfigs = require('../ConditionBuilderContext/DataConfigs.js');
+var uuidv4 = require('../../../global/js/utils/uuidv4.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -26,17 +27,18 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * @returns
  */
 var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
-  var _state$conditions;
-  var state = _ref.state,
+  var _group$conditions;
+  var group = _ref.group,
     aria = _ref.aria,
     onRemove = _ref.onRemove,
     onChange = _ref.onChange,
-    conditionBuilderRef = _ref.conditionBuilderRef;
-  var onRemoveHandler = function onRemoveHandler(conditionIndex, e) {
-    if (state.conditions.length > 1) {
-      onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state), {}, {
-        conditions: state.conditions.filter(function (condition, cIndex) {
-          return conditionIndex !== cIndex;
+    conditionBuilderRef = _ref.conditionBuilderRef,
+    className = _ref.className;
+  var onRemoveHandler = function onRemoveHandler(conditionId, e) {
+    if (group.conditions.length > 1) {
+      onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, group), {}, {
+        conditions: group.conditions.filter(function (condition) {
+          return conditionId !== condition.id;
         })
       }));
       handleFocusOnClose(e);
@@ -44,23 +46,27 @@ var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
       onRemove();
     }
   };
-  var onChangeHandler = function onChangeHandler(updatedConditions, conditionIndex) {
-    onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state), {}, {
-      conditions: state.conditions.map(function (condition, cIndex) {
-        return conditionIndex === cIndex ? updatedConditions : condition;
-      })
+  var onChangeHandler = function onChangeHandler(updatedCondition, conditionIndex) {
+    var updatedConditions = [].concat(_rollupPluginBabelHelpers.toConsumableArray(group.conditions.slice(0, conditionIndex)), [updatedCondition], _rollupPluginBabelHelpers.toConsumableArray(group.conditions.slice(conditionIndex + 1)));
+    onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, group), {}, {
+      conditions: updatedConditions
     }));
   };
   var addConditionHandler = function addConditionHandler(conditionIndex) {
-    onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state), {}, {
-      conditions: [].concat(_rollupPluginBabelHelpers.toConsumableArray(state.conditions.slice(0, conditionIndex + 1)), [{
-        property: undefined,
-        operator: '',
-        value: '',
-        popoverToOpen: 'propertyField'
-      }], _rollupPluginBabelHelpers.toConsumableArray(state.conditions.slice(conditionIndex + 1)))
+    var newCondition = {
+      property: undefined,
+      operator: '',
+      value: '',
+      popoverToOpen: 'propertyField',
+      id: uuidv4["default"]()
+    };
+    onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, group), {}, {
+      conditions: [].concat(_rollupPluginBabelHelpers.toConsumableArray(group.conditions.slice(0, conditionIndex + 1)), [newCondition], _rollupPluginBabelHelpers.toConsumableArray(group.conditions.slice(conditionIndex + 1)))
     }));
   };
+  var isLastCondition = function isLastCondition(conditionIndex, conditionArr) {
+    return conditionIndex + 1 >= conditionArr.length || conditionArr.length - 1 != conditionIndex && conditionArr[conditionIndex + 1].conditions;
+  };
   var handleFocusOnClose = function handleFocusOnClose(e) {
     var _e$currentTarget;
     var previousClose = (_e$currentTarget = e.currentTarget) === null || _e$currentTarget === void 0 || (_e$currentTarget = _e$currentTarget.closest('[role="row"]')) === null || _e$currentTarget === void 0 || (_e$currentTarget = _e$currentTarget.previousSibling) === null || _e$currentTarget === void 0 ? void 0 : _e$currentTarget.querySelector('[data-name="closeCondition"]');
@@ -69,40 +75,39 @@ var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
     }
   };
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: " ".concat(DataConfigs.blockClass, "__condition-builder__group eachGroup")
+    className: "".concat(className, "  eachGroup")
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(DataConfigs.blockClass, "__condition-wrapper"),
     role: "grid",
     "aria-label": DataConfigs.translateWithId('condition_builder_group')
-  }, state === null || state === void 0 || (_state$conditions = state.conditions) === null || _state$conditions === void 0 ? void 0 : _state$conditions.map(function (eachCondition, conditionIndex) {
+  }, group === null || group === void 0 || (_group$conditions = group.conditions) === null || _group$conditions === void 0 ? void 0 : _group$conditions.map(function (eachCondition, conditionIndex) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
-      key: conditionIndex
+      key: eachCondition.id
     }, eachCondition.conditions && /*#__PURE__*/React__default["default"].createElement(ConditionGroupBuilder, {
+      className: "".concat(DataConfigs.blockClass, "__condition-builder__group"),
       aria: {
         level: aria.level + 1,
         posinset: conditionIndex + 1,
-        setsize: state.conditions.length
+        setsize: group.conditions.length
       },
-      state: eachCondition,
-      onChange: function onChange(updatedConditions) {
-        onChangeHandler(updatedConditions, conditionIndex);
+      group: eachCondition,
+      onChange: function onChange(updatedCondition) {
+        onChangeHandler(updatedCondition, conditionIndex);
       },
       onRemove: function onRemove(e) {
-        onRemoveHandler(conditionIndex, e);
+        onRemoveHandler(eachCondition.id, e);
       },
-      conditionBuilderRef: conditionBuilderRef,
-      key: conditionIndex
+      conditionBuilderRef: conditionBuilderRef
     }), !eachCondition.conditions && /*#__PURE__*/React__default["default"].createElement(ConditionBlock["default"], {
-      key: conditionIndex,
-      conjunction: conditionIndex > 0 ? state.groupOperator : undefined,
+      conjunction: conditionIndex > 0 ? group.groupOperator : undefined,
       aria: {
         level: aria.level + 1,
         posinset: conditionIndex + 1,
-        setsize: state.conditions.length
+        setsize: group.conditions.length
       },
       isStatement: conditionIndex == 0,
-      state: eachCondition,
-      group: state,
+      condition: eachCondition,
+      group: group,
       conditionIndex: conditionIndex,
       className: "".concat(DataConfigs.blockClass, "__gap ").concat(DataConfigs.blockClass, "__gap-bottom"),
       onChange: function onChange(updatedConditions) {
@@ -110,18 +115,19 @@ var ConditionGroupBuilder = function ConditionGroupBuilder(_ref) {
       },
       addConditionHandler: addConditionHandler,
       onRemove: function onRemove(e) {
-        onRemoveHandler(conditionIndex, e);
+        onRemoveHandler(eachCondition.id, e);
       },
       onConnectorOperatorChange: function onConnectorOperatorChange(op) {
-        onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state), {}, {
+        onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, group), {}, {
           groupOperator: op
         }));
       },
       onStatementChange: function onStatementChange(updatedStatement) {
-        onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, state), {}, {
+        onChange(_rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, group), {}, {
           statement: updatedStatement
         }));
-      }
+      },
+      isLastCondition: isLastCondition
     }));
   })));
 };
@@ -131,10 +137,18 @@ ConditionGroupBuilder.propTypes = {
    * object contains the aria attributes
    */
   aria: index["default"].object,
+  /**
+   * Provide an  class to be applied to the containing node.
+   */
+  className: index["default"].string,
   /**
    * ref of condition builder
    */
   conditionBuilderRef: index["default"].object,
+  /**
+   * group defines the current group
+   */
+  group: index["default"].object,
   /**
   
    * callback to update the current condition of the state tree
@@ -143,11 +157,7 @@ ConditionGroupBuilder.propTypes = {
   /**
    * call back to remove the particular group from the state tree
    */
-  onRemove: index["default"].func,
-  /**
-   * state defines the current group
-   */
-  state: index["default"].object
+  onRemove: index["default"].func
 };
 
 exports["default"] = ConditionGroupBuilder$1;

package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js

@@ -23,6 +23,7 @@ var checkActiveHeaderCell = require('./utils/checkActiveHeaderCell.js');
 var checkSelectedHeaderCell = require('./utils/checkSelectedHeaderCell.js');
 var getSpreadsheetWidth = require('./utils/getSpreadsheetWidth.js');
 var commonEventHandlers = require('./utils/commonEventHandlers.js');
+var propsHelper = require('../../global/js/utils/props-helper.js');
 var usePreviousValue = require('../../global/js/hooks/usePreviousValue.js');
 var useSpreadsheetMouseUp = require('./hooks/useSpreadsheetMouseUp.js');
 
@@ -204,10 +205,6 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       }
     }
   }, [defaultColumn, ref, activeCellCoordinates, previousState === null || previousState === void 0 ? void 0 : previousState.rowHeight, selectionAreas, setActiveCellInsideSelectionArea, setSelectionAreas, visibleColumns]);
-  //selectionAreas will be set when ever a selection area is made.
-  React.useEffect(function () {
-    removeDuplicateSelections();
-  }, [selectionAreas, removeDuplicateSelections]);
 
   //this method will check for any duplicate selection area and remove.
   //same selections are those have the same height, width, top, left styles. These inline styles are being set in createCellSelection util.
@@ -246,6 +243,11 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     }
   }, [ref, setSelectionAreas, setSelectionAreaData]);
 
+  //selectionAreas will be set when ever a selection area is made.
+  React.useEffect(function () {
+    removeDuplicateSelections();
+  }, [selectionAreas, removeDuplicateSelections]);
+
   // onClick fn for each cell in the data spreadsheet body,
   // adds the active cell highlight
 
@@ -308,9 +310,12 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     var row = rows[index];
     if (rows && rows.length) {
       prepareRow(row);
-      return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, row.getRowProps({
+      var rowProps = propsHelper.prepareProps(row.getRowProps({
         style: style
-      }), {
+      }), 'key');
+      return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
+        key: _rollupPluginBabelHelpers.objectSpread2({}, row.getRowProps().key)
+      }, rowProps, {
         className: cx__default["default"]("".concat(blockClass, "__tr")),
         "data-row-index": index,
         "aria-rowindex": index + 1,
@@ -331,10 +336,11 @@ var DataSpreadsheetBody = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         }
       }, index + 1)), row.cells.map(function (cell, index) {
         var _cell$column;
+        var cellProps = propsHelper.prepareProps(cell.getCellProps(), 'key');
         return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
           key: "cell_".concat(index),
           "aria-colindex": index + 1
-        }, cell.getCellProps(), {
+        }, cellProps, {
           role: "gridcell",
           style: _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, cell.getCellProps().style), {}, {
             display: 'grid',

package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js

@@ -21,6 +21,7 @@ var handleHeaderCellSelection = require('./utils/handleHeaderCellSelection.js');
 var selectAllCells = require('./utils/selectAllCells.js');
 var getSpreadsheetWidth = require('./utils/getSpreadsheetWidth.js');
 var checkForHoldingKey = require('./utils/checkForHoldingKey.js');
+var propsHelper = require('../../global/js/utils/props-helper.js');
 var usePreviousValue = require('../../global/js/hooks/usePreviousValue.js');
 var useSpreadsheetMouseMove = require('./hooks/useSpreadsheetMouseMove.js');
 
@@ -143,9 +144,10 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     className: cx__default["default"]("".concat(blockClass, "__header--container")),
     role: "rowgroup"
   }, headerGroups.map(function (headerGroup, index) {
+    var headerProps = propsHelper.prepareProps(headerGroup.getHeaderGroupProps(), 'key');
     return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
       key: "header_".concat(index)
-    }, headerGroup.getHeaderGroupProps(), {
+    }, headerProps, {
       style: _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, headerGroup.getHeaderGroupProps().style), {}, {
         width: getSpreadsheetWidth.getSpreadsheetWidth({
           type: 'header',
@@ -175,12 +177,13 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       onClick: handleSelectAllClick,
       className: cx__default["default"]("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element"), "".concat(blockClass, "__th--select-all"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__th--active-header"), (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header'))
     }, "\xA0")), headerGroup.headers.map(function (column, index) {
+      var colProps = propsHelper.prepareProps(column.getHeaderProps(), 'key');
       var selectedHeader = checkSelectedHeaderCell.checkSelectedHeaderCell(index, selectionAreas, 'column', rows);
       return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
         key: "column_".concat(index),
         role: "columnheader",
         className: "".concat(blockClass, "__columnheader")
-      }, column.getHeaderProps()), /*#__PURE__*/React__default["default"].createElement("button", {
+      }, colProps), /*#__PURE__*/React__default["default"].createElement("button", {
         id: "".concat(blockClass, "__cell--header--").concat(index),
         "data-row-index": "header",
         "data-column-index": index,

package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js

@@ -19,12 +19,13 @@ var useMoveActiveCell = function useMoveActiveCell(_ref) {
     createActiveCell = _ref.createActiveCell,
     activeCellContent = _ref.activeCellContent,
     isActiveHeaderCellChanged = _ref.isActiveHeaderCellChanged;
+  var performCreateActiveCell;
   //new active cell is created when the activeCellContent changes or navigate through headers
   // Otherwise new active cell will display the old value in a glance
   React.useEffect(function () {
     performCreateActiveCell();
   }, [activeCellContent, performCreateActiveCell, isActiveHeaderCellChanged]);
-  var performCreateActiveCell = React.useCallback(function () {
+  performCreateActiveCell = React.useCallback(function () {
     var activeCellPlacementElement = spreadsheetRef === null || spreadsheetRef === void 0 ? void 0 : spreadsheetRef.current.querySelector("[data-row-index=\"".concat(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row, "\"][data-column-index=\"").concat(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column, "\"]"));
     var shouldPlaceActiveCellInHeader = (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' && true;
     var selectAllElement = spreadsheetRef === null || spreadsheetRef === void 0 ? void 0 : spreadsheetRef.current.querySelector("[data-row-index=\"header\"][data-column-index=\"header\"]");

package/lib/components/Datagrid/Datagrid/DatagridContent.d.ts

@@ -14,6 +14,7 @@ export namespace DatagridContent {
             DatagridPagination: PropTypes.Requireable<NonNullable<PropTypes.ReactElementLike | ((...args: any[]) => any) | null | undefined>>;
             CustomizeColumnsTearsheet: PropTypes.Requireable<NonNullable<PropTypes.ReactElementLike | ((...args: any[]) => any) | null | undefined>>;
             isFetching: PropTypes.Requireable<boolean>;
+            skeletonRowCount: PropTypes.Requireable<number>;
             fullHeightDatagrid: PropTypes.Requireable<boolean>;
             filterProps: PropTypes.Requireable<object>;
             variableRowHeight: PropTypes.Requireable<boolean>;

package/lib/components/Datagrid/Datagrid/DatagridContent.js

@@ -193,6 +193,7 @@ DatagridContent.propTypes = {
     DatagridPagination: index["default"].oneOfType([index["default"].element, index["default"].func]),
     CustomizeColumnsTearsheet: index["default"].oneOfType([index["default"].element, index["default"].func]),
     isFetching: index["default"].bool,
+    skeletonRowCount: index["default"].number,
     fullHeightDatagrid: index["default"].bool,
     filterProps: index["default"].object,
     variableRowHeight: index["default"].bool,

package/lib/components/Datagrid/useSkeletonRows.d.ts

@@ -1,6 +1,6 @@
 export default useSkeletons;
 /**
- * Copyright IBM Corp. 2020, 2023
+ * 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.

package/lib/components/Datagrid/useSkeletonRows.js

@@ -12,7 +12,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
 
 /**
- * Copyright IBM Corp. 2020, 2023
+ * 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.
@@ -21,7 +21,11 @@ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelper
 var useSkeletons = function useSkeletons(hooks) {
   var useInstance = function useInstance(instance) {
     var isFetching = instance.isFetching,
-      rows = instance.rows;
+      rows = instance.rows,
+      skeletonRowCount = instance.skeletonRowCount;
+    if (isFetching && skeletonRowCount === 0) {
+      throw new Error('skeletonRowCount cannot be set to 0, if isFetching is true');
+    }
     var skeletonRow = function skeletonRow(id) {
       return {
         isSkeleton: true,
@@ -29,7 +33,11 @@ var useSkeletons = function useSkeletons(hooks) {
         id: id
       };
     };
-    var rowsWithSkeletons = [].concat(_rollupPluginBabelHelpers.toConsumableArray(rows), [skeletonRow('skeleton-row-1'), skeletonRow('skeleton-row-2'), skeletonRow('skeleton-row-3')]);
+    var rowsWithSkeletons = [].concat(_rollupPluginBabelHelpers.toConsumableArray(rows), _rollupPluginBabelHelpers.toConsumableArray(Array.from({
+      length: skeletonRowCount || 3
+    }, function (_, index) {
+      return skeletonRow("skeleton-row-".concat(index + 1));
+    })));
     Object.assign(instance, {
       rows: isFetching ? rowsWithSkeletons : rows
     });

package/lib/components/EditTearsheetNarrow/EditTearsheetNarrow.d.ts

@@ -1,5 +1,22 @@
+/**
+ * Copyright IBM Corp. 2022, 2022
+ *
+ * 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 React, { ReactNode } from 'react';
+interface EditTearsheetNarrowProps {
+    /**
+     * Provide the contents of the EditTearsheetNarrow.
+     */
+    children: ReactNode;
+    /**
+     * Provide an optional class to be applied to the containing node.
+     */
+    className?: string;
+}
 /**
  * Use a narrow tearsheet as an alternative to a modal when there is scrolling. See usage guidance for further information.
  */
-export let EditTearsheetNarrow: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
-import React from 'react';
+export declare let EditTearsheetNarrow: React.ForwardRefExoticComponent<EditTearsheetNarrowProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/lib/components/SearchBar/SearchBar.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { PropsWithChildren } from 'react';
+import PropTypes from 'prop-types';
 type Scopes = string[] | object[];
 interface SearchBarProps extends PropsWithChildren {
     /** @type {string} Optional additional class name. */
@@ -22,7 +23,7 @@ interface SearchBarProps extends PropsWithChildren {
     /** @type {Function} Function handler for when the user submits a search. */
     onSubmit?: (event: any) => void;
     /** @type {string} Placeholder text to be displayed in the search input. */
-    placeHolderText: string;
+    placeholderText: string;
     /** @type {Function} Function to get the text for each scope to display in dropdown. */
     scopeToString?: () => void;
     /** @type {Array<any>} Array of allowed search scopes. */
@@ -50,4 +51,12 @@ interface SearchBarProps extends PropsWithChildren {
 }
 export declare let SearchBar: React.ForwardRefExoticComponent<SearchBarProps & React.RefAttributes<HTMLFormElement>>;
 declare const conditionalScopePropValidator: (props: any, propName: any, componentName: any, ...rest: any[]) => Error | null;
+export declare const deprecatedProps: {
+    /**
+     * **Deprecated**
+     *
+     * Provide accessible label text for the scopes MultiSelect.
+     */
+    titleText: PropTypes.Requireable<string>;
+};
 export {};