@carbon/react 1.103.0 → 1.104.0

package/es/components/RadioTile/index.js

@@ -1,12 +1,20 @@
 /**
- * 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 RadioTile from './RadioTile.js';
-
+import RadioTile from "./RadioTile.js";
 
+//#region src/components/RadioTile/index.ts
+/**
+* Copyright IBM Corp. 2016, 2023
+*
+* 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 RadioTile_default = RadioTile;
 
-export { RadioTile, RadioTile as default };
+//#endregion
+export { RadioTile_default as default };

package/es/components/Search/Search.Skeleton.js

@@ -1,44 +1,39 @@
 /**
- * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import PropTypes from 'prop-types';
-import React from 'react';
-import cx from 'classnames';
-import { usePrefix } from '../../internal/usePrefix.js';
+import { usePrefix } from "../../internal/usePrefix.js";
+import classNames from "classnames";
+import React from "react";
+import PropTypes from "prop-types";
+import { jsx, jsxs } from "react/jsx-runtime";
 
-const SearchSkeleton = ({
-  small = false,
-  className,
-  ...rest
-}) => {
-  const prefix = usePrefix();
-  const searchClasses = cx(className, {
-    [`${prefix}--skeleton`]: true,
-    [`${prefix}--search--xl`]: !small,
-    [`${prefix}--search--sm`]: small
-  });
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: searchClasses
-  }, rest), /*#__PURE__*/React.createElement("span", {
-    className: `${prefix}--label`
-  }), /*#__PURE__*/React.createElement("div", {
-    className: `${prefix}--search-input`
-  }));
+//#region src/components/Search/Search.Skeleton.tsx
+/**
+* Copyright IBM Corp. 2016, 2023
+*
+* 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 SearchSkeleton = ({ small = false, className, ...rest }) => {
+	const prefix = usePrefix();
+	return /* @__PURE__ */ jsxs("div", {
+		className: classNames(className, {
+			[`${prefix}--skeleton`]: true,
+			[`${prefix}--search--xl`]: !small,
+			[`${prefix}--search--sm`]: small
+		}),
+		...rest,
+		children: [/* @__PURE__ */ jsx("span", { className: `${prefix}--label` }), /* @__PURE__ */ jsx("div", { className: `${prefix}--search-input` })]
+	});
 };
 SearchSkeleton.propTypes = {
-  /**
-   * Specify an optional className to add.
-   */
-  className: PropTypes.string,
-  /**
-   * Specify whether the Search should be a small variant
-   */
-  small: PropTypes.bool
+	className: PropTypes.string,
+	small: PropTypes.bool
 };
 
-export { SearchSkeleton, SearchSkeleton as default };
+//#endregion
+export { SearchSkeleton as default };

package/es/components/Search/Search.js

@@ -1,289 +1,193 @@
 /**
- * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import { Close, Search as Search$1 } from '@carbon/icons-react';
-import cx from 'classnames';
-import PropTypes from 'prop-types';
-import React, { useContext, useRef, useState } from 'react';
-import { Escape, Enter, Space } from '../../internal/keyboard/keys.js';
-import { match } from '../../internal/keyboard/match.js';
-import { useId } from '../../internal/useId.js';
-import { usePrefix } from '../../internal/usePrefix.js';
-import { composeEventHandlers } from '../../tools/events.js';
-import { useMergedRefs } from '../../internal/useMergedRefs.js';
-import { deprecate } from '../../prop-types/deprecate.js';
-import '../FluidForm/FluidForm.js';
-import { FormContext } from '../FluidForm/FormContext.js';
-import { noopFn } from '../../internal/noopFn.js';
-import '../Tooltip/DefinitionTooltip.js';
-import { Tooltip } from '../Tooltip/Tooltip.js';
-import { isSearchValuePresent } from './utils.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 PropTypes from "prop-types";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Close, Search } from "@carbon/icons-react";
 
-var _Close;
-const Search = /*#__PURE__*/React.forwardRef(({
-  autoComplete = 'off',
-  className,
-  closeButtonLabelText = 'Clear search input',
-  defaultValue,
-  disabled,
-  isExpanded = true,
-  id,
-  labelText,
-  // @ts-expect-error: deprecated prop
-  light,
-  onChange = () => {},
-  onClear = () => {},
-  onKeyDown,
-  onExpand,
-  placeholder = 'Search',
-  renderIcon,
-  role,
-  size = 'md',
-  type = 'search',
-  value,
-  ...rest
-}, forwardRef) => {
-  const hasPropValue = isSearchValuePresent(value) || isSearchValuePresent(defaultValue);
-  const prefix = usePrefix();
-  const {
-    isFluid
-  } = useContext(FormContext);
-  const inputRef = useRef(null);
-  const ref = useMergedRefs([forwardRef, inputRef]);
-  const expandButtonRef = useRef(null);
-  const inputId = useId('search-input');
-  const uniqueId = id || inputId;
-  const searchId = `${uniqueId}-search`;
-  const [hasContent, setHasContent] = useState(hasPropValue || false);
-  const [prevValue, setPrevValue] = useState(value);
-  const searchClasses = cx({
-    [`${prefix}--search`]: true,
-    [`${prefix}--search--sm`]: size === 'sm',
-    [`${prefix}--search--md`]: size === 'md',
-    [`${prefix}--search--lg`]: size === 'lg',
-    [`${prefix}--search--light`]: light,
-    [`${prefix}--search--disabled`]: disabled,
-    [`${prefix}--search--fluid`]: isFluid
-  }, className);
-  const clearClasses = cx({
-    [`${prefix}--search-close`]: true,
-    [`${prefix}--search-close--hidden`]: !hasContent || !isExpanded
-  });
-  if (value !== prevValue) {
-    setHasContent(isSearchValuePresent(value));
-    setPrevValue(value);
-  }
-  function clearInput() {
-    if (!value && inputRef.current) {
-      inputRef.current.value = '';
-    }
-    if (inputRef.current) {
-      const inputTarget = Object.assign({}, inputRef.current, {
-        value: ''
-      });
-      const syntheticEvent = {
-        bubbles: false,
-        cancelable: false,
-        currentTarget: inputRef.current,
-        defaultPrevented: false,
-        eventPhase: 0,
-        isDefaultPrevented: () => false,
-        isPropagationStopped: () => false,
-        isTrusted: false,
-        nativeEvent: new Event('change'),
-        persist: noopFn,
-        preventDefault: noopFn,
-        stopPropagation: noopFn,
-        target: inputTarget,
-        timeStamp: 0,
-        type: 'change'
-      };
-      onChange(syntheticEvent);
-    }
-    onClear();
-    setHasContent(false);
-    inputRef.current?.focus();
-  }
-  function handleChange(event) {
-    setHasContent(event.target.value !== '');
-  }
-  function handleKeyDown(event) {
-    if (match(event, Escape)) {
-      event.stopPropagation();
-      if (inputRef.current?.value) {
-        clearInput();
-      }
-      // ExpandableSearch closes on escape when isExpanded, focus search activation button
-      else if (onExpand && isExpanded) {
-        expandButtonRef.current?.focus();
-      }
-    }
-  }
-  function handleExpandButtonKeyDown(event) {
-    if (match(event, Enter) || match(event, Space)) {
-      event.stopPropagation();
-      if (onExpand) {
-        onExpand(event);
-      }
-    }
-  }
-  const magnifierButton = /*#__PURE__*/React.createElement("div", {
-    "aria-labelledby": onExpand ? searchId : undefined,
-    role: onExpand ? 'button' : undefined,
-    className: `${prefix}--search-magnifier`,
-    onClick: onExpand,
-    onKeyDown: handleExpandButtonKeyDown,
-    tabIndex: onExpand && !isExpanded ? 0 : -1,
-    ref: expandButtonRef,
-    "aria-expanded": onExpand && isExpanded ? true : onExpand && !isExpanded ? false : undefined,
-    "aria-controls": onExpand ? uniqueId : undefined
-  }, /*#__PURE__*/React.createElement(CustomSearchIcon, {
-    icon: renderIcon
-  }));
-
-  // Wrap magnifierButton in a tooltip if it's expandable
-  const magnifierWithTooltip = onExpand && !isExpanded ? /*#__PURE__*/React.createElement(Tooltip, {
-    className: `${prefix}--search-tooltip ${prefix}--search-magnifier-tooltip`,
-    align: "top",
-    label: "Search"
-  }, magnifierButton) : magnifierButton;
-  return /*#__PURE__*/React.createElement("div", {
-    role: "search",
-    "aria-label": placeholder,
-    className: searchClasses
-  }, magnifierWithTooltip, /*#__PURE__*/React.createElement("label", {
-    id: searchId,
-    htmlFor: uniqueId,
-    className: `${prefix}--label`
-  }, labelText), /*#__PURE__*/React.createElement("input", _extends({
-    autoComplete: autoComplete,
-    className: `${prefix}--search-input`,
-    defaultValue: defaultValue,
-    disabled: disabled,
-    role: role,
-    ref: ref,
-    id: uniqueId,
-    onChange: composeEventHandlers([onChange, handleChange]),
-    onKeyDown: composeEventHandlers([onKeyDown, handleKeyDown]),
-    placeholder: placeholder,
-    type: type,
-    value: value,
-    tabIndex: onExpand && !isExpanded ? -1 : undefined
-  }, rest)), /*#__PURE__*/React.createElement("button", {
-    "aria-label": closeButtonLabelText,
-    className: clearClasses,
-    disabled: disabled,
-    onClick: clearInput,
-    title: closeButtonLabelText,
-    type: "button"
-  }, _Close || (_Close = /*#__PURE__*/React.createElement(Close, null))));
+//#region src/components/Search/Search.tsx
+/**
+* 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 Search$1 = React.forwardRef(({ autoComplete = "off", className, closeButtonLabelText = "Clear search input", defaultValue, disabled, isExpanded = true, id, labelText, light, onChange = () => {}, onClear = () => {}, onKeyDown, onExpand, placeholder = "Search", renderIcon, role, size = "md", type = "search", value, ...rest }, forwardRef) => {
+	const hasPropValue = isSearchValuePresent(value) || isSearchValuePresent(defaultValue);
+	const prefix = usePrefix();
+	const { isFluid } = useContext(FormContext);
+	const inputRef = useRef(null);
+	const ref = useMergedRefs([forwardRef, inputRef]);
+	const expandButtonRef = useRef(null);
+	const inputId = useId("search-input");
+	const uniqueId = id || inputId;
+	const searchId = `${uniqueId}-search`;
+	const [hasContent, setHasContent] = useState(hasPropValue || false);
+	const searchClasses = classNames({
+		[`${prefix}--search`]: true,
+		[`${prefix}--search--sm`]: size === "sm",
+		[`${prefix}--search--md`]: size === "md",
+		[`${prefix}--search--lg`]: size === "lg",
+		[`${prefix}--search--light`]: light,
+		[`${prefix}--search--disabled`]: disabled,
+		[`${prefix}--search--fluid`]: isFluid
+	}, className);
+	const clearClasses = classNames({
+		[`${prefix}--search-close`]: true,
+		[`${prefix}--search-close--hidden`]: !hasContent || !isExpanded
+	});
+	useEffect(() => {
+		if (typeof value !== "undefined") setHasContent(isSearchValuePresent(value));
+	}, [value]);
+	function clearInput() {
+		if (!value && inputRef.current) inputRef.current.value = "";
+		if (inputRef.current) {
+			const inputTarget = Object.assign({}, inputRef.current, { value: "" });
+			onChange({
+				bubbles: false,
+				cancelable: false,
+				currentTarget: inputRef.current,
+				defaultPrevented: false,
+				eventPhase: 0,
+				isDefaultPrevented: () => false,
+				isPropagationStopped: () => false,
+				isTrusted: false,
+				nativeEvent: new Event("change"),
+				persist: noopFn,
+				preventDefault: noopFn,
+				stopPropagation: noopFn,
+				target: inputTarget,
+				timeStamp: 0,
+				type: "change"
+			});
+		}
+		onClear();
+		setHasContent(false);
+		inputRef.current?.focus();
+	}
+	function handleChange(event) {
+		setHasContent(event.target.value !== "");
+	}
+	function handleKeyDown(event) {
+		if (match(event, Escape)) {
+			event.stopPropagation();
+			if (inputRef.current?.value) clearInput();
+			else if (onExpand && isExpanded) expandButtonRef.current?.focus();
+		}
+	}
+	function handleExpandButtonKeyDown(event) {
+		if (match(event, Enter) || match(event, Space)) {
+			event.stopPropagation();
+			if (onExpand) onExpand(event);
+		}
+	}
+	const magnifierButton = /* @__PURE__ */ jsx("div", {
+		"aria-labelledby": onExpand ? searchId : void 0,
+		role: onExpand ? "button" : void 0,
+		className: `${prefix}--search-magnifier`,
+		onClick: onExpand,
+		onKeyDown: handleExpandButtonKeyDown,
+		tabIndex: onExpand && !isExpanded ? 0 : -1,
+		ref: expandButtonRef,
+		"aria-expanded": onExpand && isExpanded ? true : onExpand && !isExpanded ? false : void 0,
+		"aria-controls": onExpand ? uniqueId : void 0,
+		children: /* @__PURE__ */ jsx(CustomSearchIcon, { icon: renderIcon })
+	});
+	const magnifierWithTooltip = onExpand && !isExpanded ? /* @__PURE__ */ jsx(Tooltip, {
+		className: `${prefix}--search-tooltip ${prefix}--search-magnifier-tooltip`,
+		align: "top",
+		label: "Search",
+		children: magnifierButton
+	}) : magnifierButton;
+	return /* @__PURE__ */ jsxs("div", {
+		role: "search",
+		"aria-label": placeholder,
+		className: searchClasses,
+		children: [
+			magnifierWithTooltip,
+			/* @__PURE__ */ jsx("label", {
+				id: searchId,
+				htmlFor: uniqueId,
+				className: `${prefix}--label`,
+				children: labelText
+			}),
+			/* @__PURE__ */ jsx("input", {
+				autoComplete,
+				className: `${prefix}--search-input`,
+				defaultValue,
+				disabled,
+				role,
+				ref,
+				id: uniqueId,
+				onChange: composeEventHandlers([onChange, handleChange]),
+				onKeyDown: composeEventHandlers([onKeyDown, handleKeyDown]),
+				placeholder,
+				type,
+				value,
+				tabIndex: onExpand && !isExpanded ? -1 : void 0,
+				...rest
+			}),
+			/* @__PURE__ */ jsx("button", {
+				"aria-label": closeButtonLabelText,
+				className: clearClasses,
+				disabled,
+				onClick: clearInput,
+				title: closeButtonLabelText,
+				type: "button",
+				children: /* @__PURE__ */ jsx(Close, {})
+			})
+		]
+	});
 });
-Search.displayName = 'Search';
-Search.propTypes = {
-  /**
-   * Specify an optional value for the `autocomplete` property on the underlying
-   * `<input>`, defaults to "off"
-   */
-  autoComplete: PropTypes.string,
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-  /**
-   * Specify a label to be read by screen readers on the "close" button
-   */
-  closeButtonLabelText: PropTypes.string,
-  /**
-   * Optionally provide the default value of the `<input>`
-   */
-  defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  /**
-   * Specify whether the `<input>` should be disabled
-   */
-  disabled: PropTypes.bool,
-  /**
-   * Specify a custom `id` for the input
-   */
-  id: PropTypes.string,
-  /**
-   * Specify whether or not ExpandableSearch should render expanded or not
-   */
-  isExpanded: PropTypes.bool,
-  /**
-   * Provide the label text for the Search icon
-   */
-  labelText: PropTypes.node.isRequired,
-  /**
-   * Specify light version or default version of this control
-   */
-  light: deprecate(PropTypes.bool, 'The `light` prop for `Search` is no longer needed and has ' + 'been deprecated in v11 in favor of the new `Layer` component. It will be moved in the next major release.'),
-  /**
-   * Optional callback called when the search value changes.
-   */
-  onChange: PropTypes.func,
-  /**
-   * Optional callback called when the search value is cleared.
-   */
-  onClear: PropTypes.func,
-  /**
-   * Optional callback called when the magnifier icon is clicked in ExpandableSearch.
-   */
-  onExpand: PropTypes.func,
-  /**
-   * Provide a handler that is invoked on the key down event for the input
-   */
-  onKeyDown: PropTypes.func,
-  /**
-   * Provide an optional placeholder text for the Search.
-   * Note: if the label and placeholder differ,
-   * VoiceOver on Mac will read both
-   */
-  placeholder: PropTypes.string,
-  /**
-   * A component used to render an icon.
-   */
-  renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
-  /**
-   * Deprecated, since <input type="search"> already provides correct semantics.
-   * Specify the role for the underlying `<input>`, defaults to `searchbox`
-   */
-  role: deprecate(PropTypes.string, 'The `role` prop has been deprecated since <input type="search"> already provides correct semantics. ' + 'It will be removed in the next major release of Carbon.'),
-  /**
-   * Specify the size of the Search
-   */
-  size: PropTypes.oneOf(['sm', 'md', 'lg']),
-  /**
-   * Specify the type of the `<input>`
-   */
-  type: PropTypes.string,
-  /**
-   * Specify the value of the `<input>`
-   */
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+Search$1.displayName = "Search";
+Search$1.propTypes = {
+	autoComplete: PropTypes.string,
+	className: PropTypes.string,
+	closeButtonLabelText: PropTypes.string,
+	defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	disabled: PropTypes.bool,
+	id: PropTypes.string,
+	isExpanded: PropTypes.bool,
+	labelText: PropTypes.node.isRequired,
+	light: deprecate(PropTypes.bool, "The `light` prop for `Search` is no longer needed and has been deprecated in v11 in favor of the new `Layer` component. It will be moved in the next major release."),
+	onChange: PropTypes.func,
+	onClear: PropTypes.func,
+	onExpand: PropTypes.func,
+	onKeyDown: PropTypes.func,
+	placeholder: PropTypes.string,
+	renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+	role: deprecate(PropTypes.string, "The `role` prop has been deprecated since <input type=\"search\"> already provides correct semantics. It will be removed in the next major release of Carbon."),
+	size: PropTypes.oneOf([
+		"sm",
+		"md",
+		"lg"
+	]),
+	type: PropTypes.string,
+	value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
 };
-function CustomSearchIcon({
-  icon: Icon
-}) {
-  const prefix = usePrefix();
-  if (Icon) {
-    return /*#__PURE__*/React.createElement(Icon, {
-      className: `${prefix}--search-magnifier-icon`
-    });
-  }
-  return /*#__PURE__*/React.createElement(Search$1, {
-    className: `${prefix}--search-magnifier-icon`
-  });
+function CustomSearchIcon({ icon: Icon }) {
+	const prefix = usePrefix();
+	if (Icon) return /* @__PURE__ */ jsx(Icon, { className: `${prefix}--search-magnifier-icon` });
+	return /* @__PURE__ */ jsx(Search, { className: `${prefix}--search-magnifier-icon` });
 }
-CustomSearchIcon.propTypes = {
-  /**
-   * Rendered icon for the Search. Can be a React component class
-   */
-  icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
-};
+CustomSearchIcon.propTypes = { icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]) };
 
-export { Search as default };
+//#endregion
+export { Search$1 as default };

package/es/components/Search/index.js

@@ -1,13 +1,21 @@
 /**
- * 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 Search from './Search.js';
-export { SearchSkeleton } from './Search.Skeleton.js';
-
+import Search from "./Search.js";
+import SearchSkeleton from "./Search.Skeleton.js";
 
+//#region src/components/Search/index.tsx
+/**
+* Copyright IBM Corp. 2016, 2023
+*
+* 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 Search_default = Search;
 
-export { Search, Search as default };
+//#endregion
+export { Search_default as default };

package/es/components/Search/utils.js

@@ -1,10 +1,18 @@
 /**
- * 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.
  */
 
-const isSearchValuePresent = value => value !== '' && typeof value !== 'undefined';
+//#region src/components/Search/utils.ts
+/**
+* Copyright IBM Corp. 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 isSearchValuePresent = (value) => value !== "" && typeof value !== "undefined";
 
-export { isSearchValuePresent };
+//#endregion
+export { isSearchValuePresent };

package/es/components/SecondaryButton/SecondaryButton.js

@@ -1,17 +1,19 @@
 /**
- * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React from 'react';
-import Button from '../Button/Button.js';
-import '../Button/Button.Skeleton.js';
+import Button from "../Button/Button.js";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
 
-const SecondaryButton = props => /*#__PURE__*/React.createElement(Button, _extends({
-  kind: "secondary"
-}, props));
+//#region src/components/SecondaryButton/SecondaryButton.tsx
+const SecondaryButton = (props) => /* @__PURE__ */ jsx(Button, {
+	kind: "secondary",
+	...props
+});
 
-export { SecondaryButton as default };
+//#endregion
+export { SecondaryButton as default };