@carbon/react 1.109.0 → 1.110.0-rc.0

package/es/components/ComboBox/ComboBox.d.ts

@@ -162,7 +162,7 @@ export interface ComboBoxProps<ItemType> extends Omit<InputHTMLAttributes<HTMLIn
         inputValue: string | null;
     }) => boolean;
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/es/components/Dropdown/Dropdown.Skeleton.d.ts

@@ -35,7 +35,7 @@ declare const DropdownSkeleton: {
         /**
          * Specify the size of the ListBox.
          */
-        size: PropTypes.Requireable<"sm" | "md" | "lg">;
+        size: PropTypes.Requireable<"sm" | "md" | "lg" | "xs">;
     };
 };
 export default DropdownSkeleton;

package/es/components/Dropdown/Dropdown.d.ts

@@ -122,7 +122,7 @@ export interface DropdownProps<ItemType> extends Omit<HTMLAttributes<HTMLDivElem
      */
     selectedItem?: ItemType;
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/es/components/Link/Link.js

@@ -24,7 +24,8 @@ const Link = React.forwardRef(({ as: BaseComponent, children, className: customC
 			[`${prefix}--link--disabled`]: disabled,
 			[`${prefix}--link--inline`]: inline,
 			[`${prefix}--link--visited`]: visited,
-			[`${prefix}--link--${size}`]: size
+			[`${prefix}--link--${size}`]: size,
+			[`${prefix}--link--icon`]: Icon
 		}),
 		rel: target === "_blank" ? "noopener" : void 0,
 		target

package/es/components/ListBox/ListBox.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * 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.
@@ -37,7 +37,7 @@ export interface ListBoxProps extends Omit<HTMLAttributes<HTMLDivElement>, Exclu
      */
     light?: boolean;
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/es/components/ListBox/ListBox.js

@@ -15,7 +15,7 @@ import PropTypes from "prop-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/ListBox/ListBox.tsx
 /**
-* Copyright IBM Corp. 2016, 2025
+* 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.
@@ -40,6 +40,7 @@ const ListBox = forwardRef((props, ref) => {
 		...containerClassName && { [containerClassName]: true },
 		[`${prefix}--list-box`]: true,
 		[`${prefix}--list-box--${size}`]: size,
+		[`${prefix}--layout--size-${size}`]: size,
 		[`${prefix}--list-box--inline`]: type === "inline",
 		[`${prefix}--list-box--disabled`]: disabled,
 		[`${prefix}--list-box--light`]: light,

package/es/components/ListBox/ListBoxPropTypes.d.ts

@@ -1,14 +1,14 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * 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 PropTypes from 'prop-types';
 declare const listBoxTypes: readonly ["default", "inline"];
-declare const listBoxSizes: readonly ["sm", "md", "lg"];
+declare const listBoxSizes: readonly ["xs", "sm", "md", "lg"];
 export type ListBoxType = (typeof listBoxTypes)[number];
 export type ListBoxSize = (typeof listBoxSizes)[number];
 export declare const ListBoxTypePropType: PropTypes.Requireable<"default" | "inline">;
-export declare const ListBoxSizePropType: PropTypes.Requireable<"sm" | "md" | "lg">;
+export declare const ListBoxSizePropType: PropTypes.Requireable<"sm" | "md" | "lg" | "xs">;
 export {};

package/es/components/ListBox/ListBoxPropTypes.js

@@ -8,13 +8,14 @@
 import PropTypes from "prop-types";
 //#region src/components/ListBox/ListBoxPropTypes.ts
 /**
-* Copyright IBM Corp. 2016, 2025
+* 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 listBoxTypes = ["default", "inline"];
 const listBoxSizes = [
+	"xs",
 	"sm",
 	"md",
 	"lg"

package/es/components/MultiSelect/MultiSelect.d.ts

@@ -143,7 +143,7 @@ export interface MultiSelectProps<ItemType> extends MultiSelectSortingProps<Item
      */
     selectionFeedback?: 'fixed' | 'top' | 'top-after-reopen';
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/es/components/Slider/Slider.d.ts

@@ -153,11 +153,11 @@ export interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
      */
     unstable_valueUpper?: number;
     /**
-     * Specify whether the control is currently in warning state
+     * Specify whether the Slider is in a warning state.
      */
     warn?: boolean;
     /**
-     * Provide the text that is displayed when the control is in warning state
+     * Provide the text displayed when the Slider is in a warning state.
      */
     warnText?: ReactNode;
 }

package/es/components/Slider/Slider.js

@@ -59,6 +59,8 @@ const calcRawLeftPercent = ({ max, min, value }) => {
 };
 /**
 * Minimum time between processed "drag" events in milliseconds.
+*
+* A value of `16` limits updates to at most ~60 per second.
 */
 const EVENT_THROTTLE = 16;
 const DRAG_EVENT_TYPES = new Set(["mousemove", "touchmove"]);
@@ -96,6 +98,7 @@ const Slider = (props) => {
 	const generatedId = useId();
 	const prefix = usePrefix();
 	const twoHandles = hasUpperValue(state.valueUpper);
+	const getOwnerDocument = () => elementRef.current?.ownerDocument;
 	/**
 	* Sets up initial slider position and value in response to component mount.
 	*/
@@ -131,8 +134,9 @@ const Slider = (props) => {
 			}
 		}
 		return () => {
-			DRAG_STOP_EVENT_TYPES.forEach((element) => elementRef.current?.ownerDocument.removeEventListener(element, onDragStop));
-			DRAG_EVENT_TYPES.forEach((element) => elementRef.current?.ownerDocument.removeEventListener(element, handleDrag));
+			const ownerDocument = getOwnerDocument();
+			DRAG_STOP_EVENT_TYPES.forEach((type) => ownerDocument?.removeEventListener(type, onDragStop));
+			DRAG_EVENT_TYPES.forEach((type) => ownerDocument?.removeEventListener(type, handleDrag));
 		};
 	}, []);
 	useEffect(() => {
@@ -236,11 +240,12 @@ const Slider = (props) => {
 	const onDragStart = (evt) => {
 		if (disabled || readOnly) return;
 		evt.preventDefault();
-		DRAG_STOP_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.addEventListener(element, onDragStop);
+		const ownerDocument = getOwnerDocument();
+		DRAG_STOP_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.addEventListener(type, onDragStop);
 		});
-		DRAG_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.addEventListener(element, handleDrag);
+		DRAG_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.addEventListener(type, handleDrag);
 		});
 		const clientX = getClientXFromEvent(evt.nativeEvent);
 		let activeHandle;
@@ -264,11 +269,12 @@ const Slider = (props) => {
 	*/
 	const onDragStop = () => {
 		if (disabled || readOnly) return;
-		DRAG_STOP_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.removeEventListener(element, onDragStop);
+		const ownerDocument = getOwnerDocument();
+		DRAG_STOP_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.removeEventListener(type, onDragStop);
 		});
-		DRAG_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.removeEventListener(element, handleDrag);
+		DRAG_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.removeEventListener(type, handleDrag);
 		});
 		setState({ needsOnRelease: true });
 	};
@@ -284,8 +290,8 @@ const Slider = (props) => {
 	* @param activeHandle The first drag event call, we may have an explicit
 	* activeHandle value, which is to be used before state is used.
 	*/
-	const _onDragRef = useRef(null);
-	_onDragRef.current = (evt, activeHandle) => {
+	const onDragRef = useRef(null);
+	onDragRef.current = (evt, activeHandle) => {
 		activeHandle = activeHandle ?? stateRef.current.activeHandle;
 		if (disabled || readOnly) return;
 		const { value, left } = calcValue({
@@ -307,11 +313,11 @@ const Slider = (props) => {
 		});
 	};
 	/**
-	* Throttles calls to `_onDrag` by limiting events to being processed at
-	* most once every `EVENT_THROTTLE` milliseconds.
+	* Throttles drag event handling to at most once every `EVENT_THROTTLE`
+	* milliseconds.
 	*/
 	const onDrag = useMemo(() => throttle((evt, activeHandle) => {
-		_onDragRef.current?.(evt, activeHandle);
+		onDragRef.current?.(evt, activeHandle);
 	}, EVENT_THROTTLE, {
 		leading: true,
 		trailing: false
@@ -402,11 +408,7 @@ const Slider = (props) => {
 				value: targetValue,
 				min,
 				max
-			}) : getAdjustedValue({
-				value: targetValue,
-				min,
-				max
-			});
+			}) : clamp(targetValue, min, max);
 			if (adjustedValue !== targetValue) setState({
 				correctedValue: targetValue.toString(),
 				correctedPosition: handlePosition ?? null
@@ -430,7 +432,7 @@ const Slider = (props) => {
 		}
 	};
 	const calcLeftPercent = ({ clientX, value }) => {
-		const boundingRect = elementRef.current?.getBoundingClientRect?.();
+		const boundingRect = elementRef.current?.getBoundingClientRect();
 		let width = boundingRect ? boundingRect.right - boundingRect.left : 0;
 		const nextValue = value ?? min;
 		if (width <= 0) width = 1;
@@ -492,7 +494,7 @@ const Slider = (props) => {
 	*/
 	const calcValueForDelta = (currentValue, delta, step = 1) => {
 		const newValue = (delta > 0 ? Math.round(currentValue / step) * step : currentValue) + delta;
-		const decimals = (step.toString().split(".")[1] || "").length;
+		const decimals = (step.toString().split(".")[1] ?? "").length;
 		return Number(newValue.toFixed(decimals));
 	};
 	/**
@@ -538,19 +540,10 @@ const Slider = (props) => {
 	};
 	const getAdjustedValueForPosition = ({ handle, value: newValueInput, min, max }) => {
 		const { value, valueUpper } = state;
-		let newValue = getAdjustedValue({
-			value: newValueInput,
-			min,
-			max
-		});
-		if (handle === "lower" && valueUpper) newValue = newValue > valueUpper ? valueUpper : newValue;
-		else if (handle === "upper" && value) newValue = newValue < value ? value : newValue;
-		return newValue;
-	};
-	const getAdjustedValue = ({ value, min, max }) => {
-		if (value < min) value = min;
-		if (value > max) value = max;
-		return value;
+		const nextValue = clamp(newValueInput, min, max);
+		if (handle === "lower" && hasUpperValue(valueUpper)) return Math.min(nextValue, valueUpper);
+		if (handle === "upper") return Math.max(nextValue, value);
+		return nextValue;
 	};
 	/**
 	* Get the bounding rect for the requested handles' DOM element.

package/es/components/Tabs/Tabs.d.ts

@@ -254,6 +254,10 @@ declare namespace TabList {
          * to newly selected tabs on component rerender
          */
         scrollIntoView: PropTypes.Requireable<boolean>;
+        /**
+         * Specify the size of the tabs.
+         */
+        size: PropTypes.Requireable<string>;
     };
 }
 /**

package/es/components/Tabs/Tabs.js

@@ -161,7 +161,7 @@ function TabList({ activation = "automatic", "aria-label": label, children, clas
 		[`${prefix}--tabs__icon--default`]: iconSize === "default",
 		[`${prefix}--tabs__icon--lg`]: iconSize === "lg",
 		[`${prefix}--layout--size-lg`]: iconSize === "lg",
-		[`${prefix}--layout--size-${size}`]: size && contained && !hasSecondaryLabelTabs,
+		[`${prefix}--layout--size-${size}`]: size && !hasSecondaryLabelTabs,
 		[`${prefix}--tabs--tall`]: hasSecondaryLabelTabs,
 		[`${prefix}--tabs--full-width`]: distributeWidth,
 		[`${prefix}--tabs--dismissable`]: dismissable
@@ -342,7 +342,12 @@ TabList.propTypes = {
 	light: deprecate(PropTypes.bool, "The `light` prop for `TabList` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
 	rightOverflowButtonProps: PropTypes.object,
 	scrollDebounceWait: PropTypes.number,
-	scrollIntoView: PropTypes.bool
+	scrollIntoView: PropTypes.bool,
+	size: PropTypes.oneOf([
+		"sm",
+		"md",
+		"lg"
+	])
 };
 function TabListVertical({ activation = "automatic", "aria-label": label, children, className: customClassName, scrollIntoView, ...rest }) {
 	const { activeIndex, selectedIndex, setSelectedIndex, setActiveIndex } = React.useContext(TabsContext);

package/lib/components/ComboBox/ComboBox.d.ts

@@ -162,7 +162,7 @@ export interface ComboBoxProps<ItemType> extends Omit<InputHTMLAttributes<HTMLIn
         inputValue: string | null;
     }) => boolean;
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

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

@@ -35,7 +35,7 @@ declare const DropdownSkeleton: {
         /**
          * Specify the size of the ListBox.
          */
-        size: PropTypes.Requireable<"sm" | "md" | "lg">;
+        size: PropTypes.Requireable<"sm" | "md" | "lg" | "xs">;
     };
 };
 export default DropdownSkeleton;

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

@@ -122,7 +122,7 @@ export interface DropdownProps<ItemType> extends Omit<HTMLAttributes<HTMLDivElem
      */
     selectedItem?: ItemType;
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/lib/components/Link/Link.js

@@ -28,7 +28,8 @@ const Link = react.default.forwardRef(({ as: BaseComponent, children, className:
 			[`${prefix}--link--disabled`]: disabled,
 			[`${prefix}--link--inline`]: inline,
 			[`${prefix}--link--visited`]: visited,
-			[`${prefix}--link--${size}`]: size
+			[`${prefix}--link--${size}`]: size,
+			[`${prefix}--link--icon`]: Icon
 		}),
 		rel: target === "_blank" ? "noopener" : void 0,
 		target

package/lib/components/ListBox/ListBox.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * 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.
@@ -37,7 +37,7 @@ export interface ListBoxProps extends Omit<HTMLAttributes<HTMLDivElement>, Exclu
      */
     light?: boolean;
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/lib/components/ListBox/ListBox.js

@@ -19,7 +19,7 @@ prop_types = require_runtime.__toESM(prop_types);
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/ListBox/ListBox.tsx
 /**
-* Copyright IBM Corp. 2016, 2025
+* 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.
@@ -44,6 +44,7 @@ const ListBox = (0, react.forwardRef)((props, ref) => {
 		...containerClassName && { [containerClassName]: true },
 		[`${prefix}--list-box`]: true,
 		[`${prefix}--list-box--${size}`]: size,
+		[`${prefix}--layout--size-${size}`]: size,
 		[`${prefix}--list-box--inline`]: type === "inline",
 		[`${prefix}--list-box--disabled`]: disabled,
 		[`${prefix}--list-box--light`]: light,

package/lib/components/ListBox/ListBoxPropTypes.d.ts

@@ -1,14 +1,14 @@
 /**
- * Copyright IBM Corp. 2016, 2025
+ * 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 PropTypes from 'prop-types';
 declare const listBoxTypes: readonly ["default", "inline"];
-declare const listBoxSizes: readonly ["sm", "md", "lg"];
+declare const listBoxSizes: readonly ["xs", "sm", "md", "lg"];
 export type ListBoxType = (typeof listBoxTypes)[number];
 export type ListBoxSize = (typeof listBoxSizes)[number];
 export declare const ListBoxTypePropType: PropTypes.Requireable<"default" | "inline">;
-export declare const ListBoxSizePropType: PropTypes.Requireable<"sm" | "md" | "lg">;
+export declare const ListBoxSizePropType: PropTypes.Requireable<"sm" | "md" | "lg" | "xs">;
 export {};

package/lib/components/ListBox/ListBoxPropTypes.js

@@ -10,13 +10,14 @@ let prop_types = require("prop-types");
 prop_types = require_runtime.__toESM(prop_types);
 //#region src/components/ListBox/ListBoxPropTypes.ts
 /**
-* Copyright IBM Corp. 2016, 2025
+* 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 listBoxTypes = ["default", "inline"];
 const listBoxSizes = [
+	"xs",
 	"sm",
 	"md",
 	"lg"

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

@@ -143,7 +143,7 @@ export interface MultiSelectProps<ItemType> extends MultiSelectSortingProps<Item
      */
     selectionFeedback?: 'fixed' | 'top' | 'top-after-reopen';
     /**
-     * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
+     * Specify the size of the ListBox. Currently supports either `xs`, `sm`, `md` or `lg` as an option.
      */
     size?: ListBoxSize;
     /**

package/lib/components/Slider/Slider.d.ts

@@ -153,11 +153,11 @@ export interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
      */
     unstable_valueUpper?: number;
     /**
-     * Specify whether the control is currently in warning state
+     * Specify whether the Slider is in a warning state.
      */
     warn?: boolean;
     /**
-     * Provide the text that is displayed when the control is in warning state
+     * Provide the text displayed when the Slider is in a warning state.
      */
     warnText?: ReactNode;
 }

package/lib/components/Slider/Slider.js

@@ -63,6 +63,8 @@ const calcRawLeftPercent = ({ max, min, value }) => {
 };
 /**
 * Minimum time between processed "drag" events in milliseconds.
+*
+* A value of `16` limits updates to at most ~60 per second.
 */
 const EVENT_THROTTLE = 16;
 const DRAG_EVENT_TYPES = new Set(["mousemove", "touchmove"]);
@@ -100,6 +102,7 @@ const Slider = (props) => {
 	const generatedId = require_useId.useId();
 	const prefix = require_usePrefix.usePrefix();
 	const twoHandles = hasUpperValue(state.valueUpper);
+	const getOwnerDocument = () => elementRef.current?.ownerDocument;
 	/**
 	* Sets up initial slider position and value in response to component mount.
 	*/
@@ -135,8 +138,9 @@ const Slider = (props) => {
 			}
 		}
 		return () => {
-			DRAG_STOP_EVENT_TYPES.forEach((element) => elementRef.current?.ownerDocument.removeEventListener(element, onDragStop));
-			DRAG_EVENT_TYPES.forEach((element) => elementRef.current?.ownerDocument.removeEventListener(element, handleDrag));
+			const ownerDocument = getOwnerDocument();
+			DRAG_STOP_EVENT_TYPES.forEach((type) => ownerDocument?.removeEventListener(type, onDragStop));
+			DRAG_EVENT_TYPES.forEach((type) => ownerDocument?.removeEventListener(type, handleDrag));
 		};
 	}, []);
 	(0, react.useEffect)(() => {
@@ -240,11 +244,12 @@ const Slider = (props) => {
 	const onDragStart = (evt) => {
 		if (disabled || readOnly) return;
 		evt.preventDefault();
-		DRAG_STOP_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.addEventListener(element, onDragStop);
+		const ownerDocument = getOwnerDocument();
+		DRAG_STOP_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.addEventListener(type, onDragStop);
 		});
-		DRAG_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.addEventListener(element, handleDrag);
+		DRAG_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.addEventListener(type, handleDrag);
 		});
 		const clientX = getClientXFromEvent(evt.nativeEvent);
 		let activeHandle;
@@ -268,11 +273,12 @@ const Slider = (props) => {
 	*/
 	const onDragStop = () => {
 		if (disabled || readOnly) return;
-		DRAG_STOP_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.removeEventListener(element, onDragStop);
+		const ownerDocument = getOwnerDocument();
+		DRAG_STOP_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.removeEventListener(type, onDragStop);
 		});
-		DRAG_EVENT_TYPES.forEach((element) => {
-			elementRef.current?.ownerDocument.removeEventListener(element, handleDrag);
+		DRAG_EVENT_TYPES.forEach((type) => {
+			ownerDocument?.removeEventListener(type, handleDrag);
 		});
 		setState({ needsOnRelease: true });
 	};
@@ -288,8 +294,8 @@ const Slider = (props) => {
 	* @param activeHandle The first drag event call, we may have an explicit
 	* activeHandle value, which is to be used before state is used.
 	*/
-	const _onDragRef = (0, react.useRef)(null);
-	_onDragRef.current = (evt, activeHandle) => {
+	const onDragRef = (0, react.useRef)(null);
+	onDragRef.current = (evt, activeHandle) => {
 		activeHandle = activeHandle ?? stateRef.current.activeHandle;
 		if (disabled || readOnly) return;
 		const { value, left } = calcValue({
@@ -311,11 +317,11 @@ const Slider = (props) => {
 		});
 	};
 	/**
-	* Throttles calls to `_onDrag` by limiting events to being processed at
-	* most once every `EVENT_THROTTLE` milliseconds.
+	* Throttles drag event handling to at most once every `EVENT_THROTTLE`
+	* milliseconds.
 	*/
 	const onDrag = (0, react.useMemo)(() => (0, es_toolkit_compat.throttle)((evt, activeHandle) => {
-		_onDragRef.current?.(evt, activeHandle);
+		onDragRef.current?.(evt, activeHandle);
 	}, EVENT_THROTTLE, {
 		leading: true,
 		trailing: false
@@ -406,11 +412,7 @@ const Slider = (props) => {
 				value: targetValue,
 				min,
 				max
-			}) : getAdjustedValue({
-				value: targetValue,
-				min,
-				max
-			});
+			}) : require_clamp.clamp(targetValue, min, max);
 			if (adjustedValue !== targetValue) setState({
 				correctedValue: targetValue.toString(),
 				correctedPosition: handlePosition ?? null
@@ -434,7 +436,7 @@ const Slider = (props) => {
 		}
 	};
 	const calcLeftPercent = ({ clientX, value }) => {
-		const boundingRect = elementRef.current?.getBoundingClientRect?.();
+		const boundingRect = elementRef.current?.getBoundingClientRect();
 		let width = boundingRect ? boundingRect.right - boundingRect.left : 0;
 		const nextValue = value ?? min;
 		if (width <= 0) width = 1;
@@ -496,7 +498,7 @@ const Slider = (props) => {
 	*/
 	const calcValueForDelta = (currentValue, delta, step = 1) => {
 		const newValue = (delta > 0 ? Math.round(currentValue / step) * step : currentValue) + delta;
-		const decimals = (step.toString().split(".")[1] || "").length;
+		const decimals = (step.toString().split(".")[1] ?? "").length;
 		return Number(newValue.toFixed(decimals));
 	};
 	/**
@@ -542,19 +544,10 @@ const Slider = (props) => {
 	};
 	const getAdjustedValueForPosition = ({ handle, value: newValueInput, min, max }) => {
 		const { value, valueUpper } = state;
-		let newValue = getAdjustedValue({
-			value: newValueInput,
-			min,
-			max
-		});
-		if (handle === "lower" && valueUpper) newValue = newValue > valueUpper ? valueUpper : newValue;
-		else if (handle === "upper" && value) newValue = newValue < value ? value : newValue;
-		return newValue;
-	};
-	const getAdjustedValue = ({ value, min, max }) => {
-		if (value < min) value = min;
-		if (value > max) value = max;
-		return value;
+		const nextValue = require_clamp.clamp(newValueInput, min, max);
+		if (handle === "lower" && hasUpperValue(valueUpper)) return Math.min(nextValue, valueUpper);
+		if (handle === "upper") return Math.max(nextValue, value);
+		return nextValue;
 	};
 	/**
 	* Get the bounding rect for the requested handles' DOM element.

package/lib/components/Tabs/Tabs.d.ts

@@ -254,6 +254,10 @@ declare namespace TabList {
          * to newly selected tabs on component rerender
          */
         scrollIntoView: PropTypes.Requireable<boolean>;
+        /**
+         * Specify the size of the tabs.
+         */
+        size: PropTypes.Requireable<string>;
     };
 }
 /**

package/lib/components/Tabs/Tabs.js

@@ -165,7 +165,7 @@ function TabList({ activation = "automatic", "aria-label": label, children, clas
 		[`${prefix}--tabs__icon--default`]: iconSize === "default",
 		[`${prefix}--tabs__icon--lg`]: iconSize === "lg",
 		[`${prefix}--layout--size-lg`]: iconSize === "lg",
-		[`${prefix}--layout--size-${size}`]: size && contained && !hasSecondaryLabelTabs,
+		[`${prefix}--layout--size-${size}`]: size && !hasSecondaryLabelTabs,
 		[`${prefix}--tabs--tall`]: hasSecondaryLabelTabs,
 		[`${prefix}--tabs--full-width`]: distributeWidth,
 		[`${prefix}--tabs--dismissable`]: dismissable
@@ -346,7 +346,12 @@ TabList.propTypes = {
 	light: require_deprecate.deprecate(prop_types.default.bool, "The `light` prop for `TabList` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
 	rightOverflowButtonProps: prop_types.default.object,
 	scrollDebounceWait: prop_types.default.number,
-	scrollIntoView: prop_types.default.bool
+	scrollIntoView: prop_types.default.bool,
+	size: prop_types.default.oneOf([
+		"sm",
+		"md",
+		"lg"
+	])
 };
 function TabListVertical({ activation = "automatic", "aria-label": label, children, className: customClassName, scrollIntoView, ...rest }) {
 	const { activeIndex, selectedIndex, setSelectedIndex, setActiveIndex } = react.default.useContext(TabsContext);