@carbon/react 1.103.0 → 1.104.0

package/lib/components/Tabs/usePressable.js

@@ -1,123 +1,107 @@
 /**
- * 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.
  */
 
-'use strict';
+const require_runtime = require('../../_virtual/_rolldown/runtime.js');
+let react = require("react");
 
-var React = require('react');
-
-const usePressable = (ref, {
-  onPress,
-  onPressIn,
-  onPressOut,
-  onLongPress,
-  delayLongPressMs = 500
-} = {}) => {
-  const savedOnPress = React.useRef(onPress);
-  const savedOnPressIn = React.useRef(onPressIn);
-  const savedOnPressOut = React.useRef(onPressOut);
-  const savedOnLongPress = React.useRef(onLongPress);
-  const [pendingLongPress, setPendingLongPress] = React.useState(false);
-  const [longPress, setLongPress] = React.useState(false);
-  const state = React.useRef({
-    longPress: false
-  });
-  React.useEffect(() => {
-    savedOnPress.current = onPress;
-  }, [onPress]);
-  React.useEffect(() => {
-    savedOnPressIn.current = onPressIn;
-  }, [onPressIn]);
-  React.useEffect(() => {
-    savedOnPressOut.current = onPressOut;
-  }, [onPressOut]);
-  React.useEffect(() => {
-    savedOnLongPress.current = onLongPress;
-  }, [onLongPress]);
-  React.useEffect(() => {
-    const element = ref.current;
-    if (!element) return;
-
-    // Fired when a pointer becomes active buttons state.
-    const onPointerDown = event => {
-      setPendingLongPress(true);
-      savedOnPressIn.current?.();
-      event.preventDefault();
-    };
-
-    // Fired when a pointer is no longer active buttons state.
-    const onPointerUp = () => {
-      setPendingLongPress(false);
-      setLongPress(false);
-      savedOnPressOut.current?.(state.current);
-    };
-
-    // A browser fires this event if it concludes the pointer
-    // will no longer be able to generate events (for example
-    // the related device is deactivated).
-    const onPointerCancel = () => {
-      setPendingLongPress(false);
-      setLongPress(false);
-      savedOnPressOut.current?.(state.current);
-      state.current.longPress = false;
-    };
-
-    // Fired when a pointer is moved out of the hit test
-    // boundaries of an element. For pen devices, this event
-    // is fired when the stylus leaves the hover range
-    // detectable by the digitizer.
-    const onPointerLeave = () => {
-      setPendingLongPress(false);
-      setLongPress(false);
-      savedOnPressOut.current?.(state.current);
-      state.current.longPress = false;
-    };
-    const onClick = () => {
-      setLongPress(false);
-      setPendingLongPress(false);
-      savedOnPress.current?.(state.current);
-      state.current.longPress = false;
-    };
-
-    // Certain devices treat long press events as context menu triggers
-    const onContextMenu = event => {
-      event.preventDefault();
-    };
-    element.addEventListener('pointerdown', onPointerDown);
-    element.addEventListener('pointerup', onPointerUp);
-    element.addEventListener('pointercancel', onPointerCancel);
-    element.addEventListener('pointerleave', onPointerLeave);
-    element.addEventListener('click', onClick);
-    element.addEventListener('contextmenu', onContextMenu);
-    return () => {
-      element.removeEventListener('pointerdown', onPointerDown);
-      element.removeEventListener('pointerup', onPointerUp);
-      element.removeEventListener('pointercancel', onPointerCancel);
-      element.removeEventListener('pointerleave', onPointerLeave);
-      element.removeEventListener('click', onClick);
-      element.removeEventListener('contextmenu', onContextMenu);
-    };
-  }, [ref]);
-  React.useEffect(() => {
-    if (pendingLongPress) {
-      const timeoutId = setTimeout(() => {
-        setPendingLongPress(false);
-        setLongPress(true);
-      }, delayLongPressMs);
-      return () => {
-        clearTimeout(timeoutId);
-      };
-    }
-  }, [pendingLongPress, delayLongPressMs]);
-  React.useEffect(() => {
-    if (longPress) {
-      state.current.longPress = true;
-      return savedOnLongPress.current?.();
-    }
-  }, [longPress]);
+//#region src/components/Tabs/usePressable.ts
+/**
+* Copyright IBM Corp. 2016, 2025
+*
+* 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 usePressable = (ref, { onPress, onPressIn, onPressOut, onLongPress, delayLongPressMs = 500 } = {}) => {
+	const savedOnPress = (0, react.useRef)(onPress);
+	const savedOnPressIn = (0, react.useRef)(onPressIn);
+	const savedOnPressOut = (0, react.useRef)(onPressOut);
+	const savedOnLongPress = (0, react.useRef)(onLongPress);
+	const [pendingLongPress, setPendingLongPress] = (0, react.useState)(false);
+	const [longPress, setLongPress] = (0, react.useState)(false);
+	const state = (0, react.useRef)({ longPress: false });
+	(0, react.useEffect)(() => {
+		savedOnPress.current = onPress;
+	}, [onPress]);
+	(0, react.useEffect)(() => {
+		savedOnPressIn.current = onPressIn;
+	}, [onPressIn]);
+	(0, react.useEffect)(() => {
+		savedOnPressOut.current = onPressOut;
+	}, [onPressOut]);
+	(0, react.useEffect)(() => {
+		savedOnLongPress.current = onLongPress;
+	}, [onLongPress]);
+	(0, react.useEffect)(() => {
+		const element = ref.current;
+		if (!element) return;
+		const onPointerDown = (event) => {
+			setPendingLongPress(true);
+			savedOnPressIn.current?.();
+			event.preventDefault();
+		};
+		const onPointerUp = () => {
+			setPendingLongPress(false);
+			setLongPress(false);
+			savedOnPressOut.current?.(state.current);
+		};
+		const onPointerCancel = () => {
+			setPendingLongPress(false);
+			setLongPress(false);
+			savedOnPressOut.current?.(state.current);
+			state.current.longPress = false;
+		};
+		const onPointerLeave = () => {
+			setPendingLongPress(false);
+			setLongPress(false);
+			savedOnPressOut.current?.(state.current);
+			state.current.longPress = false;
+		};
+		const onClick = () => {
+			setLongPress(false);
+			setPendingLongPress(false);
+			savedOnPress.current?.(state.current);
+			state.current.longPress = false;
+		};
+		const onContextMenu = (event) => {
+			event.preventDefault();
+		};
+		element.addEventListener("pointerdown", onPointerDown);
+		element.addEventListener("pointerup", onPointerUp);
+		element.addEventListener("pointercancel", onPointerCancel);
+		element.addEventListener("pointerleave", onPointerLeave);
+		element.addEventListener("click", onClick);
+		element.addEventListener("contextmenu", onContextMenu);
+		return () => {
+			element.removeEventListener("pointerdown", onPointerDown);
+			element.removeEventListener("pointerup", onPointerUp);
+			element.removeEventListener("pointercancel", onPointerCancel);
+			element.removeEventListener("pointerleave", onPointerLeave);
+			element.removeEventListener("click", onClick);
+			element.removeEventListener("contextmenu", onContextMenu);
+		};
+	}, [ref]);
+	(0, react.useEffect)(() => {
+		if (pendingLongPress) {
+			const timeoutId = setTimeout(() => {
+				setPendingLongPress(false);
+				setLongPress(true);
+			}, delayLongPressMs);
+			return () => {
+				clearTimeout(timeoutId);
+			};
+		}
+	}, [pendingLongPress, delayLongPressMs]);
+	(0, react.useEffect)(() => {
+		if (longPress) {
+			state.current.longPress = true;
+			return savedOnLongPress.current?.();
+		}
+	}, [longPress]);
 };
 
-exports.usePressable = usePressable;
+//#endregion
+exports.usePressable = usePressable;

package/lib/components/Tag/DismissibleTag.js

@@ -1,171 +1,134 @@
 /**
- * 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.
  */
 
-'use strict';
+const require_runtime = require('../../_virtual/_rolldown/runtime.js');
+const require_usePrefix = require('../../internal/usePrefix.js');
+const require_Text = require('../Text/Text.js');
+const require_useIsomorphicEffect = require('../../internal/useIsomorphicEffect.js');
+const require_useId = require('../../internal/useId.js');
+const require_deprecate = require('../../prop-types/deprecate.js');
+const require_Tooltip = require('../Tooltip/Tooltip.js');
+const require_index = require('../AILabel/index.js');
+const require_utils = require('../../internal/utils.js');
+const require_mergeRefs = require('../../tools/mergeRefs.js');
+const require_isEllipsisActive = require('./isEllipsisActive.js');
+const require_Tag = require('./Tag.js');
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react = require("react");
+react = require_runtime.__toESM(react);
+let prop_types = require("prop-types");
+prop_types = require_runtime.__toESM(prop_types);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _carbon_icons_react = require("@carbon/icons-react");
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
-var PropTypes = require('prop-types');
-var React = require('react');
-var cx = require('classnames');
-var useId = require('../../internal/useId.js');
-var usePrefix = require('../../internal/usePrefix.js');
-var deprecate = require('../../prop-types/deprecate.js');
-var Tag = require('./Tag.js');
-var iconsReact = require('@carbon/icons-react');
-require('../Tooltip/DefinitionTooltip.js');
-var Tooltip = require('../Tooltip/Tooltip.js');
-var Text = require('../Text/Text.js');
-require('../Text/TextDirection.js');
-var isEllipsisActive = require('./isEllipsisActive.js');
-var mergeRefs = require('../../tools/mergeRefs.js');
-var index = require('../AILabel/index.js');
-var utils = require('../../internal/utils.js');
-var useIsomorphicEffect = require('../../internal/useIsomorphicEffect.js');
-
-var _Close;
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
-const DismissibleTag = /*#__PURE__*/React.forwardRef(({
-  className,
-  decorator,
-  disabled,
-  id,
-  renderIcon,
-  title = 'Dismiss',
-  onClose,
-  slug,
-  size,
-  text,
-  tagTitle,
-  type,
-  dismissTooltipAlignment = 'bottom',
-  dismissTooltipLabel = 'Dismiss tag',
-  ...other
-}, forwardRef) => {
-  const prefix = usePrefix.usePrefix();
-  const tagLabelRef = React.useRef(null);
-  const generatedTagId = useId.useId();
-  const tagId = id ?? `tag-${generatedTagId}`;
-  const tagClasses = cx(`${prefix}--tag--filter`, className);
-  const [isEllipsisApplied, setIsEllipsisApplied] = React.useState(false);
-  useIsomorphicEffect.default(() => {
-    const newElement = tagLabelRef.current?.getElementsByClassName(`${prefix}--tag__label`)[0];
-    setIsEllipsisApplied(isEllipsisActive.isEllipsisActive(newElement));
-  }, [prefix, tagLabelRef]);
-  const combinedRef = mergeRefs.mergeRefs(tagLabelRef, forwardRef);
-  const handleClose = event => {
-    if (onClose) {
-      event.stopPropagation();
-      onClose(event);
-    }
-  };
-  const candidate = slug ?? decorator;
-  const candidateIsAILabel = utils.isComponentElement(candidate, index.AILabel);
-  const normalizedDecorator = candidateIsAILabel ? /*#__PURE__*/React.cloneElement(candidate, {
-    size: 'sm',
-    kind: 'inline'
-  }) : candidate;
-  const tooltipClasses = cx(`${prefix}--icon-tooltip`, `${prefix}--tag-label-tooltip`);
-
-  // Removing onClick from the spread operator
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  const {
-    onClick,
-    ...otherProps
-  } = other;
-  const dismissActionLabel = isEllipsisApplied ? dismissTooltipLabel : title;
-  return /*#__PURE__*/React.createElement(Tag.default, _rollupPluginBabelHelpers.extends({
-    ref: combinedRef,
-    type: type,
-    size: size,
-    renderIcon: renderIcon,
-    disabled: disabled,
-    className: tagClasses,
-    id: tagId
-  }, otherProps), /*#__PURE__*/React.createElement("div", {
-    className: `${prefix}--interactive--tag-children`
-  }, /*#__PURE__*/React.createElement(Text.Text, {
-    title: tagTitle ? tagTitle : text,
-    className: `${prefix}--tag__label`
-  }, text), slug ? normalizedDecorator : decorator ? /*#__PURE__*/React.createElement("div", {
-    className: `${prefix}--tag__decorator`
-  }, normalizedDecorator) : '', /*#__PURE__*/React.createElement(Tooltip.Tooltip, {
-    label: dismissActionLabel,
-    align: dismissTooltipAlignment,
-    className: tooltipClasses,
-    leaveDelayMs: 0,
-    closeOnActivation: true
-  }, /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    className: `${prefix}--tag__close-icon`,
-    onClick: handleClose,
-    disabled: disabled,
-    "aria-label": dismissActionLabel
-  }, _Close || (_Close = /*#__PURE__*/React.createElement(iconsReact.Close, null))))));
+//#region src/components/Tag/DismissibleTag.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 DismissibleTag = (0, react.forwardRef)(({ className, decorator, disabled, id, renderIcon, title = "Dismiss", onClose, slug, size, text, tagTitle, type, dismissTooltipAlignment = "bottom", dismissTooltipLabel = "Dismiss tag", ...other }, forwardRef) => {
+	const prefix = require_usePrefix.usePrefix();
+	const tagLabelRef = (0, react.useRef)(null);
+	const generatedTagId = require_useId.useId();
+	const tagId = id ?? `tag-${generatedTagId}`;
+	const tagClasses = (0, classnames.default)(`${prefix}--tag--filter`, className);
+	const [isEllipsisApplied, setIsEllipsisApplied] = (0, react.useState)(false);
+	require_useIsomorphicEffect.default(() => {
+		const newElement = tagLabelRef.current?.getElementsByClassName(`${prefix}--tag__label`)[0];
+		setIsEllipsisApplied(require_isEllipsisActive.isEllipsisActive(newElement));
+	}, [prefix, tagLabelRef]);
+	const combinedRef = require_mergeRefs.mergeRefs(tagLabelRef, forwardRef);
+	const handleClose = (event) => {
+		if (onClose) {
+			event.stopPropagation();
+			onClose(event);
+		}
+	};
+	const candidate = slug ?? decorator;
+	const normalizedDecorator = require_utils.isComponentElement(candidate, require_index.AILabel) ? (0, react.cloneElement)(candidate, {
+		size: "sm",
+		kind: "inline"
+	}) : candidate;
+	const tooltipClasses = (0, classnames.default)(`${prefix}--icon-tooltip`, `${prefix}--tag-label-tooltip`);
+	const { onClick, ...otherProps } = other;
+	const dismissActionLabel = isEllipsisApplied ? dismissTooltipLabel : title;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tag.default, {
+		ref: combinedRef,
+		type,
+		size,
+		renderIcon,
+		disabled,
+		className: tagClasses,
+		id: tagId,
+		...otherProps,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: `${prefix}--interactive--tag-children`,
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Text.Text, {
+					title: tagTitle ? tagTitle : text,
+					className: `${prefix}--tag__label`,
+					children: text
+				}),
+				slug ? normalizedDecorator : decorator ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: `${prefix}--tag__decorator`,
+					children: normalizedDecorator
+				}) : "",
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Tooltip.Tooltip, {
+					label: dismissActionLabel,
+					align: dismissTooltipAlignment,
+					className: tooltipClasses,
+					leaveDelayMs: 0,
+					closeOnActivation: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: `${prefix}--tag__close-icon`,
+						onClick: handleClose,
+						disabled,
+						"aria-label": dismissActionLabel,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_carbon_icons_react.Close, {})
+					})
+				})
+			]
+		})
+	});
 });
 DismissibleTag.propTypes = {
-  /**
-   * Provide a custom className that is applied to the containing <span>
-   */
-  className: PropTypes.string,
-  /**
-   * **Experimental:** Provide a `decorator` component to be rendered inside the `DismissibleTag` component
-   */
-  decorator: PropTypes.node,
-  /**
-   * Specify if the `DismissibleTag` is disabled
-   */
-  disabled: PropTypes.bool,
-  /**
-   * Specify the tooltip alignment for the dismiss button
-   */
-  dismissTooltipAlignment: PropTypes.oneOf(['top', 'bottom', 'left', 'right', 'top-start', 'top-end', 'bottom-start', 'bottom-end', 'left-end', 'left-start', 'right-end', 'right-start']),
-  /**
-   * Provide a custom tooltip label for the dismiss button
-   */
-  dismissTooltipLabel: PropTypes.string,
-  /**
-   * Specify the id for the tag.
-   */
-  id: PropTypes.string,
-  /**
-   * Click handler for filter tag close button.
-   */
-  onClose: PropTypes.func,
-  /**
-   * A component used to render an icon.
-   */
-  renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
-  /**
-   * Specify the size of the Tag. Currently supports either `sm`,
-   * `md` (default) or `lg` sizes.
-   */
-  size: PropTypes.oneOf(Object.keys(Tag.SIZES)),
-  /**
-   * **Experimental:** Provide a `Slug` component to be rendered inside the `DismissibleTag` component
-   */
-  slug: deprecate.deprecate(PropTypes.node, 'The `slug` prop has been deprecated and will be removed in the next major version. Use the decorator prop instead.'),
-  /**
-   * Provide text to be rendered inside of a the tag.
-   */
-  text: PropTypes.string,
-  /**
-   * Provide a custom `title` to be inserted in the tag.
-   */
-  tagTitle: PropTypes.string,
-  /**
-   * Text to show on clear filters
-   */
-  title: PropTypes.string,
-  /**
-   * Specify the type of the `Tag`
-   */
-  type: PropTypes.oneOf(Object.keys(Tag.TYPES))
+	className: prop_types.default.string,
+	decorator: prop_types.default.node,
+	disabled: prop_types.default.bool,
+	dismissTooltipAlignment: prop_types.default.oneOf([
+		"top",
+		"bottom",
+		"left",
+		"right",
+		"top-start",
+		"top-end",
+		"bottom-start",
+		"bottom-end",
+		"left-end",
+		"left-start",
+		"right-end",
+		"right-start"
+	]),
+	dismissTooltipLabel: prop_types.default.string,
+	id: prop_types.default.string,
+	onClose: prop_types.default.func,
+	renderIcon: prop_types.default.oneOfType([prop_types.default.func, prop_types.default.object]),
+	size: prop_types.default.oneOf(Object.keys(require_Tag.SIZES)),
+	slug: require_deprecate.deprecate(prop_types.default.node, "The `slug` prop has been deprecated and will be removed in the next major version. Use the decorator prop instead."),
+	text: prop_types.default.string,
+	tagTitle: prop_types.default.string,
+	title: prop_types.default.string,
+	type: prop_types.default.oneOf(Object.keys(require_Tag.TYPES))
 };
+const types = Object.keys(require_Tag.TYPES);
 
-exports.default = DismissibleTag;
+//#endregion
+exports.default = DismissibleTag;