carbon-addons-iot-react 5.6.3 → 5.6.5

package/es/components/Table/Table.js

@@ -594,6 +594,7 @@ var defaultProps = function defaultProps(baseProps) {
       multiSortDescending: 'Descending',
       multiSortOverflowItem: 'Multi-sort',
       multiSortDragHandle: 'Drag handle',
+      dragHandleTooltip: 'Click and drag to new location',
       // table error state
       tableErrorStateTitle: 'Unable to load the page',
       buttonLabelOnTableError: 'Refresh the page',
@@ -1009,7 +1010,7 @@ var Table = function Table(props) {
     selectedIds: view.table.selectedIds,
     loadingMoreIds: view.table.loadingMoreIds,
     zIndex: zIndex
-  }, _pick(i18n, 'overflowMenuAria', 'clickToExpandAria', 'clickToCollapseAria', 'inProgressText', 'actionFailedText', 'learnMoreText', 'dismissText', 'selectRowAria', 'loadMoreText'), {
+  }, _pick(i18n, 'overflowMenuAria', 'clickToExpandAria', 'clickToCollapseAria', 'inProgressText', 'actionFailedText', 'learnMoreText', 'dismissText', 'selectRowAria', 'loadMoreText', 'dragHandleTooltip'), {
     totalColumns: totalColumns
   }, _pick(options, 'hasRowSelection', 'hasRowActions', 'hasRowNesting', 'shouldExpandOnRowClick', 'shouldLazyRender', 'preserveCellWhiteSpace', 'useRadioButtonSingleSelect', 'hasDragAndDrop', 'hasBreadcrumbDrop'), {
     hideDragHandles: hideDragHandles,

package/es/components/Table/TableBody/TableBody.js

@@ -57,6 +57,8 @@ var propTypes = {
   dismissText: PropTypes.string,
   /** I18N label for load more */
   loadMoreText: PropTypes.string,
+  /** I18N label for drag handle tooltip */
+  dragHandleTooltip: PropTypes.string,
   /** since some columns might not be currently visible */
   totalColumns: PropTypes.number,
   hasRowSelection: PropTypes.oneOf(['multi', 'single', false]),
@@ -154,6 +156,7 @@ var defaultProps = {
   inProgressText: 'In progress',
   dismissText: 'Dismiss',
   actionFailedText: 'Action failed',
+  dragHandleTooltip: 'Click and drag to new location',
   size: undefined,
   hasDragAndDrop: false,
   hasBreadcrumbDrop: false,
@@ -179,6 +182,7 @@ var TableBody = function TableBody(_ref) {
     dismissText = _ref.dismissText,
     actionFailedText = _ref.actionFailedText,
     loadMoreText = _ref.loadMoreText,
+    dragHandleTooltip = _ref.dragHandleTooltip,
     totalColumns = _ref.totalColumns,
     actions = _ref.actions,
     rowActionsState = _ref.rowActionsState,
@@ -320,6 +324,7 @@ var TableBody = function TableBody(_ref) {
       clickToExpandAria: clickToExpandAria,
       columns: columns,
       dismissText: dismissText,
+      dragHandleTooltip: dragHandleTooltip,
       expandedIds: expandedIds,
       expandedRows: expandedRows,
       hasRowActions: hasRowActions,
@@ -329,6 +334,7 @@ var TableBody = function TableBody(_ref) {
       useRadioButtonSingleSelect: useRadioButtonSingleSelect,
       indeterminateSelectionIds: getIndeterminateRowSelectionIds(rows, selectedIds),
       inProgressText: inProgressText,
+      isDragging: isDragging,
       langDir: langDir,
       learnMoreText: learnMoreText,
       loadingMoreIds: loadingMoreIds,
@@ -756,6 +762,17 @@ TableBody.__docgenInfo = {
       },
       "required": false
     },
+    "dragHandleTooltip": {
+      "defaultValue": {
+        "value": "'Click and drag to new location'",
+        "computed": false
+      },
+      "description": "I18N label for drag handle tooltip",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
     "size": {
       "defaultValue": {
         "value": "undefined",

package/es/components/Table/TableBody/TableBodyRow/TableBodyRow.js

@@ -46,6 +46,8 @@ var propTypes = {
   clickToExpandAria: PropTypes.string,
   /** internationalized label  */
   clickToCollapseAria: PropTypes.string,
+  /** I18N label for drag handle tooltip */
+  dragHandleTooltip: PropTypes.string,
   /** List of columns */
   columns: TableColumnsPropTypes.isRequired,
   /** table wide options */
@@ -137,6 +139,8 @@ var propTypes = {
   isDraggable: PropTypes.bool,
   /** If this row is being dragged. */
   isDragRow: PropTypes.bool,
+  /** If a drag operation is currently in progress. */
+  isDragging: PropTypes.bool,
   /** If all drag handles should be hidden. This happens when an undraggable row is in the selection. */
   hideDragHandles: PropTypes.bool,
   /** Attribute name to identify deleted rows */
@@ -150,6 +154,7 @@ var defaultProps = {
   overflowMenuAria: 'More actions',
   clickToExpandAria: 'Click to expand.',
   clickToCollapseAria: 'Click to collapse.',
+  dragHandleTooltip: 'Click and drag to new location',
   rowActions: null,
   rowDetails: null,
   nestingLevel: 0,
@@ -177,6 +182,7 @@ var defaultProps = {
   onDragLeaveRow: null,
   isDraggable: false,
   isDragRow: false,
+  isDragging: false,
   deletedAttribute: '_deleted'
 };
 var TableBodyRow = function TableBodyRow(_ref) {
@@ -210,6 +216,7 @@ var TableBodyRow = function TableBodyRow(_ref) {
     overflowMenuAria = _ref.overflowMenuAria,
     clickToExpandAria = _ref.clickToExpandAria,
     clickToCollapseAria = _ref.clickToCollapseAria,
+    dragHandleTooltip = _ref.dragHandleTooltip,
     inProgressText = _ref.inProgressText,
     actionFailedText = _ref.actionFailedText,
     learnMoreText = _ref.learnMoreText,
@@ -233,6 +240,7 @@ var TableBodyRow = function TableBodyRow(_ref) {
     onDragLeaveRow = _ref.onDragLeaveRow,
     isDragRow = _ref.isDragRow,
     isDraggable = _ref.isDraggable,
+    isDragging = _ref.isDragging,
     hasDragAndDrop = _ref.hasDragAndDrop,
     hideDragHandles = _ref.hideDragHandles,
     deletedAttribute = _ref.deletedAttribute;
@@ -289,7 +297,9 @@ var TableBodyRow = function TableBodyRow(_ref) {
     className: "".concat(iotPrefix, "--table-grab-handle-cell")
   }, !isDraggable || hideDragHandles ? null : /*#__PURE__*/React__default.createElement(TableDragHandle, {
     onStartDrag: onStartDrag,
-    rowId: id
+    rowId: id,
+    isDragging: isDragging,
+    tooltipText: dragHandleTooltip
   }));
   var firstVisibleColIndex = ordering.findIndex(function (col) {
     return !col.isHidden;
@@ -548,6 +558,17 @@ TableBodyRow.__docgenInfo = {
       },
       "required": false
     },
+    "dragHandleTooltip": {
+      "defaultValue": {
+        "value": "'Click and drag to new location'",
+        "computed": false
+      },
+      "description": "I18N label for drag handle tooltip",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
     "rowActions": {
       "defaultValue": {
         "value": "null",
@@ -937,6 +958,17 @@ TableBodyRow.__docgenInfo = {
       },
       "required": false
     },
+    "isDragging": {
+      "defaultValue": {
+        "value": "false",
+        "computed": false
+      },
+      "description": "If a drag operation is currently in progress.",
+      "type": {
+        "name": "bool"
+      },
+      "required": false
+    },
     "deletedAttribute": {
       "defaultValue": {
         "value": "'_deleted'",

package/es/components/Table/TableBody/TableBodyRow/TableDragHandle.js

@@ -1,5 +1,6 @@
 import React__default, { forwardRef } from 'react';
 import PropTypes from 'prop-types';
+import { Tooltip } from '@carbon/react';
 import { settings } from '../../../../constants/Settings.js';
 import { Draggable } from '@carbon/icons-react';
 
@@ -13,7 +14,15 @@ var propTypes = {
   /**
    * The ID of the table row this handle is it. This is the row that will be dragged by this handle.
    */
-  rowId: PropTypes.string.isRequired
+  rowId: PropTypes.string.isRequired,
+  /**
+   * If a drag operation is currently in progress. When true, the tooltip is hidden.
+   */
+  isDragging: PropTypes.bool.isRequired,
+  /**
+   * Tooltip text to display on hover.
+   */
+  tooltipText: PropTypes.string.isRequired
 };
 
 /**
@@ -21,7 +30,9 @@ var propTypes = {
  */
 var TableDragHandle = /*#__PURE__*/forwardRef(function TableDragHandle(_ref, ref) {
   var onStartDrag = _ref.onStartDrag,
-    rowId = _ref.rowId;
+    rowId = _ref.rowId,
+    isDragging = _ref.isDragging,
+    tooltipText = _ref.tooltipText;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "".concat(iotPrefix, "--table-drag-handle"),
     ref: ref,
@@ -31,7 +42,18 @@ var TableDragHandle = /*#__PURE__*/forwardRef(function TableDragHandle(_ref, ref
       e.stopPropagation();
       onStartDrag(e, rowId);
     }
-  }, /*#__PURE__*/React__default.createElement(Draggable, null));
+  }, isDragging ?
+  /*#__PURE__*/
+  // During drag, render icon without tooltip
+  React__default.createElement("div", {
+    className: "".concat(iotPrefix, "--table-drag-handle-icon")
+  }, /*#__PURE__*/React__default.createElement(Draggable, null)) :
+  /*#__PURE__*/
+  // When not dragging, render with tooltip
+  React__default.createElement(Tooltip, {
+    label: tooltipText,
+    autoAlign: true
+  }, /*#__PURE__*/React__default.createElement(Draggable, null)));
 });
 TableDragHandle.propTypes = propTypes;
 TableDragHandle.__docgenInfo = {
@@ -52,6 +74,20 @@ TableDragHandle.__docgenInfo = {
         "name": "string"
       },
       "required": true
+    },
+    "isDragging": {
+      "description": "If a drag operation is currently in progress. When true, the tooltip is hidden.",
+      "type": {
+        "name": "bool"
+      },
+      "required": true
+    },
+    "tooltipText": {
+      "description": "Tooltip text to display on hover.",
+      "type": {
+        "name": "string"
+      },
+      "required": true
     }
   }
 };

package/es/components/Table/TableBody/TableBodyRowRenderer.js

@@ -54,6 +54,10 @@ var propTypes = {
   dismissText: PropTypes.string,
   /** I18N label for load more */
   loadMoreText: PropTypes.string,
+  /** I18N label for drag handle tooltip */
+  dragHandleTooltip: PropTypes.string,
+  /** If a drag is currently in progress */
+  isDragging: PropTypes.bool,
   /** since some columns might not be currently visible */
   totalColumns: PropTypes.number,
   hasRowSelection: PropTypes.oneOf(['multi', 'single', false]),
@@ -137,6 +141,7 @@ var defaultProps = {
   clickToExpandAria: 'Click to expand.',
   columns: [],
   dismissText: 'Dismiss',
+  dragHandleTooltip: 'Click and drag to new location',
   expandedIds: [],
   expandedRows: [],
   hasRowActions: false,
@@ -146,6 +151,7 @@ var defaultProps = {
   useRadioButtonSingleSelect: false,
   indeterminateSelectionIds: [],
   inProgressText: 'In progress',
+  isDragging: false,
   langDir: 'ltr',
   learnMoreText: 'Learn more',
   loadingMoreIds: [],
@@ -184,6 +190,7 @@ function TableBodyRowRenderer(props) {
     clickToExpandAria = props.clickToExpandAria,
     columns = props.columns,
     dismissText = props.dismissText,
+    dragHandleTooltip = props.dragHandleTooltip,
     expandedIds = props.expandedIds,
     expandedRows = props.expandedRows,
     hasRowActions = props.hasRowActions,
@@ -193,6 +200,7 @@ function TableBodyRowRenderer(props) {
     useRadioButtonSingleSelect = props.useRadioButtonSingleSelect,
     indeterminateSelectionIds = props.indeterminateSelectionIds,
     inProgressText = props.inProgressText,
+    isDragging = props.isDragging,
     langDir = props.langDir,
     learnMoreText = props.learnMoreText,
     loadingMoreIds = props.loadingMoreIds,
@@ -262,6 +270,8 @@ function TableBodyRowRenderer(props) {
     onDragEnterRow: canDrop ? onDragEnterRow : null,
     onDragLeaveRow: canDrop ? onDragLeaveRow : null,
     isDragRow: dragRowIds.indexOf(row.id) !== -1,
+    isDragging: isDragging,
+    dragHandleTooltip: dragHandleTooltip,
     langDir: langDir,
     key: row.id,
     isExpanded: isRowExpanded,
@@ -422,6 +432,17 @@ TableBodyRowRenderer.__docgenInfo = {
       },
       "required": false
     },
+    "dragHandleTooltip": {
+      "defaultValue": {
+        "value": "'Click and drag to new location'",
+        "computed": false
+      },
+      "description": "I18N label for drag handle tooltip",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
     "expandedIds": {
       "defaultValue": {
         "value": "[]",
@@ -550,6 +571,17 @@ TableBodyRowRenderer.__docgenInfo = {
       },
       "required": false
     },
+    "isDragging": {
+      "defaultValue": {
+        "value": "false",
+        "computed": false
+      },
+      "description": "If a drag is currently in progress",
+      "type": {
+        "name": "bool"
+      },
+      "required": false
+    },
     "langDir": {
       "defaultValue": {
         "value": "'ltr'",

package/es/components/Table/TableToolbar/TableToolbar.js

@@ -7,13 +7,17 @@ import isNil from '../../../node_modules/lodash-es/isNil.js';
 import 'core-js/modules/es.symbol.js';
 import 'core-js/modules/es.array.concat.js';
 import 'core-js/modules/es.array.filter.js';
+import 'core-js/modules/es.array.includes.js';
 import 'core-js/modules/es.array.map.js';
+import 'core-js/modules/es.array.slice.js';
 import 'core-js/modules/es.function.name.js';
 import 'core-js/modules/es.object.get-own-property-descriptor.js';
 import 'core-js/modules/es.object.get-own-property-descriptors.js';
 import 'core-js/modules/es.object.keys.js';
 import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/es.promise.js';
 import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.includes.js';
 import 'core-js/modules/es.string.search.js';
 import 'core-js/modules/web.dom-collections.for-each.js';
 import React__default, { useMemo } from 'react';
@@ -250,6 +254,72 @@ var TableToolbar = function TableToolbar(_ref) {
   var visibleToolbarActions = actions.filter(function (action) {
     return !action.isOverflow && action.hidden !== true;
   });
+
+  // Extract TableViewDropdown from customToolbarContent
+  var _useMemo = useMemo(function () {
+      var _customToolbarContent;
+      if (!customToolbarContent) {
+        return {
+          tableViewDropdown: null,
+          otherToolbarContent: null
+        };
+      }
+
+      // Helper function to check if a child is TableViewDropdown
+      var isTableViewDropdown = function isTableViewDropdown(child) {
+        if (!child) return false;
+
+        // Check by key (most reliable for wrapped components)
+        if (child.key && typeof child.key === 'string' && child.key.includes('table-view-dropdown')) {
+          return true;
+        }
+
+        // Check by type properties
+        if (child.type) {
+          // Check by displayName
+          if (child.type.displayName === 'TableViewDropdown') return true;
+
+          // Check by function name
+          if (child.type.name === 'TableViewDropdown') return true;
+        }
+
+        // Check by props (TableViewDropdown has specific props like 'views', 'selectedViewId')
+        if (child.props && (child.props.views !== undefined || child.props.selectedViewId !== undefined || child.props.selectedViewEdited !== undefined)) {
+          return true;
+        }
+        return false;
+      };
+
+      // Extract children from Fragment if present
+      var contentToProcess = customToolbarContent;
+
+      // Check if it's a Fragment (React.Fragment has type as Symbol or Fragment)
+      if (customToolbarContent.type === React__default.Fragment && (_customToolbarContent = customToolbarContent.props) !== null && _customToolbarContent !== void 0 && _customToolbarContent.children) {
+        contentToProcess = customToolbarContent.props.children;
+      }
+
+      // Convert to array (handles both single element and multiple children)
+      var contentArray = React__default.Children.toArray(contentToProcess);
+
+      // Always check the first element
+      var firstElement = contentArray[0];
+      if (isTableViewDropdown(firstElement)) {
+        // First element is TableViewDropdown - extract it, rest is other content
+        var remainingContent = contentArray.slice(1);
+        return {
+          tableViewDropdown: firstElement,
+          otherToolbarContent: remainingContent.length > 0 ? remainingContent : null
+        };
+      }
+
+      // First element is not TableViewDropdown - all content is other content
+      return {
+        tableViewDropdown: null,
+        otherToolbarContent: contentArray.length > 0 ? contentArray : null
+      };
+    }, [customToolbarContent]),
+    tableViewDropdown = _useMemo.tableViewDropdown,
+    otherToolbarContent = _useMemo.otherToolbarContent;
   var visibleBatchActions = batchActions.filter(function (action) {
     return !action.isOverflow && action.hidden !== true;
   });
@@ -389,7 +459,7 @@ var TableToolbar = function TableToolbar(_ref) {
   , {
     "data-testid": "".concat(testID || testId, "-content"),
     className: "".concat(iotPrefix, "--table-toolbar-content")
-  }, hasSearch ? /*#__PURE__*/React__default.createElement(TableToolbarSearch, {
+  }, tableViewDropdown || null, hasSearch ? /*#__PURE__*/React__default.createElement(TableToolbarSearch, {
     tableId: tableId,
     i18n: i18n,
     options: {
@@ -532,8 +602,8 @@ var TableToolbar = function TableToolbar(_ref) {
     itemText: "",
     disabled: true
   })) : null,
-  // Default card header actions should be to the right of the table-specific actions
-  customToolbarContent || null));
+  // Render other custom toolbar content
+  otherToolbarContent || null));
 };
 TableToolbar.propTypes = propTypes;
 TableToolbar.defaultProps = defaultProps;

package/lib/components/Table/Table.js

@@ -611,6 +611,7 @@ var defaultProps = function defaultProps(baseProps) {
       multiSortDescending: 'Descending',
       multiSortOverflowItem: 'Multi-sort',
       multiSortDragHandle: 'Drag handle',
+      dragHandleTooltip: 'Click and drag to new location',
       // table error state
       tableErrorStateTitle: 'Unable to load the page',
       buttonLabelOnTableError: 'Refresh the page',
@@ -1026,7 +1027,7 @@ var Table = function Table(props) {
     selectedIds: view.table.selectedIds,
     loadingMoreIds: view.table.loadingMoreIds,
     zIndex: zIndex
-  }, pick(i18n, 'overflowMenuAria', 'clickToExpandAria', 'clickToCollapseAria', 'inProgressText', 'actionFailedText', 'learnMoreText', 'dismissText', 'selectRowAria', 'loadMoreText'), {
+  }, pick(i18n, 'overflowMenuAria', 'clickToExpandAria', 'clickToCollapseAria', 'inProgressText', 'actionFailedText', 'learnMoreText', 'dismissText', 'selectRowAria', 'loadMoreText', 'dragHandleTooltip'), {
     totalColumns: totalColumns
   }, pick(options, 'hasRowSelection', 'hasRowActions', 'hasRowNesting', 'shouldExpandOnRowClick', 'shouldLazyRender', 'preserveCellWhiteSpace', 'useRadioButtonSingleSelect', 'hasDragAndDrop', 'hasBreadcrumbDrop'), {
     hideDragHandles: hideDragHandles,

package/lib/components/Table/TableBody/TableBody.js

@@ -67,6 +67,8 @@ var propTypes = {
   dismissText: PropTypes__default.default.string,
   /** I18N label for load more */
   loadMoreText: PropTypes__default.default.string,
+  /** I18N label for drag handle tooltip */
+  dragHandleTooltip: PropTypes__default.default.string,
   /** since some columns might not be currently visible */
   totalColumns: PropTypes__default.default.number,
   hasRowSelection: PropTypes__default.default.oneOf(['multi', 'single', false]),
@@ -164,6 +166,7 @@ var defaultProps = {
   inProgressText: 'In progress',
   dismissText: 'Dismiss',
   actionFailedText: 'Action failed',
+  dragHandleTooltip: 'Click and drag to new location',
   size: undefined,
   hasDragAndDrop: false,
   hasBreadcrumbDrop: false,
@@ -189,6 +192,7 @@ var TableBody = function TableBody(_ref) {
     dismissText = _ref.dismissText,
     actionFailedText = _ref.actionFailedText,
     loadMoreText = _ref.loadMoreText,
+    dragHandleTooltip = _ref.dragHandleTooltip,
     totalColumns = _ref.totalColumns,
     actions = _ref.actions,
     rowActionsState = _ref.rowActionsState,
@@ -330,6 +334,7 @@ var TableBody = function TableBody(_ref) {
       clickToExpandAria: clickToExpandAria,
       columns: columns,
       dismissText: dismissText,
+      dragHandleTooltip: dragHandleTooltip,
       expandedIds: expandedIds,
       expandedRows: expandedRows,
       hasRowActions: hasRowActions,
@@ -339,6 +344,7 @@ var TableBody = function TableBody(_ref) {
       useRadioButtonSingleSelect: useRadioButtonSingleSelect,
       indeterminateSelectionIds: getIndeterminateRowSelectionIds(rows, selectedIds),
       inProgressText: inProgressText,
+      isDragging: isDragging,
       langDir: langDir,
       learnMoreText: learnMoreText,
       loadingMoreIds: loadingMoreIds,
@@ -766,6 +772,17 @@ TableBody.__docgenInfo = {
       },
       "required": false
     },
+    "dragHandleTooltip": {
+      "defaultValue": {
+        "value": "'Click and drag to new location'",
+        "computed": false
+      },
+      "description": "I18N label for drag handle tooltip",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
     "size": {
       "defaultValue": {
         "value": "undefined",

package/lib/components/Table/TableBody/TableBodyRow/TableBodyRow.js

@@ -56,6 +56,8 @@ var propTypes = {
   clickToExpandAria: PropTypes__default.default.string,
   /** internationalized label  */
   clickToCollapseAria: PropTypes__default.default.string,
+  /** I18N label for drag handle tooltip */
+  dragHandleTooltip: PropTypes__default.default.string,
   /** List of columns */
   columns: TablePropTypes.TableColumnsPropTypes.isRequired,
   /** table wide options */
@@ -147,6 +149,8 @@ var propTypes = {
   isDraggable: PropTypes__default.default.bool,
   /** If this row is being dragged. */
   isDragRow: PropTypes__default.default.bool,
+  /** If a drag operation is currently in progress. */
+  isDragging: PropTypes__default.default.bool,
   /** If all drag handles should be hidden. This happens when an undraggable row is in the selection. */
   hideDragHandles: PropTypes__default.default.bool,
   /** Attribute name to identify deleted rows */
@@ -160,6 +164,7 @@ var defaultProps = {
   overflowMenuAria: 'More actions',
   clickToExpandAria: 'Click to expand.',
   clickToCollapseAria: 'Click to collapse.',
+  dragHandleTooltip: 'Click and drag to new location',
   rowActions: null,
   rowDetails: null,
   nestingLevel: 0,
@@ -187,6 +192,7 @@ var defaultProps = {
   onDragLeaveRow: null,
   isDraggable: false,
   isDragRow: false,
+  isDragging: false,
   deletedAttribute: '_deleted'
 };
 var TableBodyRow = function TableBodyRow(_ref) {
@@ -220,6 +226,7 @@ var TableBodyRow = function TableBodyRow(_ref) {
     overflowMenuAria = _ref.overflowMenuAria,
     clickToExpandAria = _ref.clickToExpandAria,
     clickToCollapseAria = _ref.clickToCollapseAria,
+    dragHandleTooltip = _ref.dragHandleTooltip,
     inProgressText = _ref.inProgressText,
     actionFailedText = _ref.actionFailedText,
     learnMoreText = _ref.learnMoreText,
@@ -243,6 +250,7 @@ var TableBodyRow = function TableBodyRow(_ref) {
     onDragLeaveRow = _ref.onDragLeaveRow,
     isDragRow = _ref.isDragRow,
     isDraggable = _ref.isDraggable,
+    isDragging = _ref.isDragging,
     hasDragAndDrop = _ref.hasDragAndDrop,
     hideDragHandles = _ref.hideDragHandles,
     deletedAttribute = _ref.deletedAttribute;
@@ -299,7 +307,9 @@ var TableBodyRow = function TableBodyRow(_ref) {
     className: "".concat(iotPrefix, "--table-grab-handle-cell")
   }, !isDraggable || hideDragHandles ? null : /*#__PURE__*/React__default.default.createElement(TableDragHandle.TableDragHandle, {
     onStartDrag: onStartDrag,
-    rowId: id
+    rowId: id,
+    isDragging: isDragging,
+    tooltipText: dragHandleTooltip
   }));
   var firstVisibleColIndex = ordering.findIndex(function (col) {
     return !col.isHidden;
@@ -558,6 +568,17 @@ TableBodyRow.__docgenInfo = {
       },
       "required": false
     },
+    "dragHandleTooltip": {
+      "defaultValue": {
+        "value": "'Click and drag to new location'",
+        "computed": false
+      },
+      "description": "I18N label for drag handle tooltip",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
     "rowActions": {
       "defaultValue": {
         "value": "null",
@@ -947,6 +968,17 @@ TableBodyRow.__docgenInfo = {
       },
       "required": false
     },
+    "isDragging": {
+      "defaultValue": {
+        "value": "false",
+        "computed": false
+      },
+      "description": "If a drag operation is currently in progress.",
+      "type": {
+        "name": "bool"
+      },
+      "required": false
+    },
     "deletedAttribute": {
       "defaultValue": {
         "value": "'_deleted'",