@carbon/react 1.103.0-rc.0 → 1.104.0-rc.0

package/es/internal/Selection.js

@@ -1,145 +1,112 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * 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 { useRef, useState, useCallback, useEffect } from 'react';
-import isEqual from 'react-fast-compare';
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { Fragment, jsx } from "react/jsx-runtime";
+import isEqual from "react-fast-compare";
 
-const callOnChangeHandler = ({
-  isControlled,
-  isMounted,
-  onChangeHandlerControlled,
-  onChangeHandlerUncontrolled,
-  selectedItems
-}) => {
-  if (isControlled) {
-    if (isMounted && onChangeHandlerControlled) {
-      // Use setTimeout to defer the controlled onChange call,
-      // avoiding React’s warning: "Cannot update a component while rendering a different component".
-      // This ensures the parent state updates after rendering completes.
-      setTimeout(() => {
-        onChangeHandlerControlled({
-          selectedItems
-        });
-      }, 0);
-    }
-  } else {
-    onChangeHandlerUncontrolled(selectedItems);
-  }
+//#region src/internal/Selection.tsx
+/**
+* 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.
+*/
+const callOnChangeHandler = ({ isControlled, isMounted, onChangeHandlerControlled, onChangeHandlerUncontrolled, selectedItems }) => {
+	if (isControlled) {
+		if (isMounted && onChangeHandlerControlled) setTimeout(() => {
+			onChangeHandlerControlled({ selectedItems });
+		}, 0);
+	} else onChangeHandlerUncontrolled(selectedItems);
 };
-const useSelection = ({
-  disabled,
-  onChange,
-  initialSelectedItems = [],
-  selectedItems: controlledItems,
-  selectAll = false,
-  filteredItems = []
-}) => {
-  const isMounted = useRef(false);
-  const savedOnChange = useRef(onChange);
-  const [uncontrolledItems, setUncontrolledItems] = useState(initialSelectedItems);
-  const isControlled = !!controlledItems;
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452
-  const selectedItems = isControlled ? controlledItems : uncontrolledItems;
-  const onItemChange = useCallback(item => {
-    if (disabled) return;
-
-    // Assert special properties (e.g., `disabled`, `isSelectAll`, etc.) are
-    // `any` since those properties aren’t part of the generic type.
-    const allSelectableItems = filteredItems.filter(
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
-    item => !item?.disabled && !item?.isSelectAll);
-    const disabledItemCount = filteredItems.filter(
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
-    item => item?.disabled).length;
-    let newSelectedItems;
-
-    // deselect all on click to All/indeterminate option
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
-    if (item?.isSelectAll && selectedItems.length > 0) {
-      newSelectedItems = [];
-    }
-    // select all options
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
-    else if (item?.isSelectAll && selectedItems.length === 0) {
-      newSelectedItems = allSelectableItems;
-    } else {
-      const selectedIndex = selectedItems.findLastIndex(selectedItem => isEqual(selectedItem, item));
-      if (selectedIndex === -1) {
-        newSelectedItems = selectedItems.concat(item);
-        // checking if all items are selected then We should select mark the 'select All' option as well
-        if (selectAll && filteredItems.length - 1 === newSelectedItems.length + disabledItemCount) {
-          newSelectedItems = allSelectableItems;
-        }
-      } else {
-        newSelectedItems = removeAtIndex(selectedItems, selectedIndex);
-        newSelectedItems = newSelectedItems.filter(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452
-        item => !item?.isSelectAll);
-      }
-    }
-    callOnChangeHandler({
-      isControlled,
-      isMounted: isMounted.current,
-      onChangeHandlerControlled: savedOnChange.current,
-      onChangeHandlerUncontrolled: setUncontrolledItems,
-      selectedItems: newSelectedItems
-    });
-  }, [disabled, selectedItems, filteredItems, selectAll, isControlled]);
-  const clearSelection = useCallback(() => {
-    if (disabled) return;
-    callOnChangeHandler({
-      isControlled,
-      isMounted: isMounted.current,
-      onChangeHandlerControlled: savedOnChange.current,
-      onChangeHandlerUncontrolled: setUncontrolledItems,
-      selectedItems: []
-    });
-  }, [disabled, isControlled]);
-  const toggleAll = useCallback(items => {
-    callOnChangeHandler({
-      isControlled,
-      isMounted: isMounted.current,
-      onChangeHandlerControlled: savedOnChange.current,
-      onChangeHandlerUncontrolled: setUncontrolledItems,
-      selectedItems: items
-    });
-  }, [isControlled]);
-  useEffect(() => {
-    savedOnChange.current = onChange;
-  }, [onChange]);
-  useEffect(() => {
-    if (isMounted.current && savedOnChange.current && !isControlled) {
-      savedOnChange.current({
-        selectedItems
-      });
-    }
-  }, [isControlled, selectedItems]);
-  useEffect(() => {
-    isMounted.current = true;
-    return () => {
-      isMounted.current = false;
-    };
-  }, []);
-  return {
-    clearSelection,
-    onItemChange,
-    toggleAll,
-    selectedItems
-  };
+const useSelection = ({ disabled, onChange, initialSelectedItems = [], selectedItems: controlledItems, selectAll = false, filteredItems = [] }) => {
+	const isMounted = useRef(false);
+	const savedOnChange = useRef(onChange);
+	const [uncontrolledItems, setUncontrolledItems] = useState(initialSelectedItems);
+	const isControlled = !!controlledItems;
+	const selectedItems = isControlled ? controlledItems : uncontrolledItems;
+	const onItemChange = useCallback((item) => {
+		if (disabled) return;
+		const allSelectableItems = filteredItems.filter((item) => !item?.disabled && !item?.isSelectAll);
+		const disabledItemCount = filteredItems.filter((item) => item?.disabled).length;
+		let newSelectedItems;
+		if (item?.isSelectAll && selectedItems.length > 0) newSelectedItems = [];
+		else if (item?.isSelectAll && selectedItems.length === 0) newSelectedItems = allSelectableItems;
+		else {
+			const selectedIndex = selectedItems.findLastIndex((selectedItem) => isEqual(selectedItem, item));
+			if (selectedIndex === -1) {
+				newSelectedItems = selectedItems.concat(item);
+				if (selectAll && filteredItems.length - 1 === newSelectedItems.length + disabledItemCount) newSelectedItems = allSelectableItems;
+			} else {
+				newSelectedItems = removeAtIndex(selectedItems, selectedIndex);
+				newSelectedItems = newSelectedItems.filter((item) => !item?.isSelectAll);
+			}
+		}
+		callOnChangeHandler({
+			isControlled,
+			isMounted: isMounted.current,
+			onChangeHandlerControlled: savedOnChange.current,
+			onChangeHandlerUncontrolled: setUncontrolledItems,
+			selectedItems: newSelectedItems
+		});
+	}, [
+		disabled,
+		selectedItems,
+		filteredItems,
+		selectAll,
+		isControlled
+	]);
+	const clearSelection = useCallback(() => {
+		if (disabled) return;
+		callOnChangeHandler({
+			isControlled,
+			isMounted: isMounted.current,
+			onChangeHandlerControlled: savedOnChange.current,
+			onChangeHandlerUncontrolled: setUncontrolledItems,
+			selectedItems: []
+		});
+	}, [disabled, isControlled]);
+	const toggleAll = useCallback((items) => {
+		callOnChangeHandler({
+			isControlled,
+			isMounted: isMounted.current,
+			onChangeHandlerControlled: savedOnChange.current,
+			onChangeHandlerUncontrolled: setUncontrolledItems,
+			selectedItems: items
+		});
+	}, [isControlled]);
+	useEffect(() => {
+		savedOnChange.current = onChange;
+	}, [onChange]);
+	useEffect(() => {
+		if (isMounted.current && savedOnChange.current && !isControlled) savedOnChange.current({ selectedItems });
+	}, [isControlled, selectedItems]);
+	useEffect(() => {
+		isMounted.current = true;
+		return () => {
+			isMounted.current = false;
+		};
+	}, []);
+	return {
+		clearSelection,
+		onItemChange,
+		toggleAll,
+		selectedItems
+	};
 };
-
 /**
- * Generic utility for safely removing an element at a given index from an
- * array.
- */
+* Generic utility for safely removing an element at a given index from an
+* array.
+*/
 const removeAtIndex = (array, index) => {
-  const result = array.slice();
-  result.splice(index, 1);
-  return result;
+	const result = array.slice();
+	result.splice(index, 1);
+	return result;
 };
 
-export { useSelection };
+//#endregion
+export { useSelection };

package/es/internal/clamp.js

@@ -1,13 +1,21 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+//#region src/internal/clamp.ts
 /**
- * Clamps a number between a minimum and maximum value (inclusive).
- */
+* Copyright IBM Corp. 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.
+*/
+/**
+* Clamps a number between a minimum and maximum value (inclusive).
+*/
 const clamp = (num, min, max) => Math.min(max, Math.max(min, num));
 
-export { clamp };
+//#endregion
+export { clamp };

package/es/internal/defaultItemToString.js

@@ -1,17 +1,23 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-const defaultItemToString = item => {
-  if (typeof item === 'string') return item;
-  if (typeof item === 'number') return `${item}`;
-  if (item && typeof item === 'object' && 'label' in item && typeof item.label === 'string') {
-    return item.label;
-  }
-  return '';
+//#region src/internal/defaultItemToString.ts
+/**
+* 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.
+*/
+const defaultItemToString = (item) => {
+	if (typeof item === "string") return item;
+	if (typeof item === "number") return `${item}`;
+	if (item && typeof item === "object" && "label" in item && typeof item.label === "string") return item.label;
+	return "";
 };
 
-export { defaultItemToString };
+//#endregion
+export { defaultItemToString };

package/es/internal/deprecateFieldOnObject.js

@@ -1,24 +1,32 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * 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 { warning } from './warning.js';
+import { warning } from "./warning.js";
 
+//#region src/internal/deprecateFieldOnObject.ts
+/**
+* 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.
+*/
 const deprecateFieldOnObject = (object, field, Component, message) => {
-  const didWarnAboutDeprecation = {};
-  Object.defineProperty(object, field, {
-    enumerable: true,
-    get: () => {
-      if (!didWarnAboutDeprecation[field]) {
-        process.env.NODE_ENV !== "production" ? warning(false, `The ${field} field has been deprecated on the ${object.displayName} object. ` + `Please import and use ${Component.displayName || Component.name || 'the field'} directly.`) : void 0;
-        didWarnAboutDeprecation[field] = true;
-      }
-      return Component;
-    }
-  });
+	const didWarnAboutDeprecation = {};
+	Object.defineProperty(object, field, {
+		enumerable: true,
+		get: () => {
+			if (!didWarnAboutDeprecation[field]) {
+				warning(false, message || `The ${field} field has been deprecated on the ${object.displayName} object. Please import and use ${Component.displayName || Component.name || "the field"} directly.`);
+				didWarnAboutDeprecation[field] = true;
+			}
+			return Component;
+		}
+	});
 };
 
-export { deprecateFieldOnObject };
+//#endregion
+export { deprecateFieldOnObject };

package/es/internal/environment.js

@@ -1,15 +1,23 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+//#region src/internal/environment.ts
 /**
- * Indicate whether current execution environment can access the DOM.
- *
- * @see https://github.com/facebook/fbjs/blob/4d1751311d3f67af2dcce2e40df8512a23c7b9c6/packages/fbjs/src/core/ExecutionEnvironment.js#L12
- */
-const canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+* 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.
+*/
+/**
+* Indicate whether current execution environment can access the DOM.
+*
+* @see https://github.com/facebook/fbjs/blob/4d1751311d3f67af2dcce2e40df8512a23c7b9c6/packages/fbjs/src/core/ExecutionEnvironment.js#L12
+*/
+const canUseDOM = !!(typeof window !== "undefined" && window.document && window.document.createElement);
 
-export { canUseDOM };
+//#endregion
+export { canUseDOM };

package/es/internal/getAnnouncement.js

@@ -1,22 +1,25 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+//#region src/internal/getAnnouncement.ts
+/**
+* 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.
+*/
 /** Returns an announcement message when the remaining count is low. */
-const getAnnouncement = (count, maxCount, singularEntityName = 'character', pluralEntityName = 'characters') => {
-  if (typeof maxCount === 'undefined') return null;
-  const remaining = maxCount - count;
-  if (remaining <= 10 && remaining > 0) {
-    const entityName = remaining === 1 ? singularEntityName : pluralEntityName;
-    return `${remaining} ${entityName} left.`;
-  }
-  if (remaining <= 0) {
-    return `Maximum ${pluralEntityName} reached.`;
-  }
-  return null;
+const getAnnouncement = (count, maxCount, singularEntityName = "character", pluralEntityName = "characters") => {
+	if (typeof maxCount === "undefined") return null;
+	const remaining = maxCount - count;
+	if (remaining <= 10 && remaining > 0) return `${remaining} ${remaining === 1 ? singularEntityName : pluralEntityName} left.`;
+	if (remaining <= 0) return `Maximum ${pluralEntityName} reached.`;
+	return null;
 };
 
-export { getAnnouncement };
+//#endregion
+export { getAnnouncement };

package/es/internal/keyboard/keys.js

@@ -1,77 +1,77 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+//#region src/internal/keyboard/keys.ts
 const Tab = {
-  key: 'Tab',
-  which: 9,
-  keyCode: 9,
-  code: 'Tab'
+	key: "Tab",
+	which: 9,
+	keyCode: 9,
+	code: "Tab"
 };
 const Enter = {
-  key: 'Enter',
-  which: 13,
-  keyCode: 13,
-  code: 'Enter'
+	key: "Enter",
+	which: 13,
+	keyCode: 13,
+	code: "Enter"
 };
 const Escape = {
-  key: ['Escape',
-  // IE11 Escape
-  'Esc'],
-  which: 27,
-  keyCode: 27,
-  code: 'Esc'
+	key: ["Escape", "Esc"],
+	which: 27,
+	keyCode: 27,
+	code: "Esc"
 };
 const Space = {
-  key: ' ',
-  which: 32,
-  keyCode: 32,
-  code: 'Space'
+	key: " ",
+	which: 32,
+	keyCode: 32,
+	code: "Space"
 };
 const End = {
-  key: 'End',
-  which: 35,
-  keyCode: 35,
-  code: 'Numpad1'
+	key: "End",
+	which: 35,
+	keyCode: 35,
+	code: "Numpad1"
 };
 const Home = {
-  key: 'Home',
-  which: 36,
-  keyCode: 36,
-  code: 'Numpad7'
+	key: "Home",
+	which: 36,
+	keyCode: 36,
+	code: "Numpad7"
 };
 const ArrowLeft = {
-  key: 'ArrowLeft',
-  which: 37,
-  keyCode: 37,
-  code: 'ArrowLeft'
+	key: "ArrowLeft",
+	which: 37,
+	keyCode: 37,
+	code: "ArrowLeft"
 };
 const ArrowUp = {
-  key: 'ArrowUp',
-  which: 38,
-  keyCode: 38,
-  code: 'ArrowUp'
+	key: "ArrowUp",
+	which: 38,
+	keyCode: 38,
+	code: "ArrowUp"
 };
 const ArrowRight = {
-  key: 'ArrowRight',
-  which: 39,
-  keyCode: 39,
-  code: 'ArrowRight'
+	key: "ArrowRight",
+	which: 39,
+	keyCode: 39,
+	code: "ArrowRight"
 };
 const ArrowDown = {
-  key: 'ArrowDown',
-  which: 40,
-  keyCode: 40,
-  code: 'ArrowDown'
+	key: "ArrowDown",
+	which: 40,
+	keyCode: 40,
+	code: "ArrowDown"
 };
 const Delete = {
-  key: 'Delete',
-  which: 8,
-  keyCode: 8,
-  code: 'ArrowDecimal'
+	key: "Delete",
+	which: 8,
+	keyCode: 8,
+	code: "ArrowDecimal"
 };
 
-export { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Delete, End, Enter, Escape, Home, Space, Tab };
+//#endregion
+export { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Delete, End, Enter, Escape, Home, Space, Tab };

package/es/internal/keyboard/match.js

@@ -1,54 +1,37 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
+//#region src/internal/keyboard/match.ts
 /**
- * Check to see if at least one key code matches the key code of the
- * given event.
- *
- * @param event - The event to test.
- * @param keysToMatch - An array of key definitions to match against.
- * @returns `true` if one of the keys matches.
- */
+* Check to see if at least one key code matches the key code of the
+* given event.
+*
+* @param event - The event to test.
+* @param keysToMatch - An array of key definitions to match against.
+* @returns `true` if one of the keys matches.
+*/
 const matches = (event, keysToMatch) => {
-  for (let i = 0; i < keysToMatch.length; i++) {
-    if (match(event, keysToMatch[i])) {
-      return true;
-    }
-  }
-  return false;
+	for (let i = 0; i < keysToMatch.length; i++) if (match(event, keysToMatch[i])) return true;
+	return false;
 };
-
 /**
- * Check to see if the given key matches the corresponding keyboard event. Also
- * supports passing in the value directly if you can't use the given event.
- *
- * @param eventOrCode - A `KeyboardEvent`, a number, or a string value.
- * @param keyObj - An object with key properties to match against.
- * @returns `true` if the event or code matches the key definition.
- */
-const match = (eventOrCode, {
-  key,
-  which,
-  keyCode,
-  code
-}) => {
-  if (typeof eventOrCode === 'string') {
-    return eventOrCode === key;
-  }
-  if (typeof eventOrCode === 'number') {
-    return eventOrCode === which || eventOrCode === keyCode;
-  }
-  if (eventOrCode.key && Array.isArray(key)) {
-    return key.includes(eventOrCode.key);
-  }
-  return eventOrCode.key === key ||
-  // TODO: When can these checks for deprecated properties be deleted?
-  // Presumably, the `Key` type should also be pruned of these properties.
-  eventOrCode.which === which || eventOrCode.keyCode === keyCode || eventOrCode.code === code;
+* Check to see if the given key matches the corresponding keyboard event. Also
+* supports passing in the value directly if you can't use the given event.
+*
+* @param eventOrCode - A `KeyboardEvent`, a number, or a string value.
+* @param keyObj - An object with key properties to match against.
+* @returns `true` if the event or code matches the key definition.
+*/
+const match = (eventOrCode, { key, which, keyCode, code }) => {
+	if (typeof eventOrCode === "string") return eventOrCode === key;
+	if (typeof eventOrCode === "number") return eventOrCode === which || eventOrCode === keyCode;
+	if (eventOrCode.key && Array.isArray(key)) return key.includes(eventOrCode.key);
+	return eventOrCode.key === key || eventOrCode.which === which || eventOrCode.keyCode === keyCode || eventOrCode.code === code;
 };
 
-export { match, matches };
+//#endregion
+export { match, matches };