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

package/lib/components/DataTable/TableBody.js

@@ -18,17 +18,14 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableBody = _ref => {
-  let {
-    children,
-    className,
-    ...rest
-  } = _ref;
-  return /*#__PURE__*/React__default["default"].createElement("tbody", _rollupPluginBabelHelpers["extends"]({
-    "aria-live": rest['aria-live'] ?? 'polite',
-    className: className
-  }, rest), children);
-};
+const TableBody = ({
+  children,
+  className,
+  ...rest
+}) => /*#__PURE__*/React__default["default"].createElement("tbody", _rollupPluginBabelHelpers["extends"]({
+  "aria-live": rest['aria-live'] ?? 'polite',
+  className: className
+}, rest), children);
 TableBody.propTypes = {
   /**
    * `polite` Adjust the notification behavior of screen readers

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

@@ -1,12 +1,11 @@
 /**
- * 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 React from 'react';
-import { ReactAttr } from '../../types/common';
-export interface TableCellProps extends ReactAttr<HTMLTableCellElement> {
+import React, { type HTMLAttributes } from 'react';
+export interface TableCellProps extends HTMLAttributes<HTMLTableCellElement> {
     /**
      * Pass in children that will be embedded in the table header label
      */

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

@@ -5,9 +5,8 @@
  * LICENSE file in the root directory of this source tree.
  */
 import PropTypes from 'prop-types';
-import React from 'react';
-import { ReactAttr } from '../../types/common';
-export interface TableContainerProps extends Omit<ReactAttr<HTMLDivElement>, 'title'> {
+import React, { type HTMLAttributes } from 'react';
+export interface TableContainerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
     /**
      * Optional description text for the Table
      */

package/lib/components/DataTable/TableContainer.js

@@ -24,16 +24,15 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableContainer = _ref => {
-  let {
-    className,
-    children,
-    title,
-    description,
-    stickyHeader,
-    useStaticWidth,
-    ...rest
-  } = _ref;
+const TableContainer = ({
+  className,
+  children,
+  title,
+  description,
+  stickyHeader,
+  useStaticWidth,
+  ...rest
+}) => {
   const baseId = useId.useId('tc');
   const titleId = `${baseId}-title`;
   const descriptionId = `${baseId}-description`;

package/lib/components/DataTable/TableDecoratorRow.js

@@ -20,11 +20,10 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const TableDecoratorRow = _ref => {
-  let {
-    className,
-    decorator
-  } = _ref;
+const TableDecoratorRow = ({
+  className,
+  decorator
+}) => {
   const prefix = usePrefix.usePrefix();
   const TableDecoratorRowClasses = cx__default["default"]({
     ...(className && {

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

@@ -5,8 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import PropTypes from 'prop-types';
-import React from 'react';
-import { ReactAttr } from '../../types/common';
+import React, { type HTMLAttributes } from 'react';
 export type TableExpandHeaderPropsBase = {
     /**
      * Space separated list of one or more ID values referencing the TableExpandedRow(s) being controlled by the TableExpandHeader
@@ -44,7 +43,7 @@ export type TableExpandHeaderPropsBase = {
      * Hook for when a listener initiates a request to expand the given row
      */
     onExpand?(event: React.MouseEvent<HTMLButtonElement>): void;
-} & ReactAttr<HTMLTableCellElement>;
+} & HTMLAttributes<HTMLTableCellElement>;
 export type TableExpandHeaderPropsWithToggle = Omit<TableExpandHeaderPropsBase, 'aria-label' | 'enableToggle' | 'onExpand'> & {
     enableToggle: true;
     ['aria-label']: string;

package/lib/components/DataTable/TableExpandHeader.js

@@ -24,21 +24,20 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableExpandHeader = _ref => {
-  let {
-    ['aria-controls']: ariaControls,
-    ['aria-label']: ariaLabel,
-    ariaLabel: deprecatedAriaLabel,
-    className: headerClassName,
-    enableExpando,
-    enableToggle,
-    id = 'expand',
-    isExpanded,
-    onExpand,
-    expandIconDescription,
-    children,
-    ...rest
-  } = _ref;
+const TableExpandHeader = ({
+  ['aria-controls']: ariaControls,
+  ['aria-label']: ariaLabel,
+  ariaLabel: deprecatedAriaLabel,
+  className: headerClassName,
+  enableExpando,
+  enableToggle,
+  id = 'expand',
+  isExpanded,
+  onExpand,
+  expandIconDescription,
+  children,
+  ...rest
+}) => {
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"](`${prefix}--table-expand`, headerClassName);
   const previousValue = isExpanded ? 'collapsed' : undefined;

package/lib/components/DataTable/TableExpandRow.js

@@ -23,20 +23,19 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableExpandRow = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
-  let {
-    ['aria-controls']: ariaControls,
-    ['aria-label']: ariaLabel,
-    ariaLabel: deprecatedAriaLabel,
-    className: rowClassName,
-    children,
-    isExpanded,
-    onExpand,
-    expandIconDescription,
-    isSelected,
-    expandHeader = 'expand',
-    ...rest
-  } = _ref;
+const TableExpandRow = /*#__PURE__*/React__default["default"].forwardRef(({
+  ['aria-controls']: ariaControls,
+  ['aria-label']: ariaLabel,
+  ariaLabel: deprecatedAriaLabel,
+  className: rowClassName,
+  children,
+  isExpanded,
+  onExpand,
+  expandIconDescription,
+  isSelected,
+  expandHeader = 'expand',
+  ...rest
+}, ref) => {
   const prefix = usePrefix.usePrefix();
 
   // We need to put the AILabel and Decorator before the expansion arrow and all other table cells after the arrow.

package/lib/components/DataTable/TableExpandedRow.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 TableExpandedRowProps extends ReactAttr<HTMLTableRowElement> {
+import { type HTMLAttributes } from 'react';
+export interface TableExpandedRowProps extends HTMLAttributes<HTMLTableRowElement> {
     /**
      * The width of the expanded row's internal cell
      */

package/lib/components/DataTable/TableExpandedRow.js

@@ -22,13 +22,12 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableExpandedRow = _ref => {
-  let {
-    className: customClassName,
-    children,
-    colSpan,
-    ...rest
-  } = _ref;
+const TableExpandedRow = ({
+  className: customClassName,
+  children,
+  colSpan,
+  ...rest
+}) => {
   const rowRef = React.useRef(null);
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"](`${prefix}--expandable-row`, customClassName);

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

@@ -6,5 +6,5 @@
  */
 import { ThHTMLAttributes } from 'react';
 export type TableHeadProps = ThHTMLAttributes<HTMLTableSectionElement>;
-declare const TableHead: (props: import("../../types/common").ReactAttr<"thead">) => React.ReactElement<any>;
+declare const TableHead: (props: import("react").HTMLAttributes<"thead">) => React.ReactElement<any>;
 export default TableHead;

package/lib/components/DataTable/TableHeader.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 React, { type MouseEventHandler, ReactNode } from 'react';
+import React, { type HTMLAttributes, type MouseEventHandler, type ReactNode } from 'react';
 import { sortStates } from './state/sorting';
-import { TranslateWithId, ReactAttr } from '../../types/common';
+import { TranslateWithId } from '../../types/common';
 import { DataTableSortState } from './state/sortStates';
 export type TableHeaderTranslationKey = 'carbon.table.header.icon.description';
 export interface TableHeaderTranslationArgs {
@@ -15,7 +15,7 @@ export interface TableHeaderTranslationArgs {
     sortDirection?: DataTableSortState;
     sortStates: typeof sortStates;
 }
-export interface TableHeaderProps extends ReactAttr<HTMLTableCellElement & HTMLButtonElement>, TranslateWithId<TableHeaderTranslationKey, {
+export interface TableHeaderProps extends HTMLAttributes<HTMLTableCellElement & HTMLButtonElement>, TranslateWithId<TableHeaderTranslationKey, {
     header: any;
     sortDirection: any;
     isSortHeader: any;

package/lib/components/DataTable/TableHeader.js

@@ -51,22 +51,21 @@ const sortDirections = {
   [sortStates.sortStates.ASC]: 'ascending',
   [sortStates.sortStates.DESC]: 'descending'
 };
-const TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function TableHeader(_ref, ref) {
-  let {
-    className: headerClassName,
-    children,
-    colSpan,
-    decorator,
-    isSortable = false,
-    isSortHeader,
-    onClick,
-    scope = defaultScope,
-    sortDirection,
-    translateWithId: t = translateWithId,
-    slug,
-    id,
-    ...rest
-  } = _ref;
+const TableHeader = /*#__PURE__*/React__default["default"].forwardRef(function TableHeader({
+  className: headerClassName,
+  children,
+  colSpan,
+  decorator,
+  isSortable = false,
+  isSortHeader,
+  onClick,
+  scope = defaultScope,
+  sortDirection,
+  translateWithId: t = translateWithId,
+  slug,
+  id,
+  ...rest
+}, ref) {
   const prefix = usePrefix.usePrefix();
   const uniqueId = useId.useId('table-sort');
 

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

@@ -1,12 +1,11 @@
 /**
- * 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 React from 'react';
-import { ReactAttr } from '../../types/common';
-export interface TableRowProps extends ReactAttr<HTMLTableRowElement> {
+import React, { type HTMLAttributes } from 'react';
+export interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {
     /**
      * Specify an optional className to be applied to the container node
      */

package/lib/components/DataTable/TableSelectAll.js

@@ -22,18 +22,17 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const TableSelectAll = _ref => {
-  let {
-    ariaLabel: deprecatedAriaLabel = 'Select all rows in the table',
-    ['aria-label']: ariaLabel,
-    checked,
-    id,
-    indeterminate,
-    name,
-    onSelect,
-    disabled,
-    className
-  } = _ref;
+const TableSelectAll = ({
+  ariaLabel: deprecatedAriaLabel = 'Select all rows in the table',
+  ['aria-label']: ariaLabel,
+  checked,
+  id,
+  indeterminate,
+  name,
+  onSelect,
+  disabled,
+  className
+}) => {
   const prefix = usePrefix.usePrefix();
   return /*#__PURE__*/React__default["default"].createElement("th", {
     "aria-live": "off",

package/lib/components/DataTable/TableSelectRow.js

@@ -25,19 +25,18 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const TableSelectRow = _ref => {
-  let {
-    ariaLabel: deprecatedAriaLabel,
-    ['aria-label']: ariaLabel,
-    checked,
-    id,
-    name,
-    onSelect,
-    onChange,
-    disabled,
-    radio,
-    className
-  } = _ref;
+const TableSelectRow = ({
+  ariaLabel: deprecatedAriaLabel,
+  ['aria-label']: ariaLabel,
+  checked,
+  id,
+  name,
+  onSelect,
+  onChange,
+  disabled,
+  radio,
+  className
+}) => {
   const prefix = usePrefix.usePrefix();
   const uniqueNameId = useId.useId();
   const handleRadioChange = onChange ? (value, name, event) => {

package/lib/components/DataTable/TableSlugRow.js

@@ -21,11 +21,10 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-const TableSlugRow = _ref => {
-  let {
-    className,
-    slug
-  } = _ref;
+const TableSlugRow = ({
+  className,
+  slug
+}) => {
   React.useEffect(() => {
     deprecateComponent["default"]('TableSlugRow', 'The `TableSlugRow` component has been deprecated and will be removed in the next major version. Use the TableDecoratorRow component instead.');
   }, []);

package/lib/components/DataTable/TableToolbar.js

@@ -22,14 +22,13 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const TableToolbar = _ref => {
-  let {
-    ['aria-label']: ariaLabel = 'data table toolbar',
-    ariaLabel: deprecatedAriaLabel,
-    children,
-    size,
-    ...rest
-  } = _ref;
+const TableToolbar = ({
+  ['aria-label']: ariaLabel = 'data table toolbar',
+  ariaLabel: deprecatedAriaLabel,
+  children,
+  size,
+  ...rest
+}) => {
   const prefix = usePrefix.usePrefix();
   const className = cx__default["default"]({
     [`${prefix}--table-toolbar`]: true,

package/lib/components/DataTable/TableToolbarContent.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 TableToolbarContent: (props: import("../../types/common").ReactAttr<"div">) => React.ReactElement<any>;
+declare const TableToolbarContent: (props: import("react").HTMLAttributes<"div">) => React.ReactElement<any>;
 export default TableToolbarContent;

package/lib/components/DataTable/TableToolbarMenu.js

@@ -24,15 +24,14 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 const defaultIconDescription = 'Settings';
-const TableToolbarMenu = _ref => {
-  let {
-    className,
-    renderIcon = iconsReact.Settings,
-    iconDescription = defaultIconDescription,
-    children,
-    menuOptionsClass,
-    ...rest
-  } = _ref;
+const TableToolbarMenu = ({
+  className,
+  renderIcon = iconsReact.Settings,
+  iconDescription = defaultIconDescription,
+  children,
+  menuOptionsClass,
+  ...rest
+}) => {
   const prefix = usePrefix.usePrefix();
   const toolbarActionClasses = cx__default["default"](className, `${prefix}--toolbar-action ${prefix}--overflow-menu`);
   const menuOptionsClasses = cx__default["default"](menuOptionsClass, `${prefix}--toolbar-action__menu`);

package/lib/components/DataTable/TableToolbarSearch.js

@@ -36,28 +36,27 @@ const translationKeys = {
 const translateWithId = id => {
   return translationKeys[id];
 };
-const TableToolbarSearch = _ref => {
-  let {
-    className,
-    searchContainerClass,
-    onChange: onChangeProp,
-    onClear = noopFn.noopFn,
-    translateWithId: t = translateWithId,
-    placeholder,
-    labelText,
-    expanded: expandedProp,
-    defaultExpanded,
-    defaultValue,
-    disabled,
-    onExpand,
-    persistent = false,
-    id,
-    onBlur,
-    onFocus,
-    size = 'lg',
-    tabIndex = '0',
-    ...rest
-  } = _ref;
+const TableToolbarSearch = ({
+  className,
+  searchContainerClass,
+  onChange: onChangeProp,
+  onClear = noopFn.noopFn,
+  translateWithId: t = translateWithId,
+  placeholder,
+  labelText,
+  expanded: expandedProp,
+  defaultExpanded,
+  defaultValue,
+  disabled,
+  onExpand,
+  persistent = false,
+  id,
+  onBlur,
+  onFocus,
+  size = 'lg',
+  tabIndex = '0',
+  ...rest
+}) => {
   const {
     current: controlled
   } = React.useRef(expandedProp !== undefined);
@@ -88,8 +87,7 @@ const TableToolbarSearch = _ref => {
     [`${prefix}--toolbar-search-container-expandable`]: !persistent,
     [`${prefix}--toolbar-search-container-persistent`]: persistent
   });
-  const handleExpand = function (event) {
-    let value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : !expanded;
+  const handleExpand = (event, value = !expanded) => {
     if (!disabled) {
       if (!controlled && !persistent) {
         setExpandedState(value);

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

@@ -1,5 +1,5 @@
 /**
- * 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.

package/lib/components/DataTable/state/sorting.js

@@ -43,10 +43,9 @@ const getNextSortDirection = (prevHeader, header, prevState) => {
   // in descending order by default
   return sortStates.sortStates.ASC;
 };
-const getNextSortState = (props, state, _ref) => {
-  let {
-    key
-  } = _ref;
+const getNextSortState = (props, state, {
+  key
+}) => {
   const {
     sortDirection,
     sortHeaderKey

package/lib/components/DataTable/tools/filter.js

@@ -13,20 +13,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
  * Filters row IDs based on whether any of the cell values in the row include
  * the input value as a substring. Boolean cell values are ignored.
  */
-const defaultFilterRows = _ref => {
-  let {
-    rowIds,
-    headers,
-    cellsById,
-    inputValue,
-    getCellId
-  } = _ref;
+const defaultFilterRows = ({
+  rowIds,
+  headers,
+  cellsById,
+  inputValue,
+  getCellId
+}) => {
   const normalizedInput = inputValue.trim().toLowerCase();
   if (!normalizedInput) return rowIds;
-  return rowIds.filter(rowId => headers.some(_ref2 => {
-    let {
-      key
-    } = _ref2;
+  return rowIds.filter(rowId => headers.some(({
+    key
+  }) => {
     const cellId = getCellId(rowId, key);
     const cell = cellsById[cellId];
     if (typeof cell.value === 'boolean') return false;

package/lib/components/DataTable/tools/normalize.js

@@ -18,8 +18,7 @@ var cells = require('./cells.js');
  * @param {Array<object>} headers
  * @returns {object}
  */
-const normalize = function (rows, headers) {
-  let prevState = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+const normalize = (rows, headers, prevState = {}) => {
   const {
     rowsById: prevRowsByIds
   } = prevState;
@@ -50,12 +49,11 @@ const normalize = function (rows, headers) {
       rowsById[row.id].isSelected = prevRowsByIds[row.id].isSelected;
       rowsById[row.id].isExpanded = prevRowsByIds[row.id].isExpanded;
     }
-    headers.forEach((_ref, i) => {
-      let {
-        key,
-        slug,
-        decorator
-      } = _ref;
+    headers.forEach(({
+      key,
+      slug,
+      decorator
+    }, i) => {
       const id = cells.getCellId(row.id, key);
       // Initialize the cell info and state values, namely for editing
       cellsById[id] = {