@carbon/react 1.83.0 → 1.84.0-rc.0

package/es/components/DataTable/TableBody.js

@@ -9,17 +9,14 @@ import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const TableBody = _ref => {
-  let {
-    children,
-    className,
-    ...rest
-  } = _ref;
-  return /*#__PURE__*/React.createElement("tbody", _extends({
-    "aria-live": rest['aria-live'] ?? 'polite',
-    className: className
-  }, rest), children);
-};
+const TableBody = ({
+  children,
+  className,
+  ...rest
+}) => /*#__PURE__*/React.createElement("tbody", _extends({
+  "aria-live": rest['aria-live'] ?? 'polite',
+  className: className
+}, rest), children);
 TableBody.propTypes = {
   /**
    * `polite` Adjust the notification behavior of screen readers

package/es/components/DataTable/TableContainer.js

@@ -14,16 +14,15 @@ import { useId } from '../../internal/useId.js';
 import { TableContext } from './TableContext.js';
 import { Section, Heading } from '../Heading/index.js';
 
-const TableContainer = _ref => {
-  let {
-    className,
-    children,
-    title,
-    description,
-    stickyHeader,
-    useStaticWidth,
-    ...rest
-  } = _ref;
+const TableContainer = ({
+  className,
+  children,
+  title,
+  description,
+  stickyHeader,
+  useStaticWidth,
+  ...rest
+}) => {
   const baseId = useId('tc');
   const titleId = `${baseId}-title`;
   const descriptionId = `${baseId}-description`;

package/es/components/DataTable/TableDecoratorRow.js

@@ -10,11 +10,10 @@ import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-const TableDecoratorRow = _ref => {
-  let {
-    className,
-    decorator
-  } = _ref;
+const TableDecoratorRow = ({
+  className,
+  decorator
+}) => {
   const prefix = usePrefix();
   const TableDecoratorRowClasses = cx({
     ...(className && {

package/es/components/DataTable/TableExpandHeader.js

@@ -14,21 +14,20 @@ import { usePrefix } from '../../internal/usePrefix.js';
 import deprecate from '../../prop-types/deprecate.js';
 import requiredIfGivenPropIsTruthy from '../../prop-types/requiredIfGivenPropIsTruthy.js';
 
-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();
   const className = cx(`${prefix}--table-expand`, headerClassName);
   const previousValue = isExpanded ? 'collapsed' : undefined;

package/es/components/DataTable/TableExpandRow.js

@@ -13,20 +13,19 @@ import { ChevronRight } from '@carbon/icons-react';
 import TableCell from './TableCell.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-const TableExpandRow = /*#__PURE__*/React.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.forwardRef(({
+  ['aria-controls']: ariaControls,
+  ['aria-label']: ariaLabel,
+  ariaLabel: deprecatedAriaLabel,
+  className: rowClassName,
+  children,
+  isExpanded,
+  onExpand,
+  expandIconDescription,
+  isSelected,
+  expandHeader = 'expand',
+  ...rest
+}, ref) => {
   const prefix = usePrefix();
 
   // We need to put the AILabel and Decorator before the expansion arrow and all other table cells after the arrow.

package/es/components/DataTable/TableExpandedRow.js

@@ -12,13 +12,12 @@ import React, { useRef } from 'react';
 import TableCell from './TableCell.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-const TableExpandedRow = _ref => {
-  let {
-    className: customClassName,
-    children,
-    colSpan,
-    ...rest
-  } = _ref;
+const TableExpandedRow = ({
+  className: customClassName,
+  children,
+  colSpan,
+  ...rest
+}) => {
   const rowRef = useRef(null);
   const prefix = usePrefix();
   const className = cx(`${prefix}--expandable-row`, customClassName);

package/es/components/DataTable/TableHeader.js

@@ -41,22 +41,21 @@ const sortDirections = {
   [sortStates.ASC]: 'ascending',
   [sortStates.DESC]: 'descending'
 };
-const TableHeader = /*#__PURE__*/React.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.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();
   const uniqueId = useId('table-sort');
 

package/es/components/DataTable/TableSelectAll.js

@@ -12,18 +12,17 @@ import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import deprecate from '../../prop-types/deprecate.js';
 
-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();
   return /*#__PURE__*/React.createElement("th", {
     "aria-live": "off",

package/es/components/DataTable/TableSelectRow.js

@@ -15,19 +15,18 @@ import { useId } from '../../internal/useId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import deprecate from '../../prop-types/deprecate.js';
 
-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();
   const uniqueNameId = useId();
   const handleRadioChange = onChange ? (value, name, event) => {

package/es/components/DataTable/TableSlugRow.js

@@ -11,11 +11,10 @@ import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import deprecateComponent from '../../prop-types/deprecateComponent.js';
 
-const TableSlugRow = _ref => {
-  let {
-    className,
-    slug
-  } = _ref;
+const TableSlugRow = ({
+  className,
+  slug
+}) => {
   useEffect(() => {
     deprecateComponent('TableSlugRow', 'The `TableSlugRow` component has been deprecated and will be removed in the next major version. Use the TableDecoratorRow component instead.');
   }, []);

package/es/components/DataTable/TableToolbar.js

@@ -12,14 +12,13 @@ import React from 'react';
 import { usePrefix } from '../../internal/usePrefix.js';
 import deprecate from '../../prop-types/deprecate.js';
 
-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();
   const className = cx({
     [`${prefix}--table-toolbar`]: true,

package/es/components/DataTable/TableToolbarMenu.js

@@ -14,15 +14,14 @@ import { usePrefix } from '../../internal/usePrefix.js';
 import OverflowMenu from '../OverflowMenu/index.js';
 
 const defaultIconDescription = 'Settings';
-const TableToolbarMenu = _ref => {
-  let {
-    className,
-    renderIcon = Settings,
-    iconDescription = defaultIconDescription,
-    children,
-    menuOptionsClass,
-    ...rest
-  } = _ref;
+const TableToolbarMenu = ({
+  className,
+  renderIcon = Settings,
+  iconDescription = defaultIconDescription,
+  children,
+  menuOptionsClass,
+  ...rest
+}) => {
   const prefix = usePrefix();
   const toolbarActionClasses = cx(className, `${prefix}--toolbar-action ${prefix}--overflow-menu`);
   const menuOptionsClasses = cx(menuOptionsClass, `${prefix}--toolbar-action__menu`);

package/es/components/DataTable/TableToolbarSearch.js

@@ -26,28 +26,27 @@ const translationKeys = {
 const translateWithId = id => {
   return translationKeys[id];
 };
-const TableToolbarSearch = _ref => {
-  let {
-    className,
-    searchContainerClass,
-    onChange: onChangeProp,
-    onClear = 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,
+  translateWithId: t = translateWithId,
+  placeholder,
+  labelText,
+  expanded: expandedProp,
+  defaultExpanded,
+  defaultValue,
+  disabled,
+  onExpand,
+  persistent = false,
+  id,
+  onBlur,
+  onFocus,
+  size = 'lg',
+  tabIndex = '0',
+  ...rest
+}) => {
   const {
     current: controlled
   } = useRef(expandedProp !== undefined);
@@ -78,8 +77,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/es/components/DataTable/state/sorting.js

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

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

@@ -9,20 +9,18 @@
  * 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/es/components/DataTable/tools/normalize.js

@@ -14,8 +14,7 @@ import { getCellId } from './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;
@@ -46,12 +45,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 = getCellId(row.id, key);
       // Initialize the cell info and state values, namely for editing
       cellsById[id] = {

package/es/components/DataTable/tools/sorting.js

@@ -13,8 +13,7 @@ import { sortStates } from '../state/sortStates.js';
  * type, the default sort algorithm will be used for those types. Otherwise, the
  * values will be converted to strings for comparison.
  */
-const compare = function (a, b) {
-  let locale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'en';
+const compare = (a, b, locale = 'en') => {
   // prevent multiple null values in one column (sorting breaks)
   if (a === null) a = '';
   if (b === null) b = '';
@@ -37,8 +36,7 @@ const compare = function (a, b) {
  *
  * Note: Uses numeric comparison if strings are numeric.
  */
-const compareStrings = function (a, b) {
-  let locale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'en';
+const compareStrings = (a, b, locale = 'en') => {
   const isNumeric = !isNaN(parseFloat(a)) && !isNaN(parseFloat(b));
   return a.localeCompare(b, locale, {
     numeric: isNumeric
@@ -47,38 +45,34 @@ const compareStrings = function (a, b) {
 /**
  * Sorts table rows based on the provided column key and direction.
  */
-const sortRows = _ref => {
-  let {
-    rowIds,
-    cellsById,
-    sortDirection,
+const sortRows = ({
+  rowIds,
+  cellsById,
+  sortDirection,
+  key,
+  locale = 'en',
+  sortRow = defaultSortRow
+}) => rowIds.slice().sort((a, b) => {
+  const cellA = cellsById[getCellId(a, key)];
+  const cellB = cellsById[getCellId(b, key)];
+  return sortRow(cellA?.value, cellB?.value, {
     key,
-    locale = 'en',
-    sortRow = defaultSortRow
-  } = _ref;
-  return rowIds.slice().sort((a, b) => {
-    const cellA = cellsById[getCellId(a, key)];
-    const cellB = cellsById[getCellId(b, key)];
-    return sortRow(cellA?.value, cellB?.value, {
-      key,
-      sortDirection,
-      sortStates,
-      locale,
-      compare,
-      rowIds: [a, b]
-    });
+    sortDirection,
+    sortStates,
+    locale,
+    compare,
+    rowIds: [a, b]
   });
-};
+});
 
 /**
  * Sorts table rows based on the sort direction.
  */
-const defaultSortRow = (cellA, cellB, _ref2) => {
-  let {
-    sortDirection,
-    sortStates,
-    locale
-  } = _ref2;
+const defaultSortRow = (cellA, cellB, {
+  sortDirection,
+  sortStates,
+  locale
+}) => {
   if (sortDirection === sortStates.ASC) {
     return compare(cellA, cellB, locale);
   }

package/es/components/DataTableSkeleton/DataTableSkeleton.js

@@ -12,18 +12,17 @@ import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 
 var _span, _span2;
-const DataTableSkeleton = _ref => {
-  let {
-    headers,
-    rowCount = 5,
-    columnCount = 5,
-    zebra = false,
-    compact = false,
-    className,
-    showHeader = true,
-    showToolbar = true,
-    ...rest
-  } = _ref;
+const DataTableSkeleton = ({
+  headers,
+  rowCount = 5,
+  columnCount = 5,
+  zebra = false,
+  compact = false,
+  className,
+  showHeader = true,
+  showToolbar = true,
+  ...rest
+}) => {
   const prefix = usePrefix();
   const dataTableSkeletonClasses = cx(className, {
     [`${prefix}--skeleton`]: true,

package/es/components/DatePicker/DatePicker.Skeleton.js

@@ -11,14 +11,13 @@ import React from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 
-const DatePickerSkeleton = _ref => {
-  let {
-    range,
-    id,
-    hideLabel,
-    className,
-    ...rest
-  } = _ref;
+const DatePickerSkeleton = ({
+  range,
+  id,
+  hideLabel,
+  className,
+  ...rest
+}) => {
   const prefix = usePrefix();
   const dateInput = /*#__PURE__*/React.createElement("div", {
     className: `${prefix}--date-picker-container`