@carbon/react 1.110.0-rc.0 → 1.111.0-rc.0

package/lib/components/ComboBox/ComboBox.js

@@ -619,47 +619,187 @@ const ComboBox = (0, react.forwardRef)((props, ref) => {
 });
 ComboBox.displayName = "ComboBox";
 ComboBox.propTypes = {
+	/**
+	* Specify whether or not the ComboBox should allow a value that is
+	* not in the list to be entered in the input
+	*/
 	allowCustomValue: prop_types.default.bool,
+	/**
+	* 'aria-label' of the ListBox component.
+	* Specify a label to be read by screen readers on the container node
+	*/
 	["aria-label"]: prop_types.default.string,
+	/**
+	* Deprecated, please use `aria-label` instead.
+	* Specify a label to be read by screen readers on the container note.
+	* 'aria-label' of the ListBox component.
+	*/
 	ariaLabel: require_deprecate.deprecate(prop_types.default.string, "This prop syntax has been deprecated. Please use the new `aria-label`."),
+	/**
+	* **Experimental**: Will attempt to automatically align the floating
+	* element to avoid collisions with the viewport and being clipped by
+	* ancestor elements. Requires React v17+
+	* @see https://github.com/carbon-design-system/carbon/issues/18714
+	*/
 	autoAlign: prop_types.default.bool,
+	/**
+	* An optional className to add to the container node
+	*/
 	className: prop_types.default.string,
+	/**
+	* **Experimental**: Provide a decorator component to be rendered inside the `ComboBox` component
+	*/
 	decorator: prop_types.default.node,
+	/**
+	* Specify the direction of the combobox dropdown. Can be either top or bottom.
+	*/
 	direction: prop_types.default.oneOf(["top", "bottom"]),
+	/**
+	* Specify if the control should be disabled, or not
+	*/
 	disabled: prop_types.default.bool,
+	/**
+	* Additional props passed to Downshift.
+	*
+	* **Use with caution:** anything you define here overrides the components'
+	* internal handling of that prop. Downshift APIs and internals are subject to
+	* change, and in some cases they can not be shimmed by Carbon to shield you
+	* from potentially breaking changes.
+	*/
 	downshiftProps: prop_types.default.object,
+	/**
+	* Provide a ref that will be mutated to contain an object of downshift
+	* action functions. These can be called to change the internal state of the
+	* downshift useCombobox hook.
+	*
+	* **Use with caution:** calling these actions modifies the internal state of
+	* downshift. It may conflict with or override the state management used within
+	* Combobox. Downshift APIs and internals are subject to change, and in some
+	* cases they can not be shimmed by Carbon to shield you from potentially breaking
+	* changes.
+	*/
 	downshiftActions: prop_types.default.exact({ current: prop_types.default.any }),
+	/**
+	* Provide helper text that is used alongside the control label for
+	* additional help
+	*/
 	helperText: prop_types.default.node,
+	/**
+	* Specify a custom `id` for the input
+	*/
 	id: prop_types.default.string.isRequired,
+	/**
+	* Allow users to pass in an arbitrary item or a string (in case their items are an array of strings)
+	* from their collection that are pre-selected
+	*/
 	initialSelectedItem: prop_types.default.oneOfType([
 		prop_types.default.object,
 		prop_types.default.string,
 		prop_types.default.number
 	]),
+	/**
+	* Specify if the currently selected value is invalid.
+	*/
 	invalid: prop_types.default.bool,
+	/**
+	* Message which is displayed if the value is invalid.
+	*/
 	invalidText: prop_types.default.node,
+	/**
+	* Renders an item as a custom React node instead of a string.
+	*/
 	itemToElement: prop_types.default.func,
+	/**
+	* Helper function passed to downshift that allows the library to render a
+	* given item to a string label. By default, it extracts the `label` field
+	* from a given item to serve as the item label in the list
+	*/
 	itemToString: prop_types.default.func,
+	/**
+	* We try to stay as generic as possible here to allow individuals to pass
+	* in a collection of whatever kind of data structure they prefer
+	*/
 	items: prop_types.default.array.isRequired,
+	/**
+	* should use "light theme" (white background)?
+	*/
 	light: require_deprecate.deprecate(prop_types.default.bool, "The `light` prop for `Combobox` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
+	/**
+	* `onChange` is a utility for this controlled component to communicate to a
+	* consuming component when a specific dropdown item is selected.
+	* `({ selectedItem }) => void`
+	* @param {{ selectedItem }}
+	*/
 	onChange: prop_types.default.func.isRequired,
+	/**
+	* Callback function to notify consumer when the text input changes.
+	* This provides support to change available items based on the text.
+	* `(inputText) => void`
+	* @param {string} inputText
+	*/
 	onInputChange: prop_types.default.func,
+	/**
+	* Callback function that fires when the combobox menu toggle is clicked
+	* `(evt) => void`
+	* @param {MouseEvent} event
+	*/
 	onToggleClick: prop_types.default.func,
+	/**
+	* Used to provide a placeholder text node before a user enters any input.
+	* This is only present if the control has no items selected
+	*/
 	placeholder: prop_types.default.string,
+	/**
+	* Is the ComboBox readonly?
+	*/
 	readOnly: prop_types.default.bool,
+	/**
+	* For full control of the selection
+	*/
 	selectedItem: prop_types.default.oneOfType([
 		prop_types.default.object,
 		prop_types.default.string,
 		prop_types.default.number
 	]),
+	/**
+	* Specify your own filtering logic by passing in a `shouldFilterItem`
+	* function that takes in the current input and an item and passes back
+	* whether or not the item should be filtered.
+	* this prop will be ignored if `typeahead` prop is enabled
+	*/
 	shouldFilterItem: prop_types.default.func,
+	/**
+	* Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
+	*/
 	size: require_ListBoxPropTypes.ListBoxSizePropType,
 	slug: require_deprecate.deprecate(prop_types.default.node, "The `slug` prop has been deprecated and will be removed in the next major version. Use the decorator prop instead."),
+	/**
+	* Provide text to be used in a `<label>` element that is tied to the
+	* combobox via ARIA attributes.
+	*/
 	titleText: prop_types.default.node,
+	/**
+	* Translates component strings using your i18n tool.
+	*/
 	translateWithId: prop_types.default.func,
+	/**
+	* **Experimental**: will enable autocomplete and typeahead for the input field
+	*/
 	typeahead: prop_types.default.bool,
+	/**
+	* Specify whether the control is currently in warning state
+	*/
 	warn: prop_types.default.bool,
+	/**
+	* Provide the text that is displayed when the control is in warning state
+	*/
 	warnText: prop_types.default.node,
+	/**
+	* Specify native input attributes to place on the `<input>`, like maxLength.
+	* These are passed to downshift's getInputProps() and will override the
+	* internal input props.
+	* https://github.com/downshift-js/downshift?tab=readme-ov-file#getinputprops
+	*/
 	inputProps: prop_types.default.object
 };
 //#endregion

package/lib/components/ComboButton/index.js

@@ -126,10 +126,25 @@ const ComboButton = react.default.forwardRef(function ComboButton({ children, cl
 	});
 });
 ComboButton.propTypes = {
+	/**
+	* A collection of MenuItems to be rendered as additional actions for this ComboButton.
+	*/
 	children: prop_types.default.node.isRequired,
+	/**
+	* Additional CSS class names.
+	*/
 	className: prop_types.default.string,
+	/**
+	* Specify whether the ComboButton should be disabled, or not.
+	*/
 	disabled: prop_types.default.bool,
+	/**
+	* Provide the label to be rendered on the primary action button.
+	*/
 	label: prop_types.default.string.isRequired,
+	/**
+	* Experimental property. Specify how the menu should align with the button element
+	*/
 	menuAlignment: prop_types.default.oneOf([
 		"top",
 		"top-start",
@@ -138,13 +153,22 @@ ComboButton.propTypes = {
 		"bottom-start",
 		"bottom-end"
 	]),
+	/**
+	* Provide an optional function to be called when the primary action element is clicked.
+	*/
 	onClick: prop_types.default.func,
+	/**
+	* Specify the size of the buttons and menu.
+	*/
 	size: prop_types.default.oneOf([
 		"xs",
 		"sm",
 		"md",
 		"lg"
 	]),
+	/**
+	* Specify how the trigger tooltip should be aligned.
+	*/
 	tooltipAlignment: require_deprecateValuesWithin.deprecateValuesWithin(prop_types.default.oneOf([
 		"top",
 		"top-left",
@@ -180,6 +204,9 @@ ComboButton.propTypes = {
 		"right-start",
 		"right-end"
 	], require_mapPopoverAlign.mapPopoverAlign),
+	/**
+	* Translates component strings using your i18n tool.
+	*/
 	translateWithId: prop_types.default.func
 };
 //#endregion

package/lib/components/ComposedModal/ComposedModal.js

@@ -72,11 +72,30 @@ const ModalBody = react.default.forwardRef(function ModalBody({ ["aria-label"]:
 	});
 });
 ModalBody.propTypes = {
+	/**
+	* Specify the aria-label for the modal body when it is scrollable
+	*/
 	["aria-label"]: prop_types.default.string,
+	/**
+	* Specify the aria-labelledby for the modal body when it is scrollable
+	*/
 	["aria-labelledby"]: prop_types.default.string,
+	/**
+	* Specify the content to be placed in the ModalBody
+	*/
 	children: prop_types.default.node,
+	/**
+	* Specify an optional className to be added to the Modal Body node
+	*/
 	className: prop_types.default.string,
+	/**
+	* Provide whether the modal content has a form element.
+	* If `true` is used here, non-form child content should have `cds--modal-content__regular-content` class.
+	*/
 	hasForm: prop_types.default.bool,
+	/**
+	* Specify whether the modal contains scrolling content
+	*/
 	hasScrollingContent: prop_types.default.bool
 };
 const ComposedModal = react.default.forwardRef(function ComposedModal({ open, ...props }, ref) {
@@ -321,21 +340,70 @@ const ComposedModalDialog = react.default.forwardRef(function ComposedModalDialo
 	});
 });
 ComposedModal.propTypes = {
+	/**
+	* Specify the aria-label for cds--modal-container
+	*/
 	["aria-label"]: prop_types.default.string,
+	/**
+	* Specify the aria-labelledby for cds--modal-container
+	*/
 	["aria-labelledby"]: prop_types.default.string,
+	/**
+	* Specify the content to be placed in the ComposedModal
+	*/
 	children: prop_types.default.node,
+	/**
+	* Specify an optional className to be applied to the modal root node
+	*/
 	className: prop_types.default.string,
+	/**
+	* Specify an optional className to be applied to the modal node
+	*/
 	containerClassName: prop_types.default.string,
+	/**
+	* Specify whether the primary button should be replaced with danger button.
+	* Note that this prop is not applied if you render primary/danger button by yourself
+	*/
 	danger: prop_types.default.bool,
+	/**
+	* **Experimental**: Provide a `decorator` component to be rendered inside the `ComposedModal` component
+	*/
 	decorator: prop_types.default.node,
+	/**
+	* Specify whether the Modal content should have any inner padding.
+	*/
 	isFullWidth: prop_types.default.bool,
+	/**
+	* Provide a ref to return focus to once the modal is closed.
+	*/
 	launcherButtonRef: prop_types.default.oneOfType([prop_types.default.func, prop_types.default.shape({ current: prop_types.default.any })]),
+	/**
+	* Specify an optional handler for closing modal.
+	* Returning `false` here prevents closing modal.
+	*/
 	onClose: prop_types.default.func,
+	/**
+	* Specify an optional handler for the `onKeyDown` event. Called for all
+	* `onKeyDown` events that do not close the modal
+	*/
 	onKeyDown: prop_types.default.func,
+	/**
+	* Specify whether the Modal is currently open
+	*/
 	open: prop_types.default.bool,
 	preventCloseOnClickOutside: prop_types.default.bool,
+	/**
+	* Specify a CSS selector that matches the DOM element that should be
+	* focused when the Modal opens
+	*/
 	selectorPrimaryFocus: prop_types.default.string,
+	/**
+	* Specify the CSS selectors that match the floating menus
+	*/
 	selectorsFloatingMenus: prop_types.default.arrayOf(prop_types.default.string.isRequired),
+	/**
+	* Specify the size variant.
+	*/
 	size: prop_types.default.oneOf([
 		"xs",
 		"sm",

package/lib/components/ComposedModal/ComposedModalContext.js

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-require("../../_virtual/_rolldown/runtime.js");
 //#region src/components/ComposedModal/ComposedModalContext.ts
 /**
 * Copyright IBM Corp. 2026

package/lib/components/ComposedModal/ModalFooter.js

@@ -105,27 +105,87 @@ const ModalFooter = react.default.forwardRef(function ModalFooter({ children, cl
 	});
 });
 ModalFooter.propTypes = {
+	/**
+	* Pass in content that will be rendered in the Modal Footer
+	*/
 	children: prop_types.default.node,
+	/**
+	* Specify a custom className to be applied to the Modal Footer container
+	*/
 	className: prop_types.default.string,
+	/**
+	* Specify an optional function that is called whenever the modal is closed
+	*/
 	closeModal: prop_types.default.func,
+	/**
+	* Specify whether the primary button should be replaced with danger button.
+	* Note that this prop is not applied if you render primary/danger button by yourself
+	*/
 	danger: prop_types.default.bool,
+	/**
+	* Specify the message read by screen readers for the danger primary button.
+	* Defaults to an empty string; provide localized text to opt in.
+	*/
 	dangerDescription: prop_types.default.string,
+	/**
+	* The `ref` callback for the primary button.
+	*/
 	inputref: prop_types.default.oneOfType([prop_types.default.func, prop_types.default.shape({ current: prop_types.default.any })]),
+	/**
+	* Specify the description for the loading text
+	*/
 	loadingDescription: prop_types.default.string,
+	/**
+	* Specify the description for the loading text
+	*/
 	loadingIconDescription: prop_types.default.string,
+	/**
+	* loading status
+	*/
 	loadingStatus: prop_types.default.oneOf([
 		"inactive",
 		"active",
 		"finished",
 		"error"
 	]),
+	/**
+	* Provide an optional handler to be invoked when loading is
+	* successful
+	*/
 	onLoadingSuccess: prop_types.default.func,
+	/**
+	* Specify an optional function for when the modal is requesting to be
+	* closed
+	*/
 	onRequestClose: prop_types.default.func,
+	/**
+	* Specify an optional function for when the modal is requesting to be
+	* submitted
+	*/
 	onRequestSubmit: prop_types.default.func,
+	/**
+	* Specify whether the primary button should be disabled
+	*/
 	primaryButtonDisabled: prop_types.default.bool,
+	/**
+	* Specify the text for the primary button
+	*/
 	primaryButtonText: prop_types.default.string,
+	/**
+	* Specify a custom className to be applied to the primary button
+	*/
 	primaryClassName: prop_types.default.string,
+	/**
+	* Specify the text for the secondary button
+	*/
 	secondaryButtonText: prop_types.default.string,
+	/**
+	* Specify an array of config objects for secondary buttons
+	* (`Array<{
+	*   buttonText: string,
+	*   onClick: function,
+	* }>`).
+	*/
 	secondaryButtons: (props, propName, componentName) => {
 		if (props.secondaryButtons) {
 			if (!Array.isArray(props.secondaryButtons) || props.secondaryButtons.length !== 2) return /* @__PURE__ */ new Error(`${propName} needs to be an array of two button config objects`);
@@ -139,6 +199,9 @@ ModalFooter.propTypes = {
 		}
 		return null;
 	},
+	/**
+	* Specify a custom className to be applied to the secondary button
+	*/
 	secondaryClassName: prop_types.default.string
 };
 //#endregion

package/lib/components/ComposedModal/ModalHeader.js

@@ -96,16 +96,51 @@ const ModalHeader = react.default.forwardRef(function ModalHeader({ buttonOnClic
 	});
 });
 ModalHeader.propTypes = {
+	/**
+	* Provide an optional function to be called when the close button is
+	* clicked
+	*/
 	buttonOnClick: prop_types.default.func,
+	/**
+	* Specify the content to be placed in the ModalHeader
+	*/
 	children: prop_types.default.node,
+	/**
+	* Specify an optional className to be applied to the modal header
+	*/
 	className: prop_types.default.string,
+	/**
+	* Specify an optional className to be applied to the modal close node
+	*/
 	closeClassName: prop_types.default.string,
+	/**
+	* Specify an optional className to be applied to the modal close icon node
+	*/
 	closeIconClassName: prop_types.default.string,
+	/**
+	* Provide an optional function to be called when the modal is closed
+	*/
 	closeModal: prop_types.default.func,
+	/**
+	* Specify a description for the close icon that can be read by screen
+	* readers
+	*/
 	iconDescription: prop_types.default.string,
+	/**
+	* Specify an optional label to be displayed
+	*/
 	label: prop_types.default.string,
+	/**
+	* Specify an optional className to be applied to the modal header label
+	*/
 	labelClassName: prop_types.default.string,
+	/**
+	* Specify an optional title to be displayed
+	*/
 	title: prop_types.default.node,
+	/**
+	* Specify an optional className to be applied to the modal heading
+	*/
 	titleClassName: prop_types.default.string
 };
 //#endregion

package/lib/components/ComposedModal/useComposedModalState.js

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-require("../../_virtual/_rolldown/runtime.js");
 let react = require("react");
 //#region src/components/ComposedModal/useComposedModalState.ts
 /**

package/lib/components/ContainedList/ContainedList.js

@@ -79,12 +79,33 @@ const ContainedList = ({ action, children, className, isInset, kind = variants[0
 	});
 };
 ContainedList.propTypes = {
+	/**
+	* A slot for a possible interactive element to render.
+	*/
 	action: prop_types.default.node,
+	/**
+	* A collection of ContainedListItems to be rendered in the ContainedList
+	*/
 	children: prop_types.default.node,
+	/**
+	* Additional CSS class names.
+	*/
 	className: prop_types.default.string,
+	/**
+	* Specify whether the dividing lines in between list items should be inset.
+	*/
 	isInset: prop_types.default.bool,
+	/**
+	* The kind of ContainedList you want to display
+	*/
 	kind: prop_types.default.oneOf(variants),
+	/**
+	* A label describing the contained list.
+	*/
 	label: prop_types.default.oneOfType([prop_types.default.string, prop_types.default.node]),
+	/**
+	* Specify the size of the contained list.
+	*/
 	size: prop_types.default.oneOf([
 		"sm",
 		"md",

package/lib/components/ContainedList/ContainedListItem/ContainedListItem.js

@@ -57,11 +57,29 @@ const ContainedListItem = ({ action, children, className, disabled = false, onCl
 	});
 };
 ContainedListItem.propTypes = {
+	/**
+	* A slot for a possible interactive element to render within the item.
+	*/
 	action: prop_types.default.node,
+	/**
+	* The content of this item. Must not contain any interactive elements. Use props.action to include those.
+	*/
 	children: prop_types.default.node,
+	/**
+	* Additional CSS class names.
+	*/
 	className: prop_types.default.string,
+	/**
+	* Whether this item is disabled.
+	*/
 	disabled: prop_types.default.bool,
+	/**
+	* Provide an optional function to be called when the item is clicked.
+	*/
 	onClick: prop_types.default.func,
+	/**
+	* A component used to render an icon.
+	*/
 	renderIcon: prop_types.default.oneOfType([prop_types.default.func, prop_types.default.object])
 };
 //#endregion

package/lib/components/ContainedList/index.js

@@ -22,6 +22,6 @@ const require_ContainedList = require("./ContainedList.js");
 if (process.env.NODE_ENV !== "production") require_internal_deprecateFieldOnObject.deprecateFieldOnObject(require_ContainedList.default, "ContainedListItem", require_index.default);
 var ContainedList_default = require_ContainedList.default;
 //#endregion
-exports.ContainedList = require_ContainedList.default || require_ContainedList;
-exports.ContainedListItem = require_index.default || require_index;
+exports.ContainedList = require_ContainedList.default;
+exports.ContainedListItem = require_index.default;
 exports.default = ContainedList_default;

package/lib/components/ContentSwitcher/ContentSwitcher.js

@@ -113,13 +113,38 @@ const ContentSwitcher = ({ children, className, light, lowContrast, selectedInde
 };
 ContentSwitcher.displayName = "ContentSwitcher";
 ContentSwitcher.propTypes = {
+	/**
+	* Pass in Switch components to be rendered in the ContentSwitcher
+	*/
 	children: prop_types.default.node,
+	/**
+	* Specify an optional className to be added to the container node
+	*/
 	className: prop_types.default.string,
+	/**
+	* `true` to use the light variant.
+	*/
 	light: require_deprecate.deprecate(prop_types.default.bool, "The `light` prop for `ContentSwitcher` is no longer needed and has been deprecated. It will be removed in the next major release."),
+	/**
+	* `true` to use the low contrast version.
+	*/
 	lowContrast: prop_types.default.bool,
+	/**
+	* Specify an `onChange` handler that is called whenever the ContentSwitcher
+	* changes which item is selected
+	*/
 	onChange: prop_types.default.func.isRequired,
+	/**
+	* Specify a selected index for the initially selected content
+	*/
 	selectedIndex: prop_types.default.number,
+	/**
+	* Choose whether or not to automatically change selection on focus when left/right arrow pressed. Defaults to 'automatic'
+	*/
 	selectionMode: prop_types.default.oneOf(["automatic", "manual"]),
+	/**
+	* Specify the size of the Content Switcher. Currently supports either `sm`, `md` (default) or `lg` as an option.
+	*/
 	size: prop_types.default.oneOf([
 		"sm",
 		"md",

package/lib/components/ContextMenu/useContextMenu.js

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-require("../../_virtual/_rolldown/runtime.js");
 let react = require("react");
 //#region src/components/ContextMenu/useContextMenu.tsx
 /**

package/lib/components/Copy/Copy.js

@@ -63,6 +63,9 @@ function Copy({ align = "bottom", autoAlign = false, children, className, feedba
 	});
 }
 Copy.propTypes = {
+	/**
+	* Specify how the trigger should align with the tooltip
+	*/
 	align: require_deprecateValuesWithin.deprecateValuesWithin(prop_types.default.oneOf([
 		"top",
 		"top-left",
@@ -98,12 +101,38 @@ Copy.propTypes = {
 		"right-start",
 		"right-end"
 	], require_mapPopoverAlign.mapPopoverAlign),
+	/**
+	* **Experimental**: Will attempt to automatically align the tooltip. Requires
+	* React v17+
+	* @see https://github.com/carbon-design-system/carbon/issues/18714
+	*/
 	autoAlign: prop_types.default.bool,
+	/**
+	* Pass in content to be rendered in the underlying `<button>`
+	*/
 	children: prop_types.default.node,
+	/**
+	* Specify an optional className to be applied to the underlying `<button>`
+	*/
 	className: prop_types.default.string,
+	/**
+	* Specify the string that is displayed when the button is clicked and the
+	* content is copied
+	*/
 	feedback: prop_types.default.string,
+	/**
+	* Specify the time it takes for the feedback message to timeout
+	*/
 	feedbackTimeout: prop_types.default.number,
+	/**
+	* Specify an optional `onAnimationEnd` handler that is called when the underlying
+	* animation ends
+	*/
 	onAnimationEnd: prop_types.default.func,
+	/**
+	* Specify an optional `onClick` handler that is called when the underlying
+	* `<button>` is clicked
+	*/
 	onClick: prop_types.default.func
 };
 //#endregion