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

package/lib/tools/uniqueId.js

@@ -10,8 +10,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 let lastId = 0;
-const uniqueId = function () {
-  let prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'id';
+const uniqueId = (prefix = 'id') => {
   lastId++;
   return `${prefix}${lastId}`;
 };

package/lib/tools/wrapComponent.d.ts

@@ -1,11 +1,10 @@
 /**
- * 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';
+import React, { type HTMLAttributes } from 'react';
 type HTMLTagName = keyof HTMLElementTagNameMap;
 type WrapComponentArgs<T extends HTMLTagName> = {
     name: string;
@@ -16,5 +15,5 @@ type WrapComponentArgs<T extends HTMLTagName> = {
  * @param {{ name: string, type: string, className?: string | (prefix: string) => string }} props
  * @returns
  */
-declare const wrapComponent: <T extends HTMLTagName>({ name, className: getClassName, type, }: WrapComponentArgs<T>) => ((props: ReactAttr<T>) => React.ReactElement<any>);
+declare const wrapComponent: <T extends HTMLTagName>({ name, className: getClassName, type, }: WrapComponentArgs<T>) => ((props: HTMLAttributes<T>) => React.ReactElement<any>);
 export default wrapComponent;

package/lib/tools/wrapComponent.js

@@ -24,22 +24,20 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
  * @param {{ name: string, type: string, className?: string | (prefix: string) => string }} props
  * @returns
  */
-const wrapComponent = _ref => {
-  let {
-    name,
-    className: getClassName,
-    type
-  } = _ref;
+const wrapComponent = ({
+  name,
+  className: getClassName,
+  type
+}) => {
   /**
    *
    * @param {{ className?: string, [x: string]: any}} param0
    * @returns
    */
-  function Component(_ref2) {
-    let {
-      className: baseClassName,
-      ...other
-    } = _ref2;
+  function Component({
+    className: baseClassName,
+    ...other
+  }) {
     const prefix = usePrefix.usePrefix();
     const componentClass = cx__default["default"](typeof getClassName === 'function' ? getClassName(prefix) : getClassName, baseClassName);
     return /*#__PURE__*/React__default["default"].createElement(type, {

package/lib/types/common.d.ts

@@ -4,8 +4,6 @@
  * 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 * as React from 'react';
-export type ReactAttr<T = HTMLElement> = React.HTMLAttributes<T>;
 /**
  * For "as" props.  Creates an "as" property that supports native html tags such as 'span', 'a', 'button' as well as custom functional components
  * All native props for the supplied html tag/component are inferred as part of the base component props, allowing us to use props like `href` on an 'a' element etc

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.83.0-rc.0",
+  "version": "1.84.0-rc.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -51,37 +51,36 @@
     "sass": "^1.33.0"
   },
   "dependencies": {
-    "@babel/runtime": "^7.24.7",
-    "@carbon/feature-flags": "^0.26.0",
-    "@carbon/icons-react": "^11.60.0",
-    "@carbon/layout": "^11.34.0",
-    "@carbon/styles": "^1.82.0-rc.0",
-    "@carbon/utilities": "^0.6.0-rc.0",
+    "@babel/runtime": "^7.27.3",
+    "@carbon/feature-flags": "^0.27.0-rc.0",
+    "@carbon/icons-react": "^11.61.0-rc.0",
+    "@carbon/layout": "^11.35.0-rc.0",
+    "@carbon/styles": "^1.83.0-rc.0",
+    "@carbon/utilities": "^0.7.0-rc.0",
     "@floating-ui/react": "^0.27.4",
     "@ibm/telemetry-js": "^1.5.0",
     "classnames": "2.5.1",
     "copy-to-clipboard": "^3.3.1",
-    "downshift": "9.0.8",
+    "downshift": "9.0.9",
     "es-toolkit": "^1.27.0",
     "flatpickr": "4.6.13",
     "invariant": "^2.2.3",
     "prop-types": "^15.8.1",
     "react-fast-compare": "^3.2.2",
     "tabbable": "^6.2.0",
-    "use-resize-observer": "^9.1.0",
     "window-or-global": "^1.0.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.24.7",
-    "@babel/plugin-proposal-export-default-from": "^7.24.7",
-    "@babel/plugin-transform-class-properties": "^7.24.7",
-    "@babel/plugin-transform-export-namespace-from": "^7.24.7",
-    "@babel/plugin-transform-react-constant-elements": "^7.24.7",
-    "@babel/preset-env": "^7.24.7",
-    "@babel/preset-react": "^7.24.7",
-    "@babel/preset-typescript": "^7.24.7",
+    "@babel/core": "^7.27.3",
+    "@babel/plugin-proposal-export-default-from": "^7.27.1",
+    "@babel/plugin-transform-class-properties": "^7.27.1",
+    "@babel/plugin-transform-export-namespace-from": "^7.27.1",
+    "@babel/plugin-transform-react-constant-elements": "^7.27.1",
+    "@babel/preset-env": "^7.27.2",
+    "@babel/preset-react": "^7.27.1",
+    "@babel/preset-typescript": "^7.27.1",
     "@carbon/test-utils": "^10.36.0",
-    "@carbon/themes": "^11.52.0",
+    "@carbon/themes": "^11.54.0-rc.0",
     "@figma/code-connect": "^1.3.2",
     "@rollup/plugin-babel": "^6.0.0",
     "@rollup/plugin-commonjs": "^28.0.0",
@@ -100,10 +99,11 @@
     "@storybook/react-webpack5": "^8.4.7",
     "@storybook/theming": "^8.4.7",
     "@types/react-is": "^19.0.0",
+    "@types/use-sync-external-store": "^1",
     "autoprefixer": "^10.4.0",
     "babel-loader": "^9.0.0",
     "babel-plugin-dev-expression": "^0.2.3",
-    "babel-preset-carbon": "^0.6.0",
+    "babel-preset-carbon": "^0.7.0-rc.0",
     "browserify-zlib": "^0.2.0",
     "browserslist-config-carbon": "^11.2.0",
     "clipboardy": "^2.1.0",
@@ -133,6 +133,7 @@
     "stream-browserify": "^3.0.0",
     "style-loader": "^4.0.0",
     "typescript-config-carbon": "^0.5.0",
+    "use-sync-external-store": "^1.5.0",
     "webpack": "^5.65.0",
     "webpack-dev-server": "^5.0.0"
   },
@@ -147,5 +148,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "184bbaf4d986f623be415b47b933c56b19655774"
+  "gitHead": "fcae2645f1b5a1a01b5629926df471ec1945d1e6"
 }

package/scss/components/content-switcher/_tokens.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 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.
+//
+
+@forward '@carbon/styles/scss/components/content-switcher/tokens';

package/telemetry.yml

@@ -68,6 +68,7 @@ collect:
         - experimentalAutoAlign
         - feedback
         - feedbackTimeout
+        - formatOptions
         - fullWidth
         - gap
         - hasDivider
@@ -91,6 +92,7 @@ collect:
         - initialSelectedItems
         - inline
         - innerRef
+        - inputMode
         - invalid
         - invalidText
         - isActive
@@ -163,6 +165,7 @@ collect:
         - onOpen
         - onRequestClose
         - onRequestSubmit
+        - onSecondarySubmit
         - onSelect
         - onToggle
         - onToggleClick
@@ -214,7 +217,6 @@ collect:
         - statusIconDescription
         - step
         - stickyHeader
-        - style
         - subtitle
         - tabIndex
         - target
@@ -257,6 +259,8 @@ collect:
         - revertLabel
         - slugLabel
         - textLabel
+        # AISkeletonIcon
+        - style
         # AspectRatio
         - ratio
         # Breadcrumb
@@ -320,6 +324,8 @@ collect:
         - tooltipText
         - triggerClassName
         # Dialog
+        - ariaDescribedBy
+        - ariaLabelledBy
         - modal
         # DismissibleTag
         - dismissTooltipLabel
@@ -384,6 +390,8 @@ collect:
         # InlineLoading
         - onSuccess
         - successDelay
+        # Layer
+        - withBackground
         # LinkBase
         - visited
         # ListBox
@@ -412,7 +420,6 @@ collect:
         - alert
         - closeButtonLabel
         - modalAriaLabel
-        - onSecondarySubmit
         - shouldSubmitOnEnter
         # ModalBody
         - hasForm
@@ -457,9 +464,15 @@ collect:
         - onMouseDown
         - requireTitle
         - wrapperClassName
+        # PageHeaderBreadcrumbBar
+        - border
+        - contentActions
+        - contentActionsFlush
+        - pageActionsFlush
         # PageHeaderContent
         - contextualActions
         # PageHeaderContentPageActions
+        - actions
         - menuButtonLabel
         # PageSelector
         - currentPage
@@ -662,6 +675,15 @@ collect:
         # General - direction
         - bottom
         - top
+        # General - inputMode
+        - decimal
+        - email
+        - none
+        - numeric
+        - search
+        - tel
+        - text
+        - url
         # General - kind
         - caution-major
         - caution-minor
@@ -788,6 +810,8 @@ collect:
         - vertical
         # General - role
         - alert
+        - alertdialog
+        - dialog
         - log
         - status
         # General - selectionFeedback
@@ -850,6 +874,7 @@ collect:
         - inline
         - magenta
         - multi
+        - number
         - outline
         - password
         - purple

package/es/components/ContentSwitcher/index.js

@@ -1,13 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 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.
- */
-
-import { createClassWrapper } from '../../internal/createClassWrapper.js';
-import ContentSwitcher$1 from './ContentSwitcher.js';
-
-const ContentSwitcher = createClassWrapper(ContentSwitcher$1);
-
-export { ContentSwitcher, ContentSwitcher as default };

package/es/components/DataTable/index.js

@@ -1,76 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 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.
- */
-
-import DataTable from './DataTable.js';
-export { default as DataTable, default } from './DataTable.js';
-import { Table } from './Table.js';
-export { Table } from './Table.js';
-import TableActionList from './TableActionList.js';
-export { default as TableActionList } from './TableActionList.js';
-import TableBatchAction from './TableBatchAction.js';
-export { default as TableBatchAction } from './TableBatchAction.js';
-import TableBatchActions from './TableBatchActions.js';
-export { default as TableBatchActions } from './TableBatchActions.js';
-import TableBody from './TableBody.js';
-export { default as TableBody } from './TableBody.js';
-import TableCell from './TableCell.js';
-export { default as TableCell } from './TableCell.js';
-import TableContainer from './TableContainer.js';
-export { default as TableContainer } from './TableContainer.js';
-import TableExpandHeader from './TableExpandHeader.js';
-export { default as TableExpandHeader } from './TableExpandHeader.js';
-import TableDecoratorRow from './TableDecoratorRow.js';
-export { default as TableDecoratorRow } from './TableDecoratorRow.js';
-import TableExpandRow from './TableExpandRow.js';
-export { default as TableExpandRow } from './TableExpandRow.js';
-import TableExpandedRow from './TableExpandedRow.js';
-export { default as TableExpandedRow } from './TableExpandedRow.js';
-import TableHead from './TableHead.js';
-export { default as TableHead } from './TableHead.js';
-import TableHeader from './TableHeader.js';
-export { default as TableHeader } from './TableHeader.js';
-import TableRow from './TableRow.js';
-export { default as TableRow } from './TableRow.js';
-import TableSelectAll from './TableSelectAll.js';
-export { default as TableSelectAll } from './TableSelectAll.js';
-import TableSelectRow from './TableSelectRow.js';
-export { default as TableSelectRow } from './TableSelectRow.js';
-import TableSlugRow from './TableSlugRow.js';
-export { default as TableSlugRow } from './TableSlugRow.js';
-import TableToolbar from './TableToolbar.js';
-export { default as TableToolbar } from './TableToolbar.js';
-import TableToolbarAction from './TableToolbarAction.js';
-export { default as TableToolbarAction } from './TableToolbarAction.js';
-import TableToolbarContent from './TableToolbarContent.js';
-export { default as TableToolbarContent } from './TableToolbarContent.js';
-import TableToolbarSearch from './TableToolbarSearch.js';
-export { default as TableToolbarSearch } from './TableToolbarSearch.js';
-import TableToolbarMenu from './TableToolbarMenu.js';
-export { default as TableToolbarMenu } from './TableToolbarMenu.js';
-
-DataTable.Table = Table;
-DataTable.TableActionList = TableActionList;
-DataTable.TableBatchAction = TableBatchAction;
-DataTable.TableBatchActions = TableBatchActions;
-DataTable.TableBody = TableBody;
-DataTable.TableCell = TableCell;
-DataTable.TableContainer = TableContainer;
-DataTable.TableDecoratorRow = TableDecoratorRow;
-DataTable.TableExpandHeader = TableExpandHeader;
-DataTable.TableExpandRow = TableExpandRow;
-DataTable.TableExpandedRow = TableExpandedRow;
-DataTable.TableHead = TableHead;
-DataTable.TableHeader = TableHeader;
-DataTable.TableRow = TableRow;
-DataTable.TableSelectAll = TableSelectAll;
-DataTable.TableSelectRow = TableSelectRow;
-DataTable.TableSlugRow = TableSlugRow;
-DataTable.TableToolbar = TableToolbar;
-DataTable.TableToolbarAction = TableToolbarAction;
-DataTable.TableToolbarContent = TableToolbarContent;
-DataTable.TableToolbarSearch = TableToolbarSearch;
-DataTable.TableToolbarMenu = TableToolbarMenu;

package/es/internal/useAnnouncer.js

@@ -1,21 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 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.
- */
-
-function useAnnouncer(textCount, maxCount) {
-  let entityName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'characters';
-  const remaining = maxCount - textCount;
-  if (remaining <= 10 && remaining > 0) {
-    const entity = remaining === 1 ? entityName.slice(0, -1) : entityName;
-    return `${remaining} ${entity} left.`;
-  }
-  if (remaining <= 0) {
-    return `Maximum ${entityName} reached.`;
-  }
-  return null;
-}
-
-export { useAnnouncer };

package/lib/components/ContentSwitcher/index.js

@@ -1,18 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 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.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var createClassWrapper = require('../../internal/createClassWrapper.js');
-var ContentSwitcher$1 = require('./ContentSwitcher.js');
-
-const ContentSwitcher = createClassWrapper.createClassWrapper(ContentSwitcher$1["default"]);
-
-exports.ContentSwitcher = ContentSwitcher;
-exports["default"] = ContentSwitcher;

package/lib/components/DataTable/index.js

@@ -1,82 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 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.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var DataTable = require('./DataTable.js');
-var Table = require('./Table.js');
-var TableActionList = require('./TableActionList.js');
-var TableBatchAction = require('./TableBatchAction.js');
-var TableBatchActions = require('./TableBatchActions.js');
-var TableBody = require('./TableBody.js');
-var TableCell = require('./TableCell.js');
-var TableContainer = require('./TableContainer.js');
-var TableExpandHeader = require('./TableExpandHeader.js');
-var TableDecoratorRow = require('./TableDecoratorRow.js');
-var TableExpandRow = require('./TableExpandRow.js');
-var TableExpandedRow = require('./TableExpandedRow.js');
-var TableHead = require('./TableHead.js');
-var TableHeader = require('./TableHeader.js');
-var TableRow = require('./TableRow.js');
-var TableSelectAll = require('./TableSelectAll.js');
-var TableSelectRow = require('./TableSelectRow.js');
-var TableSlugRow = require('./TableSlugRow.js');
-var TableToolbar = require('./TableToolbar.js');
-var TableToolbarAction = require('./TableToolbarAction.js');
-var TableToolbarContent = require('./TableToolbarContent.js');
-var TableToolbarSearch = require('./TableToolbarSearch.js');
-var TableToolbarMenu = require('./TableToolbarMenu.js');
-
-DataTable["default"].Table = Table.Table;
-DataTable["default"].TableActionList = TableActionList["default"];
-DataTable["default"].TableBatchAction = TableBatchAction["default"];
-DataTable["default"].TableBatchActions = TableBatchActions["default"];
-DataTable["default"].TableBody = TableBody["default"];
-DataTable["default"].TableCell = TableCell["default"];
-DataTable["default"].TableContainer = TableContainer["default"];
-DataTable["default"].TableDecoratorRow = TableDecoratorRow["default"];
-DataTable["default"].TableExpandHeader = TableExpandHeader["default"];
-DataTable["default"].TableExpandRow = TableExpandRow["default"];
-DataTable["default"].TableExpandedRow = TableExpandedRow["default"];
-DataTable["default"].TableHead = TableHead["default"];
-DataTable["default"].TableHeader = TableHeader["default"];
-DataTable["default"].TableRow = TableRow["default"];
-DataTable["default"].TableSelectAll = TableSelectAll["default"];
-DataTable["default"].TableSelectRow = TableSelectRow["default"];
-DataTable["default"].TableSlugRow = TableSlugRow["default"];
-DataTable["default"].TableToolbar = TableToolbar["default"];
-DataTable["default"].TableToolbarAction = TableToolbarAction["default"];
-DataTable["default"].TableToolbarContent = TableToolbarContent["default"];
-DataTable["default"].TableToolbarSearch = TableToolbarSearch["default"];
-DataTable["default"].TableToolbarMenu = TableToolbarMenu["default"];
-
-exports.DataTable = DataTable["default"];
-exports["default"] = DataTable["default"];
-exports.Table = Table.Table;
-exports.TableActionList = TableActionList["default"];
-exports.TableBatchAction = TableBatchAction["default"];
-exports.TableBatchActions = TableBatchActions["default"];
-exports.TableBody = TableBody["default"];
-exports.TableCell = TableCell["default"];
-exports.TableContainer = TableContainer["default"];
-exports.TableExpandHeader = TableExpandHeader["default"];
-exports.TableDecoratorRow = TableDecoratorRow["default"];
-exports.TableExpandRow = TableExpandRow["default"];
-exports.TableExpandedRow = TableExpandedRow["default"];
-exports.TableHead = TableHead["default"];
-exports.TableHeader = TableHeader["default"];
-exports.TableRow = TableRow["default"];
-exports.TableSelectAll = TableSelectAll["default"];
-exports.TableSelectRow = TableSelectRow["default"];
-exports.TableSlugRow = TableSlugRow["default"];
-exports.TableToolbar = TableToolbar["default"];
-exports.TableToolbarAction = TableToolbarAction["default"];
-exports.TableToolbarContent = TableToolbarContent["default"];
-exports.TableToolbarSearch = TableToolbarSearch["default"];
-exports.TableToolbarMenu = TableToolbarMenu["default"];

package/lib/internal/useAnnouncer.js

@@ -1,25 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 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.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-function useAnnouncer(textCount, maxCount) {
-  let entityName = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'characters';
-  const remaining = maxCount - textCount;
-  if (remaining <= 10 && remaining > 0) {
-    const entity = remaining === 1 ? entityName.slice(0, -1) : entityName;
-    return `${remaining} ${entity} left.`;
-  }
-  if (remaining <= 0) {
-    return `Maximum ${entityName} reached.`;
-  }
-  return null;
-}
-
-exports.useAnnouncer = useAnnouncer;