@carbon/react 1.106.0-rc.0 → 1.107.0-rc.0

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

@@ -13,7 +13,7 @@ declare const translationIds: {
     readonly 'carbon.table.toolbar.search.placeholder': "carbon.table.toolbar.search.placeholder";
 };
 type TranslationKey = keyof typeof translationIds;
-type ExcludedInheritedProps = 'defaultValue' | 'labelText' | 'onBlur' | 'onChange' | 'onExpand' | 'onFocus' | 'tabIndex';
+type ExcludedInheritedProps = 'defaultValue' | 'labelText' | 'onBlur' | 'onChange' | 'onExpand' | 'onFocus' | 'tabIndex' | 'size';
 export type TableToolbarSearchHandleExpand = (event: FocusEvent<HTMLInputElement>, newValue?: boolean) => void;
 /**
  * @deprecated Passing `''` as the event sentinel is legacy compatibility
@@ -69,6 +69,10 @@ export interface TableToolbarSearchProps extends Omit<SearchProps, ExcludedInher
      * Provide an optional className for the overall container of the Search
      */
     searchContainerClass?: string;
+    /**
+     * Specify the size of the Search
+     */
+    size?: 'sm' | 'md' | 'lg';
     tabIndex?: number | string;
 }
 declare const TableToolbarSearch: {

package/lib/components/DatePicker/DatePicker.js

@@ -45,6 +45,7 @@ function initializeWeekdayShorthand() {
 	});
 }
 const forEach = Array.prototype.forEach;
+const defaultAriaDateFormat = "l, F j, Y";
 /**
 * @param {number} monthNumber The month number.
 * @param {boolean} shorthand `true` to use shorthand month.
@@ -170,7 +171,6 @@ const DatePicker = (0, react.forwardRef)((props, ref) => {
 	const lastFocusedField = (0, react.useRef)(null);
 	const savedOnChange = require_useSavedCallback.useSavedCallback(onChange);
 	const savedOnOpen = require_useSavedCallback.useSavedCallback(onOpen);
-	const effectiveWarn = warn && !invalid;
 	const wrapperRef = (0, react.useRef)(null);
 	const datePickerClasses = (0, classnames.default)(`${prefix}--date-picker`, {
 		[`${prefix}--date-picker--short`]: short,
@@ -182,31 +182,35 @@ const DatePicker = (0, react.forwardRef)((props, ref) => {
 	});
 	const wrapperClasses = (0, classnames.default)(`${prefix}--form-item`, { [String(className)]: className });
 	const childrenWithProps = react.default.Children.toArray(children).map((child, index) => {
+		const childInvalid = child.props?.invalid;
+		const childWarn = child.props?.warn;
+		const mergedInvalid = invalid ?? childInvalid;
+		const mergedWarn = mergedInvalid ? false : warn ?? childWarn;
 		if (index === 0 && require_utils.isComponentElement(child, require_index.default)) return react.default.cloneElement(child, {
 			datePickerType,
 			ref: startInputField,
 			readOnly,
-			invalid,
-			warn: effectiveWarn
+			invalid: mergedInvalid,
+			warn: mergedWarn
 		});
 		if (index === 1 && require_utils.isComponentElement(child, require_index.default)) return react.default.cloneElement(child, {
 			datePickerType,
 			ref: endInputField,
 			readOnly,
-			invalid,
-			warn: effectiveWarn
+			invalid: mergedInvalid,
+			warn: mergedWarn
 		});
 		if (index === 0) return react.default.cloneElement(child, {
 			ref: startInputField,
 			readOnly,
-			invalid,
-			warn: effectiveWarn
+			invalid: mergedInvalid,
+			warn: mergedWarn
 		});
 		if (index === 1) return react.default.cloneElement(child, {
 			ref: endInputField,
 			readOnly,
-			invalid,
-			warn: effectiveWarn
+			invalid: mergedInvalid,
+			warn: mergedWarn
 		});
 	});
 	(0, react.useEffect)(() => {
@@ -261,6 +265,7 @@ const DatePicker = (0, react.forwardRef)((props, ref) => {
 			inline: inline ?? false,
 			onClose: onCalendarClose,
 			disableMobile: true,
+			ariaDateFormat: defaultAriaDateFormat,
 			defaultDate: value,
 			closeOnSelect,
 			mode: datePickerType,
@@ -345,7 +350,6 @@ const DatePicker = (0, react.forwardRef)((props, ref) => {
 			const { target } = event;
 			if (target === start) lastStartValue.current = start.value;
 			if (start.value !== "") return;
-			if (!calendar.selectedDates) return;
 			if (calendar.selectedDates.length === 0) return;
 		}
 		function handleKeyPress(event) {
@@ -427,9 +431,7 @@ const DatePicker = (0, react.forwardRef)((props, ref) => {
 	}, [value, startInputField]);
 	(0, react.useEffect)(() => {
 		if (calendarRef.current?.set) {
-			if (value !== void 0) if (value === "" || value === null || Array.isArray(value) && (value.length === 0 || value.every(require_utils$1.isEmptyDateValue))) {
-				if (calendarRef.current.selectedDates.length > 0) calendarRef.current.clear();
-			} else calendarRef.current.setDate(value);
+			if (!require_utils$1.isEmptyDateValue(value) && (!Array.isArray(value) || value.length > 0 && !value.every(require_utils$1.isEmptyDateValue))) calendarRef.current.setDate(value);
 			updateClassNames(calendarRef.current, prefix);
 		} else if (!calendarRef.current && typeof value !== "undefined" && value !== null) startInputField.current.value = value;
 	}, [

package/lib/components/DatePicker/plugins/fixEventsPlugin.js

@@ -52,8 +52,7 @@ const fixEventsPlugin = (config) => (fp) => {
 				if (inputTo === target && fp.config.closeOnSelect) requestAnimationFrame(() => {
 					fp.close();
 				});
-			} else if (require_match.match(event, require_keys.ArrowLeft) || require_match.match(event, require_keys.ArrowRight)) event.stopPropagation();
-			else if (require_match.match(event, require_keys.ArrowDown)) {
+			} else if (require_match.match(event, require_keys.ArrowDown)) {
 				event.preventDefault();
 				fp.open();
 			} else if (!fp.config.allowInput) {

package/lib/components/DatePickerInput/DatePickerInput.js

@@ -84,15 +84,22 @@ const DatePickerInput = (0, react.forwardRef)((props, ref) => {
 		[`${prefix}--date-picker--fluid--warn`]: isFluid && normalizedProps.warn
 	});
 	const datePickerInputHelperId = !helperText ? void 0 : `datepicker-input-helper-text-${datePickerInputInstanceId}`;
+	let ariaDescribedBy;
+	if (normalizedProps.invalid) ariaDescribedBy = normalizedProps.invalidId;
+	else if (normalizedProps.warn) ariaDescribedBy = normalizedProps.warnId;
+	else ariaDescribedBy = helperText ? datePickerInputHelperId : void 0;
 	const inputProps = {
 		...rest,
 		...datePickerInputProps,
 		className: inputClasses,
 		disabled: normalizedProps.disabled,
 		ref,
-		["aria-describedby"]: helperText ? datePickerInputHelperId : void 0
+		["aria-describedby"]: ariaDescribedBy
 	};
-	if (normalizedProps.invalid) inputProps["data-invalid"] = true;
+	if (normalizedProps.invalid) {
+		inputProps["data-invalid"] = true;
+		inputProps["aria-invalid"] = true;
+	}
 	const input = /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", { ...inputProps });
 	const candidate = slug ?? decorator;
 	const normalizedDecorator = require_utils.isComponentElement(candidate, require_index.AILabel) ? (0, react.cloneElement)(candidate, { size: "mini" }) : candidate;

package/lib/components/Dropdown/Dropdown.d.ts

@@ -152,7 +152,7 @@ export type DropdownTranslationKey = ListBoxMenuIconTranslationKey;
 interface DropdownComponent {
     <ItemType>(props: DropdownProps<ItemType> & {
         ref?: Ref<HTMLButtonElement>;
-    }): React.ReactElement<any> | null;
+    }): React.ReactElement | null;
 }
 declare const _default: DropdownComponent;
 export default _default;

package/lib/components/FluidTimePicker/FluidTimePicker.d.ts

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

package/lib/components/FluidTimePicker/FluidTimePicker.js

@@ -7,7 +7,9 @@
 
 const require_runtime = require("../../_virtual/_rolldown/runtime.js");
 const require_usePrefix = require("../../internal/usePrefix.js");
+const require_utils = require("../../internal/utils.js");
 const require_index = require("../FluidTextInput/index.js");
+const require_index$1 = require("../FluidTimePickerSelect/index.js");
 let classnames = require("classnames");
 classnames = require_runtime.__toESM(classnames);
 let react = require("react");
@@ -18,7 +20,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 let _carbon_icons_react = require("@carbon/icons-react");
 //#region src/components/FluidTimePicker/FluidTimePicker.tsx
 /**
-* Copyright IBM Corp. 2022
+* Copyright IBM Corp. 2022, 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.
@@ -38,8 +40,8 @@ const FluidTimePicker = react.default.forwardRef(({ className, children, disable
 	};
 	const error = invalid || warn;
 	const childrenWithProps = () => {
-		if (disabled) return react.default.Children.toArray(children).map((child) => react.default.cloneElement(child, { disabled: true }));
-		if (readOnly) return react.default.Children.toArray(children).map((child) => react.default.cloneElement(child, { readOnly: true }));
+		if (disabled) return react.default.Children.toArray(children).map((child) => require_utils.isComponentElement(child, require_index$1.default) ? (0, react.cloneElement)(child, { disabled: true }) : child);
+		if (readOnly) return react.default.Children.toArray(children).map((child) => require_utils.isComponentElement(child, require_index$1.default) ? (0, react.cloneElement)(child, { readOnly: true }) : child);
 		return children;
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {

package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.d.ts

@@ -36,6 +36,10 @@ export interface FluidTimePickerSelectProps {
      * the underlying `<input>` changes
      */
     onChange?: React.ChangeEventHandler<HTMLSelectElement>;
+    /**
+     * Whether the component is read-only.
+     */
+    readOnly?: boolean;
 }
 declare const FluidTimePickerSelect: React.ForwardRefExoticComponent<FluidTimePickerSelectProps & React.RefAttributes<HTMLSelectElement>>;
 export default FluidTimePickerSelect;

package/lib/components/FluidTimePickerSelect/FluidTimePickerSelect.js

@@ -34,7 +34,8 @@ FluidTimePickerSelect.propTypes = {
 	disabled: prop_types.default.bool,
 	id: prop_types.default.string.isRequired,
 	labelText: prop_types.default.node,
-	onChange: prop_types.default.func
+	onChange: prop_types.default.func,
+	readOnly: prop_types.default.bool
 };
 //#endregion
 exports.default = FluidTimePickerSelect;

package/lib/components/FluidTimePickerSelect/index.js

@@ -0,0 +1,17 @@
+/**
+ * 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/components/FluidTimePickerSelect/index.tsx
+/**
+* Copyright IBM Corp. 2022
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+var FluidTimePickerSelect_default = require("./FluidTimePickerSelect.js").default;
+//#endregion
+exports.default = FluidTimePickerSelect_default;

package/lib/components/Grid/CSSGrid.js

@@ -22,7 +22,7 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * 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 CSSGrid = react.default.forwardRef(({ align, as, children, className: customClassName, condensed = false, fullWidth = false, narrow = false, ...rest }, ref) => {
+const CSSGrid = react.default.forwardRef(({ align, as, children, className: customClassName, condensed = false, fullWidth = false, narrow = false, withRowGap, ...rest }, ref) => {
 	const prefix = require_usePrefix.usePrefix();
 	const { subgrid } = require_GridContext.useGridSettings();
 	let mode = "wide";
@@ -36,6 +36,7 @@ const CSSGrid = react.default.forwardRef(({ align, as, children, className: cust
 			as,
 			className: customClassName,
 			mode,
+			withRowGap,
 			...rest,
 			children
 		})
@@ -46,7 +47,8 @@ const CSSGrid = react.default.forwardRef(({ align, as, children, className: cust
 		[`${prefix}--css-grid--narrow`]: mode === "narrow",
 		[`${prefix}--css-grid--full-width`]: fullWidth,
 		[`${prefix}--css-grid--start`]: align === "start",
-		[`${prefix}--css-grid--end`]: align === "end"
+		[`${prefix}--css-grid--end`]: align === "end",
+		[`${prefix}--css-grid--with-row-gap`]: withRowGap
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_GridContext.GridSettings, {
 		mode: "css-grid",
@@ -70,15 +72,17 @@ CSSGrid.propTypes = {
 	className: prop_types.default.string,
 	condensed: prop_types.default.bool,
 	fullWidth: prop_types.default.bool,
-	narrow: prop_types.default.bool
+	narrow: prop_types.default.bool,
+	withRowGap: prop_types.default.bool
 };
-const Subgrid = react.default.forwardRef(({ as, className: customClassName, children, mode, ...rest }, ref) => {
+const Subgrid = react.default.forwardRef(({ as, className: customClassName, children, mode, withRowGap, ...rest }, ref) => {
 	const prefix = require_usePrefix.usePrefix();
 	const className = (0, classnames.default)(customClassName, {
 		[`${prefix}--subgrid`]: true,
 		[`${prefix}--subgrid--condensed`]: mode === "condensed",
 		[`${prefix}--subgrid--narrow`]: mode === "narrow",
-		[`${prefix}--subgrid--wide`]: mode === "wide"
+		[`${prefix}--subgrid--wide`]: mode === "wide",
+		[`${prefix}--subgrid--with-row-gap`]: withRowGap
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(as || "div", {
 		...rest,
@@ -95,7 +99,8 @@ Subgrid.propTypes = {
 		"wide",
 		"narrow",
 		"condensed"
-	])
+	]),
+	withRowGap: prop_types.default.bool
 };
 const CSSGridComponent = CSSGrid;
 //#endregion

package/lib/components/Grid/Column.d.ts

@@ -4,7 +4,7 @@
  * 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 React, { type ReactElement } from 'react';
 import { PolymorphicComponentPropWithRef } from '../../internal/PolymorphicProps';
 type ColumnSpanPercent = '25%' | '50%' | '75%' | '100%';
 type ColumnSpanSimple = boolean | number | ColumnSpanPercent;
@@ -67,7 +67,7 @@ export interface ColumnBaseProps {
 }
 export type ColumnProps<T extends React.ElementType> = PolymorphicComponentPropWithRef<T, ColumnBaseProps>;
 export interface ColumnComponent {
-    <T extends React.ElementType>(props: ColumnProps<T>, context?: any): React.ReactElement<any, any> | null;
+    <T extends React.ElementType>(props: ColumnProps<T>, context?: any): ReactElement | null;
 }
 declare const _default: ColumnComponent;
 export default _default;

package/lib/components/Grid/ColumnHang.d.ts

@@ -1,10 +1,10 @@
 /**
- * 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 React from 'react';
+import React, { type ReactElement } from 'react';
 import { PolymorphicProps } from '../../types/common';
 interface ColumnHangBaseProps {
     /**
@@ -18,7 +18,7 @@ interface ColumnHangBaseProps {
 }
 export type ColumnHangProps<T extends React.ElementType> = PolymorphicProps<T, ColumnHangBaseProps>;
 export interface ColumnHangComponent {
-    <T extends React.ElementType>(props: ColumnHangProps<T>, context?: any): React.ReactElement<any, any> | null;
+    <T extends React.ElementType>(props: ColumnHangProps<T>, context?: any): ReactElement | null;
 }
 declare const ColumnHangComponent: ColumnHangComponent;
 export { ColumnHangComponent as ColumnHang };

package/lib/components/Grid/ColumnHang.js

@@ -16,7 +16,7 @@ prop_types = require_runtime.__toESM(prop_types);
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/Grid/ColumnHang.tsx
 /**
-* 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.

package/lib/components/Grid/FlexGrid.js

@@ -22,13 +22,14 @@ let react_jsx_runtime = require("react/jsx-runtime");
 * 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 FlexGrid = react.default.forwardRef(({ as, condensed = false, narrow = false, fullWidth = false, className: containerClassName, children, ...rest }, ref) => {
+const FlexGrid = react.default.forwardRef(({ as, condensed = false, narrow = false, fullWidth = false, withRowGap = false, className: containerClassName, children, ...rest }, ref) => {
 	const prefix = require_usePrefix.usePrefix();
 	const className = (0, classnames.default)(containerClassName, {
 		[`${prefix}--grid`]: true,
 		[`${prefix}--grid--condensed`]: condensed,
 		[`${prefix}--grid--narrow`]: narrow,
-		[`${prefix}--grid--full-width`]: fullWidth
+		[`${prefix}--grid--full-width`]: fullWidth,
+		[`${prefix}--grid--with-row-gap`]: withRowGap
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_GridContext.GridSettings, {
 		mode: "flexbox",
@@ -47,7 +48,8 @@ FlexGrid.propTypes = {
 	className: prop_types.default.string,
 	condensed: prop_types.default.bool,
 	fullWidth: prop_types.default.bool,
-	narrow: prop_types.default.bool
+	narrow: prop_types.default.bool,
+	withRowGap: prop_types.default.bool
 };
 const FlexGridComponent = FlexGrid;
 //#endregion

package/lib/components/Grid/Grid.js

@@ -36,7 +36,8 @@ Grid.propTypes = {
 	className: prop_types.default.string,
 	condensed: prop_types.default.bool,
 	fullWidth: prop_types.default.bool,
-	narrow: prop_types.default.bool
+	narrow: prop_types.default.bool,
+	withRowGap: prop_types.default.bool
 };
 const GridAsGridComponent = Grid;
 //#endregion

package/lib/components/Grid/GridTypes.d.ts

@@ -33,6 +33,11 @@ export interface GridBaseProps {
      * typographic alignment with and without containers.
      */
     narrow?: boolean;
+    /**
+     * Add a row gap to the grid that matches the current gutter size.
+     * This is useful when you want consistent vertical spacing between rows.
+     */
+    withRowGap?: boolean;
 }
 export type GridProps<T extends React.ElementType> = PolymorphicComponentPropWithRef<T, GridBaseProps>;
 export interface GridComponent {

package/lib/components/Grid/Row.d.ts

@@ -1,10 +1,10 @@
 /**
- * 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 React from 'react';
+import React, { type ReactElement } from 'react';
 import { PolymorphicProps } from '../../types/common';
 export interface RowBaseProps {
     /**
@@ -28,7 +28,7 @@ export interface RowBaseProps {
 }
 export type RowProps<T extends React.ElementType> = PolymorphicProps<T, RowBaseProps>;
 export interface RowComponent {
-    <T extends React.ElementType>(props: RowProps<T>, context?: any): React.ReactElement<any, any> | null;
+    <T extends React.ElementType>(props: RowProps<T>, context?: any): ReactElement | null;
 }
 declare const _default: RowComponent;
 export default _default;

package/lib/components/Grid/Row.js

@@ -16,7 +16,7 @@ prop_types = require_runtime.__toESM(prop_types);
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/Grid/Row.tsx
 /**
-* 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.

package/lib/components/Menu/Menu.js

@@ -112,7 +112,7 @@ const Menu = (0, react.forwardRef)(function Menu({ backgroundToken = "layer", bo
 		}
 	}
 	function handleBlur(e) {
-		if (open && onClose && isRoot && e.relatedTarget && !menu.current?.contains(e.relatedTarget)) handleClose();
+		if (open && onClose && isRoot && !menu.current?.contains(e.relatedTarget)) handleClose();
 	}
 	function fitValue(range, axis) {
 		if (!menu.current) return;

package/lib/components/Menu/MenuItem.js

@@ -88,6 +88,9 @@ const MenuItem = (0, react.forwardRef)(function MenuItem({ children, className,
 	}
 	const pendingKeyboardClick = (0, react.useRef)(false);
 	const keyboardClickEvent = (e) => require_match.match(e, require_keys.Enter) || require_match.match(e, require_keys.Space);
+	function handleMouseDown(e) {
+		if (isDisabled) e.preventDefault();
+	}
 	function handleKeyDown(e) {
 		if (hasChildren && require_match.match(e, require_keys.ArrowRight)) {
 			openSubmenu();
@@ -142,6 +145,7 @@ const MenuItem = (0, react.forwardRef)(function MenuItem({ children, className,
 			"aria-disabled": isDisabled ?? void 0,
 			"aria-haspopup": hasChildren ?? void 0,
 			"aria-expanded": hasChildren ? submenuOpen : void 0,
+			onMouseDown: handleMouseDown,
 			onClick: handleClick,
 			onKeyDown: handleKeyDown,
 			onKeyUp: handleKeyUp,

package/lib/components/Modal/Modal.js

@@ -140,6 +140,9 @@ const ModalDialog = react.default.forwardRef(function ModalDialog({ "aria-label"
 		}
 		const modalContent = document.querySelector(`.${prefix}--modal-content`);
 		if (!modalContent || !modalContent.classList.contains(`${prefix}--modal-scroll-content`) || !currentActiveNode || !modalContent.contains(currentActiveNode)) return;
+		const modalRect = modalContent.getBoundingClientRect();
+		const elementRect = currentActiveNode.getBoundingClientRect();
+		if (elementRect.top >= modalRect.top && elementRect.bottom <= modalRect.bottom) return;
 		currentActiveNode.scrollIntoView({ block: "center" });
 	}
 	const onSecondaryButtonClick = onSecondarySubmit ? onSecondarySubmit : onRequestClose;

package/lib/components/MultiSelect/FilterableMultiSelect.d.ts

@@ -195,7 +195,7 @@ export interface FilterableMultiSelectProps<ItemType> extends MultiSelectSorting
     inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
 }
 export declare const FilterableMultiSelect: {
-    <ItemType>(props: FilterableMultiSelectProps<ItemType>): ReactElement<any>;
+    <ItemType>(props: FilterableMultiSelectProps<ItemType>): ReactElement;
     propTypes?: any;
     contextTypes?: any;
     defaultProps?: any;

package/lib/components/MultiSelect/FilterableMultiSelect.js

@@ -14,6 +14,7 @@ const require_useId = require("../../internal/useId.js");
 const require_deprecate = require("../../prop-types/deprecate.js");
 const require_defaultItemToString = require("../../internal/defaultItemToString.js");
 const require_utils = require("../../internal/utils.js");
+const require_hasHelperText = require("../../internal/hasHelperText.js");
 const require_useNormalizedInputProps = require("../../internal/useNormalizedInputProps.js");
 const require_index = require("../AILabel/index.js");
 const require_index$1 = require("../Checkbox/index.js");
@@ -181,7 +182,7 @@ const FilterableMultiSelect = (0, react.forwardRef)(function FilterableMultiSele
 		[`${prefix}--list-box__wrapper--decorator`]: decorator,
 		[`${prefix}--autoalign`]: autoAlign
 	});
-	const hasHelper = typeof helperText !== "undefined" && helperText !== null;
+	const hasHelper = require_hasHelperText.hasHelperText(helperText);
 	const helperId = !hasHelper ? void 0 : `filterablemultiselect-helper-text-${filterableMultiSelectInstanceId}`;
 	const labelId = `${id}-label`;
 	const titleClasses = (0, classnames.default)({
@@ -400,7 +401,7 @@ const FilterableMultiSelect = (0, react.forwardRef)(function FilterableMultiSele
 	});
 	const inputProp = getInputProps(getDropdownProps({
 		"aria-controls": isOpen ? menuId : void 0,
-		"aria-describedby": helperText && showHelperText ? helperId : void 0,
+		"aria-describedby": hasHelper && showHelperText ? helperId : void 0,
 		"aria-haspopup": "listbox",
 		"aria-labelledby": void 0,
 		disabled,

package/lib/components/MultiSelect/MultiSelect.d.ts

@@ -178,6 +178,6 @@ type MultiSelectComponentProps<ItemType> = React.PropsWithChildren<MultiSelectPr
 interface MultiSelectComponent {
     propTypes: Record<string, any>;
     displayName: string;
-    <ItemType>(props: MultiSelectComponentProps<ItemType>): React.ReactElement<any> | null;
+    <ItemType>(props: MultiSelectComponentProps<ItemType>): React.ReactElement | null;
 }
 export {};

package/lib/components/OverflowMenu/OverflowMenu.js

@@ -13,9 +13,11 @@ const require_setupGetInstanceId = require("../../tools/setupGetInstanceId.js");
 const require_noopFn = require("../../internal/noopFn.js");
 const require_deprecate = require("../../prop-types/deprecate.js");
 const require_deprecateValuesWithin = require("../../prop-types/deprecateValuesWithin.js");
+const require_utils = require("../../internal/utils.js");
 const require_mapPopoverAlign = require("../../tools/mapPopoverAlign.js");
 const require_index = require("../IconButton/index.js");
 const require_mergeRefs = require("../../tools/mergeRefs.js");
+const require_OverflowMenuItem = require("../OverflowMenuItem/OverflowMenuItem.js");
 const require_FloatingMenu = require("../../internal/FloatingMenu.js");
 const require_useOutsideClick = require("../../internal/useOutsideClick.js");
 let classnames = require("classnames");
@@ -227,17 +229,14 @@ const OverflowMenu = (0, react.forwardRef)(({ align, ["aria-label"]: ariaLabel =
 	});
 	const overflowMenuIconClasses = (0, classnames.default)(`${prefix}--overflow-menu__icon`, iconClass);
 	const childrenWithProps = react.Children.toArray(children).map((child, index) => {
-		if ((0, react.isValidElement)(child)) {
-			const childElement = child;
-			return (0, react.cloneElement)(childElement, {
-				closeMenu: childElement.props.closeMenu || closeMenuAndFocus,
-				handleOverflowMenuItemFocus,
-				ref: (el) => {
-					menuItemRefs.current[index] = el;
-				},
-				index
-			});
-		}
+		if (require_utils.isComponentElement(child, require_OverflowMenuItem.default)) return (0, react.cloneElement)(child, {
+			closeMenu: child.props.closeMenu || closeMenuAndFocus,
+			handleOverflowMenuItemFocus,
+			ref: (el) => {
+				menuItemRefs.current[index] = el;
+			},
+			index
+		});
 		return null;
 	});
 	const wrappedMenuBody = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FloatingMenu.FloatingMenu, {

package/lib/components/Pagination/Pagination.d.ts

@@ -96,7 +96,7 @@ export interface PaginationProps extends Omit<React.HTMLAttributes<HTMLDivElemen
     /**
      * Specify the size of the Pagination.
      */
-    size?: 'sm' | 'md' | 'lg';
+    size?: 'xs' | 'sm' | 'md' | 'lg';
     /**
      * The total number of items.
      */

package/lib/components/Pagination/Pagination.js

@@ -75,6 +75,7 @@ const Pagination = react.default.forwardRef(({ backwardText = "Previous page", c
 	const className = (0, classnames.default)({
 		[`${prefix}--pagination`]: true,
 		[`${prefix}--pagination--${size}`]: size,
+		[`${prefix}--layout--size-${size}`]: size,
 		[customClassName]: !!customClassName
 	});
 	const totalPages = totalItems ? Math.max(Math.ceil(totalItems / pageSize), 1) : 1;
@@ -292,6 +293,7 @@ Pagination.propTypes = {
 	pageText: prop_types.default.func,
 	pagesUnknown: prop_types.default.bool,
 	size: prop_types.default.oneOf([
+		"xs",
 		"sm",
 		"md",
 		"lg"

package/lib/components/Popover/index.js

@@ -41,6 +41,18 @@ const Popover = react.default.forwardRef(function PopoverRenderFunction({ isTabT
 	const popover = (0, react.useRef)(null);
 	const enableFloatingStyles = require_index.useFeatureFlag("enable-v12-dynamic-floating-styles") || autoAlign;
 	const lastClickWasInsidePopoverContent = (0, react.useRef)(false);
+	const isTargetInDatePickerInsidePopover = (target) => {
+		if (!popover.current) return false;
+		const calendar = target instanceof Element && target.closest(".flatpickr-calendar");
+		if (!calendar) return false;
+		const inputs = popover.current.querySelectorAll("input");
+		for (const input of inputs) {
+			if (!("_flatpickr" in input)) continue;
+			const fp = input._flatpickr;
+			if (fp && typeof fp === "object" && "calendarContainer" in fp && fp.calendarContainer === calendar) return true;
+		}
+		return false;
+	};
 	let align = require_mapPopoverAlign.mapPopoverAlign(initialAlign);
 	require_useEvent.useEvent(popover, "mousedown", (event) => {
 		const target = event.target;
@@ -58,13 +70,14 @@ const Popover = react.default.forwardRef(function PopoverRenderFunction({ isTabT
 			}
 			onRequestClose?.();
 		} else if (relatedTarget && !popover.current?.contains(relatedTarget)) {
+			if (isTargetInDatePickerInsidePopover(relatedTarget)) return;
 			const isOutsideFloating = enableFloatingStyles && refs.floating.current ? !refs.floating.current.contains(relatedTarget) : true;
 			const isFocusableWrapper = relatedTarget && popover.current && relatedTarget.contains(popover.current);
 			if (isOutsideFloating && !isFocusableWrapper) onRequestClose?.();
 		}
 	});
 	require_useEvent.useWindowEvent("click", ({ target }) => {
-		if (open && target instanceof Node && !popover.current?.contains(target)) onRequestClose?.();
+		if (open && target instanceof Node && !popover.current?.contains(target) && !isTargetInDatePickerInsidePopover(target)) onRequestClose?.();
 	});
 	const popoverDimensions = (0, react.useRef)({
 		offset: 10,

package/lib/components/RadioButtonGroup/RadioButtonGroup.d.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { type ReactNode } from 'react';
-import type { RadioButtonProps } from '../RadioButton';
+import { type RadioButtonProps } from '../RadioButton';
 export declare const RadioButtonGroupContext: React.Context<null>;
 type ExcludedAttributes = 'onChange';
 export interface RadioButtonGroupProps extends Omit<React.InputHTMLAttributes<HTMLFieldSetElement>, ExcludedAttributes> {