@carbon/react 1.109.0 → 1.110.0

package/es/components/Search/Search.js

@@ -5,19 +5,19 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { noopFn } from "../../internal/noopFn.js";
 import { usePrefix } from "../../internal/usePrefix.js";
 import { Enter, Escape, Space } from "../../internal/keyboard/keys.js";
 import { match } from "../../internal/keyboard/match.js";
 import { useId } from "../../internal/useId.js";
-import { noopFn } from "../../internal/noopFn.js";
 import { deprecate } from "../../prop-types/deprecate.js";
 import { useMergedRefs } from "../../internal/useMergedRefs.js";
 import { Tooltip } from "../Tooltip/Tooltip.js";
 import { composeEventHandlers } from "../../tools/events.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import { isSearchValuePresent } from "./utils.js";
-import classNames from "classnames";
 import React, { useContext, useEffect, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Close, Search } from "@carbon/icons-react";

package/es/components/Select/Select.Skeleton.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Select/Select.Skeleton.tsx

package/es/components/Select/Select.js

@@ -14,8 +14,8 @@ import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.
 import { AILabel } from "../AILabel/index.js";
 import { composeEventHandlers } from "../../tools/events.js";
 import { FormContext } from "../FluidForm/FormContext.js";
-import classNames from "classnames";
 import React, { cloneElement, forwardRef, useContext, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown, WarningAltFilled, WarningFilled } from "@carbon/icons-react";

package/es/components/SelectItem/SelectItem.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/SelectItem/SelectItem.tsx

package/es/components/SelectItemGroup/SelectItemGroup.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/SelectItemGroup/SelectItemGroup.tsx

package/es/components/ShapeIndicator/index.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import React from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Caution, CircleFill, CircleStroke, Critical, CriticalSeverity, DiamondFill, LowSeverity } from "@carbon/icons-react";

package/es/components/SkeletonIcon/SkeletonIcon.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/SkeletonIcon/SkeletonIcon.tsx

package/es/components/SkeletonPlaceholder/SkeletonPlaceholder.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/SkeletonPlaceholder/SkeletonPlaceholder.tsx

package/es/components/SkeletonText/SkeletonText.js

@@ -7,8 +7,8 @@
 
 import { usePrefix } from "../../internal/usePrefix.js";
 import useIsomorphicEffect from "../../internal/useIsomorphicEffect.js";
-import classNames from "classnames";
 import { useRef } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { Fragment, jsx } from "react/jsx-runtime";
 //#region src/components/SkeletonText/SkeletonText.tsx

package/es/components/Slider/Slider.Skeleton.js

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import useIsomorphicEffect from "../../internal/useIsomorphicEffect.js";
 import { LowerHandle, UpperHandle } from "./SliderHandles.js";
-import classNames from "classnames";
 import { useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Slider/Slider.Skeleton.tsx

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

@@ -15,8 +15,8 @@ import { Tooltip } from "../Tooltip/Tooltip.js";
 import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
 import { clamp } from "../../internal/clamp.js";
 import { LowerHandle, LowerHandleFocus, UpperHandle, UpperHandleFocus } from "./SliderHandles.js";
-import classNames from "classnames";
 import { useEffect, useMemo, useReducer, useRef } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { WarningAltFilled, WarningFilled } from "@carbon/icons-react";
@@ -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/Stack/Stack.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import { forwardRef } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 import { spacing } from "@carbon/layout";

package/es/components/StructuredList/StructuredList.Skeleton.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/StructuredList/StructuredList.Skeleton.tsx

package/es/components/StructuredList/StructuredList.js

@@ -10,8 +10,8 @@ import { Text } from "../Text/Text.js";
 import { useId } from "../../internal/useId.js";
 import { deprecate } from "../../prop-types/deprecate.js";
 import { useOutsideClick } from "../../internal/useOutsideClick.js";
-import classNames from "classnames";
 import React, { useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { RadioButton, RadioButtonChecked } from "@carbon/icons-react";

package/es/components/Switch/IconSwitch.js

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { usePrefix } from "../../internal/usePrefix.js";
 import { noopFn } from "../../internal/noopFn.js";
+import { usePrefix } from "../../internal/usePrefix.js";
 import { IconButton } from "../IconButton/index.js";
-import classNames from "classnames";
 import { forwardRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Switch/IconSwitch.tsx

package/es/components/Switch/Switch.js

@@ -5,10 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { usePrefix } from "../../internal/usePrefix.js";
 import { noopFn } from "../../internal/noopFn.js";
-import classNames from "classnames";
+import { usePrefix } from "../../internal/usePrefix.js";
 import React from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Switch/Switch.tsx

package/es/components/TabContent/TabContent.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/TabContent/TabContent.tsx

package/es/components/Tabs/Tabs.Skeleton.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Tabs/Tabs.Skeleton.tsx

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

@@ -194,6 +194,9 @@ export interface TabListProps extends DivAttributes {
     scrollIntoView?: boolean;
     /**
      * Specify the size of the tabs.
+     *
+     * Supports `sm` and `md` for line tabs.
+     * Supports `sm`, `md`, and `lg` for contained tabs.
      */
     size?: 'sm' | 'md' | 'lg';
 }
@@ -254,6 +257,13 @@ declare namespace TabList {
          * to newly selected tabs on component rerender
          */
         scrollIntoView: PropTypes.Requireable<boolean>;
+        /**
+         * Specify the size of the tabs.
+         *
+         * Supports `sm` and `md` for line tabs.
+         * Supports `sm`, `md`, and `lg` for contained tabs.
+         */
+        size: PropTypes.Requireable<string>;
     };
 }
 /**
@@ -284,8 +294,12 @@ export interface TabListVerticalProps extends DivAttributes {
      * on component rerender
      */
     scrollIntoView?: boolean;
+    /**
+     * Specify the size of the tabs.
+     */
+    size?: 'sm' | 'md' | 'lg' | 'xl';
 }
-declare function TabListVertical({ activation, 'aria-label': label, children, className: customClassName, scrollIntoView, ...rest }: TabListVerticalProps): import("react/jsx-runtime").JSX.Element;
+declare function TabListVertical({ activation, 'aria-label': label, children, className: customClassName, scrollIntoView, size, ...rest }: TabListVerticalProps): import("react/jsx-runtime").JSX.Element;
 declare namespace TabListVertical {
     var propTypes: {
         /**
@@ -307,6 +321,10 @@ declare namespace TabListVertical {
          * Specify an optional className to be added to the container node
          */
         className: PropTypes.Requireable<string>;
+        /**
+         * Specify the size of the tabs.
+         */
+        size: PropTypes.Requireable<string>;
     };
 }
 /**

package/es/components/Tabs/Tabs.js

@@ -21,8 +21,8 @@ import { useControllableState } from "../../internal/useControllableState.js";
 import { GridAsGridComponent } from "../Grid/Grid.js";
 import { useMatchMedia } from "../../internal/useMatchMedia.js";
 import { usePressable } from "./usePressable.js";
-import classNames from "classnames";
 import React, { Children, cloneElement, createContext, forwardRef, isValidElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { ChevronLeft, ChevronRight, Close } from "@carbon/icons-react";
@@ -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 && (contained || size === "sm" || size === "md"),
 		[`${prefix}--tabs--tall`]: hasSecondaryLabelTabs,
 		[`${prefix}--tabs--full-width`]: distributeWidth,
 		[`${prefix}--tabs--dismissable`]: dismissable
@@ -342,16 +342,21 @@ 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 }) {
+function TabListVertical({ activation = "automatic", "aria-label": label, children, className: customClassName, scrollIntoView, size, ...rest }) {
 	const { activeIndex, selectedIndex, setSelectedIndex, setActiveIndex } = React.useContext(TabsContext);
 	const prefix = usePrefix();
 	const ref = useRef(null);
 	const [isOverflowingBottom, setIsOverflowingBottom] = useState(false);
 	const [isOverflowingTop, setIsOverflowingTop] = useState(false);
 	const isSm = useMatchMedia(smMediaQuery);
-	const className = classNames(`${prefix}--tabs`, `${prefix}--tabs--vertical`, `${prefix}--tabs--contained`, customClassName);
+	const className = classNames(`${prefix}--tabs`, `${prefix}--tabs--vertical`, `${prefix}--tabs--contained`, { [`${prefix}--layout--size-${size}`]: size }, customClassName);
 	const tabs = useRef([]);
 	function onKeyDown(event) {
 		if (matches(event, [
@@ -423,6 +428,7 @@ function TabListVertical({ activation = "automatic", "aria-label": label, childr
 		...rest,
 		"aria-label": label,
 		contained: true,
+		size: size === "xl" ? "lg" : size,
 		children
 	});
 	return /* @__PURE__ */ jsxs("div", {
@@ -458,7 +464,13 @@ TabListVertical.propTypes = {
 	activation: PropTypes.oneOf(["automatic", "manual"]),
 	"aria-label": PropTypes.string,
 	children: PropTypes.node,
-	className: PropTypes.string
+	className: PropTypes.string,
+	size: PropTypes.oneOf([
+		"sm",
+		"md",
+		"lg",
+		"xl"
+	])
 };
 /**
 * Helper function to set up the behavior when a button is "long pressed".

package/es/components/Tag/DismissibleTag.js

@@ -16,8 +16,8 @@ import { AILabel } from "../AILabel/index.js";
 import { mergeRefs } from "../../tools/mergeRefs.js";
 import { isEllipsisActive } from "./isEllipsisActive.js";
 import Tag, { SIZES, TYPES } from "./Tag.js";
-import classNames from "classnames";
 import { cloneElement, forwardRef, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Close } from "@carbon/icons-react";

package/es/components/Tag/OperationalTag.js

@@ -13,8 +13,8 @@ import { Tooltip } from "../Tooltip/Tooltip.js";
 import { mergeRefs } from "../../tools/mergeRefs.js";
 import { isEllipsisActive } from "./isEllipsisActive.js";
 import Tag, { SIZES } from "./Tag.js";
-import classNames from "classnames";
 import { forwardRef, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Tag/OperationalTag.tsx

package/es/components/Tag/SelectableTag.js

@@ -14,8 +14,8 @@ import { mergeRefs } from "../../tools/mergeRefs.js";
 import { useControllableState } from "../../internal/useControllableState.js";
 import { isEllipsisActive } from "./isEllipsisActive.js";
 import Tag, { SIZES } from "./Tag.js";
-import classNames from "classnames";
 import { forwardRef, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Tag/SelectableTag.tsx

package/es/components/Tag/Tag.Skeleton.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Tag/Tag.Skeleton.tsx

package/es/components/Tag/Tag.js

@@ -15,8 +15,8 @@ import { useMergedRefs } from "../../internal/useMergedRefs.js";
 import { DefinitionTooltip } from "../Tooltip/DefinitionTooltip.js";
 import { AILabel } from "../AILabel/index.js";
 import { isEllipsisActive } from "./isEllipsisActive.js";
-import classNames from "classnames";
 import React, { cloneElement, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Close } from "@carbon/icons-react";

package/es/components/TextArea/TextArea.Skeleton.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/TextArea/TextArea.Skeleton.tsx

package/es/components/TextArea/TextArea.js

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { noopFn } from "../../internal/noopFn.js";
 import { usePrefix } from "../../internal/usePrefix.js";
 import { Text } from "../Text/Text.js";
 import useIsomorphicEffect from "../../internal/useIsomorphicEffect.js";
 import { useId } from "../../internal/useId.js";
-import { noopFn } from "../../internal/noopFn.js";
 import { deprecate } from "../../prop-types/deprecate.js";
 import { isComponentElement } from "../../internal/utils.js";
 import { useMergedRefs } from "../../internal/useMergedRefs.js";
@@ -17,8 +17,8 @@ import { hasHelperText } from "../../internal/hasHelperText.js";
 import { AILabel } from "../AILabel/index.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import { getAnnouncement } from "../../internal/getAnnouncement.js";
-import classNames from "classnames";
 import { cloneElement, forwardRef, useContext, useEffect, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { WarningAltFilled, WarningFilled } from "@carbon/icons-react";

package/es/components/TextInput/ControlledPasswordInput.js

@@ -5,14 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { noopFn } from "../../internal/noopFn.js";
 import { usePrefix } from "../../internal/usePrefix.js";
 import { useId } from "../../internal/useId.js";
-import { noopFn } from "../../internal/noopFn.js";
 import { deprecate } from "../../prop-types/deprecate.js";
 import { hasHelperText } from "../../internal/hasHelperText.js";
 import { getTextInputProps } from "./util.js";
-import classNames from "classnames";
 import { forwardRef } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { View, ViewOff, WarningFilled } from "@carbon/icons-react";

package/es/components/TextInput/PasswordInput.js

@@ -12,8 +12,8 @@ import { hasHelperText } from "../../internal/hasHelperText.js";
 import { useNormalizedInputProps } from "../../internal/useNormalizedInputProps.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import { getTextInputProps } from "./util.js";
-import classNames from "classnames";
 import { forwardRef, useContext, useEffect, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { View, ViewOff } from "@carbon/icons-react";

package/es/components/TextInput/TextInput.Skeleton.js

@@ -6,8 +6,8 @@
  */
 
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/TextInput/TextInput.Skeleton.tsx

package/es/components/TextInput/TextInput.js

@@ -16,8 +16,8 @@ import { AILabel } from "../AILabel/index.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import { getTextInputProps } from "./util.js";
 import { getAnnouncement } from "../../internal/getAnnouncement.js";
-import classNames from "classnames";
 import { cloneElement, forwardRef, useContext, useEffect, useRef, useState } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/TextInput/TextInput.tsx

package/es/components/Theme/index.js

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { LayerContext } from "../Layer/LayerContext.js";
 import { useMatchMedia } from "../../internal/useMatchMedia.js";
-import classNames from "classnames";
 import React, { cloneElement, isValidElement, useMemo } from "react";
+import classNames from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/Theme/index.tsx