@carbon/ibm-products 2.95.0 → 2.96.0

package/es/components/Card/next/Card.d.ts

@@ -5,96 +5,33 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-import PropTypes from 'prop-types';
 import { CardProps } from './Card.types';
 import { CardHeader } from './CardHeader';
 import { CardBody } from './CardBody';
 import { CardFooter } from './CardFooter';
 import { CardHeaderMedia } from './CardHeaderMedia';
 import { CardMedia } from './CardMedia';
-import { CardLabel } from './CardLabel';
 import { CardTitle } from './CardTitle';
 import { CardTitleMedia } from './CardTitleMedia';
-import { CardCaption } from './CardCaption';
 import { CardActions } from './CardActions';
 import { CardAction } from './CardAction';
 export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>> & {
     Header: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
     Body: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
     Footer: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
-    HeaderMedia: {
-        ({ children, className, ...rest }: import("./CardHeaderMedia").CardHeaderMediaProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-        };
-        displayName: string;
-    };
-    Media: {
-        ({ children, className, ...rest }: import("./CardMedia").CardMediaProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-        };
-        displayName: string;
-    };
-    Label: {
-        ({ children, className, truncate, ...rest }: import("./CardLabel").CardLabelProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-            truncate: PropTypes.Requireable<boolean>;
-        };
-        displayName: string;
-    };
-    Title: {
-        ({ children, className, truncate, maxWidth, titleStart, titleEnd, ...rest }: import("./CardTitle").CardTitleProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-            maxWidth: PropTypes.Requireable<string>;
-            titleEnd: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            titleStart: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            truncate: PropTypes.Requireable<NonNullable<number | boolean>>;
-        };
-        displayName: string;
-    };
+    HeaderMedia: React.ForwardRefExoticComponent<import("./CardHeaderMedia").CardHeaderMediaProps & React.RefAttributes<HTMLDivElement>>;
+    Media: React.ForwardRefExoticComponent<import("./CardMedia").CardMediaProps & React.RefAttributes<HTMLDivElement>>;
+    Title: React.ForwardRefExoticComponent<import("./CardTitle").CardTitleProps & React.RefAttributes<HTMLDivElement>>;
     TitleMedia: React.ForwardRefExoticComponent<import("./CardTitleMedia").CardTitleMediaProps & React.RefAttributes<HTMLDivElement>>;
-    Caption: {
-        ({ children, className, truncate, ...rest }: import("./CardCaption").CardCaptionProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-            truncate: PropTypes.Requireable<boolean>;
-        };
-        displayName: string;
-    };
-    Actions: {
-        ({ children, className, overflowMenuLabel, ...rest }: import("./CardActions").CardActionsProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-            overflowMenuLabel: PropTypes.Requireable<string>;
-        };
-        displayName: string;
-    };
-    Action: {
-        ({ children, className, ...rest }: import("./CardAction").CardActionProps): React.JSX.Element;
-        propTypes: {
-            children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-            className: PropTypes.Requireable<string>;
-        };
-        displayName: string;
-    };
+    Actions: React.ForwardRefExoticComponent<import("./CardActions").CardActionsProps & React.RefAttributes<HTMLDivElement>>;
+    Action: React.ForwardRefExoticComponent<import("./CardAction").CardActionProps & React.RefAttributes<HTMLDivElement>>;
 };
-export { Card as default, CardHeader, CardBody, CardFooter, CardHeaderMedia, CardMedia, CardLabel, CardTitle, CardTitleMedia, CardCaption, CardActions, CardAction, };
+export { Card as default, CardHeader, CardBody, CardFooter, CardHeaderMedia, CardMedia, CardTitle, CardTitleMedia, CardActions, CardAction, };
 export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, } from './Card.types';
 export type { CardHeaderMediaProps } from './CardHeaderMedia';
 export type { CardMediaProps } from './CardMedia';
-export type { CardLabelProps } from './CardLabel';
 export type { CardTitleProps } from './CardTitle';
 export type { CardTitleMediaProps } from './CardTitleMedia';
-export type { CardCaptionProps } from './CardCaption';
 export type { CardActionsProps } from './CardActions';
 export type { CardActionProps } from './CardAction';
 //# sourceMappingURL=Card.d.ts.map

package/es/components/Card/next/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/Card.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAKzC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AA4K1C,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYf,CAAC;AAEH,OAAO,EACL,IAAI,IAAI,OAAO,EACf,UAAU,EACV,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,SAAS,EACT,SAAS,EACT,cAAc,EACd,WAAW,EACX,WAAW,EACX,UAAU,GACX,CAAC;AAEF,YAAY,EACV,SAAS,EACT,eAAe,EACf,aAAa,EACb,eAAe,GAChB,MAAM,cAAc,CAAC;AAGtB,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/Card.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAA2D,MAAM,OAAO,CAAC;AAIhF,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAKzC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AA0N1C,eAAO,MAAM,IAAI;;;;;;;;;;CAUf,CAAC;AAEH,OAAO,EACL,IAAI,IAAI,OAAO,EACf,UAAU,EACV,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,SAAS,EACT,cAAc,EACd,WAAW,EACX,UAAU,GACX,CAAC;AAEF,YAAY,EACV,SAAS,EACT,eAAe,EACf,aAAa,EACb,eAAe,GAChB,MAAM,cAAc,CAAC;AAGtB,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC"}

package/es/components/Card/next/Card.js

@@ -14,14 +14,13 @@ import { CardBody } from "./CardBody.js";
 import { CardFooter } from "./CardFooter.js";
 import { CardHeaderMedia } from "./CardHeaderMedia.js";
 import { CardMedia } from "./CardMedia.js";
-import { CardLabel } from "./CardLabel.js";
 import { CardTitle } from "./CardTitle.js";
 import { CardTitleMedia } from "./CardTitleMedia.js";
-import { CardCaption } from "./CardCaption.js";
 import { CardActions } from "./CardActions.js";
 import { CardAction } from "./CardAction.js";
-import React, { forwardRef, useMemo } from "react";
+import React, { forwardRef, isValidElement, useCallback, useMemo } from "react";
 import PropTypes from "prop-types";
+import { AILabel } from "@carbon/react";
 //#region src/components/Card/next/Card.tsx
 /**
 * Copyright IBM Corp. 2026
@@ -35,36 +34,40 @@ const blockClass = `${pkg.prefix}--card-next`;
 /**
 * Card component - Root container for composable card
 */
-const CardComponent = forwardRef(({ clickable = false, onClick, onKeyDown, disabled = false, density = "productive", decorator, className, children, ...rest }, ref) => {
-	const hasAILabel = decorator?.["type"]?.displayName === "AILabel";
-	const normalizedDecorator = useMemo(() => {
-		if (hasAILabel && React.isValidElement(decorator)) return React.cloneElement(decorator, { size: "xs" });
-		return decorator;
-	}, [decorator, hasAILabel]);
+let CardComponent = forwardRef(({ clickable = false, onClick, onKeyDown, disabled = false, density = "productive", decorator, horizontal = false, className, children, ...rest }, ref) => {
+	const hasAILabel = useMemo(() => isValidElement(decorator) && decorator.type === AILabel, [decorator]);
 	const contextValue = useMemo(() => ({
 		clickable,
 		disabled,
-		decorator: normalizedDecorator
+		decorator,
+		horizontal
 	}), [
 		clickable,
 		disabled,
-		normalizedDecorator
+		decorator,
+		horizontal
 	]);
-	const handleKeyDown = (event) => {
+	const handleKeyDown = useCallback((event) => {
 		if (clickable && !disabled && (event.key === "Enter" || event.key === " ")) {
 			event.preventDefault();
 			onClick?.(event);
 		}
 		onKeyDown?.(event);
-	};
-	const handleClick = (event) => {
+	}, [
+		clickable,
+		disabled,
+		onClick,
+		onKeyDown
+	]);
+	const handleClick = useCallback((event) => {
 		if (!disabled) onClick?.(event);
-	};
+	}, [disabled, onClick]);
 	const cardClasses = (0, import_classnames.default)(blockClass, className, {
 		[`${blockClass}--clickable`]: clickable && !disabled,
 		[`${blockClass}--disabled`]: disabled,
 		[`${blockClass}--${density}`]: density,
-		[`${blockClass}--has-ai-label`]: hasAILabel
+		[`${blockClass}--has-ai-label`]: hasAILabel,
+		[`${blockClass}--horizontal`]: horizontal
 	});
 	const cardProps = {
 		...rest,
@@ -78,9 +81,27 @@ const CardComponent = forwardRef(({ clickable = false, onClick, onKeyDown, disab
 			"aria-disabled": disabled
 		}
 	};
-	return /* @__PURE__ */ React.createElement(CardContext.Provider, { value: contextValue }, /* @__PURE__ */ React.createElement("div", cardProps, children));
+	const { mediaChildren, contentChildren, mediaIsFirst } = useMemo(() => {
+		if (!horizontal) return {
+			mediaChildren: [],
+			contentChildren: [],
+			mediaIsFirst: false
+		};
+		const childArray = React.Children.toArray(children);
+		const isMedia = (child) => React.isValidElement(child) && child.type === CardMedia;
+		return {
+			mediaChildren: childArray.filter(isMedia),
+			contentChildren: childArray.filter((c) => !isMedia(c)),
+			mediaIsFirst: childArray.findIndex(isMedia) < childArray.findIndex((c) => !isMedia(c))
+		};
+	}, [children, horizontal]);
+	let renderedChildren = children;
+	if (horizontal) {
+		const contentWrapper = /* @__PURE__ */ React.createElement("div", { className: `${blockClass}__content` }, contentChildren);
+		renderedChildren = mediaIsFirst ? /* @__PURE__ */ React.createElement(React.Fragment, null, mediaChildren, contentWrapper) : /* @__PURE__ */ React.createElement(React.Fragment, null, contentWrapper, mediaChildren);
+	}
+	return /* @__PURE__ */ React.createElement(CardContext.Provider, { value: contextValue }, /* @__PURE__ */ React.createElement("div", cardProps, renderedChildren));
 });
-CardComponent.displayName = componentName;
 CardComponent.propTypes = {
 	/**
 	* Card content
@@ -107,6 +128,10 @@ CardComponent.propTypes = {
 	*/
 	disabled: PropTypes.bool,
 	/**
+	* When true, renders media on the left and content (header/body/footer) on the right
+	*/
+	horizontal: PropTypes.bool,
+	/**
 	* Click handler for clickable cards
 	*/
 	onClick: PropTypes.func,
@@ -115,6 +140,8 @@ CardComponent.propTypes = {
 	*/
 	onKeyDown: PropTypes.func
 };
+CardComponent = pkg.checkComponentEnabled(CardComponent, componentName);
+CardComponent.displayName = componentName;
 /**
 * -------
 * Exports
@@ -130,14 +157,10 @@ const HeaderMedia = CardHeaderMedia;
 HeaderMedia.displayName = "Card.HeaderMedia";
 const Media = CardMedia;
 Media.displayName = "Card.Media";
-const Label = CardLabel;
-Label.displayName = "Card.Label";
 const Title = CardTitle;
 Title.displayName = "Card.Title";
 const TitleMedia = CardTitleMedia;
 TitleMedia.displayName = "Card.TitleMedia";
-const Caption = CardCaption;
-Caption.displayName = "Card.Caption";
 const Actions = CardActions;
 Actions.displayName = "Card.Actions";
 const Action = CardAction;
@@ -148,10 +171,8 @@ const Card = Object.assign(CardComponent, {
 	Footer,
 	HeaderMedia,
 	Media,
-	Label,
 	Title,
 	TitleMedia,
-	Caption,
 	Actions,
 	Action
 });

package/es/components/Card/next/Card.types.d.ts

@@ -4,7 +4,7 @@
  * 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 { ReactNode } from 'react';
+import { ReactNode, MouseEvent, KeyboardEvent } from 'react';
 /**
  * Base props shared across card components
  */
@@ -29,11 +29,11 @@ export interface CardProps extends CardBaseProps {
     /**
      * Click handler for clickable cards
      */
-    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    onClick?: (event: MouseEvent<HTMLDivElement>) => void;
     /**
      * Keyboard event handler for clickable cards
      */
-    onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+    onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void;
     /**
      * Disables the card and all interactive elements
      */
@@ -47,6 +47,11 @@ export interface CardProps extends CardBaseProps {
      * Renders in the top-right corner of the card header with a blue gradient border.
      */
     decorator?: ReactNode;
+    /**
+     * When true, the card renders in a horizontal layout: media on the left,
+     * header/body/footer stacked vertically on the right.
+     */
+    horizontal?: boolean;
 }
 /**
  * Props for CardHeader component
@@ -76,5 +81,9 @@ export interface CardContextValue {
      * Optional decorator component (typically AILabel) to be rendered by CardHeader
      */
     decorator?: ReactNode;
+    /**
+     * Whether the card is in horizontal layout mode
+     */
+    horizontal: boolean;
 }
 //# sourceMappingURL=Card.types.d.ts.map

package/es/components/Card/next/Card.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/Card.types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACjE;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,GAAG,YAAY,CAAC;IACtC;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,aAAa,CAAC;AAE5C;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC;AAE1C;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,aAAa,CAAC;AAE5C;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB"}
+{"version":3,"file":"Card.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/Card.types.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE7D;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IACtD;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC3D;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,GAAG,YAAY,CAAC;IACtC;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,aAAa,CAAC;AAE5C;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC;AAE1C;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,aAAa,CAAC;AAE5C;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;OAEG;IACH,UAAU,EAAE,OAAO,CAAC;CACrB"}

package/es/components/Card/next/CardAction.d.ts

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-import PropTypes from 'prop-types';
 export interface CardActionProps {
     /**
      * Provide the contents of the CardAction (typically a Button or IconButton).
@@ -17,6 +16,12 @@ export interface CardActionProps {
      * Provide an optional class to be applied to the containing node.
      */
     className?: string;
+    /**
+     * Label shown in the overflow menu when this action is hidden.
+     * If not provided, CardActions will attempt to read it from the
+     * direct child's props (label, iconDescription, or children text).
+     */
+    label?: string;
 }
 /**
  * CardAction is a wrapper for interactive elements in the card footer.
@@ -26,18 +31,5 @@ export interface CardActionProps {
  * Note: do not use CardAction inside a clickable card — clickable cards
  * should not contain interactive elements (see usage guidelines).
  */
-export declare const CardAction: {
-    ({ children, className, ...rest }: CardActionProps): React.JSX.Element;
-    propTypes: {
-        /**
-         * Provide the contents of the CardAction.
-         */
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Provide an optional class to be applied to the containing node.
-         */
-        className: PropTypes.Requireable<string>;
-    };
-    displayName: string;
-};
+export declare let CardAction: React.ForwardRefExoticComponent<CardActionProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardAction.d.ts.map

package/es/components/Card/next/CardAction.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardAction.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardAction.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AAQnC,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU;uCAIpB,eAAe;;QAahB;;WAEG;;QAGH;;WAEG;;;;CAVJ,CAAC"}
+{"version":3,"file":"CardAction.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardAction.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AASrD,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;GAOG;AACH,eAAO,IAAI,UAAU,wFAapB,CAAC"}

package/es/components/Card/next/CardAction.js

@@ -9,7 +9,7 @@ import { __toESM } from "../../../_virtual/_rolldown/runtime.js";
 import { require_classnames } from "../../../node_modules/classnames/index.js";
 import { pkg } from "../../../settings.js";
 import { getDevtoolsProps } from "../../../global/js/utils/devtools.js";
-import React from "react";
+import React, { forwardRef } from "react";
 import PropTypes from "prop-types";
 //#region src/components/Card/next/CardAction.tsx
 /**
@@ -29,13 +29,14 @@ const componentName = "CardAction";
 * Note: do not use CardAction inside a clickable card — clickable cards
 * should not contain interactive elements (see usage guidelines).
 */
-const CardAction = ({ children, className, ...rest }) => {
+let CardAction = forwardRef(({ children, className, ...rest }, ref) => {
 	return /* @__PURE__ */ React.createElement("div", {
 		...rest,
+		ref,
 		className: (0, import_classnames.default)(`${blockClass}__action`, className),
 		...getDevtoolsProps(componentName)
 	}, children);
-};
+});
 CardAction.propTypes = {
 	/**
 	* Provide the contents of the CardAction.
@@ -44,8 +45,13 @@ CardAction.propTypes = {
 	/**
 	* Provide an optional class to be applied to the containing node.
 	*/
-	className: PropTypes.string
+	className: PropTypes.string,
+	/**
+	* Label shown in the overflow menu when this action is hidden.
+	*/
+	label: PropTypes.string
 };
+CardAction = pkg.checkComponentEnabled(CardAction, componentName);
 CardAction.displayName = componentName;
 //#endregion
 export { CardAction };

package/es/components/Card/next/CardActions.d.ts

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React, { ReactNode } from 'react';
-import PropTypes from 'prop-types';
 export interface CardActionsProps {
     /**
      * Provide the contents of the CardActions (typically CardAction components).
@@ -25,22 +24,5 @@ export interface CardActionsProps {
  * Positioned in the top-right corner with 8px gap between actions.
  * When actions exceed 50% of available header space, overflow menu is shown.
  */
-export declare const CardActions: {
-    ({ children, className, overflowMenuLabel, ...rest }: CardActionsProps): React.JSX.Element;
-    propTypes: {
-        /**
-         * Provide the contents of the CardActions.
-         */
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Provide an optional class to be applied to the containing node.
-         */
-        className: PropTypes.Requireable<string>;
-        /**
-         * Aria label for the overflow menu
-         */
-        overflowMenuLabel: PropTypes.Requireable<string>;
-    };
-    displayName: string;
-};
+export declare let CardActions: React.ForwardRefExoticComponent<CardActionsProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardActions.d.ts.map

package/es/components/Card/next/CardActions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardActions.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardActions.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAyC,MAAM,OAAO,CAAC;AAChF,OAAO,SAAS,MAAM,YAAY,CAAC;AAUnC,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAQD;;;;GAIG;AACH,eAAO,MAAM,WAAW;0DAKrB,gBAAgB;;QA2FjB;;WAEG;;QAGH;;WAEG;;QAGH;;WAEG;;;;CAfJ,CAAC"}
+{"version":3,"file":"CardActions.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardActions.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAEZ,SAAS,EAMV,MAAM,OAAO,CAAC;AAYf,MAAM,WAAW,gBAAgB;IAC/B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAQD;;;;GAIG;AACH,eAAO,IAAI,WAAW,yFAwGrB,CAAC"}

package/es/components/Card/next/CardActions.js

@@ -9,7 +9,7 @@ import { __toESM } from "../../../_virtual/_rolldown/runtime.js";
 import { require_classnames } from "../../../node_modules/classnames/index.js";
 import { pkg } from "../../../settings.js";
 import { getDevtoolsProps } from "../../../global/js/utils/devtools.js";
-import React, { Children, useEffect, useRef, useState } from "react";
+import React, { Children, forwardRef, useEffect, useMemo, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import { FeatureFlags, OverflowMenu, OverflowMenuItem } from "@carbon/react";
 import { createOverflowHandler } from "@carbon/utilities";
@@ -28,27 +28,28 @@ const componentName = "CardActions";
 * Positioned in the top-right corner with 8px gap between actions.
 * When actions exceed 50% of available header space, overflow menu is shown.
 */
-const CardActions = ({ children, className, overflowMenuLabel = "More actions", ...rest }) => {
+let CardActions = forwardRef(({ children, className, overflowMenuLabel = "More actions", ...rest }, ref) => {
 	const containerRef = useRef(null);
 	const [hiddenItems, setHiddenItems] = useState([]);
 	const classes = (0, import_classnames.default)(`${blockClass}__actions`, className);
-	const actionItems = [];
-	Children.forEach(children, (child, index) => {
-		if (React.isValidElement(child)) {
-			const id = `action-${index}`;
-			let label = overflowMenuLabel;
-			const childProps = child.props;
-			if (childProps.children && React.isValidElement(childProps.children)) {
-				const iconButton = childProps.children;
-				label = iconButton.props?.label || iconButton.props?.iconDescription || `Action ${index + 1}`;
+	const actionItems = useMemo(() => {
+		const items = [];
+		Children.forEach(children, (child, index) => {
+			if (React.isValidElement(child)) {
+				const actionProps = child.props;
+				const button = actionProps.children;
+				const buttonProps = React.isValidElement(button) ? button.props : null;
+				const label = actionProps.label ?? buttonProps?.label ?? buttonProps?.iconDescription ?? (typeof buttonProps?.children === "string" ? buttonProps.children : `Action ${index + 1}`);
+				const id = `${label}-${index}`;
+				items.push({
+					id,
+					element: child,
+					label
+				});
 			}
-			actionItems.push({
-				id,
-				element: child,
-				label
-			});
-		}
-	});
+		});
+		return items;
+	}, [children]);
 	useEffect(() => {
 		if (!containerRef.current || actionItems.length === 0) return;
 		const handler = createOverflowHandler({
@@ -61,7 +62,11 @@ const CardActions = ({ children, className, overflowMenuLabel = "More actions",
 		return () => handler.disconnect();
 	}, [children]);
 	return /* @__PURE__ */ React.createElement("div", {
-		ref: containerRef,
+		ref: (node) => {
+			containerRef.current = node;
+			if (typeof ref === "function") ref(node);
+			else if (ref) ref.current = node;
+		},
 		className: classes,
 		...rest,
 		...getDevtoolsProps(componentName)
@@ -71,8 +76,7 @@ const CardActions = ({ children, className, overflowMenuLabel = "More actions",
 	}, item.element)), /* @__PURE__ */ React.createElement("div", {
 		"data-offset": true,
 		"data-hidden": true,
-		"data-floating-menu-container": true,
-		style: { position: "relative" }
+		"data-floating-menu-container": true
 	}, /* @__PURE__ */ React.createElement(FeatureFlags, { enableV12Overflowmenu: true }, /* @__PURE__ */ React.createElement(OverflowMenu, {
 		size: "sm",
 		"aria-label": overflowMenuLabel
@@ -87,7 +91,7 @@ const CardActions = ({ children, className, overflowMenuLabel = "More actions",
 			}
 		}
 	}))))));
-};
+});
 CardActions.propTypes = {
 	/**
 	* Provide the contents of the CardActions.
@@ -102,6 +106,7 @@ CardActions.propTypes = {
 	*/
 	overflowMenuLabel: PropTypes.string
 };
+CardActions = pkg.checkComponentEnabled(CardActions, componentName);
 CardActions.displayName = componentName;
 //#endregion
 export { CardActions };

package/es/components/Card/next/CardBody.d.ts

@@ -8,5 +8,5 @@ import React from 'react';
 /**
  * CardBody component - Body section of the card for free-form content
  */
-export declare const CardBody: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
+export declare let CardBody: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardBody.d.ts.map

package/es/components/Card/next/CardBody.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardBody.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAU1C;;GAEG;AACH,eAAO,MAAM,QAAQ,6GAUpB,CAAC"}
+{"version":3,"file":"CardBody.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardBody.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAU1C;;GAEG;AACH,eAAO,IAAI,QAAQ,6GAUlB,CAAC"}

package/es/components/Card/next/CardBody.js

@@ -23,7 +23,7 @@ const blockClass = `${pkg.prefix}--card-next__body`;
 /**
 * CardBody component - Body section of the card for free-form content
 */
-const CardBody = forwardRef(({ className, children, ...rest }, ref) => {
+let CardBody = forwardRef(({ className, children, ...rest }, ref) => {
 	const bodyClasses = (0, import_classnames.default)(blockClass, className);
 	return /* @__PURE__ */ React.createElement("div", {
 		...rest,
@@ -31,7 +31,6 @@ const CardBody = forwardRef(({ className, children, ...rest }, ref) => {
 		className: bodyClasses
 	}, children);
 });
-CardBody.displayName = componentName;
 CardBody.propTypes = {
 	/**
 	* Body content
@@ -42,5 +41,7 @@ CardBody.propTypes = {
 	*/
 	className: PropTypes.string
 };
+CardBody = pkg.checkComponentEnabled(CardBody, componentName);
+CardBody.displayName = componentName;
 //#endregion
 export { CardBody };

package/es/components/Card/next/CardFooter.d.ts

@@ -8,5 +8,5 @@ import React from 'react';
 /**
  * CardFooter component - Footer section of the card
  */
-export declare const CardFooter: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
+export declare let CardFooter: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardFooter.d.ts.map

package/es/components/Card/next/CardFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardFooter.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAS1C;;GAEG;AACH,eAAO,MAAM,UAAU,6GAUtB,CAAC"}
+{"version":3,"file":"CardFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardFooter.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAS1C;;GAEG;AACH,eAAO,IAAI,UAAU,6GAUpB,CAAC"}

package/es/components/Card/next/CardFooter.js

@@ -23,7 +23,7 @@ const blockClass = `${pkg.prefix}--card-next__footer`;
 /**
 * CardFooter component - Footer section of the card
 */
-const CardFooter = forwardRef(({ className, children, ...rest }, ref) => {
+let CardFooter = forwardRef(({ className, children, ...rest }, ref) => {
 	const footerClasses = (0, import_classnames.default)(blockClass, className);
 	return /* @__PURE__ */ React.createElement("div", {
 		...rest,
@@ -31,7 +31,6 @@ const CardFooter = forwardRef(({ className, children, ...rest }, ref) => {
 		className: footerClasses
 	}, children);
 });
-CardFooter.displayName = componentName;
 CardFooter.propTypes = {
 	/**
 	* Footer content
@@ -42,5 +41,7 @@ CardFooter.propTypes = {
 	*/
 	className: PropTypes.string
 };
+CardFooter = pkg.checkComponentEnabled(CardFooter, componentName);
+CardFooter.displayName = componentName;
 //#endregion
 export { CardFooter };

package/es/components/Card/next/CardHeader.d.ts

@@ -6,7 +6,13 @@
  */
 import React from 'react';
 /**
- * CardHeader component - Header section of the card
+ * CardHeader component - Header section of the card.
+ * Layout is handled entirely by CSS Grid on __header:
+ *   - CardHeaderMedia spans both columns (full-width row above the title area)
+ *   - CardTitleMedia occupies column 1 (left icon slot)
+ *   - CardTitle occupies column 2 (right text slot), or spans full width when
+ *     CardTitleMedia is absent — detected by the :has selector in SCSS.
+ * No child-scanning or wrapper injection is needed.
  */
-export declare const CardHeader: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
+export declare let CardHeader: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardHeader.d.ts.map

package/es/components/Card/next/CardHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardHeader.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAC;AAU/E;;GAEG;AACH,eAAO,MAAM,UAAU,6GA4EtB,CAAC"}
+{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardHeader.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAkC,MAAM,OAAO,CAAC;AAUvD;;;;;;;;GAQG;AACH,eAAO,IAAI,UAAU,6GA+BpB,CAAC"}