@carbon/ibm-products 1.44.1 → 1.45.0

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

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
+/**
+ * Copyright IBM Corp. 2023, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/* eslint-disable jsdoc/check-param-names */
+
+/**
+ * Keeps track of the button disabled state
+ * @param  {string} initialValue - the initial value if the buttons should be enabled or disabled
+ * @param  {object} filtersState - the filter state from the filter panel or flyout
+ * @param  {object} prevFiltersRef - reference of the prev filterState
+ * @returns {Array} returns a tuple of the state and setter function
+ */
+var useShouldDisableButtons = function useShouldDisableButtons(_ref) {
+  var _ref$initialValue = _ref.initialValue,
+    initialValue = _ref$initialValue === void 0 ? true : _ref$initialValue,
+    filtersState = _ref.filtersState,
+    prevFiltersRef = _ref.prevFiltersRef;
+  var _useState = (0, _react.useState)(initialValue),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    shouldDisableButtons = _useState2[0],
+    setShouldDisableButtons = _useState2[1];
+  (0, _react.useEffect)(function updateDisabledButtonsState() {
+    setShouldDisableButtons((0, _isEqual.default)(filtersState, JSON.parse(prevFiltersRef.current)));
+  }, [filtersState, prevFiltersRef]);
+  return [shouldDisableButtons, setShouldDisableButtons];
+};
+var _default = useShouldDisableButtons;
+exports.default = _default;

package/lib/components/Datagrid/utils/DatagridActions.js

@@ -150,7 +150,7 @@ var DatagridActions = function DatagridActions(datagridState) {
     onChange: function onChange(e) {
       return setGlobalFilter(e.target.value);
     }
-  }), renderFilterFlyout(), /*#__PURE__*/_react.default.createElement(RowSizeDropdown, rowSizeDropdownProps), /*#__PURE__*/_react.default.createElement("div", {
+  }), renderFilterFlyout(), /*#__PURE__*/_react.default.createElement("div", {
     style: style
   }, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
     kind: "ghost",
@@ -170,7 +170,7 @@ var DatagridActions = function DatagridActions(datagridState) {
     onClick: downloadCsv
   })), CustomizeColumnsButton && /*#__PURE__*/_react.default.createElement("div", {
     style: style
-  }, /*#__PURE__*/_react.default.createElement(CustomizeColumnsButton, null)), /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenu, {
+  }, /*#__PURE__*/_react.default.createElement(CustomizeColumnsButton, null)), /*#__PURE__*/_react.default.createElement(RowSizeDropdown, rowSizeDropdownProps), /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenu, {
     label: "Primary button",
     size: "lg",
     light: true,
@@ -184,7 +184,7 @@ var DatagridActions = function DatagridActions(datagridState) {
   }), /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenuItem, {
     itemText: "Option 3",
     onClick: (0, _addonActions.action)("Click on ButtonMenu Option 3")
-  }))) : /*#__PURE__*/_react.default.createElement(TableToolbarContent, null, renderFilterPanelButton(), /*#__PURE__*/_react.default.createElement(TableToolbarSearch, {
+  }))) : /*#__PURE__*/_react.default.createElement(TableToolbarContent, null, /*#__PURE__*/_react.default.createElement(TableToolbarSearch, {
     size: "xl",
     id: "columnSearch",
     persistent: true,
@@ -192,39 +192,7 @@ var DatagridActions = function DatagridActions(datagridState) {
     onChange: function onChange(e) {
       return setGlobalFilter(e.target.value);
     }
-  }), renderFilterFlyout(), /*#__PURE__*/_react.default.createElement(RowSizeDropdown, rowSizeDropdownProps), /*#__PURE__*/_react.default.createElement("div", {
-    style: style
-  }, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
-    kind: "ghost",
-    hasIconOnly: true,
-    tooltipPosition: "bottom",
-    renderIcon: _iconsReact.Restart16,
-    iconDescription: 'Refresh',
-    onClick: refreshColumns
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    style: style
-  }, /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
-    kind: "ghost",
-    hasIconOnly: true,
-    tooltipPosition: "bottom",
-    renderIcon: _iconsReact.Download16,
-    iconDescription: 'Download CSV',
-    onClick: downloadCsv
-  })), CustomizeColumnsButton && /*#__PURE__*/_react.default.createElement("div", {
-    style: style
-  }, /*#__PURE__*/_react.default.createElement(CustomizeColumnsButton, null)), /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenu, {
-    label: "Primary button",
-    renderIcon: _iconsReact.Add16
-  }, /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenuItem, {
-    itemText: "Option 1",
-    onClick: (0, _addonActions.action)("Click on ButtonMenu Option 1")
-  }), /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenuItem, {
-    itemText: "Option 2",
-    onClick: (0, _addonActions.action)("Click on ButtonMenu Option 2")
-  }), /*#__PURE__*/_react.default.createElement(_ButtonMenu.ButtonMenuItem, {
-    itemText: "Option 3",
-    onClick: (0, _addonActions.action)("Click on ButtonMenu Option 3")
-  })), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.OverflowMenu, {
+  }), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.OverflowMenu, {
     ariaLabel: "Tools",
     size: "lg",
     flipped: true,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/ibm-products",
   "description": "Carbon for IBM Products",
-  "version": "1.44.1",
+  "version": "1.45.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -95,5 +95,5 @@
     "react": "^16.8.6 || ^17.0.1",
     "react-dom": "^16.8.6 || ^17.0.1"
   },
-  "gitHead": "fc263168325ad92efaa868582b43760e317d9a33"
+  "gitHead": "68d8819759209ba30005c751ca0b49ce5e22ed56"
 }

package/scss/components/Datagrid/styles/_datagrid.scss

@@ -447,7 +447,7 @@
   }
 
   .#{$block-class}__table-toolbar {
-    flex: 0 0 auto;
+    flex: 1 0 auto;
   }
   .#{$carbon-prefix}--table-toolbar {
     background: transparent;

package/scss/components/Datagrid/styles/addons/_RowSizeDropdown.scss

@@ -16,7 +16,7 @@
   box-shadow: 1px 4px 8px -3px $overlay-01, -1px 6px 8px -5px $overlay-01;
 }
 
-.#{$block-class}__row-size-button--open {
+.#{$carbon-prefix}--btn--ghost.#{$block-class}__row-size-button--open {
   background-color: $ui-background;
 
   box-shadow: 1px 4px 8px -3px $overlay-01, -1px 6px 8px -5px $overlay-01;