npm - @carbon/react - Versions diffs - 1.112.0 → 1.113.0-rc.0 - Mend

@carbon/react 1.112.0 → 1.113.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (535) hide show

package/es/components/FileUploader/FileUploaderDropContainer.js CHANGED Viewed

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
+import { noopFn } from "../../internal/noopFn.js";
 import { usePrefix } from "../../internal/usePrefix.js";
 import { Enter, Space } from "../../internal/keyboard/keys.js";
 import { matches } 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 { composeEventHandlers } from "../../tools/events.js";
-import classNames from "classnames";
 import { useRef, useState } from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FileUploader/FileUploaderDropContainer.tsx
@@ -29,7 +29,7 @@ function FileUploaderDropContainer({ accept = [], className, id, disabled, label
 	const generatedId = useId();
 	const { current: uid } = useRef(id || generatedId);
 	const [isActive, setActive] = useState(false);
-	const dropareaClasses = classNames(`${prefix}--file__drop-container`, `${prefix}--file-browse-btn`, {
+	const dropareaClasses = cx(`${prefix}--file__drop-container`, `${prefix}--file-browse-btn`, {
 		[`${prefix}--file__drop-container--drag-over`]: isActive,
 		[`${prefix}--file-browse-btn--disabled`]: disabled
 	}, className);
@@ -58,17 +58,19 @@ function FileUploaderDropContainer({ accept = [], className, id, disabled, label
 		return onAddFiles(event, { addedFiles: validateFiles(multiple ? files : [files[0]]) });
 	};
 	const handleChange = (event) => {
-		return handleFiles(event, [...event.target.files ?? []]);
+		const files = [...event.target.files ?? []];
+		return handleFiles(event, files);
 	};
 	const handleDrop = (event) => {
 		const items = [...event.dataTransfer.items ?? []];
-		return handleFiles(event, items.length ? items.reduce((acc, item) => {
+		const files = items.length ? items.reduce((acc, item) => {
 			if (item.kind !== "file") return acc;
 			if (item.webkitGetAsEntry()?.isDirectory) return acc;
 			const file = item.getAsFile();
 			if (file) acc.push(file);
 			return acc;
-		}, []) : [...event.dataTransfer.files]);
+		}, []) : [...event.dataTransfer.files];
+		return handleFiles(event, files);
 	};
 	const handleClick = () => {
 		if (!disabled) inputRef.current?.click();

package/es/components/FileUploader/FileUploaderItem.js CHANGED Viewed

@@ -5,17 +5,17 @@
  * 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 { Enter, Space } from "../../internal/keyboard/keys.js";
 import { matches } from "../../internal/keyboard/match.js";
 import useIsomorphicEffect from "../../internal/useIsomorphicEffect.js";
 import { useId } from "../../internal/useId.js";
-import { noopFn } from "../../internal/noopFn.js";
 import { Tooltip } from "../Tooltip/Tooltip.js";
 import Filename from "./Filename.js";
-import classNames from "classnames";
 import { useRef, useState } from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FileUploader/FileUploaderItem.tsx
@@ -31,7 +31,7 @@ function FileUploaderItem({ uuid, name, status = "uploading", iconDescription, o
 	const prefix = usePrefix();
 	const generatedId = useId();
 	const { current: id } = useRef(uuid || generatedId);
-	const classes = classNames(`${prefix}--file__selected-file`, className, {
+	const classes = cx(`${prefix}--file__selected-file`, className, {
 		[`${prefix}--file__selected-file--invalid`]: invalid,
 		[`${prefix}--file__selected-file--md`]: size === "md",
 		[`${prefix}--file__selected-file--sm`]: size === "sm",

package/es/components/FluidComboBox/FluidComboBox.Skeleton.js CHANGED Viewed

@@ -6,8 +6,8 @@
  */
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidComboBox/FluidComboBox.Skeleton.tsx
@@ -20,7 +20,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const FluidComboBoxSkeleton = ({ className, ...rest }) => {
 	const prefix = usePrefix();
 	return /* @__PURE__ */ jsx("div", {
-		className: classNames(className, `${prefix}--list-box__wrapper--fluid`),
+		className: cx(className, `${prefix}--list-box__wrapper--fluid`),
 		...rest,
 		children: /* @__PURE__ */ jsxs("div", {
 			className: `${prefix}--skeleton ${prefix}--list-box`,

package/es/components/FluidComboBox/FluidComboBox.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import ComboBox_default from "../ComboBox/index.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidComboBox/FluidComboBox.tsx
@@ -21,12 +21,12 @@ import { jsx } from "react/jsx-runtime";
 */
 const FluidComboBox = React.forwardRef(function FluidComboBox({ className, isCondensed, ...other }, ref) {
 	const prefix = usePrefix();
-	const classNames$1 = classNames(`${prefix}--list-box__wrapper--fluid`, className, { [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed });
+	const classNames = cx(`${prefix}--list-box__wrapper--fluid`, className, { [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed });
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(ComboBox_default, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidDatePicker/FluidDatePicker.Skeleton.js CHANGED Viewed

@@ -7,8 +7,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Calendar } from "@carbon/icons-react";
@@ -21,11 +21,11 @@ import { Calendar } from "@carbon/icons-react";
 */
 const FluidDatePickerSkeleton = ({ className, datePickerType = "single", ...other }) => {
 	const prefix = usePrefix();
-	const classNames$1 = classNames(className, `${prefix}--form-item ${prefix}--date-picker--fluid__skeleton`, { [`${prefix}--date-picker--fluid__skeleton--range`]: datePickerType === "range" });
+	const classNames = cx(className, `${prefix}--form-item ${prefix}--date-picker--fluid__skeleton`, { [`${prefix}--date-picker--fluid__skeleton--range`]: datePickerType === "range" });
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsxs("div", {
-			className: classNames$1,
+			className: classNames,
 			...other,
 			children: [/* @__PURE__ */ jsxs("div", {
 				className: `${prefix}--date-picker--fluid__skeleton--container`,

package/es/components/FluidDatePicker/FluidDatePicker.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import DatePicker_default from "../DatePicker/index.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidDatePicker/FluidDatePicker.tsx
@@ -21,7 +21,7 @@ import { jsx } from "react/jsx-runtime";
 */
 const FluidDatePicker = React.forwardRef(function FluidDatePicker({ className, children, invalid, readOnly, warn, ...other }, ref) {
 	const prefix = usePrefix();
-	const classNames$1 = classNames(className, {
+	const classNames = cx(className, {
 		[`${prefix}--date-picker--fluid`]: true,
 		[`${prefix}--date-picker--fluid--invalid`]: invalid,
 		[`${prefix}--date-picker--fluid--readonly`]: readOnly,
@@ -33,7 +33,7 @@ const FluidDatePicker = React.forwardRef(function FluidDatePicker({ className, c
 			invalid,
 			readOnly,
 			warn,
-			className: classNames$1,
+			className: classNames,
 			ref,
 			...other,
 			children

package/es/components/FluidDropdown/FluidDropdown.Skeleton.js CHANGED Viewed

@@ -6,8 +6,8 @@
  */
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidDropdown/FluidDropdown.Skeleton.tsx
@@ -20,7 +20,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const FluidDropdownSkeleton = ({ className, ...rest }) => {
 	const prefix = usePrefix();
 	return /* @__PURE__ */ jsx("div", {
-		className: classNames(className, `${prefix}--list-box__wrapper--fluid`),
+		className: cx(className, `${prefix}--list-box__wrapper--fluid`),
 		...rest,
 		children: /* @__PURE__ */ jsxs("div", {
 			className: `${prefix}--skeleton ${prefix}--list-box`,

package/es/components/FluidDropdown/FluidDropdown.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import Dropdown_default from "../Dropdown/index.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidDropdown/FluidDropdown.tsx
@@ -21,12 +21,12 @@ import { jsx } from "react/jsx-runtime";
 */
 const FluidDropdown = React.forwardRef(function FluidDropdown({ className, isCondensed, ...other }, ref) {
 	const prefix = usePrefix();
-	const classNames$1 = classNames(`${prefix}--list-box__wrapper--fluid`, className, { [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed });
+	const classNames = cx(`${prefix}--list-box__wrapper--fluid`, className, { [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed });
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(Dropdown_default, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidForm/FluidForm.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import Form from "../Form/Form.js";
 import { FormContext } from "./FormContext.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidForm/FluidForm.tsx
@@ -20,11 +20,11 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidForm = ({ className, children, ...other }) => {
-	const classNames$1 = classNames(`${usePrefix()}--form--fluid`, className);
+	const classNames = cx(`${usePrefix()}--form--fluid`, className);
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(Form, {
-			className: classNames$1,
+			className: classNames,
 			...other,
 			children
 		})

package/es/components/FluidMultiSelect/FluidMultiSelect.Skeleton.js CHANGED Viewed

@@ -6,8 +6,8 @@
  */
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidMultiSelect/FluidMultiSelect.Skeleton.tsx
@@ -20,7 +20,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const FluidMultiSelectSkeleton = ({ className, ...rest }) => {
 	const prefix = usePrefix();
 	return /* @__PURE__ */ jsx("div", {
-		className: classNames(className, `${prefix}--list-box__wrapper--fluid`),
+		className: cx(className, `${prefix}--list-box__wrapper--fluid`),
 		...rest,
 		children: /* @__PURE__ */ jsxs("div", {
 			className: `${prefix}--skeleton ${prefix}--list-box`,

package/es/components/FluidMultiSelect/FluidMultiSelect.js CHANGED Viewed

@@ -9,8 +9,8 @@ import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import { FilterableMultiSelect } from "../MultiSelect/FilterableMultiSelect.js";
 import { MultiSelect } from "../MultiSelect/MultiSelect.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidMultiSelect/FluidMultiSelect.tsx
@@ -22,16 +22,16 @@ import { jsx } from "react/jsx-runtime";
 */
 const FluidMultiSelect = React.forwardRef(function FluidMultiSelect({ className, isCondensed, isFilterable, ...other }, ref) {
 	const prefix = usePrefix();
-	const classNames$1 = classNames(`${prefix}--list-box__wrapper--fluid`, className, { [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed });
+	const classNames = cx(`${prefix}--list-box__wrapper--fluid`, className, { [`${prefix}--list-box__wrapper--fluid--condensed`]: isCondensed });
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: isFilterable ? /* @__PURE__ */ jsx(FilterableMultiSelect, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other
 		}) : /* @__PURE__ */ jsx(MultiSelect, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidNumberInput/FluidNumberInput.Skeleton.js CHANGED Viewed

@@ -7,8 +7,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidNumberInput/FluidNumberInput.Skeleton.tsx
@@ -23,7 +23,7 @@ const FluidNumberInputSkeleton = ({ className, ...other }) => {
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsxs("div", {
-			className: classNames(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className),
+			className: cx(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className),
 			...other,
 			children: [/* @__PURE__ */ jsx("span", { className: `${prefix}--label ${prefix}--skeleton` }), /* @__PURE__ */ jsx("div", { className: `${prefix}--skeleton ${prefix}--text-input` })]
 		})

package/es/components/FluidNumberInput/FluidNumberInput.js CHANGED Viewed

@@ -9,8 +9,8 @@ import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import { NumberFormatOptionsPropType } from "../NumberInput/NumberFormatPropTypes.js";
 import { NumberInput } from "../NumberInput/NumberInput.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidNumberInput/FluidNumberInput.tsx
@@ -21,12 +21,12 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidNumberInput = React.forwardRef(({ className, ...other }, ref) => {
-	const classNames$1 = classNames(`${usePrefix()}--number-input--fluid`, className);
+	const classNames = cx(`${usePrefix()}--number-input--fluid`, className);
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(NumberInput, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidSearch/FluidSearch.Skeleton.js CHANGED Viewed

@@ -7,8 +7,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidSearch/FluidSearch.Skeleton.tsx
@@ -23,7 +23,7 @@ const FluidSearchSkeleton = ({ className, ...other }) => {
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsxs("div", {
-			className: classNames(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className),
+			className: cx(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className),
 			...other,
 			children: [/* @__PURE__ */ jsx("span", { className: `${prefix}--label ${prefix}--skeleton` }), /* @__PURE__ */ jsx("div", { className: `${prefix}--skeleton ${prefix}--text-input` })]
 		})

package/es/components/FluidSearch/FluidSearch.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import Search_default from "../Search/index.js";
-import classNames from "classnames";
 import { forwardRef } from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidSearch/FluidSearch.tsx
@@ -20,12 +20,12 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidSearch = forwardRef(({ className, ...other }, ref) => {
-	const classNames$1 = classNames(`${usePrefix()}--search--fluid`, className);
+	const classNames = cx(`${usePrefix()}--search--fluid`, className);
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(Search_default, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidSelect/FluidSelect.Skeleton.js CHANGED Viewed

@@ -6,8 +6,8 @@
  */
 import { usePrefix } from "../../internal/usePrefix.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidSelect/FluidSelect.Skeleton.tsx
@@ -20,7 +20,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const FluidSelectSkeleton = ({ className, ...rest }) => {
 	const prefix = usePrefix();
 	return /* @__PURE__ */ jsx("div", {
-		className: classNames(className, `${prefix}--list-box__wrapper--fluid`),
+		className: cx(className, `${prefix}--list-box__wrapper--fluid`),
 		...rest,
 		children: /* @__PURE__ */ jsxs("div", {
 			className: `${prefix}--skeleton ${prefix}--list-box`,

package/es/components/FluidSelect/FluidSelect.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import Select_default from "../Select/index.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidSelect/FluidSelect.tsx
@@ -20,12 +20,12 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidSelect = React.forwardRef(({ className, children, ...other }, ref) => {
-	const classNames$1 = classNames(`${usePrefix()}--select--fluid`, className);
+	const classNames = cx(`${usePrefix()}--select--fluid`, className);
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(Select_default, {
 			ref,
-			className: classNames$1,
+			className: classNames,
 			...other,
 			children
 		})

package/es/components/FluidSelect/index.js CHANGED Viewed

@@ -6,7 +6,7 @@
  */
 import FluidSelect from "./FluidSelect.js";
-import "./FluidSelect.Skeleton.js";
+import FluidSelectSkeleton from "./FluidSelect.Skeleton.js";
 //#region src/components/FluidSelect/index.tsx
 /**
 * Copyright IBM Corp. 2022
@@ -16,4 +16,4 @@ import "./FluidSelect.Skeleton.js";
 */
 var FluidSelect_default = FluidSelect;
 //#endregion
-export { FluidSelect_default as default };
+export { FluidSelect, FluidSelectSkeleton, FluidSelect_default as default };

package/es/components/FluidTextArea/FluidTextArea.Skeleton.js CHANGED Viewed

@@ -7,8 +7,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidTextArea/FluidTextArea.Skeleton.tsx
@@ -23,7 +23,7 @@ const FluidTextAreaSkeleton = ({ className, ...other }) => {
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsxs("div", {
-			className: classNames(`${prefix}--form-item ${prefix}--text-area--fluid__skeleton`, className),
+			className: cx(`${prefix}--form-item ${prefix}--text-area--fluid__skeleton`, className),
 			...other,
 			children: [/* @__PURE__ */ jsx("span", { className: `${prefix}--label ${prefix}--skeleton` }), /* @__PURE__ */ jsx("div", { className: `${prefix}--skeleton ${prefix}--text-area` })]
 		})

package/es/components/FluidTextArea/FluidTextArea.js CHANGED Viewed

@@ -9,8 +9,8 @@ import { usePrefix } from "../../internal/usePrefix.js";
 import { deprecate } from "../../prop-types/deprecate.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import TextArea_default from "../TextArea/index.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidTextArea/FluidTextArea.tsx
@@ -21,11 +21,11 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidTextArea = ({ className, ...other }) => {
-	const classNames$1 = classNames(`${usePrefix()}--text-area--fluid`, className);
+	const classNames = cx(`${usePrefix()}--text-area--fluid`, className);
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(TextArea_default, {
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidTextInput/FluidPasswordInput.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import PasswordInput from "../TextInput/PasswordInput.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidTextInput/FluidPasswordInput.tsx
@@ -20,11 +20,11 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidPasswordInput = ({ className, ...other }) => {
-	const classNames$1 = classNames(className, `${usePrefix()}--text-input--fluid`);
+	const classNames = cx(className, `${usePrefix()}--text-input--fluid`);
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsx(PasswordInput, {
-			className: classNames$1,
+			className: classNames,
 			...other
 		})
 	});

package/es/components/FluidTextInput/FluidTextInput.Skeleton.js CHANGED Viewed

@@ -7,8 +7,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidTextInput/FluidTextInput.Skeleton.tsx
@@ -23,7 +23,7 @@ const FluidTextInputSkeleton = ({ className, ...other }) => {
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: /* @__PURE__ */ jsxs("div", {
-			className: classNames(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className),
+			className: cx(`${prefix}--form-item ${prefix}--text-input--fluid__skeleton`, className),
 			...other,
 			children: [/* @__PURE__ */ jsx("span", { className: `${prefix}--label ${prefix}--skeleton` }), /* @__PURE__ */ jsx("div", { className: `${prefix}--skeleton ${prefix}--text-input` })]
 		})

package/es/components/FluidTextInput/FluidTextInput.js CHANGED Viewed

@@ -9,8 +9,8 @@ import { usePrefix } from "../../internal/usePrefix.js";
 import { FormContext } from "../FluidForm/FormContext.js";
 import PasswordInput from "../TextInput/PasswordInput.js";
 import TextInput_default from "../TextInput/index.js";
-import classNames from "classnames";
 import React from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/FluidTextInput/FluidTextInput.tsx
@@ -21,15 +21,15 @@ import { jsx } from "react/jsx-runtime";
 * LICENSE file in the root directory of this source tree.
 */
 const FluidTextInput = React.forwardRef(({ className, isPassword, ...other }, ref) => {
-	const classNames$1 = classNames(className, { [`${usePrefix()}--text-input--fluid`]: !isPassword });
+	const classNames = cx(className, { [`${usePrefix()}--text-input--fluid`]: !isPassword });
 	return /* @__PURE__ */ jsx(FormContext.Provider, {
 		value: { isFluid: true },
 		children: isPassword ? /* @__PURE__ */ jsx(PasswordInput, {
-			className: classNames$1,
+			className: classNames,
 			ref,
 			...other
 		}) : /* @__PURE__ */ jsx(TextInput_default, {
-			className: classNames$1,
+			className: classNames,
 			ref,
 			...other
 		})

package/es/components/FluidTextInput/index.js CHANGED Viewed

@@ -6,8 +6,8 @@
  */
 import FluidTextInput from "./FluidTextInput.js";
-import "./FluidPasswordInput.js";
-import "./FluidTextInput.Skeleton.js";
+import FluidPasswordInput from "./FluidPasswordInput.js";
+import FluidTextInputSkeleton from "./FluidTextInput.Skeleton.js";
 //#region src/components/FluidTextInput/index.tsx
 /**
 * Copyright IBM Corp. 2016, 2023
@@ -17,4 +17,4 @@ import "./FluidTextInput.Skeleton.js";
 */
 var FluidTextInput_default = FluidTextInput;
 //#endregion
-export { FluidTextInput_default as default };
+export { FluidPasswordInput, FluidTextInput, FluidTextInputSkeleton, FluidTextInput_default as default };

package/es/components/FluidTimePicker/FluidTimePicker.Skeleton.js CHANGED Viewed

@@ -8,8 +8,8 @@
 import { usePrefix } from "../../internal/usePrefix.js";
 import FluidSelectSkeleton from "../FluidSelect/FluidSelect.Skeleton.js";
 import FluidTextInputSkeleton from "../FluidTextInput/FluidTextInput.Skeleton.js";
-import classNames from "classnames";
 import "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/FluidTimePicker/FluidTimePicker.Skeleton.tsx
@@ -22,7 +22,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const FluidTimePickerSkeleton = ({ className, isOnlyTwo, ...rest }) => {
 	const prefix = usePrefix();
 	return /* @__PURE__ */ jsxs("div", {
-		className: classNames(className, `${prefix}--time-picker--fluid--skeleton`, { [`${prefix}--time-picker--equal-width`]: isOnlyTwo }),
+		className: cx(className, `${prefix}--time-picker--fluid--skeleton`, { [`${prefix}--time-picker--equal-width`]: isOnlyTwo }),
 		...rest,
 		children: [
 			/* @__PURE__ */ jsx(FluidTextInputSkeleton, {}),

package/es/components/FluidTimePicker/FluidTimePicker.js CHANGED Viewed

@@ -9,8 +9,8 @@ import { usePrefix } from "../../internal/usePrefix.js";
 import { isComponentElement } from "../../internal/utils.js";
 import FluidTextInput_default from "../FluidTextInput/index.js";
 import FluidTimePickerSelect_default from "../FluidTimePickerSelect/index.js";
-import classNames from "classnames";
 import React, { cloneElement } from "react";
+import cx from "classnames";
 import PropTypes from "prop-types";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { WarningAltFilled, WarningFilled } from "@carbon/icons-react";
@@ -23,7 +23,7 @@ import { WarningAltFilled, WarningFilled } from "@carbon/icons-react";
 */
 const FluidTimePicker = React.forwardRef(({ className, children, disabled, invalid, invalidText, warn, warnText, readOnly, ...other }, ref) => {
 	const prefix = usePrefix();
-	const classNames$1 = classNames(className, {
+	const classNames = cx(className, {
 		[`${prefix}--time-picker--fluid`]: true,
 		[`${prefix}--time-picker--equal-width`]: React.Children.toArray(children).length !== 2,
 		[`${prefix}--time-picker--fluid--disabled`]: disabled,
@@ -41,7 +41,7 @@ const FluidTimePicker = React.forwardRef(({ className, children, disabled, inval
 		return children;
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: classNames$1,
+		className: classNames,
 		children: [
 			/* @__PURE__ */ jsxs("div", {
 				className: `${prefix}--time-picker--fluid__wrapper`,

package/es/components/FluidTimePickerSelect/index.js CHANGED Viewed

@@ -15,4 +15,4 @@ import FluidTimePickerSelect from "./FluidTimePickerSelect.js";
 */
 var FluidTimePickerSelect_default = FluidTimePickerSelect;
 //#endregion
-export { FluidTimePickerSelect_default as default };
+export { FluidTimePickerSelect, FluidTimePickerSelect_default as default };