@carbon/react 1.83.0-rc.0 → 1.84.0-rc.0

package/lib/components/DataTable/DataTable.js

@@ -46,7 +46,6 @@ var TableToolbarMenu = require('./TableToolbarMenu.js');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var isEqual__default = /*#__PURE__*/_interopDefaultLegacy(isEqual);
 
 const getInstanceId = setupGetInstanceId.setupGetInstanceId();
@@ -86,29 +85,23 @@ const translateWithId = id => defaultTranslations[id];
  * and updating the state of the single entity will cascade updates to the
  * consumer.
  */
-class DataTable extends React__default["default"].Component {
+class DataTable extends React.Component {
   constructor(_props) {
-    var _this;
     super(_props);
-    _this = this;
     _rollupPluginBabelHelpers.defineProperty(this, "instanceId", void 0);
+    // TODO: Replace with a `type` when this component is converted to a
+    // functional component.
+    _rollupPluginBabelHelpers.defineProperty(this, "rp", void 0);
     /**
      * Get the props associated with the given header. Mostly used for adding in
      * sorting behavior.
-     *
-     * @param {object} config
-     * @param {string} config.header the header we want the props for
-     * @param {Function} config.onClick a custom click handler for the header
-     * @param {boolean} config.isSortable
-     * @returns {object}
      */
-    _rollupPluginBabelHelpers.defineProperty(this, "getHeaderProps", _ref => {
-      let {
-        header,
-        onClick,
-        isSortable = this.props.isSortable,
-        ...rest
-      } = _ref;
+    _rollupPluginBabelHelpers.defineProperty(this, "getHeaderProps", ({
+      header,
+      onClick,
+      isSortable = this.props.isSortable,
+      ...rest
+    }) => {
       const {
         sortDirection,
         sortHeaderKey
@@ -136,26 +129,20 @@ class DataTable extends React__default["default"].Component {
     });
     /**
      * Get the props associated with the given expand header.
-     *
-     * @param {object} config
-     * @param {Function} config.onClick a custom click handler for the expand header
-     * @param {Function} config.onExpand a custom click handler called when header is expanded
-     * @returns {object}
      */
-    _rollupPluginBabelHelpers.defineProperty(this, "getExpandHeaderProps", function () {
-      let {
-        onClick,
-        onExpand,
-        ...rest
-      } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    _rollupPluginBabelHelpers.defineProperty(this, "getExpandHeaderProps", ({
+      onClick,
+      onExpand,
+      ...rest
+    } = {}) => {
       const {
         translateWithId: t = translateWithId
-      } = _this.props;
+      } = this.props;
       const {
         isExpandedAll,
         rowIds,
         rowsById
-      } = _this.state;
+      } = this.state;
       const isExpanded = isExpandedAll || rowIds.every(id => rowsById[id].isExpanded);
       const translationKey = isExpanded ? translationKeys.collapseAll : translationKeys.expandAll;
       return {
@@ -166,45 +153,31 @@ class DataTable extends React__default["default"].Component {
         isExpanded,
         // Compose the event handlers so we don't overwrite a consumer's `onClick`
         // handler
-        onExpand: events.composeEventHandlers([_this.handleOnExpandAll, onExpand, onClick && _this.handleOnExpandHeaderClick(onClick, {
+        onExpand: events.composeEventHandlers([this.handleOnExpandAll, onExpand, onClick && this.handleOnExpandHeaderClick(onClick, {
           isExpanded
         })])
       };
     });
     /**
      * Decorate consumer's `onClick` event handler with sort parameters
-     *
-     * @param {Function} onClick
-     * @param {object} sortParams
-     * @returns {Function}
      */
     _rollupPluginBabelHelpers.defineProperty(this, "handleOnHeaderClick", (onClick, sortParams) => {
-      return e => onClick(e, sortParams);
+      return event => onClick(event, sortParams);
     });
     /**
-     * Decorate consumer's `onClick` event handler with sort parameters
-     *
-     * @param {Function} onClick
-     * @param {object} expandParams
-     * @returns {Function}
+     * Decorate consumer's `onClick` event handler with expand parameters
      */
     _rollupPluginBabelHelpers.defineProperty(this, "handleOnExpandHeaderClick", (onClick, expandParams) => {
-      return e => onClick(e, expandParams);
+      return event => onClick(event, expandParams);
     });
     /**
      * Get the props associated with the given row. Mostly used for expansion.
-     *
-     * @param {object} config
-     * @param {object} config.row the row we want the props for
-     * @param {Function} config.onClick a custom click handler for the header
-     * @returns {object}
      */
-    _rollupPluginBabelHelpers.defineProperty(this, "getRowProps", _ref2 => {
-      let {
-        row,
-        onClick,
-        ...rest
-      } = _ref2;
+    _rollupPluginBabelHelpers.defineProperty(this, "getRowProps", ({
+      row,
+      onClick,
+      ...rest
+    }) => {
       const {
         translateWithId: t = translateWithId
       } = this.props;
@@ -224,16 +197,11 @@ class DataTable extends React__default["default"].Component {
     });
     /**
      * Get the props associated with an expanded row
-     *
-     * @param {object} config
-     * @param {object} config.row the parent row we want the props for
-     * @returns {object}
      */
-    _rollupPluginBabelHelpers.defineProperty(this, "getExpandedRowProps", _ref3 => {
-      let {
-        row,
-        ...rest
-      } = _ref3;
+    _rollupPluginBabelHelpers.defineProperty(this, "getExpandedRowProps", ({
+      row,
+      ...rest
+    }) => {
       return {
         ...rest,
         id: `expanded-row-${row.id}`
@@ -244,15 +212,14 @@ class DataTable extends React__default["default"].Component {
      * applicable. Most often used to indicate selection status of the table or
      * for a specific row.
      */
-    _rollupPluginBabelHelpers.defineProperty(this, "getSelectionProps", function () {
-      let {
-        onClick,
-        row,
-        ...rest
-      } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    _rollupPluginBabelHelpers.defineProperty(this, "getSelectionProps", ({
+      onClick,
+      row,
+      ...rest
+    } = {}) => {
       const {
         translateWithId: t = translateWithId
-      } = _this.props;
+      } = this.props;
 
       // If we're given a row, return the selection state values for that row
       if (row) {
@@ -260,19 +227,19 @@ class DataTable extends React__default["default"].Component {
         return {
           ...rest,
           checked: row.isSelected,
-          onSelect: events.composeEventHandlers([_this.handleOnSelectRow(row.id), onClick]),
-          id: `${_this.getTablePrefix()}__select-row-${row.id}`,
-          name: `select-row-${_this.instanceId}`,
+          onSelect: events.composeEventHandlers([this.handleOnSelectRow(row.id), onClick]),
+          id: `${this.getTablePrefix()}__select-row-${row.id}`,
+          name: `select-row-${this.instanceId}`,
           'aria-label': t(translationKey),
           disabled: row.disabled,
-          radio: _this.props.radio
+          radio: this.props.radio
         };
       }
 
       // Otherwise, we're working on `TableSelectAll` which handles toggling the
       // selection state of all rows.
-      const rowCount = _this.state.rowIds.length;
-      const selectedRowCount = _this.getSelectedRows().length;
+      const rowCount = this.state.rowIds.length;
+      const selectedRowCount = this.getSelectedRows().length;
       const checked = rowCount > 0 && selectedRowCount === rowCount;
       const indeterminate = rowCount > 0 && selectedRowCount > 0 && selectedRowCount !== rowCount;
       const translationKey = checked || indeterminate ? translationKeys.unselectAll : translationKeys.selectAll;
@@ -280,41 +247,36 @@ class DataTable extends React__default["default"].Component {
         ...rest,
         'aria-label': t(translationKey),
         checked,
-        id: `${_this.getTablePrefix()}__select-all`,
+        id: `${this.getTablePrefix()}__select-all`,
         indeterminate,
-        name: `select-all-${_this.instanceId}`,
-        onSelect: events.composeEventHandlers([_this.handleSelectAll, onClick])
+        name: `select-all-${this.instanceId}`,
+        onSelect: events.composeEventHandlers([this.handleSelectAll, onClick])
       };
     });
-    _rollupPluginBabelHelpers.defineProperty(this, "getToolbarProps", function () {
-      let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    _rollupPluginBabelHelpers.defineProperty(this, "getToolbarProps", props => {
       const {
         size
-      } = _this.props;
+      } = this.props;
       const isSmall = size === 'xs' || size === 'sm';
       return {
         ...props,
         size: isSmall ? 'sm' : undefined
       };
     });
-    _rollupPluginBabelHelpers.defineProperty(this, "getBatchActionProps", function () {
-      let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    _rollupPluginBabelHelpers.defineProperty(this, "getBatchActionProps", props => {
       const {
         shouldShowBatchActions
-      } = _this.state;
-      const totalSelected = _this.getSelectedRows().length;
+      } = this.state;
+      const totalSelected = this.getSelectedRows().length;
       return {
         onSelectAll: undefined,
-        totalCount: _this.state.rowIds.length || 0,
+        totalCount: this.state.rowIds.length || 0,
         ...props,
         shouldShowBatchActions: shouldShowBatchActions && totalSelected > 0,
         totalSelected,
-        onCancel: _this.handleOnCancel
+        onCancel: this.handleOnCancel
       };
     });
-    /**
-     * Helper utility to get the Table Props.
-     */
     _rollupPluginBabelHelpers.defineProperty(this, "getTableProps", () => {
       const {
         useZebraStyles,
@@ -335,9 +297,6 @@ class DataTable extends React__default["default"].Component {
         experimentalAutoAlign
       };
     });
-    /**
-     * Helper utility to get the TableContainer Props.
-     */
     _rollupPluginBabelHelpers.defineProperty(this, "getTableContainerProps", () => {
       const {
         stickyHeader,
@@ -350,25 +309,24 @@ class DataTable extends React__default["default"].Component {
     });
     /**
      * Get the props associated with the given table cell.
-     *
-     * @param {object} config
-     * @param {object} config.cell the cell we want the props for
-     * @returns {object}
      */
-    _rollupPluginBabelHelpers.defineProperty(this, "getCellProps", _ref4 => {
-      let {
-        cell,
-        ...rest
-      } = _ref4;
+    _rollupPluginBabelHelpers.defineProperty(this, "getCellProps", ({
+      cell: {
+        hasAILabelHeader,
+        hasDecoratorHeader
+      },
+      ...rest
+    }) => {
       return {
         ...rest,
-        hasAILabelHeader: cell.hasAILabelHeader,
-        hasDecoratorHeader: cell.hasDecoratorHeader
+        hasAILabelHeader,
+        hasDecoratorHeader
       };
     });
     /**
      * Helper utility to get all the currently selected rows
-     * @returns {Array<string>} the array of rowIds that are currently selected
+     *
+     * @returns the array of rowIds that are currently selected
      */
     _rollupPluginBabelHelpers.defineProperty(this, "getSelectedRows", () => this.state.rowIds.filter(id => {
       const row = this.state.rowsById[id];
@@ -376,8 +334,9 @@ class DataTable extends React__default["default"].Component {
     }));
     /**
      * Helper utility to get all of the available rows after applying the filter
-     * @returns {Array<string>} the array of rowIds that are currently included through the filter
-     *  */
+     *
+     * @returns the array of rowIds that are currently included through the filter
+     */
     _rollupPluginBabelHelpers.defineProperty(this, "getFilteredRowIds", () => {
       const {
         filterRows = filter.defaultFilterRows
@@ -397,15 +356,13 @@ class DataTable extends React__default["default"].Component {
     /**
      * Helper for getting the table prefix for elements that require an
      * `id` attribute that is unique.
-     *
-     * @returns {string}
      */
     _rollupPluginBabelHelpers.defineProperty(this, "getTablePrefix", () => `data-table-${this.instanceId}`);
     /**
      * Helper for toggling all selected items in a state. Does not call
      * setState, so use it when setting state.
-     * @param {object} initialState
-     * @returns {object} object to put into this.setState (use spread operator)
+     *
+     * @returns object to put into this.setState (use spread operator)
      */
     _rollupPluginBabelHelpers.defineProperty(this, "setAllSelectedState", (initialState, isSelected, filteredRowIds) => {
       const {
@@ -455,9 +412,6 @@ class DataTable extends React__default["default"].Component {
     });
     /**
      * Handler for toggling the selection state of a given row.
-     *
-     * @param {string} rowId
-     * @returns {Function}
      */
     _rollupPluginBabelHelpers.defineProperty(this, "handleOnSelectRow", rowId => () => {
       this.setState(state => {
@@ -502,9 +456,6 @@ class DataTable extends React__default["default"].Component {
     });
     /**
      * Handler for toggling the expansion state of a given row.
-     *
-     * @param {string} rowId
-     * @returns {Function}
      */
     _rollupPluginBabelHelpers.defineProperty(this, "handleOnExpandRow", rowId => () => {
       this.setState(state => {
@@ -548,8 +499,7 @@ class DataTable extends React__default["default"].Component {
     /**
      * Handler for transitioning to the next sort state of the table
      *
-     * @param {string} headerKey the field for the header that we are sorting by
-     * @returns {Function}
+     * @param headerKey - The field for the header that we are sorting by.
      */
     _rollupPluginBabelHelpers.defineProperty(this, "handleSortBy", headerKey => () => {
       this.setState(state => sorting.getNextSortState(this.props, state, {
@@ -559,8 +509,6 @@ class DataTable extends React__default["default"].Component {
     /**
      * Event handler for transitioning input value state changes for the table
      * filter component.
-     *
-     * @param {Event} event
      */
     _rollupPluginBabelHelpers.defineProperty(this, "handleOnInputValueChange", (event, defaultValue) => {
       if (event.target) {
@@ -581,7 +529,7 @@ class DataTable extends React__default["default"].Component {
     this.instanceId = getInstanceId();
   }
 
-  // if state needs to be updated then wait for only update after state is finished
+  // If state needs to be updated, defer render until after the update completes.
   shouldComponentUpdate(nextProps) {
     if (this.props !== nextProps) {
       const nextRowIds = nextProps.rows.map(row => row.id);
@@ -649,16 +597,65 @@ class DataTable extends React__default["default"].Component {
       expandAll: this.handleOnExpandAll,
       radio: this.props.radio
     };
-    if (render !== undefined) {
+    if (typeof render !== 'undefined') {
       return render(renderProps);
     }
-    if (children !== undefined) {
+    if (typeof children !== 'undefined') {
       return children(renderProps);
     }
     return null;
   }
 }
-_rollupPluginBabelHelpers.defineProperty(DataTable, "propTypes", {
+_rollupPluginBabelHelpers.defineProperty(DataTable, "translationKeys", Object.values(translationKeys));
+// TODO: Delete these static properties when the components are converted to a
+// functional component.
+//
+// Static properties for sub-components
+_rollupPluginBabelHelpers.defineProperty(DataTable, "Table", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableActionList", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableBatchAction", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableBatchActions", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableBody", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableCell", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableContainer", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableDecoratorRow", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableExpandHeader", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableExpandRow", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableExpandedRow", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableHead", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableHeader", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableRow", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableSelectAll", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableSelectRow", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableSlugRow", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbar", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarAction", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarContent", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarSearch", void 0);
+_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarMenu", void 0);
+DataTable.Table = Table.Table;
+DataTable.TableActionList = TableActionList["default"];
+DataTable.TableBatchAction = TableBatchAction["default"];
+DataTable.TableBatchActions = TableBatchActions["default"];
+DataTable.TableBody = TableBody["default"];
+DataTable.TableCell = TableCell["default"];
+DataTable.TableContainer = TableContainer["default"];
+DataTable.TableDecoratorRow = TableDecoratorRow["default"];
+DataTable.TableExpandHeader = TableExpandHeader["default"];
+DataTable.TableExpandRow = TableExpandRow["default"];
+DataTable.TableExpandedRow = TableExpandedRow["default"];
+DataTable.TableHead = TableHead["default"];
+DataTable.TableHeader = TableHeader["default"];
+DataTable.TableRow = TableRow["default"];
+DataTable.TableSelectAll = TableSelectAll["default"];
+DataTable.TableSelectRow = TableSelectRow["default"];
+DataTable.TableSlugRow = TableSlugRow["default"];
+DataTable.TableToolbar = TableToolbar["default"];
+DataTable.TableToolbarAction = TableToolbarAction["default"];
+DataTable.TableToolbarContent = TableToolbarContent["default"];
+DataTable.TableToolbarSearch = TableToolbarSearch["default"];
+DataTable.TableToolbarMenu = TableToolbarMenu["default"];
+DataTable.propTypes = {
   /**
    * Experimental property. Allows table to align cell contents to the top if there is text wrapping in the content. Might have performance issues, intended for smaller tables
    */
@@ -733,52 +730,6 @@ _rollupPluginBabelHelpers.defineProperty(DataTable, "propTypes", {
    * `true` to add useZebraStyles striping.
    */
   useZebraStyles: PropTypes__default["default"].bool
-});
-_rollupPluginBabelHelpers.defineProperty(DataTable, "translationKeys", Object.values(translationKeys));
-// Static properties for sub-components
-_rollupPluginBabelHelpers.defineProperty(DataTable, "Table", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableActionList", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableBatchAction", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableBatchActions", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableBody", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableCell", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableContainer", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableDecoratorRow", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableExpandHeader", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableExpandRow", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableExpandedRow", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableHead", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableHeader", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableRow", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableSelectAll", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableSelectRow", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableSlugRow", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbar", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarAction", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarContent", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarSearch", void 0);
-_rollupPluginBabelHelpers.defineProperty(DataTable, "TableToolbarMenu", void 0);
-DataTable.Table = Table.Table;
-DataTable.TableActionList = TableActionList["default"];
-DataTable.TableBatchAction = TableBatchAction["default"];
-DataTable.TableBatchActions = TableBatchActions["default"];
-DataTable.TableBody = TableBody["default"];
-DataTable.TableCell = TableCell["default"];
-DataTable.TableContainer = TableContainer["default"];
-DataTable.TableDecoratorRow = TableDecoratorRow["default"];
-DataTable.TableExpandHeader = TableExpandHeader["default"];
-DataTable.TableExpandRow = TableExpandRow["default"];
-DataTable.TableExpandedRow = TableExpandedRow["default"];
-DataTable.TableHead = TableHead["default"];
-DataTable.TableHeader = TableHeader["default"];
-DataTable.TableRow = TableRow["default"];
-DataTable.TableSelectAll = TableSelectAll["default"];
-DataTable.TableSelectRow = TableSelectRow["default"];
-DataTable.TableSlugRow = TableSlugRow["default"];
-DataTable.TableToolbar = TableToolbar["default"];
-DataTable.TableToolbarAction = TableToolbarAction["default"];
-DataTable.TableToolbarContent = TableToolbarContent["default"];
-DataTable.TableToolbarSearch = TableToolbarSearch["default"];
-DataTable.TableToolbarMenu = TableToolbarMenu["default"];
+};
 
 exports["default"] = DataTable;

package/lib/components/DataTable/Table.d.ts

@@ -1,12 +1,12 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * 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 { PropsWithChildren } from 'react';
 import PropTypes from 'prop-types';
-interface TableProps {
+export interface TableProps {
     experimentalAutoAlign?: boolean;
     className?: string;
     /**

package/lib/components/DataTable/Table.js

@@ -53,20 +53,19 @@ const isElementWrappingContent = (element, context) => {
   }
   return false;
 };
-const Table = _ref => {
-  let {
-    className,
-    children,
-    useZebraStyles,
-    size = 'lg',
-    isSortable = false,
-    useStaticWidth,
-    stickyHeader,
-    overflowMenuOnHover = true,
-    experimentalAutoAlign = false,
-    tabIndex,
-    ...other
-  } = _ref;
+const Table = ({
+  className,
+  children,
+  useZebraStyles,
+  size = 'lg',
+  isSortable = false,
+  useStaticWidth,
+  stickyHeader,
+  overflowMenuOnHover = true,
+  experimentalAutoAlign = false,
+  tabIndex,
+  ...other
+}) => {
   const {
     titleId,
     descriptionId
@@ -82,12 +81,10 @@ const Table = _ref => {
     [`${prefix}--data-table--sticky-header`]: stickyHeader,
     [`${prefix}--data-table--visible-overflow-menu`]: !overflowMenuOnHover
   });
-  const toggleTableBodyAlignmentClass = React.useCallback(function () {
-    let alignTop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  const toggleTableBodyAlignmentClass = React.useCallback((alignTop = false) => {
     alignTop ? tableRef.current?.classList.add(`${prefix}--data-table--top-aligned-body`) : tableRef.current?.classList.remove(`${prefix}--data-table--top-aligned-body`);
   }, [prefix]);
-  const toggleTableHeaderAlignmentClass = React.useCallback(function () {
-    let alignTop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  const toggleTableHeaderAlignmentClass = React.useCallback((alignTop = false) => {
     alignTop ? tableRef.current?.classList.add(`${prefix}--data-table--top-aligned-header`) : tableRef.current?.classList.remove(`${prefix}--data-table--top-aligned-header`);
   }, [prefix]);
   const setTableAlignment = React.useCallback(() => {

package/lib/components/DataTable/TableActionList.d.ts

@@ -4,5 +4,5 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-declare const TableActionList: (props: import("../../types/common").ReactAttr<"div">) => React.ReactElement<any>;
+declare const TableActionList: (props: import("react").HTMLAttributes<"div">) => React.ReactElement<any>;
 export default TableActionList;

package/lib/components/DataTable/TableBatchAction.js

@@ -21,17 +21,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableBatchAction = _ref => {
-  let {
-    renderIcon = iconsReact.AddFilled,
-    iconDescription = 'Add',
-    ...props
-  } = _ref;
-  return /*#__PURE__*/React__default["default"].createElement(Button["default"], _rollupPluginBabelHelpers["extends"]({
-    renderIcon: renderIcon,
-    iconDescription: iconDescription
-  }, props));
-};
+const TableBatchAction = ({
+  renderIcon = iconsReact.AddFilled,
+  iconDescription = 'Add',
+  ...props
+}) => /*#__PURE__*/React__default["default"].createElement(Button["default"], _rollupPluginBabelHelpers["extends"]({
+  renderIcon: renderIcon,
+  iconDescription: iconDescription
+}, props));
 TableBatchAction.propTypes = {
   /**
    * Specify if the button is an icon-only button

package/lib/components/DataTable/TableBatchActions.js

@@ -33,14 +33,13 @@ const translationKeys = {
   'carbon.table.batch.item.selected': 'item selected',
   'carbon.table.batch.selectAll': 'Select all'
 };
-const translateWithId = function (id) {
-  let {
-    totalSelected,
-    totalCount
-  } = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
-    totalSelected: 0,
-    totalCount: 0
-  };
+const translateWithId = (id, {
+  totalSelected,
+  totalCount
+} = {
+  totalSelected: 0,
+  totalCount: 0
+}) => {
   if (id === 'carbon.table.batch.cancel') {
     return translationKeys[id];
   }
@@ -49,18 +48,17 @@ const translateWithId = function (id) {
   }
   return `${totalSelected} ${translationKeys[id]}`;
 };
-const TableBatchActions = _ref => {
-  let {
-    className,
-    children,
-    shouldShowBatchActions,
-    totalSelected,
-    totalCount,
-    onCancel,
-    onSelectAll,
-    translateWithId: t = translateWithId,
-    ...rest
-  } = _ref;
+const TableBatchActions = ({
+  className,
+  children,
+  shouldShowBatchActions,
+  totalSelected,
+  totalCount,
+  onCancel,
+  onSelectAll,
+  translateWithId: t = translateWithId,
+  ...rest
+}) => {
   const [isScrolling, setIsScrolling] = React__default["default"].useState(false);
   const prefix = usePrefix.usePrefix();
   const batchActionsClasses = cx__default["default"]({

package/lib/components/DataTable/TableBody.d.ts

@@ -1,12 +1,12 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2025
  *
  * 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 { ReactAttr } from '../../types/common';
-export interface TableBodyProps extends ReactAttr<HTMLTableSectionElement> {
+import { type HTMLAttributes } from 'react';
+export interface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {
     /**
      * `polite` Adjust the notification behavior of screen readers
      */