@carbon/react 1.114.0-rc.0 → 1.115.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (144) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +2816 -1339
  2. package/es/components/BigNumber/BigNumber.d.ts +82 -0
  3. package/es/components/BigNumber/BigNumberSkeleton.d.ts +16 -0
  4. package/es/components/BigNumber/constants.d.ts +19 -0
  5. package/es/components/BigNumber/index.d.ts +9 -0
  6. package/es/components/Card/Card.d.ts +48 -0
  7. package/es/components/Card/Card.js +160 -0
  8. package/es/components/Card/Card.types.d.ts +119 -0
  9. package/es/components/Card/CardAction.d.ts +37 -0
  10. package/es/components/Card/CardAction.js +32 -0
  11. package/es/components/Card/CardActions.d.ts +30 -0
  12. package/es/components/Card/CardActions.js +93 -0
  13. package/es/components/Card/CardBody.d.ts +12 -0
  14. package/es/components/Card/CardBody.js +35 -0
  15. package/es/components/Card/CardContext.d.ts +17 -0
  16. package/es/components/Card/CardContext.js +31 -0
  17. package/es/components/Card/CardFooter.d.ts +15 -0
  18. package/es/components/Card/CardFooter.js +45 -0
  19. package/es/components/Card/CardHeader.d.ts +11 -0
  20. package/es/components/Card/CardHeader.js +44 -0
  21. package/es/components/Card/CardHeaderMedia.d.ts +21 -0
  22. package/es/components/Card/CardHeaderMedia.js +24 -0
  23. package/es/components/Card/CardMedia.d.ts +35 -0
  24. package/es/components/Card/CardMedia.js +42 -0
  25. package/es/components/Card/CardTitle.d.ts +72 -0
  26. package/es/components/Card/CardTitle.js +86 -0
  27. package/es/components/Card/CardTitleMedia.d.ts +23 -0
  28. package/es/components/Card/CardTitleMedia.js +36 -0
  29. package/es/components/Card/_story-assets/data.d.ts +6 -0
  30. package/es/components/Card/_story-assets/options.d.ts +47 -0
  31. package/es/components/Card/index.d.ts +8 -0
  32. package/es/components/Card/index.js +33 -0
  33. package/es/components/Checkbox/Checkbox.js +1 -1
  34. package/es/components/CheckboxGroup/CheckboxGroup.js +1 -1
  35. package/es/components/ComboBox/ComboBox.js +2 -2
  36. package/es/components/ComboButton/index.js +1 -1
  37. package/es/components/ComposedModal/ComposedModal.js +1 -1
  38. package/es/components/DatePicker/DatePicker.d.ts +1 -1
  39. package/es/components/DatePicker/DatePicker.js +1 -1
  40. package/es/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  41. package/es/components/DatePickerInput/DatePickerInput.js +1 -1
  42. package/es/components/Dropdown/Dropdown.js +2 -2
  43. package/es/components/ExpandableSearch/ExpandableSearch.js +1 -1
  44. package/es/components/FileUploader/FileUploaderDropContainer.js +11 -5
  45. package/es/components/FormLabel/FormLabel.d.ts +2 -2
  46. package/es/components/FormLabel/FormLabel.js +1 -1
  47. package/es/components/MenuButton/index.js +1 -1
  48. package/es/components/MultiSelect/FilterableMultiSelect.js +2 -2
  49. package/es/components/MultiSelect/MultiSelect.js +2 -2
  50. package/es/components/NumberInput/NumberInput.js +2 -2
  51. package/es/components/OverflowMenu/next/index.js +1 -1
  52. package/es/components/RadioButton/RadioButton.js +1 -1
  53. package/es/components/RadioButtonGroup/RadioButtonGroup.js +1 -1
  54. package/es/components/Select/Select.js +1 -1
  55. package/es/components/Tabs/Tabs.js +13 -2
  56. package/es/components/Tag/SelectableTag.js +1 -1
  57. package/es/components/TextArea/TextArea.js +1 -1
  58. package/es/components/TextInput/TextInput.js +1 -1
  59. package/es/components/Tile/Tile.js +1 -1
  60. package/es/index.d.ts +3 -1
  61. package/es/index.js +7 -6
  62. package/es/internal/DisplayBox.d.ts +14 -0
  63. package/es/internal/getSupportedLocale.d.ts +12 -0
  64. package/lib/components/BigNumber/BigNumber.d.ts +82 -0
  65. package/lib/components/BigNumber/BigNumberSkeleton.d.ts +16 -0
  66. package/lib/components/BigNumber/constants.d.ts +19 -0
  67. package/lib/components/BigNumber/index.d.ts +9 -0
  68. package/lib/components/Card/Card.d.ts +48 -0
  69. package/lib/components/Card/Card.js +173 -0
  70. package/lib/components/Card/Card.types.d.ts +119 -0
  71. package/lib/components/Card/CardAction.d.ts +37 -0
  72. package/lib/components/Card/CardAction.js +41 -0
  73. package/lib/components/Card/CardActions.d.ts +30 -0
  74. package/lib/components/Card/CardActions.js +96 -0
  75. package/lib/components/Card/CardBody.d.ts +12 -0
  76. package/lib/components/Card/CardBody.js +38 -0
  77. package/lib/components/Card/CardContext.d.ts +17 -0
  78. package/lib/components/Card/CardContext.js +32 -0
  79. package/lib/components/Card/CardFooter.d.ts +15 -0
  80. package/lib/components/Card/CardFooter.js +48 -0
  81. package/lib/components/Card/CardHeader.d.ts +11 -0
  82. package/lib/components/Card/CardHeader.js +47 -0
  83. package/lib/components/Card/CardHeaderMedia.d.ts +21 -0
  84. package/lib/components/Card/CardHeaderMedia.js +33 -0
  85. package/lib/components/Card/CardMedia.d.ts +35 -0
  86. package/lib/components/Card/CardMedia.js +51 -0
  87. package/lib/components/Card/CardTitle.d.ts +72 -0
  88. package/lib/components/Card/CardTitle.js +89 -0
  89. package/lib/components/Card/CardTitleMedia.d.ts +23 -0
  90. package/lib/components/Card/CardTitleMedia.js +39 -0
  91. package/lib/components/Card/_story-assets/data.d.ts +6 -0
  92. package/lib/components/Card/_story-assets/options.d.ts +47 -0
  93. package/lib/components/Card/index.d.ts +8 -0
  94. package/lib/components/Card/index.js +48 -0
  95. package/lib/components/Checkbox/Checkbox.js +1 -1
  96. package/lib/components/CheckboxGroup/CheckboxGroup.js +1 -1
  97. package/lib/components/ComboBox/ComboBox.js +2 -2
  98. package/lib/components/ComboButton/index.js +1 -1
  99. package/lib/components/ComposedModal/ComposedModal.js +1 -1
  100. package/lib/components/DatePicker/DatePicker.d.ts +1 -1
  101. package/lib/components/DatePicker/DatePicker.js +1 -1
  102. package/lib/components/DatePicker/plugins/rangePlugin.d.ts +1 -1
  103. package/lib/components/DatePickerInput/DatePickerInput.js +1 -1
  104. package/lib/components/Dropdown/Dropdown.js +2 -2
  105. package/lib/components/ExpandableSearch/ExpandableSearch.js +1 -1
  106. package/lib/components/FileUploader/FileUploaderDropContainer.js +11 -5
  107. package/lib/components/FormLabel/FormLabel.d.ts +2 -2
  108. package/lib/components/FormLabel/FormLabel.js +1 -1
  109. package/lib/components/MenuButton/index.js +1 -1
  110. package/lib/components/MultiSelect/FilterableMultiSelect.js +2 -2
  111. package/lib/components/MultiSelect/MultiSelect.js +2 -2
  112. package/lib/components/NumberInput/NumberInput.js +2 -2
  113. package/lib/components/OverflowMenu/next/index.js +1 -1
  114. package/lib/components/RadioButton/RadioButton.js +1 -1
  115. package/lib/components/RadioButtonGroup/RadioButtonGroup.js +1 -1
  116. package/lib/components/Select/Select.js +1 -1
  117. package/lib/components/Tabs/Tabs.js +13 -2
  118. package/lib/components/Tag/SelectableTag.js +1 -1
  119. package/lib/components/TextArea/TextArea.js +1 -1
  120. package/lib/components/TextInput/TextInput.js +1 -1
  121. package/lib/components/Tile/Tile.js +1 -1
  122. package/lib/index.d.ts +3 -1
  123. package/lib/index.js +55 -48
  124. package/lib/internal/DisplayBox.d.ts +14 -0
  125. package/lib/internal/getSupportedLocale.d.ts +12 -0
  126. package/package.json +20 -20
  127. package/scss/_border-radius.scss +9 -0
  128. package/scss/components/OptionsTile/_index.scss +5 -0
  129. package/scss/components/OptionsTile/_options-tile.scss +5 -0
  130. package/scss/components/big-number/_big-number.scss +9 -0
  131. package/scss/components/big-number/_index.scss +9 -0
  132. package/scss/components/coachmark/_coachmark.scss +5 -0
  133. package/scss/components/coachmark/_index.scss +5 -0
  134. package/scss/components/edit-in-place/_edit-in-place.scss +5 -0
  135. package/scss/components/edit-in-place/_index.scss +5 -0
  136. package/scss/components/full-page-error/_full-page-error.scss +5 -0
  137. package/scss/components/full-page-error/_index.scss +5 -0
  138. package/scss/components/interstitial-screen/_index.scss +6 -0
  139. package/scss/components/interstitial-screen/_interstitial-screen.scss +12 -0
  140. package/scss/components/scroll-gradient/_index.scss +9 -0
  141. package/scss/components/scroll-gradient/_scroll-gradient.scss +9 -0
  142. package/scss/components/user-avatar/_index.scss +9 -0
  143. package/scss/components/user-avatar/_user-avatar.scss +9 -0
  144. package/telemetry.yml +107 -3
@@ -0,0 +1,48 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_usePrefix = require("../../internal/usePrefix.js");
10
+ const require_CardContext = require("./CardContext.js");
11
+ let react = require("react");
12
+ react = require_runtime.__toESM(react);
13
+ let classnames = require("classnames");
14
+ classnames = require_runtime.__toESM(classnames);
15
+ let react_jsx_runtime = require("react/jsx-runtime");
16
+ //#region src/components/Card/CardFooter.tsx
17
+ /**
18
+ * Copyright IBM Corp. 2026
19
+ *
20
+ * This source code is licensed under the Apache-2.0 license found in the
21
+ * LICENSE file in the root directory of this source tree.
22
+ */
23
+ const componentName = "CardFooter";
24
+ /**
25
+ * CardFooter component - Footer section of the card.
26
+ *
27
+ * Not supported inside a `clickable` card. A clickable card renders its own
28
+ * built-in footer affordance automatically. Use the `renderFooterIcon` prop on
29
+ * `Card` to customize the icon.
30
+ */
31
+ const CardFooter = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
32
+ const prefix = require_usePrefix.usePrefix();
33
+ const { clickable } = require_CardContext.useCardContext();
34
+ if (clickable) {
35
+ console.error("[Card] `Card.Footer` cannot be used inside a `clickable` card. A clickable card renders its own footer affordance automatically. Use the `renderFooterIcon` prop on `Card` to customize the icon.");
36
+ return null;
37
+ }
38
+ const footerClasses = (0, classnames.default)(`${prefix}--card__footer`, className);
39
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
40
+ ...rest,
41
+ ref,
42
+ className: footerClasses,
43
+ children
44
+ });
45
+ });
46
+ CardFooter.displayName = componentName;
47
+ //#endregion
48
+ exports.CardFooter = CardFooter;
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React from 'react';
8
+ /**
9
+ * CardHeader — header section of the card.
10
+ */
11
+ export declare const CardHeader: React.ForwardRefExoticComponent<import("./Card.types").CardBaseProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,47 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_usePrefix = require("../../internal/usePrefix.js");
10
+ const require_CardContext = require("./CardContext.js");
11
+ let react = require("react");
12
+ react = require_runtime.__toESM(react);
13
+ let classnames = require("classnames");
14
+ classnames = require_runtime.__toESM(classnames);
15
+ let react_jsx_runtime = require("react/jsx-runtime");
16
+ //#region src/components/Card/CardHeader.tsx
17
+ /**
18
+ * Copyright IBM Corp. 2026
19
+ *
20
+ * This source code is licensed under the Apache-2.0 license found in the
21
+ * LICENSE file in the root directory of this source tree.
22
+ */
23
+ const componentName = "CardHeader";
24
+ /**
25
+ * CardHeader — header section of the card.
26
+ */
27
+ const CardHeader = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
28
+ const blockClass = `${require_usePrefix.usePrefix()}--card`;
29
+ const context = require_CardContext.useCardContext();
30
+ const handleDecoratorClick = (0, react.useCallback)((e) => e.stopPropagation(), []);
31
+ const handleDecoratorKeyDown = (0, react.useCallback)((e) => e.stopPropagation(), []);
32
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
33
+ ...rest,
34
+ ref,
35
+ className: (0, classnames.default)(`${blockClass}__header`, className),
36
+ children: [children, context.decorator && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
37
+ className: `${blockClass}__decorator`,
38
+ role: "presentation",
39
+ onClick: handleDecoratorClick,
40
+ onKeyDown: handleDecoratorKeyDown,
41
+ children: context.decorator
42
+ })]
43
+ });
44
+ });
45
+ CardHeader.displayName = componentName;
46
+ //#endregion
47
+ exports.CardHeader = CardHeader;
@@ -0,0 +1,21 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import { ReactNode } from 'react';
8
+ export interface CardHeaderMediaProps {
9
+ /**
10
+ * Provide the contents of the CardHeaderMedia.
11
+ */
12
+ children?: ReactNode;
13
+ /**
14
+ * Provide an optional class to be applied to the containing node.
15
+ */
16
+ className?: string;
17
+ }
18
+ export declare const CardHeaderMedia: {
19
+ ({ children, className, ...rest }: CardHeaderMediaProps): import("react/jsx-runtime").JSX.Element;
20
+ displayName: string;
21
+ };
@@ -0,0 +1,33 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_usePrefix = require("../../internal/usePrefix.js");
10
+ let react = require("react");
11
+ react = require_runtime.__toESM(react);
12
+ let classnames = require("classnames");
13
+ classnames = require_runtime.__toESM(classnames);
14
+ let react_jsx_runtime = require("react/jsx-runtime");
15
+ //#region src/components/Card/CardHeaderMedia.tsx
16
+ /**
17
+ * Copyright IBM Corp. 2026
18
+ *
19
+ * This source code is licensed under the Apache-2.0 license found in the
20
+ * LICENSE file in the root directory of this source tree.
21
+ */
22
+ const componentName = "CardHeaderMedia";
23
+ const CardHeaderMedia = ({ children, className, ...rest }) => {
24
+ const classes = (0, classnames.default)(`${require_usePrefix.usePrefix()}--card__header-media`, className);
25
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
26
+ ...rest,
27
+ className: classes,
28
+ children
29
+ });
30
+ };
31
+ CardHeaderMedia.displayName = componentName;
32
+ //#endregion
33
+ exports.CardHeaderMedia = CardHeaderMedia;
@@ -0,0 +1,35 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React from 'react';
8
+ import { type AspectRatioProps } from '../AspectRatio/AspectRatio';
9
+ export interface CardMediaProps extends Omit<AspectRatioProps, 'className'> {
10
+ /**
11
+ * Provide the contents of the CardMedia.
12
+ */
13
+ children?: React.ReactNode;
14
+ /**
15
+ * Provide an optional class to be applied to the containing node.
16
+ */
17
+ className?: string;
18
+ /**
19
+ * Width of the media column when the card is in horizontal layout.
20
+ * Accepts any valid CSS width value (e.g. '200px', '40%').
21
+ * Defaults to '33.33%'. Has no effect in vertical (default) layout.
22
+ */
23
+ mediaWidth?: string;
24
+ }
25
+ /**
26
+ * CardMedia is a media slot component that maintains aspect ratio.
27
+ *
28
+ * In vertical (default) mode it delegates to Carbon's AspectRatio.
29
+ * In horizontal mode it renders a plain div sized to `mediaWidth` (default
30
+ * 33.33%) that stretches to the full card height — no aspect-ratio math needed.
31
+ */
32
+ export declare const CardMedia: {
33
+ ({ children, className, ratio, mediaWidth, ...rest }: CardMediaProps): import("react/jsx-runtime").JSX.Element;
34
+ displayName: string;
35
+ };
@@ -0,0 +1,51 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_usePrefix = require("../../internal/usePrefix.js");
10
+ const require_AspectRatio = require("../AspectRatio/AspectRatio.js");
11
+ const require_CardContext = require("./CardContext.js");
12
+ let react = require("react");
13
+ react = require_runtime.__toESM(react);
14
+ let classnames = require("classnames");
15
+ classnames = require_runtime.__toESM(classnames);
16
+ let react_jsx_runtime = require("react/jsx-runtime");
17
+ //#region src/components/Card/CardMedia.tsx
18
+ /**
19
+ * Copyright IBM Corp. 2026
20
+ *
21
+ * This source code is licensed under the Apache-2.0 license found in the
22
+ * LICENSE file in the root directory of this source tree.
23
+ */
24
+ const componentName = "CardMedia";
25
+ /**
26
+ * CardMedia is a media slot component that maintains aspect ratio.
27
+ *
28
+ * In vertical (default) mode it delegates to Carbon's AspectRatio.
29
+ * In horizontal mode it renders a plain div sized to `mediaWidth` (default
30
+ * 33.33%) that stretches to the full card height — no aspect-ratio math needed.
31
+ */
32
+ const CardMedia = ({ children, className, ratio, mediaWidth = "33.33%", ...rest }) => {
33
+ const prefix = require_usePrefix.usePrefix();
34
+ const blockClass = `${prefix}--card`;
35
+ const { horizontal } = require_CardContext.useCardContext();
36
+ const classes = (0, classnames.default)(`${blockClass}__media`, className);
37
+ if (horizontal) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
38
+ className: `${blockClass}__media ${blockClass}__media--horizontal`,
39
+ style: { [`--${prefix}--card--media-width`]: mediaWidth },
40
+ children
41
+ });
42
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_AspectRatio.default, {
43
+ ratio,
44
+ ...rest,
45
+ className: classes,
46
+ children
47
+ });
48
+ };
49
+ CardMedia.displayName = componentName;
50
+ //#endregion
51
+ exports.CardMedia = CardMedia;
@@ -0,0 +1,72 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React, { ReactNode } from 'react';
8
+ export interface CardTitleProps extends React.HTMLAttributes<HTMLDivElement> {
9
+ /**
10
+ * Provide the contents of the CardTitle.
11
+ */
12
+ children?: ReactNode;
13
+ /**
14
+ * Provide an optional class to be applied to the containing node.
15
+ */
16
+ className?: string;
17
+ /**
18
+ * Enable text truncation with ellipsis on the title text row.
19
+ * - `true`: Single line truncation
20
+ * - `number`: Multi-line truncation (line clamp)
21
+ * @default false
22
+ */
23
+ titleTruncate?: boolean | number;
24
+ /**
25
+ * Maximum width applied to the title text row when truncation is active.
26
+ * @default '100%'
27
+ */
28
+ maxWidth?: string;
29
+ /**
30
+ * Optional leading icon or content to display before the title text.
31
+ * - Productive density: 16px icon recommended
32
+ * - Expressive density: 24px icon recommended
33
+ */
34
+ titleStart?: ReactNode;
35
+ /**
36
+ * Optional trailing icon or content to display after the title text.
37
+ * - Productive density: 16px icon recommended
38
+ * - Expressive density: 24px icon recommended
39
+ */
40
+ titleEnd?: ReactNode;
41
+ /**
42
+ * Optional label rendered above the title text.
43
+ * Uses $label-01 typography and $text-secondary color.
44
+ */
45
+ label?: ReactNode;
46
+ /**
47
+ * Enable truncation on the label text.
48
+ * - `true`: Single line truncation
49
+ * - `number`: Multi-line truncation (line clamp)
50
+ * @default false
51
+ */
52
+ labelTruncate?: boolean | number;
53
+ /**
54
+ * Optional description rendered below the title text.
55
+ * Uses $label-01 typography and $text-secondary color.
56
+ */
57
+ description?: ReactNode;
58
+ /**
59
+ * Enable truncation on the description text.
60
+ * - `true`: Single line truncation
61
+ * - `number`: Multi-line truncation (line clamp)
62
+ * @default false
63
+ */
64
+ descriptionTruncate?: boolean | number;
65
+ }
66
+ /**
67
+ * CardTitle displays the main title text in the card header.
68
+ * Typography is driven by density on the parent Card:
69
+ * - Productive: $heading-compact-02 (16px/22px)
70
+ * - Expressive: $heading-03 (20px/28px)
71
+ */
72
+ export declare const CardTitle: React.ForwardRefExoticComponent<CardTitleProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,89 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_usePrefix = require("../../internal/usePrefix.js");
10
+ let react = require("react");
11
+ react = require_runtime.__toESM(react);
12
+ let classnames = require("classnames");
13
+ classnames = require_runtime.__toESM(classnames);
14
+ let react_jsx_runtime = require("react/jsx-runtime");
15
+ //#region src/components/Card/CardTitle.tsx
16
+ /**
17
+ * Copyright IBM Corp. 2026
18
+ *
19
+ * This source code is licensed under the Apache-2.0 license found in the
20
+ * LICENSE file in the root directory of this source tree.
21
+ */
22
+ const componentName = "CardTitle";
23
+ /**
24
+ * CardTitle displays the main title text in the card header.
25
+ * Typography is driven by density on the parent Card:
26
+ * - Productive: $heading-compact-02 (16px/22px)
27
+ * - Expressive: $heading-03 (20px/28px)
28
+ */
29
+ const CardTitle = (0, react.forwardRef)(({ children, className, titleTruncate = false, maxWidth = "100%", titleStart, titleEnd, label, labelTruncate = false, description, descriptionTruncate = false, ...rest }, ref) => {
30
+ const prefix = require_usePrefix.usePrefix();
31
+ const blockClass = `${prefix}--card`;
32
+ const isTitleMulti = typeof titleTruncate === "number";
33
+ const isLabelMulti = typeof labelTruncate === "number";
34
+ const isDescMulti = typeof descriptionTruncate === "number";
35
+ const containerClasses = (0, classnames.default)(`${blockClass}__title`, className);
36
+ const textRowClasses = (0, classnames.default)(`${blockClass}__title-text-row`, {
37
+ [`${blockClass}__title-text-row--truncate`]: titleTruncate === true,
38
+ [`${blockClass}__title-text-row--truncate-multi`]: isTitleMulti,
39
+ [`${blockClass}__title-text-row--with-start-icon`]: titleStart,
40
+ [`${blockClass}__title-text-row--with-end-icon`]: titleEnd
41
+ });
42
+ const titleVars = titleTruncate !== false ? {
43
+ [`--${prefix}--card--title-max-width`]: maxWidth,
44
+ ...isTitleMulti && { [`--${prefix}--card--title-line-clamp`]: titleTruncate }
45
+ } : void 0;
46
+ const labelVars = isLabelMulti ? { [`--${prefix}--card--label-line-clamp`]: labelTruncate } : void 0;
47
+ const descVars = isDescMulti ? { [`--${prefix}--card--description-line-clamp`]: descriptionTruncate } : void 0;
48
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
49
+ ...rest,
50
+ ref,
51
+ className: containerClasses,
52
+ children: [
53
+ label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
54
+ className: (0, classnames.default)(`${blockClass}__label`, {
55
+ [`${blockClass}__label--truncate`]: labelTruncate === true,
56
+ [`${blockClass}__label--truncate-multi`]: isLabelMulti
57
+ }),
58
+ style: labelVars,
59
+ children: label
60
+ }),
61
+ /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
62
+ className: textRowClasses,
63
+ style: titleVars,
64
+ children: [
65
+ titleStart && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
66
+ className: `${blockClass}__title-start-icon`,
67
+ children: titleStart
68
+ }),
69
+ children,
70
+ titleEnd && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
71
+ className: `${blockClass}__title-end-icon`,
72
+ children: titleEnd
73
+ })
74
+ ]
75
+ }),
76
+ description && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
77
+ className: (0, classnames.default)(`${blockClass}__description`, {
78
+ [`${blockClass}__description--truncate`]: descriptionTruncate === true,
79
+ [`${blockClass}__description--truncate-multi`]: isDescMulti
80
+ }),
81
+ style: descVars,
82
+ children: description
83
+ })
84
+ ]
85
+ });
86
+ });
87
+ CardTitle.displayName = componentName;
88
+ //#endregion
89
+ exports.CardTitle = CardTitle;
@@ -0,0 +1,23 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React, { ReactNode } from 'react';
8
+ export interface CardTitleMediaProps {
9
+ /**
10
+ * Content to be rendered in the title media slot (typically an icon or small image)
11
+ */
12
+ children?: ReactNode;
13
+ /**
14
+ * Optional class name for custom styling
15
+ */
16
+ className?: string;
17
+ }
18
+ /**
19
+ * CardTitleMedia provides a media slot positioned to the left of the card title.
20
+ * The media slot adapts to the heading area height (min 48px, max 64px) and stays
21
+ * top-aligned when the title wraps to multiple lines.
22
+ */
23
+ export declare const CardTitleMedia: React.ForwardRefExoticComponent<CardTitleMediaProps & React.RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,39 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_usePrefix = require("../../internal/usePrefix.js");
10
+ let react = require("react");
11
+ react = require_runtime.__toESM(react);
12
+ let classnames = require("classnames");
13
+ classnames = require_runtime.__toESM(classnames);
14
+ let react_jsx_runtime = require("react/jsx-runtime");
15
+ //#region src/components/Card/CardTitleMedia.tsx
16
+ /**
17
+ * Copyright IBM Corp. 2026
18
+ *
19
+ * This source code is licensed under the Apache-2.0 license found in the
20
+ * LICENSE file in the root directory of this source tree.
21
+ */
22
+ const componentName = "CardTitleMedia";
23
+ /**
24
+ * CardTitleMedia provides a media slot positioned to the left of the card title.
25
+ * The media slot adapts to the heading area height (min 48px, max 64px) and stays
26
+ * top-aligned when the title wraps to multiple lines.
27
+ */
28
+ const CardTitleMedia = (0, react.forwardRef)(({ className, children, ...rest }, ref) => {
29
+ const titleMediaClasses = (0, classnames.default)(`${require_usePrefix.usePrefix()}--card__title-media`, className);
30
+ return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
31
+ ...rest,
32
+ ref,
33
+ className: titleMediaClasses,
34
+ children
35
+ });
36
+ });
37
+ CardTitleMedia.displayName = componentName;
38
+ //#endregion
39
+ exports.CardTitleMedia = CardTitleMedia;
@@ -0,0 +1,6 @@
1
+ declare const _default: {
2
+ group: string;
3
+ date: string;
4
+ value: number;
5
+ }[];
6
+ export default _default;
@@ -0,0 +1,47 @@
1
+ declare namespace _default {
2
+ let height: string;
3
+ namespace grid {
4
+ namespace x {
5
+ let enabled: boolean;
6
+ }
7
+ namespace y {
8
+ let enabled_1: boolean;
9
+ export { enabled_1 as enabled };
10
+ }
11
+ }
12
+ namespace axes {
13
+ namespace bottom {
14
+ let visible: boolean;
15
+ let title: string;
16
+ let mapsTo: string;
17
+ let scaleType: string;
18
+ }
19
+ namespace left {
20
+ let visible_1: boolean;
21
+ export { visible_1 as visible };
22
+ let mapsTo_1: string;
23
+ export { mapsTo_1 as mapsTo };
24
+ let scaleType_1: string;
25
+ export { scaleType_1 as scaleType };
26
+ }
27
+ }
28
+ namespace color {
29
+ namespace gradient {
30
+ let enabled_2: boolean;
31
+ export { enabled_2 as enabled };
32
+ }
33
+ }
34
+ namespace points {
35
+ let enabled_3: boolean;
36
+ export { enabled_3 as enabled };
37
+ }
38
+ namespace legend {
39
+ let enabled_4: boolean;
40
+ export { enabled_4 as enabled };
41
+ }
42
+ namespace toolbar {
43
+ let enabled_5: boolean;
44
+ export { enabled_5 as enabled };
45
+ }
46
+ }
47
+ export default _default;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Copyright IBM Corp. 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ export { Card, CardHeader, CardBody, CardFooter, CardHeaderMedia, CardMedia, CardTitle, CardTitleMedia, CardActions, CardAction, } from './Card';
8
+ export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardHeaderMediaProps, CardMediaProps, CardTitleProps, CardTitleMediaProps, CardActionsProps, CardActionProps, } from './Card';
@@ -0,0 +1,48 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2026
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ const require_runtime = require("../../_virtual/_rolldown/runtime.js");
9
+ const require_CardHeader = require("./CardHeader.js");
10
+ const require_CardBody = require("./CardBody.js");
11
+ const require_CardFooter = require("./CardFooter.js");
12
+ const require_CardHeaderMedia = require("./CardHeaderMedia.js");
13
+ const require_CardMedia = require("./CardMedia.js");
14
+ const require_CardTitle = require("./CardTitle.js");
15
+ const require_CardTitleMedia = require("./CardTitleMedia.js");
16
+ const require_CardActions = require("./CardActions.js");
17
+ const require_CardAction = require("./CardAction.js");
18
+ const require_Card = require("./Card.js");
19
+ //#region src/components/Card/index.ts
20
+ var Card_exports = /* @__PURE__ */ require_runtime.__exportAll({
21
+ Card: () => require_Card.Card,
22
+ CardAction: () => require_CardAction.CardAction,
23
+ CardActions: () => require_CardActions.CardActions,
24
+ CardBody: () => require_CardBody.CardBody,
25
+ CardFooter: () => require_CardFooter.CardFooter,
26
+ CardHeader: () => require_CardHeader.CardHeader,
27
+ CardHeaderMedia: () => require_CardHeaderMedia.CardHeaderMedia,
28
+ CardMedia: () => require_CardMedia.CardMedia,
29
+ CardTitle: () => require_CardTitle.CardTitle,
30
+ CardTitleMedia: () => require_CardTitleMedia.CardTitleMedia
31
+ });
32
+ //#endregion
33
+ exports.Card = require_Card.Card;
34
+ exports.CardAction = require_CardAction.CardAction;
35
+ exports.CardActions = require_CardActions.CardActions;
36
+ exports.CardBody = require_CardBody.CardBody;
37
+ exports.CardFooter = require_CardFooter.CardFooter;
38
+ exports.CardHeader = require_CardHeader.CardHeader;
39
+ exports.CardHeaderMedia = require_CardHeaderMedia.CardHeaderMedia;
40
+ exports.CardMedia = require_CardMedia.CardMedia;
41
+ exports.CardTitle = require_CardTitle.CardTitle;
42
+ exports.CardTitleMedia = require_CardTitleMedia.CardTitleMedia;
43
+ Object.defineProperty(exports, "Card_exports", {
44
+ enumerable: true,
45
+ get: function() {
46
+ return Card_exports;
47
+ }
48
+ });
@@ -12,9 +12,9 @@ const require_Text = require("../Text/Text.js");
12
12
  const require_useId = require("../../internal/useId.js");
13
13
  const require_deprecate = require("../../prop-types/deprecate.js");
14
14
  const require_utils = require("../../internal/utils.js");
15
+ const require_index = require("../AILabel/index.js");
15
16
  const require_hasHelperText = require("../../internal/hasHelperText.js");
16
17
  const require_useNormalizedInputProps = require("../../internal/useNormalizedInputProps.js");
17
- const require_index = require("../AILabel/index.js");
18
18
  let react = require("react");
19
19
  react = require_runtime.__toESM(react);
20
20
  let classnames = require("classnames");
@@ -10,9 +10,9 @@ const require_usePrefix = require("../../internal/usePrefix.js");
10
10
  const require_useId = require("../../internal/useId.js");
11
11
  const require_deprecate = require("../../prop-types/deprecate.js");
12
12
  const require_utils = require("../../internal/utils.js");
13
+ const require_index = require("../AILabel/index.js");
13
14
  const require_hasHelperText = require("../../internal/hasHelperText.js");
14
15
  const require_useNormalizedInputProps = require("../../internal/useNormalizedInputProps.js");
15
- const require_index = require("../AILabel/index.js");
16
16
  const require_Checkbox = require("../Checkbox/Checkbox.js");
17
17
  let react = require("react");
18
18
  react = require_runtime.__toESM(react);
@@ -16,14 +16,14 @@ const require_defaultItemToString = require("../../internal/defaultItemToString.
16
16
  const require_isItemDisabled = require("../../internal/isItemDisabled.js");
17
17
  const require_utils = require("../../internal/utils.js");
18
18
  const require_index = require("../FeatureFlags/index.js");
19
- const require_useNormalizedInputProps = require("../../internal/useNormalizedInputProps.js");
20
19
  const require_index$1 = require("../AILabel/index.js");
20
+ const require_mergeRefs = require("../../tools/mergeRefs.js");
21
+ const require_useNormalizedInputProps = require("../../internal/useNormalizedInputProps.js");
21
22
  const require_ListBoxPropTypes = require("../ListBox/ListBoxPropTypes.js");
22
23
  const require_FormContext = require("../FluidForm/FormContext.js");
23
24
  const require_index$2 = require("../ListBox/index.js");
24
25
  const require_ListBoxSelection = require("../ListBox/next/ListBoxSelection.js");
25
26
  const require_ListBoxTrigger = require("../ListBox/next/ListBoxTrigger.js");
26
- const require_mergeRefs = require("../../tools/mergeRefs.js");
27
27
  let react = require("react");
28
28
  react = require_runtime.__toESM(react);
29
29
  let classnames = require("classnames");
@@ -14,8 +14,8 @@ const require_mapPopoverAlign = require("../../tools/mapPopoverAlign.js");
14
14
  const require_index = require("../FeatureFlags/index.js");
15
15
  const require_index$1 = require("../IconButton/index.js");
16
16
  const require_index$2 = require("../Button/index.js");
17
- const require_mergeRefs = require("../../tools/mergeRefs.js");
18
17
  const require_Menu = require("../Menu/Menu.js");
18
+ const require_mergeRefs = require("../../tools/mergeRefs.js");
19
19
  const require_useAttachedMenu = require("../../internal/useAttachedMenu.js");
20
20
  let react = require("react");
21
21
  react = require_runtime.__toESM(react);
@@ -15,9 +15,9 @@ const require_deprecate = require("../../prop-types/deprecate.js");
15
15
  const require_utils = require("../../internal/utils.js");
16
16
  const require_index = require("../FeatureFlags/index.js");
17
17
  const require_index$1 = require("../AILabel/index.js");
18
+ const require_mergeRefs = require("../../tools/mergeRefs.js");
18
19
  const require_useResizeObserver = require("../../internal/useResizeObserver.js");
19
20
  const require_events = require("../../tools/events.js");
20
- const require_mergeRefs = require("../../tools/mergeRefs.js");
21
21
  const require_index$2 = require("../Layer/index.js");
22
22
  const require_ComposedModalContext = require("./ComposedModalContext.js");
23
23
  const require_ModalHeader = require("./ModalHeader.js");