@carbon/ibm-products 2.29.0-alpha.10 → 2.30.0-alpha.9

package/lib/components/AboutModal/AboutModal.js

@@ -10,15 +10,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var react = require('@carbon/react');
 var React = require('react');
-var useResizeObserver = require('../../global/js/hooks/useResizeObserver.js');
 var index = require('../../node_modules/prop-types/index.js');
 var cx = require('classnames');
-var settings = require('../../settings.js');
-var uuidv4 = require('../../global/js/utils/uuidv4.js');
 var devtools = require('../../global/js/utils/devtools.js');
-var react = require('@carbon/react');
+var settings = require('../../settings.js');
 var usePortalTarget = require('../../global/js/hooks/usePortalTarget.js');
+var uuidv4 = require('../../global/js/utils/uuidv4.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -30,7 +29,6 @@ var _excluded = ["additionalInfo", "className", "closeIconDescription", "copyrig
 // The block part of our conventional BEM class names (blockClass__E--M).
 var blockClass = "".concat(settings.pkg.prefix, "--about-modal");
 var componentName = 'AboutModal';
-
 // NOTE: the component SCSS is not imported here: it is rolled up separately.
 
 /**
@@ -55,30 +53,17 @@ exports.AboutModal = /*#__PURE__*/React__default["default"].forwardRef(function
     title = _ref.title,
     version = _ref.version,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-  var _useState = React.useState(true),
-    _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
-    hasScrollingContent = _useState2[0],
-    setHasScrollingContent = _useState2[1];
-  var bodyRef = React.useRef();
-  var contentRef = React.useRef();
+  var bodyRef = React.useRef(null);
+  var contentRef = React.useRef(null);
   var contentId = uuidv4["default"]();
   var renderPortalUse = usePortalTarget.usePortalTarget(portalTargetIn);
-  var handleResize = function handleResize() {
-    setHasScrollingContent(
-    // if our scroll height exceeds the client height enable scrolling
-    bodyRef.current.clientHeight < (hasScrollingContent ?
-    // Carbon modal adds 32px bottom margin when scrolling content is enabled
-    bodyRef.current.scrollHeight - 32 : bodyRef.current.scrollHeight));
-  };
 
   // We can't add a ref directly to the ModalBody, so track it in a ref
   // as the parent of the current bodyRef element
   React.useEffect(function () {
-    bodyRef.current = contentRef.current.parentElement;
+    var _contentRef$current;
+    bodyRef.current = (_contentRef$current = contentRef.current) === null || _contentRef$current === void 0 ? void 0 : _contentRef$current.parentElement;
   }, [bodyRef]);
-
-  // Detect resize of the ModalBody to recalculate whether scrolling is enabled
-  useResizeObserver.useResizeObserver(bodyRef, handleResize);
   return renderPortalUse( /*#__PURE__*/React__default["default"].createElement(react.ComposedModal, _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: cx__default["default"](blockClass,
     // Apply the block class to the main HTML element
@@ -98,10 +83,7 @@ exports.AboutModal = /*#__PURE__*/React__default["default"].forwardRef(function
     label: title,
     labelClassName: "".concat(blockClass, "__title")
   }), /*#__PURE__*/React__default["default"].createElement(react.ModalBody, {
-    "aria-label": hasScrollingContent ? '' : null,
-    "aria-labelledby": hasScrollingContent ? contentId : null,
-    className: "".concat(blockClass, "__body"),
-    hasScrollingContent: hasScrollingContent
+    className: "".concat(blockClass, "__body")
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "".concat(blockClass, "__body-content"),
     ref: contentRef,

package/lib/components/DataSpreadsheet/DataSpreadsheet.js

@@ -301,29 +301,121 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
     updateActiveCellCoordinates({
       coords: coordinatesClone,
       updatedValue: {
-        column: type === 'home' ? 0 : columns.length - 1
+        column: type === 'Home' ? 0 : columns.length - 1
       }
     });
     removeCellSelections.removeCellSelections({
       spreadsheetRef: spreadsheetRef
     });
   }, [activeCellCoordinates, updateActiveCellCoordinates, spreadsheetRef, columns.length]);
+  var checkforReturnConditon = React.useCallback(function (key) {
+    return isEditing || key === 'Meta' || key === 'Control';
+  }, [isEditing]);
+  var handleArrowkeyPress = React.useCallback(function (arrowKey) {
+    event.preventDefault();
+    handleInitialArrowPress();
+    var coordinatesClone = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
+    var updatedValue;
+    switch (arrowKey) {
+      // Left
+      case 'ArrowLeft':
+        {
+          if (coordinatesClone.column === 'header') {
+            return;
+          }
+          if (typeof coordinatesClone.column === 'number') {
+            if (coordinatesClone.column === 0) {
+              updatedValue = {
+                column: 'header'
+              };
+            } else {
+              updatedValue = {
+                column: coordinatesClone.column - 1
+              };
+            }
+          }
+          break;
+        }
+      // Up
+      case 'ArrowUp':
+        {
+          if (coordinatesClone.row === 'header') {
+            return;
+          }
+          if (typeof coordinatesClone.row === 'number') {
+            // set row back to header if we are at index 0
+            if (coordinatesClone.row === 0) {
+              updatedValue = {
+                row: 'header'
+              };
+            } else {
+              // if we are at any other index than 0, subtract 1 from current row index
+              updatedValue = {
+                row: coordinatesClone.row - 1
+              };
+            }
+          }
+          break;
+        }
+      // Right
+      case 'ArrowRight':
+        {
+          if (coordinatesClone.column === 'header') {
+            updatedValue = {
+              column: 0
+            };
+          }
+          if (typeof coordinatesClone.column === 'number') {
+            // Prevent active cell coordinates from updating if the active
+            // cell is in the last column, ie we can't go any further to the right
+            if (columns.length - 1 === coordinatesClone.column) {
+              return;
+            } else {
+              updatedValue = {
+                column: coordinatesClone.column + 1
+              };
+            }
+          }
+          break;
+        }
+      // Down
+      case 'ArrowDown':
+        {
+          if (coordinatesClone.row === 'header') {
+            updatedValue = {
+              row: 0
+            };
+          }
+          if (typeof coordinatesClone.row === 'number') {
+            // Prevent active cell coordinates from updating if the active
+            // cell is in the last row, ie we can't go any further down since
+            // we are in the last row
+            if (rows.length - 1 === coordinatesClone.row) {
+              return;
+            } else {
+              updatedValue = {
+                row: coordinatesClone.row + 1
+              };
+            }
+          }
+          break;
+        }
+    }
+    if (updatedValue) {
+      updateActiveCellCoordinates({
+        coords: coordinatesClone,
+        updatedValue: updatedValue
+      });
+    }
+  }, [handleInitialArrowPress, updateActiveCellCoordinates, activeCellCoordinates, columns, rows]);
   var handleKeyPress = React.useCallback(function (event) {
     var key = event.key;
-    if (isEditing) {
-      return;
-    }
     // Command keys need to be returned as there is default browser behavior with these keys
-    if (key === 'Meta' || key === 'Control') {
-      return;
-    }
-    // Prevent arrow keys, home key, and end key from scrolling the page when the data spreadsheet container has focus
-    if (['End', 'Home', 'ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown'].indexOf(key) > -1 && !isEditing) {
-      event.preventDefault();
-    }
-    if (['Tab'].indexOf(key) > -1 && isEditing) {
+    // Needs to be returned in editing mode
+    if (checkforReturnConditon(key)) {
       return;
     }
+
     // Clear out all cell selection areas if user uses any arrow key, except if the shift key is being held
     if (['ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown'].indexOf(key) > -1) {
       if (selectionAreas !== null && selectionAreas !== void 0 && selectionAreas.length && keysPressedList.length < 2 && !handleMultipleKeys.includesShift(keysPressedList)) {
@@ -334,7 +426,7 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
         });
       }
     }
-    if (!isEditing && (keysPressedList === null || keysPressedList === void 0 ? void 0 : keysPressedList.length) > 1) {
+    if ((keysPressedList === null || keysPressedList === void 0 ? void 0 : keysPressedList.length) > 1) {
       handleMultipleKeys.handleMultipleKeys({
         activeCellCoordinates: activeCellCoordinates,
         event: event,
@@ -352,27 +444,24 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
         usingMac: usingMac
       });
     }
-    var deleteParams = {
-      selectionAreas: selectionAreas,
-      currentMatcher: currentMatcher,
-      rows: rows,
-      setActiveCellContent: setActiveCellContent,
-      updateData: updateData,
-      activeCellCoordinates: activeCellCoordinates
-    };
+
     // Allow arrow key navigation if there are less than two activeKeys OR
     // if one of the activeCellCoordinates is in a header position
+    // Prevent arrow keys, home key, and end key from scrolling the page when the data spreadsheet container has focus
+
     if (keysPressedList.length < 2 && !handleMultipleKeys.includesShift(keysPressedList) || activeCellCoordinates.row === 'header' || activeCellCoordinates.column === 'header') {
       switch (key) {
-        // Backspace
         case 'Backspace':
-          {
-            handleCellDeletion.handleCellDeletion(deleteParams);
-            break;
-          }
-        // Delete
         case 'Delete':
           {
+            var deleteParams = {
+              selectionAreas: selectionAreas,
+              currentMatcher: currentMatcher,
+              rows: rows,
+              setActiveCellContent: setActiveCellContent,
+              updateData: updateData,
+              activeCellCoordinates: activeCellCoordinates
+            };
             handleCellDeletion.handleCellDeletion(deleteParams);
             break;
           }
@@ -390,22 +479,14 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
           }
         // HOME
         case 'Home':
-          {
-            if (handleMultipleKeys.includesResourceKey(keysPressedList, usingMac)) {
-              return;
-            }
-            handleHomeEndKey({
-              type: 'home'
-            });
-            break;
-          }
         case 'End':
           {
+            event.preventDefault();
             if (handleMultipleKeys.includesResourceKey(keysPressedList, usingMac)) {
               return;
             }
             handleHomeEndKey({
-              type: 'end'
+              type: key
             });
             break;
           }
@@ -429,122 +510,16 @@ exports.DataSpreadsheet = /*#__PURE__*/React__default["default"].forwardRef(func
             setActiveCellCoordinates(null);
             break;
           }
-        // Left
         case 'ArrowLeft':
-          {
-            handleInitialArrowPress();
-            var coordinatesClone = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
-            if (coordinatesClone.column === 'header') {
-              return;
-            }
-            if (typeof coordinatesClone.column === 'number') {
-              if (coordinatesClone.column === 0) {
-                updateActiveCellCoordinates({
-                  coords: coordinatesClone,
-                  updatedValue: {
-                    column: 'header'
-                  }
-                });
-                return;
-              }
-              updateActiveCellCoordinates({
-                coords: coordinatesClone,
-                updatedValue: {
-                  column: coordinatesClone.column - 1
-                }
-              });
-            }
-            break;
-          }
-        // Up
         case 'ArrowUp':
-          {
-            handleInitialArrowPress();
-            var _coordinatesClone = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
-            if (_coordinatesClone.row === 'header') {
-              return;
-            }
-            if (typeof _coordinatesClone.row === 'number') {
-              // set row back to header if we are at index 0
-              if (_coordinatesClone.row === 0) {
-                updateActiveCellCoordinates({
-                  coords: _coordinatesClone,
-                  updatedValue: {
-                    row: 'header'
-                  }
-                });
-                return;
-              }
-              // if we are at any other index than 0, subtract 1 from current row index
-              updateActiveCellCoordinates({
-                coords: _coordinatesClone,
-                updatedValue: {
-                  row: _coordinatesClone.row - 1
-                }
-              });
-            }
-            break;
-          }
-        // Right
         case 'ArrowRight':
-          {
-            handleInitialArrowPress();
-            var _coordinatesClone2 = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
-            if (_coordinatesClone2.column === 'header') {
-              updateActiveCellCoordinates({
-                coords: _coordinatesClone2,
-                updatedValue: {
-                  column: 0
-                }
-              });
-            }
-            if (typeof _coordinatesClone2.column === 'number') {
-              // Prevent active cell coordinates from updating if the active
-              // cell is in the last column, ie we can't go any further to the right
-              if (columns.length - 1 === _coordinatesClone2.column) {
-                return;
-              }
-              updateActiveCellCoordinates({
-                coords: _coordinatesClone2,
-                updatedValue: {
-                  column: _coordinatesClone2.column + 1
-                }
-              });
-            }
-            break;
-          }
-        // Down
         case 'ArrowDown':
           {
-            handleInitialArrowPress();
-            var _coordinatesClone3 = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
-            if (_coordinatesClone3.row === 'header') {
-              updateActiveCellCoordinates({
-                coords: _coordinatesClone3,
-                updatedValue: {
-                  row: 0
-                }
-              });
-            }
-            if (typeof _coordinatesClone3.row === 'number') {
-              // Prevent active cell coordinates from updating if the active
-              // cell is in the last row, ie we can't go any further down since
-              // we are in the last row
-              if (rows.length - 1 === _coordinatesClone3.row) {
-                return;
-              }
-              updateActiveCellCoordinates({
-                coords: _coordinatesClone3,
-                updatedValue: {
-                  row: _coordinatesClone3.row + 1
-                }
-              });
-            }
-            break;
+            handleArrowkeyPress(key);
           }
       }
     }
-  }, [activeCellInsideSelectionArea, updateActiveCellCoordinates, handleInitialArrowPress, activeCellCoordinates, removeActiveCell, columns, rows, spreadsheetRef, currentMatcher, isEditing, removeCellEditor, selectionAreas, handleHomeEndKey, keysPressedList, usingMac, updateData]);
+  }, [activeCellInsideSelectionArea, updateActiveCellCoordinates, activeCellCoordinates, removeActiveCell, columns, rows, spreadsheetRef, currentMatcher, removeCellEditor, selectionAreas, handleHomeEndKey, keysPressedList, usingMac, updateData, checkforReturnConditon, handleArrowkeyPress]);
   var startEditMode = function startEditMode() {
     setIsEditing(true);
     setClickAndHoldActive(false);

package/lib/components/Datagrid/Datagrid/DatagridRow.js

@@ -162,7 +162,7 @@ var DatagridRow = function DatagridRow(datagridState) {
       return h.id === cell.column.id;
     });
     return /*#__PURE__*/React__default["default"].createElement(react.TableCell, _rollupPluginBabelHelpers["extends"]({
-      className: cx__default["default"]("".concat(blockClass, "__cell"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__expandable-row-cell"), row.canExpand && index === 0), "".concat(blockClass, "__slug--cell"), associatedHeader && associatedHeader.length && /*#__PURE__*/React.isValidElement((_associatedHeader$ = associatedHeader[0]) === null || _associatedHeader$ === void 0 ? void 0 : _associatedHeader$.slug)))
+      className: cx__default["default"]("".concat(blockClass, "__cell"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__expandable-row-cell"), row.canExpand && index === 0), "".concat(blockClass, "__expandable-row-cell--is-expanded"), row.isExpanded && index === 0), "".concat(blockClass, "__slug--cell"), associatedHeader && associatedHeader.length && /*#__PURE__*/React.isValidElement((_associatedHeader$ = associatedHeader[0]) === null || _associatedHeader$ === void 0 ? void 0 : _associatedHeader$.slug)))
     }, restProps, {
       key: cell.column.id,
       title: title

package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js

@@ -411,9 +411,12 @@ var useFilters = function useFilters(_ref) {
         });
         return updatedFilters[0];
       };
-      setFiltersObjectArray(savedFilters);
-      var filterStateCopy = cleanFilters(filtersState);
-      setFiltersState(filterStateCopy);
+      if (savedFilters && savedFilters.length) {
+        var _cleanFilters;
+        setFiltersObjectArray(savedFilters);
+        var filterStateCopy = (_cleanFilters = cleanFilters(filtersState)) !== null && _cleanFilters !== void 0 ? _cleanFilters : [];
+        setFiltersState(filterStateCopy);
+      }
     }
     if (!isFetching) {
       setFetchingReset(false);

package/lib/components/Datagrid/useActionsColumn.js

@@ -21,7 +21,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["align", "id", "itemText", "onClick", "icon", "shouldHideMenuItem"],
+var _excluded = ["align", "id", "itemText", "onClick", "icon", "shouldHideMenuItem", "shouldDisableMenuItem", "disabled"],
   _excluded2 = ["id", "onClick", "shouldHideMenuItem", "shouldDisableMenuItem", "disabled"];
 var blockClass = "".concat(settings.pkg.prefix, "--datagrid");
 var useActionsColumn = function useActionsColumn(hooks) {
@@ -63,8 +63,11 @@ var useActionsColumn = function useActionsColumn(hooks) {
                 _onClick = preparedActionProps.onClick,
                 icon = preparedActionProps.icon,
                 shouldHideMenuItem = preparedActionProps.shouldHideMenuItem,
+                shouldDisableMenuItem = preparedActionProps.shouldDisableMenuItem,
+                disabled = preparedActionProps.disabled,
                 rest = _rollupPluginBabelHelpers.objectWithoutProperties(preparedActionProps, _excluded);
               var hidden = typeof shouldHideMenuItem === 'function' && shouldHideMenuItem(row);
+              var isDisabledByRow = typeof shouldDisableMenuItem === 'function' ? shouldDisableMenuItem(row) : disabled;
               if (hidden) {
                 return null;
               }
@@ -86,7 +89,8 @@ var useActionsColumn = function useActionsColumn(hooks) {
                   }
                   e.stopPropagation();
                   _onClick(id, row, e);
-                }
+                },
+                disabled: isDisabledByRow
               }), /*#__PURE__*/React__default["default"].createElement(Icon, null)));
             })), !isFetching && (rowActions.length > 2 || isColumnSticky) && /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(react.OverflowMenu, {
               align: "left",

package/lib/components/Decorator/Decorator.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The Decorator groups a key/value pair to look and behave like a single UI element.
+ */
+export let Decorator: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from 'react';