@carbon/ibm-products 2.95.0 → 2.96.0

package/lib/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/lib/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/lib/components/Card/next/CardFooter.js

@@ -25,7 +25,7 @@ const blockClass = `${require_settings.pkg.prefix}--card-next__footer`;
 /**
 * CardFooter component - Footer section of the card
 */
-const CardFooter = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
+let CardFooter = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
 	const footerClasses = (0, import_classnames.default)(blockClass, className);
 	return /* @__PURE__ */ react.default.createElement("div", {
 		...rest,
@@ -33,7 +33,6 @@ const CardFooter = (0, react.forwardRef)(({ className, children, ...rest }, ref)
 		className: footerClasses
 	}, children);
 });
-CardFooter.displayName = componentName;
 CardFooter.propTypes = {
 	/**
 	* Footer content
@@ -44,5 +43,12 @@ CardFooter.propTypes = {
 	*/
 	className: prop_types.default.string
 };
+CardFooter = require_settings.pkg.checkComponentEnabled(CardFooter, componentName);
+CardFooter.displayName = componentName;
 //#endregion
-exports.CardFooter = CardFooter;
+Object.defineProperty(exports, "CardFooter", {
+	enumerable: true,
+	get: function() {
+		return CardFooter;
+	}
+});

package/lib/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/lib/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"}

package/lib/components/Card/next/CardHeader.js

@@ -24,39 +24,30 @@ var import_classnames = /* @__PURE__ */ require_runtime.__toESM(require_index.de
 const componentName = "CardHeader";
 const blockClass = `${require_settings.pkg.prefix}--card-next__header`;
 /**
-* 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.
 */
-const CardHeader = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
+let CardHeader = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
 	const context = require_CardContext.useCardContext();
 	const cardBlockClass = `${require_settings.pkg.prefix}--card-next`;
-	const hasTitleMedia = react.Children.toArray(children).some((child) => {
-		return (0, react.isValidElement)(child) && child.type?.["displayName"] === "Card.TitleMedia";
-	});
-	const titleMediaElements = [];
-	const mediaElements = [];
-	const otherContent = [];
-	if (hasTitleMedia) react.Children.forEach(children, (child) => {
-		if ((0, react.isValidElement)(child) && child.type?.["displayName"] === "Card.TitleMedia") titleMediaElements.push(child);
-		else if ((0, react.isValidElement)(child) && child.type?.["displayName"] === "Card.Media") mediaElements.push(child);
-		else otherContent.push(child);
-	});
-	const headerClasses = (0, import_classnames.default)(blockClass, className);
+	const handleDecoratorClick = (0, react.useCallback)((e) => e.stopPropagation(), []);
+	const handleDecoratorKeyDown = (0, react.useCallback)((e) => e.stopPropagation(), []);
 	return /* @__PURE__ */ react.default.createElement("div", {
 		...rest,
 		ref,
-		className: headerClasses
-	}, hasTitleMedia ? /* @__PURE__ */ react.default.createElement(react.default.Fragment, null, mediaElements, /* @__PURE__ */ react.default.createElement("div", { className: `${cardBlockClass}__header-content` }, titleMediaElements, /* @__PURE__ */ react.default.createElement("div", { className: `${cardBlockClass}__title-content` }, otherContent))) : children, context.decorator && /* @__PURE__ */ react.default.createElement("div", {
+		className: (0, import_classnames.default)(blockClass, className)
+	}, children, context.decorator && /* @__PURE__ */ react.default.createElement("div", {
 		className: `${cardBlockClass}__decorator`,
 		role: "presentation",
-		onClick: (e) => {
-			e.stopPropagation();
-		},
-		onKeyDown: (e) => {
-			e.stopPropagation();
-		}
+		onClick: handleDecoratorClick,
+		onKeyDown: handleDecoratorKeyDown
 	}, context.decorator));
 });
-CardHeader.displayName = componentName;
 CardHeader.propTypes = {
 	/**
 	* Header content
@@ -67,5 +58,12 @@ CardHeader.propTypes = {
 	*/
 	className: prop_types.default.string
 };
+CardHeader = require_settings.pkg.checkComponentEnabled(CardHeader, componentName);
+CardHeader.displayName = componentName;
 //#endregion
-exports.CardHeader = CardHeader;
+Object.defineProperty(exports, "CardHeader", {
+	enumerable: true,
+	get: function() {
+		return CardHeader;
+	}
+});

package/lib/components/Card/next/CardHeaderMedia.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 CardHeaderMediaProps {
     /**
      * Provide the contents of the CardHeaderMedia.
@@ -16,18 +15,5 @@ export interface CardHeaderMediaProps {
      */
     className?: string;
 }
-export declare const CardHeaderMedia: {
-    ({ children, className, ...rest }: CardHeaderMediaProps): React.JSX.Element;
-    propTypes: {
-        /**
-         * Provide the contents of the CardHeaderMedia.
-         */
-        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 CardHeaderMedia: React.ForwardRefExoticComponent<CardHeaderMediaProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardHeaderMedia.d.ts.map

package/lib/components/Card/next/CardHeaderMedia.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardHeaderMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardHeaderMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AAQnC,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,eAAe;uCAIzB,oBAAoB;;QAWrB;;WAEG;;QAGH;;WAEG;;;;CAVJ,CAAC"}
+{"version":3,"file":"CardHeaderMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardHeaderMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AASrD,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,IAAI,eAAe,6FAezB,CAAC"}

package/lib/components/Card/next/CardHeaderMedia.js

@@ -23,14 +23,15 @@ prop_types = require_runtime.__toESM(prop_types);
 var import_classnames = /* @__PURE__ */ require_runtime.__toESM(require_index.default);
 const blockClass = `${require_settings.pkg.prefix}--card-next`;
 const componentName = "CardHeaderMedia";
-const CardHeaderMedia = ({ children, className, ...rest }) => {
+let CardHeaderMedia = (0, react.forwardRef)(({ children, className, ...rest }, ref) => {
 	const classes = (0, import_classnames.default)(`${blockClass}__header-media`, className);
 	return /* @__PURE__ */ react.default.createElement("div", {
 		...rest,
+		ref,
 		className: classes,
 		...require_devtools.getDevtoolsProps(componentName)
 	}, children);
-};
+});
 CardHeaderMedia.propTypes = {
 	/**
 	* Provide the contents of the CardHeaderMedia.
@@ -41,6 +42,12 @@ CardHeaderMedia.propTypes = {
 	*/
 	className: prop_types.default.string
 };
+CardHeaderMedia = require_settings.pkg.checkComponentEnabled(CardHeaderMedia, componentName);
 CardHeaderMedia.displayName = componentName;
 //#endregion
-exports.CardHeaderMedia = CardHeaderMedia;
+Object.defineProperty(exports, "CardHeaderMedia", {
+	enumerable: true,
+	get: function() {
+		return CardHeaderMedia;
+	}
+});

package/lib/components/Card/next/CardMedia.d.ts

@@ -5,7 +5,6 @@
  * LICENSE file in the root directory of this source tree.
  */
 import React from 'react';
-import PropTypes from 'prop-types';
 import { AspectRatioProps } from '@carbon/react';
 export interface CardMediaProps extends Omit<AspectRatioProps, 'className'> {
     /**
@@ -16,24 +15,19 @@ export interface CardMediaProps extends Omit<AspectRatioProps, 'className'> {
      * Provide an optional class to be applied to the containing node.
      */
     className?: string;
+    /**
+     * Width of the media column when the card is in horizontal layout.
+     * Accepts any valid CSS width value (e.g. '200px', '40%').
+     * Defaults to '33.33%'. Has no effect in vertical (default) layout.
+     */
+    mediaWidth?: string;
 }
 /**
- * CardMedia is a media slot component that maintains aspect ratio using Carbon's AspectRatio.
- * Used for images, profiles, tags, large pictograms, and other substantial content in the card.
- * Supports all Carbon AspectRatio props including ratio: '1x1', '2x1', '2x3', '3x2', '4x3', '9x16', '16x9'
+ * CardMedia is a media slot component that maintains aspect ratio.
+ *
+ * In vertical (default) mode it delegates to Carbon's AspectRatio.
+ * In horizontal mode it renders a plain div sized to `mediaWidth` (default
+ * 33.33%) that stretches to the full card height — no aspect-ratio math needed.
  */
-export declare const CardMedia: {
-    ({ children, className, ...rest }: CardMediaProps): React.JSX.Element;
-    propTypes: {
-        /**
-         * Provide the contents of the CardMedia.
-         */
-        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 CardMedia: React.ForwardRefExoticComponent<CardMediaProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardMedia.d.ts.map

package/lib/components/Card/next/CardMedia.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAe,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAO9D,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,gBAAgB,EAAE,WAAW,CAAC;IACzE;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,SAAS;uCAAsC,cAAc;;QAexE;;WAEG;;QAGH;;WAEG;;;;CAVJ,CAAC"}
+{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAe,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAQ9D,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,gBAAgB,EAAE,WAAW,CAAC;IACzE;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;;;GAMG;AACH,eAAO,IAAI,SAAS,uFAkCnB,CAAC"}

package/lib/components/Card/next/CardMedia.js

@@ -9,6 +9,7 @@ const require_runtime = require("../../../_virtual/_rolldown/runtime.js");
 const require_index = require("../../../node_modules/classnames/index.js");
 const require_settings = require("../../../settings.js");
 const require_devtools = require("../../../global/js/utils/devtools.js");
+const require_CardContext = require("./CardContext.js");
 let react = require("react");
 react = require_runtime.__toESM(react);
 let prop_types = require("prop-types");
@@ -25,28 +26,41 @@ var import_classnames = /* @__PURE__ */ require_runtime.__toESM(require_index.de
 const blockClass = `${require_settings.pkg.prefix}--card-next`;
 const componentName = "CardMedia";
 /**
-* CardMedia is a media slot component that maintains aspect ratio using Carbon's AspectRatio.
-* Used for images, profiles, tags, large pictograms, and other substantial content in the card.
-* Supports all Carbon AspectRatio props including ratio: '1x1', '2x1', '2x3', '3x2', '4x3', '9x16', '16x9'
+* CardMedia is a media slot component that maintains aspect ratio.
+*
+* In vertical (default) mode it delegates to Carbon's AspectRatio.
+* In horizontal mode it renders a plain div sized to `mediaWidth` (default
+* 33.33%) that stretches to the full card height — no aspect-ratio math needed.
 */
-const CardMedia = ({ children, className, ...rest }) => {
+let CardMedia = (0, react.forwardRef)(({ children, className, ratio, mediaWidth = "33.33%", ...rest }, ref) => {
+	const { horizontal } = require_CardContext.useCardContext();
 	const classes = (0, import_classnames.default)(`${blockClass}__media`, className);
+	if (horizontal) return /* @__PURE__ */ react.default.createElement("div", {
+		ref,
+		className: `${blockClass}__media ${blockClass}__media--horizontal`,
+		style: { [`--${blockClass}--media-width`]: mediaWidth },
+		...require_devtools.getDevtoolsProps(componentName)
+	}, children);
 	return /* @__PURE__ */ react.default.createElement(_carbon_react.AspectRatio, {
+		ratio,
 		...rest,
+		ref,
 		className: classes,
 		...require_devtools.getDevtoolsProps(componentName)
 	}, children);
-};
+});
 CardMedia.propTypes = {
-	/**
-	* Provide the contents of the CardMedia.
-	*/
 	children: prop_types.default.node,
-	/**
-	* Provide an optional class to be applied to the containing node.
-	*/
-	className: prop_types.default.string
+	className: prop_types.default.string,
+	/** Width of the media column in horizontal layout. Any valid CSS width value. */
+	mediaWidth: prop_types.default.string
 };
+CardMedia = require_settings.pkg.checkComponentEnabled(CardMedia, componentName);
 CardMedia.displayName = componentName;
 //#endregion
-exports.CardMedia = CardMedia;
+Object.defineProperty(exports, "CardMedia", {
+	enumerable: true,
+	get: function() {
+		return CardMedia;
+	}
+});

package/lib/components/Card/next/CardTitle.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 CardTitleProps {
     /**
      * Provide the contents of the CardTitle.
@@ -21,10 +20,10 @@ export interface CardTitleProps {
      * - `number`: Multi-line truncation (line clamp)
      * @default false
      */
-    truncate?: boolean | number;
+    titleTruncate?: boolean | number;
     /**
      * Maximum width for the title.
-     * @default '640px'
+     * @default '100%'
      */
     maxWidth?: string;
     /**
@@ -41,6 +40,30 @@ export interface CardTitleProps {
      * - Expressive density: 24px icon recommended
      */
     titleEnd?: ReactNode;
+    /**
+     * Optional label rendered above the title text.
+     * Uses $label-01 typography and $text-secondary color.
+     */
+    label?: ReactNode;
+    /**
+     * Enable truncation on the label text.
+     * - `true`: Single line truncation
+     * - `number`: Multi-line truncation (line clamp)
+     * @default false
+     */
+    labelTruncate?: boolean | number;
+    /**
+     * Optional description rendered below the title text.
+     * Uses $label-01 typography and $text-secondary color.
+     */
+    description?: ReactNode;
+    /**
+     * Enable truncation on the description text.
+     * - `true`: Single line truncation
+     * - `number`: Multi-line truncation (line clamp)
+     * @default false
+     */
+    descriptionTruncate?: boolean | number;
 }
 /**
  * CardTitle displays the main title text in the card header.
@@ -49,34 +72,5 @@ export interface CardTitleProps {
  * - Expressive: Use $heading-03 (20px/28px)
  * Color uses $text-primary token.
  */
-export declare const CardTitle: {
-    ({ children, className, truncate, maxWidth, titleStart, titleEnd, ...rest }: CardTitleProps): React.JSX.Element;
-    propTypes: {
-        /**
-         * Provide the contents of the CardTitle.
-         */
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Provide an optional class to be applied to the containing node.
-         */
-        className: PropTypes.Requireable<string>;
-        /**
-         * Maximum width for the title.
-         */
-        maxWidth: PropTypes.Requireable<string>;
-        /**
-         * Optional trailing icon or content to display after the title text.
-         */
-        titleEnd: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Optional leading icon or content to display before the title text.
-         */
-        titleStart: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Enable text truncation with ellipsis.
-         */
-        truncate: PropTypes.Requireable<NonNullable<number | boolean>>;
-    };
-    displayName: string;
-};
+export declare let CardTitle: React.ForwardRefExoticComponent<CardTitleProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardTitle.d.ts.map

package/lib/components/Card/next/CardTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardTitle.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,SAAS,MAAM,YAAY,CAAC;AAQnC,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;GAMG;AACH,eAAO,MAAM,SAAS;iFAQnB,cAAc;;QAuCf;;WAEG;;QAGH;;WAEG;;QAGH;;WAEG;;QAGH;;WAEG;;QAGH;;WAEG;;QAGH;;WAEG;;;;CA9BJ,CAAC"}
+{"version":3,"file":"CardTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardTitle.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AASrD,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAEjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAEjC;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;CACxC;AAED;;;;;;GAMG;AACH,eAAO,IAAI,SAAS,uFAuGnB,CAAC"}

package/lib/components/Card/next/CardTitle.js

@@ -30,24 +30,45 @@ const componentName = "CardTitle";
 * - Expressive: Use $heading-03 (20px/28px)
 * Color uses $text-primary token.
 */
-const CardTitle = ({ children, className, truncate = false, maxWidth = "640px", titleStart, titleEnd, ...rest }) => {
-	const classes = (0, import_classnames.default)(`${blockClass}__title`, {
-		[`${blockClass}__title--truncate`]: truncate === true,
-		[`${blockClass}__title--truncate-multi`]: typeof truncate === "number",
-		[`${blockClass}__title--with-start-icon`]: titleStart,
-		[`${blockClass}__title--with-end-icon`]: titleEnd
-	}, className);
-	const style = typeof truncate === "number" ? {
-		WebkitLineClamp: truncate,
-		maxWidth
-	} : { maxWidth };
+let CardTitle = (0, react.forwardRef)(({ children, className, titleTruncate = false, maxWidth = "100%", titleStart, titleEnd, label, labelTruncate = false, description, descriptionTruncate = false, ...rest }, ref) => {
+	const isTitleMulti = typeof titleTruncate === "number";
+	const isLabelMulti = typeof labelTruncate === "number";
+	const isDescMulti = typeof descriptionTruncate === "number";
+	const containerClasses = (0, import_classnames.default)(`${blockClass}__title`, className);
+	const textRowClasses = (0, import_classnames.default)(`${blockClass}__title-text-row`, {
+		[`${blockClass}__title-text-row--truncate`]: titleTruncate === true,
+		[`${blockClass}__title-text-row--truncate-multi`]: isTitleMulti,
+		[`${blockClass}__title-text-row--with-start-icon`]: titleStart,
+		[`${blockClass}__title-text-row--with-end-icon`]: titleEnd
+	});
+	const titleVars = titleTruncate !== false ? {
+		[`--${blockClass}--title-max-width`]: maxWidth,
+		...isTitleMulti && { [`--${blockClass}--title-line-clamp`]: titleTruncate }
+	} : void 0;
+	const labelVars = isLabelMulti ? { [`--${blockClass}--label-line-clamp`]: labelTruncate } : void 0;
+	const descVars = isDescMulti ? { [`--${blockClass}--description-line-clamp`]: descriptionTruncate } : void 0;
 	return /* @__PURE__ */ react.default.createElement("div", {
 		...rest,
-		className: classes,
-		style,
+		ref,
+		className: containerClasses,
 		...require_devtools.getDevtoolsProps(componentName)
-	}, titleStart && /* @__PURE__ */ react.default.createElement("span", { className: `${blockClass}__title-start-icon` }, titleStart), children, titleEnd && /* @__PURE__ */ react.default.createElement("span", { className: `${blockClass}__title-end-icon` }, titleEnd));
-};
+	}, label && /* @__PURE__ */ react.default.createElement("div", {
+		className: (0, import_classnames.default)(`${blockClass}__label`, {
+			[`${blockClass}__label--truncate`]: labelTruncate === true,
+			[`${blockClass}__label--truncate-multi`]: isLabelMulti
+		}),
+		style: labelVars
+	}, label), /* @__PURE__ */ react.default.createElement("span", {
+		className: textRowClasses,
+		style: titleVars
+	}, titleStart && /* @__PURE__ */ react.default.createElement("span", { className: `${blockClass}__title-start-icon` }, titleStart), children, titleEnd && /* @__PURE__ */ react.default.createElement("span", { className: `${blockClass}__title-end-icon` }, titleEnd)), description && /* @__PURE__ */ react.default.createElement("div", {
+		className: (0, import_classnames.default)(`${blockClass}__description`, {
+			[`${blockClass}__description--truncate`]: descriptionTruncate === true,
+			[`${blockClass}__description--truncate-multi`]: isDescMulti
+		}),
+		style: descVars
+	}, description));
+});
 CardTitle.propTypes = {
 	/**
 	* Provide the contents of the CardTitle.
@@ -58,7 +79,27 @@ CardTitle.propTypes = {
 	*/
 	className: prop_types.default.string,
 	/**
-	* Maximum width for the title.
+	* Optional description rendered below the title text.
+	*/
+	description: prop_types.default.node,
+	/**
+	* Enable truncation on the description text.
+	* - `true`: Single line truncation
+	* - `number`: Multi-line truncation (line clamp)
+	*/
+	descriptionTruncate: prop_types.default.oneOfType([prop_types.default.bool, prop_types.default.number]),
+	/**
+	* Optional label rendered above the title text.
+	*/
+	label: prop_types.default.node,
+	/**
+	* Enable truncation on the label text.
+	* - `true`: Single line truncation
+	* - `number`: Multi-line truncation (line clamp)
+	*/
+	labelTruncate: prop_types.default.oneOfType([prop_types.default.bool, prop_types.default.number]),
+	/**
+	* Maximum width for the title when truncation is active.
 	*/
 	maxWidth: prop_types.default.string,
 	/**
@@ -71,9 +112,17 @@ CardTitle.propTypes = {
 	titleStart: prop_types.default.node,
 	/**
 	* Enable text truncation with ellipsis.
+	* - `true`: Single line truncation
+	* - `number`: Multi-line truncation (line clamp)
 	*/
-	truncate: prop_types.default.oneOfType([prop_types.default.bool, prop_types.default.number])
+	titleTruncate: prop_types.default.oneOfType([prop_types.default.bool, prop_types.default.number])
 };
+CardTitle = require_settings.pkg.checkComponentEnabled(CardTitle, componentName);
 CardTitle.displayName = componentName;
 //#endregion
-exports.CardTitle = CardTitle;
+Object.defineProperty(exports, "CardTitle", {
+	enumerable: true,
+	get: function() {
+		return CardTitle;
+	}
+});

package/lib/components/Card/next/CardTitleMedia.d.ts

@@ -20,5 +20,5 @@ export interface CardTitleMediaProps {
  * The media slot adapts to the heading area height (min 48px, max 64px) and stays
  * top-aligned when the title wraps to multiple lines.
  */
-export declare const CardTitleMedia: React.ForwardRefExoticComponent<CardTitleMediaProps & React.RefAttributes<HTMLDivElement>>;
+export declare let CardTitleMedia: React.ForwardRefExoticComponent<CardTitleMediaProps & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=CardTitleMedia.d.ts.map

package/lib/components/Card/next/CardTitleMedia.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CardTitleMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardTitleMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAQrD,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,MAAM,cAAc,4FAU1B,CAAC"}
+{"version":3,"file":"CardTitleMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardTitleMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAQrD,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,eAAO,IAAI,cAAc,4FAUxB,CAAC"}

package/lib/components/Card/next/CardTitleMedia.js

@@ -27,7 +27,7 @@ const componentName = "CardTitleMedia";
 * The media slot adapts to the heading area height (min 48px, max 64px) and stays
 * top-aligned when the title wraps to multiple lines.
 */
-const CardTitleMedia = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
+let CardTitleMedia = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
 	const titleMediaClasses = (0, import_classnames.default)(blockClass, className);
 	return /* @__PURE__ */ react.default.createElement("div", {
 		...rest,
@@ -35,7 +35,6 @@ const CardTitleMedia = (0, react.forwardRef)(({ className, children, ...rest },
 		className: titleMediaClasses
 	}, children);
 });
-CardTitleMedia.displayName = componentName;
 CardTitleMedia.propTypes = {
 	/**
 	* Content to be rendered in the title media slot (typically an icon or small image)
@@ -46,5 +45,12 @@ CardTitleMedia.propTypes = {
 	*/
 	className: prop_types.default.string
 };
+CardTitleMedia = require_settings.pkg.checkComponentEnabled(CardTitleMedia, componentName);
+CardTitleMedia.displayName = componentName;
 //#endregion
-exports.CardTitleMedia = CardTitleMedia;
+Object.defineProperty(exports, "CardTitleMedia", {
+	enumerable: true,
+	get: function() {
+		return CardTitleMedia;
+	}
+});

package/lib/components/Card/next/_story-assets/data.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+    group: string;
+    date: string;
+    value: number;
+}[];
+export default _default;
+//# sourceMappingURL=data.d.ts.map

package/lib/components/Card/next/_story-assets/data.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/next/_story-assets/data.js"],"names":[],"mappings":""}

package/lib/components/Card/next/_story-assets/options.d.ts

@@ -0,0 +1,48 @@
+declare namespace _default {
+    let height: string;
+    namespace grid {
+        namespace x {
+            let enabled: boolean;
+        }
+        namespace y {
+            let enabled_1: boolean;
+            export { enabled_1 as enabled };
+        }
+    }
+    namespace axes {
+        namespace bottom {
+            let visible: boolean;
+            let title: string;
+            let mapsTo: string;
+            let scaleType: string;
+        }
+        namespace left {
+            let visible_1: boolean;
+            export { visible_1 as visible };
+            let mapsTo_1: string;
+            export { mapsTo_1 as mapsTo };
+            let scaleType_1: string;
+            export { scaleType_1 as scaleType };
+        }
+    }
+    namespace color {
+        namespace gradient {
+            let enabled_2: boolean;
+            export { enabled_2 as enabled };
+        }
+    }
+    namespace points {
+        let enabled_3: boolean;
+        export { enabled_3 as enabled };
+    }
+    namespace legend {
+        let enabled_4: boolean;
+        export { enabled_4 as enabled };
+    }
+    namespace toolbar {
+        let enabled_5: boolean;
+        export { enabled_5 as enabled };
+    }
+}
+export default _default;
+//# sourceMappingURL=options.d.ts.map

package/lib/components/Card/next/_story-assets/options.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/next/_story-assets/options.js"],"names":[],"mappings":""}

package/lib/components/Card/next/index.d.ts

@@ -4,6 +4,6 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-export { Card, CardHeader, CardBody, CardFooter, CardHeaderMedia, CardMedia, CardLabel, CardTitle, CardTitleMedia, CardCaption, CardActions, CardAction, } from './Card';
-export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardHeaderMediaProps, CardMediaProps, CardLabelProps, CardTitleProps, CardTitleMediaProps, CardCaptionProps, CardActionsProps, CardActionProps, } from './Card';
+export { Card, CardHeader, CardBody, CardFooter, CardHeaderMedia, CardMedia, CardTitle, CardTitleMedia, CardActions, CardAction, } from './Card';
+export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardHeaderMediaProps, CardMediaProps, CardTitleProps, CardTitleMediaProps, CardActionsProps, CardActionProps, } from './Card';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Card/next/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EACL,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,SAAS,EACT,SAAS,EACT,cAAc,EACd,WAAW,EACX,WAAW,EACX,UAAU,GACX,MAAM,QAAQ,CAAC;AAEhB,YAAY,EACV,SAAS,EACT,eAAe,EACf,aAAa,EACb,eAAe,EACf,oBAAoB,EACpB,cAAc,EACd,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,gBAAgB,EAChB,gBAAgB,EAChB,eAAe,GAChB,MAAM,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EACL,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,SAAS,EACT,cAAc,EACd,WAAW,EACX,UAAU,GACX,MAAM,QAAQ,CAAC;AAEhB,YAAY,EACV,SAAS,EACT,eAAe,EACf,aAAa,EACb,eAAe,EACf,oBAAoB,EACpB,cAAc,EACd,cAAc,EACd,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,GAChB,MAAM,QAAQ,CAAC"}