@carbon/ibm-products 2.95.0 → 2.96.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.
- package/css/index-full-carbon.css +94 -89
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +15 -11
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +94 -89
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +15 -11
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/Card/next/Card.d.ts +6 -69
- package/es/components/Card/next/Card.d.ts.map +1 -1
- package/es/components/Card/next/Card.js +45 -24
- package/es/components/Card/next/Card.types.d.ts +12 -3
- package/es/components/Card/next/Card.types.d.ts.map +1 -1
- package/es/components/Card/next/CardAction.d.ts +7 -15
- package/es/components/Card/next/CardAction.d.ts.map +1 -1
- package/es/components/Card/next/CardAction.js +10 -4
- package/es/components/Card/next/CardActions.d.ts +1 -19
- package/es/components/Card/next/CardActions.d.ts.map +1 -1
- package/es/components/Card/next/CardActions.js +27 -22
- package/es/components/Card/next/CardBody.d.ts +1 -1
- package/es/components/Card/next/CardBody.d.ts.map +1 -1
- package/es/components/Card/next/CardBody.js +3 -2
- package/es/components/Card/next/CardFooter.d.ts +1 -1
- package/es/components/Card/next/CardFooter.d.ts.map +1 -1
- package/es/components/Card/next/CardFooter.js +3 -2
- package/es/components/Card/next/CardHeader.d.ts +8 -2
- package/es/components/Card/next/CardHeader.d.ts.map +1 -1
- package/es/components/Card/next/CardHeader.js +17 -24
- package/es/components/Card/next/CardHeaderMedia.d.ts +1 -15
- package/es/components/Card/next/CardHeaderMedia.d.ts.map +1 -1
- package/es/components/Card/next/CardHeaderMedia.js +5 -3
- package/es/components/Card/next/CardMedia.d.ts +12 -18
- package/es/components/Card/next/CardMedia.d.ts.map +1 -1
- package/es/components/Card/next/CardMedia.js +22 -13
- package/es/components/Card/next/CardTitle.d.ts +27 -33
- package/es/components/Card/next/CardTitle.d.ts.map +1 -1
- package/es/components/Card/next/CardTitle.js +62 -18
- package/es/components/Card/next/CardTitleMedia.d.ts +1 -1
- package/es/components/Card/next/CardTitleMedia.d.ts.map +1 -1
- package/es/components/Card/next/CardTitleMedia.js +3 -2
- package/es/components/Card/next/_story-assets/data.d.ts +7 -0
- package/es/components/Card/next/_story-assets/data.d.ts.map +1 -0
- package/es/components/Card/next/_story-assets/options.d.ts +48 -0
- package/es/components/Card/next/_story-assets/options.d.ts.map +1 -0
- package/es/components/Card/next/index.d.ts +2 -2
- package/es/components/Card/next/index.d.ts.map +1 -1
- package/es/components/Card/next/index.js +0 -4
- package/es/components/Tearsheet/next/Tearsheet.d.ts.map +1 -1
- package/es/components/Tearsheet/next/Tearsheet.js +5 -2
- package/es/components/Tearsheet/next/TearsheetBody.d.ts.map +1 -1
- package/es/components/Tearsheet/next/TearsheetBody.js +2 -1
- package/es/global/js/package-settings.d.ts +10 -0
- package/es/global/js/package-settings.d.ts.map +1 -1
- package/es/global/js/package-settings.js +10 -0
- package/es/settings.d.ts +10 -0
- package/es/settings.d.ts.map +1 -1
- package/lib/components/Card/next/Card.d.ts +6 -69
- package/lib/components/Card/next/Card.d.ts.map +1 -1
- package/lib/components/Card/next/Card.js +44 -23
- package/lib/components/Card/next/Card.types.d.ts +12 -3
- package/lib/components/Card/next/Card.types.d.ts.map +1 -1
- package/lib/components/Card/next/CardAction.d.ts +7 -15
- package/lib/components/Card/next/CardAction.d.ts.map +1 -1
- package/lib/components/Card/next/CardAction.js +15 -4
- package/lib/components/Card/next/CardActions.d.ts +1 -19
- package/lib/components/Card/next/CardActions.d.ts.map +1 -1
- package/lib/components/Card/next/CardActions.js +32 -22
- package/lib/components/Card/next/CardBody.d.ts +1 -1
- package/lib/components/Card/next/CardBody.d.ts.map +1 -1
- package/lib/components/Card/next/CardBody.js +9 -3
- package/lib/components/Card/next/CardFooter.d.ts +1 -1
- package/lib/components/Card/next/CardFooter.d.ts.map +1 -1
- package/lib/components/Card/next/CardFooter.js +9 -3
- package/lib/components/Card/next/CardHeader.d.ts +8 -2
- package/lib/components/Card/next/CardHeader.d.ts.map +1 -1
- package/lib/components/Card/next/CardHeader.js +22 -24
- package/lib/components/Card/next/CardHeaderMedia.d.ts +1 -15
- package/lib/components/Card/next/CardHeaderMedia.d.ts.map +1 -1
- package/lib/components/Card/next/CardHeaderMedia.js +10 -3
- package/lib/components/Card/next/CardMedia.d.ts +12 -18
- package/lib/components/Card/next/CardMedia.d.ts.map +1 -1
- package/lib/components/Card/next/CardMedia.js +27 -13
- package/lib/components/Card/next/CardTitle.d.ts +27 -33
- package/lib/components/Card/next/CardTitle.d.ts.map +1 -1
- package/lib/components/Card/next/CardTitle.js +67 -18
- package/lib/components/Card/next/CardTitleMedia.d.ts +1 -1
- package/lib/components/Card/next/CardTitleMedia.d.ts.map +1 -1
- package/lib/components/Card/next/CardTitleMedia.js +9 -3
- package/lib/components/Card/next/_story-assets/data.d.ts +7 -0
- package/lib/components/Card/next/_story-assets/data.d.ts.map +1 -0
- package/lib/components/Card/next/_story-assets/options.d.ts +48 -0
- package/lib/components/Card/next/_story-assets/options.d.ts.map +1 -0
- package/lib/components/Card/next/index.d.ts +2 -2
- package/lib/components/Card/next/index.d.ts.map +1 -1
- package/lib/components/Card/next/index.js +0 -4
- package/lib/components/Tearsheet/next/Tearsheet.d.ts.map +1 -1
- package/lib/components/Tearsheet/next/Tearsheet.js +5 -2
- package/lib/components/Tearsheet/next/TearsheetBody.d.ts.map +1 -1
- package/lib/components/Tearsheet/next/TearsheetBody.js +2 -1
- package/lib/global/js/package-settings.d.ts +10 -0
- package/lib/global/js/package-settings.d.ts.map +1 -1
- package/lib/global/js/package-settings.js +10 -0
- package/lib/settings.d.ts +10 -0
- package/lib/settings.d.ts.map +1 -1
- package/package.json +9 -8
- package/scss/components/AboutModal/_about-modal.scss +12 -12
- package/scss/components/Card/_card-next.scss +184 -157
- package/scss/components/PageHeader/_page-header.scss +1 -1
- package/scss/components/Tearsheet/_tearsheet_next.scss +1 -2
- package/telemetry.yml +9 -9
- package/es/components/Card/next/CardCaption.d.ts +0 -46
- package/es/components/Card/next/CardCaption.d.ts.map +0 -1
- package/es/components/Card/next/CardCaption.js +0 -52
- package/es/components/Card/next/CardLabel.d.ts +0 -46
- package/es/components/Card/next/CardLabel.d.ts.map +0 -1
- package/es/components/Card/next/CardLabel.js +0 -52
- package/es/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts +0 -30
- package/es/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts.map +0 -1
- package/lib/components/Card/next/CardCaption.d.ts +0 -46
- package/lib/components/Card/next/CardCaption.d.ts.map +0 -1
- package/lib/components/Card/next/CardCaption.js +0 -54
- package/lib/components/Card/next/CardLabel.d.ts +0 -46
- package/lib/components/Card/next/CardLabel.d.ts.map +0 -1
- package/lib/components/Card/next/CardLabel.js +0 -54
- package/lib/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts +0 -30
- package/lib/components/Tearsheet/next/_story-assets/StepTearsheet.d.ts.map +0 -1
|
@@ -9,7 +9,7 @@ import { __toESM } from "../../../_virtual/_rolldown/runtime.js";
|
|
|
9
9
|
import { require_classnames } from "../../../node_modules/classnames/index.js";
|
|
10
10
|
import { pkg } from "../../../settings.js";
|
|
11
11
|
import { useCardContext } from "./CardContext.js";
|
|
12
|
-
import React, {
|
|
12
|
+
import React, { forwardRef, useCallback } from "react";
|
|
13
13
|
import PropTypes from "prop-types";
|
|
14
14
|
//#region src/components/Card/next/CardHeader.tsx
|
|
15
15
|
/**
|
|
@@ -22,39 +22,30 @@ var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
|
|
|
22
22
|
const componentName = "CardHeader";
|
|
23
23
|
const blockClass = `${pkg.prefix}--card-next__header`;
|
|
24
24
|
/**
|
|
25
|
-
* CardHeader component - Header section of the card
|
|
25
|
+
* CardHeader component - Header section of the card.
|
|
26
|
+
* Layout is handled entirely by CSS Grid on __header:
|
|
27
|
+
* - CardHeaderMedia spans both columns (full-width row above the title area)
|
|
28
|
+
* - CardTitleMedia occupies column 1 (left icon slot)
|
|
29
|
+
* - CardTitle occupies column 2 (right text slot), or spans full width when
|
|
30
|
+
* CardTitleMedia is absent — detected by the :has selector in SCSS.
|
|
31
|
+
* No child-scanning or wrapper injection is needed.
|
|
26
32
|
*/
|
|
27
|
-
|
|
33
|
+
let CardHeader = forwardRef(({ className, children, ...rest }, ref) => {
|
|
28
34
|
const context = useCardContext();
|
|
29
35
|
const cardBlockClass = `${pkg.prefix}--card-next`;
|
|
30
|
-
const
|
|
31
|
-
|
|
32
|
-
});
|
|
33
|
-
const titleMediaElements = [];
|
|
34
|
-
const mediaElements = [];
|
|
35
|
-
const otherContent = [];
|
|
36
|
-
if (hasTitleMedia) Children.forEach(children, (child) => {
|
|
37
|
-
if (isValidElement(child) && child.type?.["displayName"] === "Card.TitleMedia") titleMediaElements.push(child);
|
|
38
|
-
else if (isValidElement(child) && child.type?.["displayName"] === "Card.Media") mediaElements.push(child);
|
|
39
|
-
else otherContent.push(child);
|
|
40
|
-
});
|
|
41
|
-
const headerClasses = (0, import_classnames.default)(blockClass, className);
|
|
36
|
+
const handleDecoratorClick = useCallback((e) => e.stopPropagation(), []);
|
|
37
|
+
const handleDecoratorKeyDown = useCallback((e) => e.stopPropagation(), []);
|
|
42
38
|
return /* @__PURE__ */ React.createElement("div", {
|
|
43
39
|
...rest,
|
|
44
40
|
ref,
|
|
45
|
-
className:
|
|
46
|
-
},
|
|
41
|
+
className: (0, import_classnames.default)(blockClass, className)
|
|
42
|
+
}, children, context.decorator && /* @__PURE__ */ React.createElement("div", {
|
|
47
43
|
className: `${cardBlockClass}__decorator`,
|
|
48
44
|
role: "presentation",
|
|
49
|
-
onClick:
|
|
50
|
-
|
|
51
|
-
},
|
|
52
|
-
onKeyDown: (e) => {
|
|
53
|
-
e.stopPropagation();
|
|
54
|
-
}
|
|
45
|
+
onClick: handleDecoratorClick,
|
|
46
|
+
onKeyDown: handleDecoratorKeyDown
|
|
55
47
|
}, context.decorator));
|
|
56
48
|
});
|
|
57
|
-
CardHeader.displayName = componentName;
|
|
58
49
|
CardHeader.propTypes = {
|
|
59
50
|
/**
|
|
60
51
|
* Header content
|
|
@@ -65,5 +56,7 @@ CardHeader.propTypes = {
|
|
|
65
56
|
*/
|
|
66
57
|
className: PropTypes.string
|
|
67
58
|
};
|
|
59
|
+
CardHeader = pkg.checkComponentEnabled(CardHeader, componentName);
|
|
60
|
+
CardHeader.displayName = componentName;
|
|
68
61
|
//#endregion
|
|
69
62
|
export { CardHeader };
|
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
7
|
import React, { ReactNode } from 'react';
|
|
8
|
-
import PropTypes from 'prop-types';
|
|
9
8
|
export interface CardHeaderMediaProps {
|
|
10
9
|
/**
|
|
11
10
|
* Provide the contents of the CardHeaderMedia.
|
|
@@ -16,18 +15,5 @@ export interface CardHeaderMediaProps {
|
|
|
16
15
|
*/
|
|
17
16
|
className?: string;
|
|
18
17
|
}
|
|
19
|
-
export declare
|
|
20
|
-
({ children, className, ...rest }: CardHeaderMediaProps): React.JSX.Element;
|
|
21
|
-
propTypes: {
|
|
22
|
-
/**
|
|
23
|
-
* Provide the contents of the CardHeaderMedia.
|
|
24
|
-
*/
|
|
25
|
-
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
26
|
-
/**
|
|
27
|
-
* Provide an optional class to be applied to the containing node.
|
|
28
|
-
*/
|
|
29
|
-
className: PropTypes.Requireable<string>;
|
|
30
|
-
};
|
|
31
|
-
displayName: string;
|
|
32
|
-
};
|
|
18
|
+
export declare let CardHeaderMedia: React.ForwardRefExoticComponent<CardHeaderMediaProps & React.RefAttributes<HTMLDivElement>>;
|
|
33
19
|
//# sourceMappingURL=CardHeaderMedia.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardHeaderMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardHeaderMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,
|
|
1
|
+
{"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"}
|
|
@@ -9,7 +9,7 @@ import { __toESM } from "../../../_virtual/_rolldown/runtime.js";
|
|
|
9
9
|
import { require_classnames } from "../../../node_modules/classnames/index.js";
|
|
10
10
|
import { pkg } from "../../../settings.js";
|
|
11
11
|
import { getDevtoolsProps } from "../../../global/js/utils/devtools.js";
|
|
12
|
-
import React from "react";
|
|
12
|
+
import React, { forwardRef } from "react";
|
|
13
13
|
import PropTypes from "prop-types";
|
|
14
14
|
//#region src/components/Card/next/CardHeaderMedia.tsx
|
|
15
15
|
/**
|
|
@@ -21,14 +21,15 @@ import PropTypes from "prop-types";
|
|
|
21
21
|
var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
|
|
22
22
|
const blockClass = `${pkg.prefix}--card-next`;
|
|
23
23
|
const componentName = "CardHeaderMedia";
|
|
24
|
-
|
|
24
|
+
let CardHeaderMedia = forwardRef(({ children, className, ...rest }, ref) => {
|
|
25
25
|
const classes = (0, import_classnames.default)(`${blockClass}__header-media`, className);
|
|
26
26
|
return /* @__PURE__ */ React.createElement("div", {
|
|
27
27
|
...rest,
|
|
28
|
+
ref,
|
|
28
29
|
className: classes,
|
|
29
30
|
...getDevtoolsProps(componentName)
|
|
30
31
|
}, children);
|
|
31
|
-
};
|
|
32
|
+
});
|
|
32
33
|
CardHeaderMedia.propTypes = {
|
|
33
34
|
/**
|
|
34
35
|
* Provide the contents of the CardHeaderMedia.
|
|
@@ -39,6 +40,7 @@ CardHeaderMedia.propTypes = {
|
|
|
39
40
|
*/
|
|
40
41
|
className: PropTypes.string
|
|
41
42
|
};
|
|
43
|
+
CardHeaderMedia = pkg.checkComponentEnabled(CardHeaderMedia, componentName);
|
|
42
44
|
CardHeaderMedia.displayName = componentName;
|
|
43
45
|
//#endregion
|
|
44
46
|
export { CardHeaderMedia };
|
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
7
|
import React from 'react';
|
|
8
|
-
import PropTypes from 'prop-types';
|
|
9
8
|
import { AspectRatioProps } from '@carbon/react';
|
|
10
9
|
export interface CardMediaProps extends Omit<AspectRatioProps, 'className'> {
|
|
11
10
|
/**
|
|
@@ -16,24 +15,19 @@ export interface CardMediaProps extends Omit<AspectRatioProps, 'className'> {
|
|
|
16
15
|
* Provide an optional class to be applied to the containing node.
|
|
17
16
|
*/
|
|
18
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;
|
|
19
24
|
}
|
|
20
25
|
/**
|
|
21
|
-
* CardMedia is a media slot component that maintains aspect ratio
|
|
22
|
-
*
|
|
23
|
-
*
|
|
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.
|
|
24
31
|
*/
|
|
25
|
-
export declare
|
|
26
|
-
({ children, className, ...rest }: CardMediaProps): React.JSX.Element;
|
|
27
|
-
propTypes: {
|
|
28
|
-
/**
|
|
29
|
-
* Provide the contents of the CardMedia.
|
|
30
|
-
*/
|
|
31
|
-
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
32
|
-
/**
|
|
33
|
-
* Provide an optional class to be applied to the containing node.
|
|
34
|
-
*/
|
|
35
|
-
className: PropTypes.Requireable<string>;
|
|
36
|
-
};
|
|
37
|
-
displayName: string;
|
|
38
|
-
};
|
|
32
|
+
export declare let CardMedia: React.ForwardRefExoticComponent<CardMediaProps & React.RefAttributes<HTMLDivElement>>;
|
|
39
33
|
//# sourceMappingURL=CardMedia.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardMedia.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardMedia.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,
|
|
1
|
+
{"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"}
|
|
@@ -9,7 +9,8 @@ import { __toESM } from "../../../_virtual/_rolldown/runtime.js";
|
|
|
9
9
|
import { require_classnames } from "../../../node_modules/classnames/index.js";
|
|
10
10
|
import { pkg } from "../../../settings.js";
|
|
11
11
|
import { getDevtoolsProps } from "../../../global/js/utils/devtools.js";
|
|
12
|
-
import
|
|
12
|
+
import { useCardContext } from "./CardContext.js";
|
|
13
|
+
import React, { forwardRef } from "react";
|
|
13
14
|
import PropTypes from "prop-types";
|
|
14
15
|
import { AspectRatio } from "@carbon/react";
|
|
15
16
|
//#region src/components/Card/next/CardMedia.tsx
|
|
@@ -23,28 +24,36 @@ var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
|
|
|
23
24
|
const blockClass = `${pkg.prefix}--card-next`;
|
|
24
25
|
const componentName = "CardMedia";
|
|
25
26
|
/**
|
|
26
|
-
* CardMedia is a media slot component that maintains aspect ratio
|
|
27
|
-
*
|
|
28
|
-
*
|
|
27
|
+
* CardMedia is a media slot component that maintains aspect ratio.
|
|
28
|
+
*
|
|
29
|
+
* In vertical (default) mode it delegates to Carbon's AspectRatio.
|
|
30
|
+
* In horizontal mode it renders a plain div sized to `mediaWidth` (default
|
|
31
|
+
* 33.33%) that stretches to the full card height — no aspect-ratio math needed.
|
|
29
32
|
*/
|
|
30
|
-
|
|
33
|
+
let CardMedia = forwardRef(({ children, className, ratio, mediaWidth = "33.33%", ...rest }, ref) => {
|
|
34
|
+
const { horizontal } = useCardContext();
|
|
31
35
|
const classes = (0, import_classnames.default)(`${blockClass}__media`, className);
|
|
36
|
+
if (horizontal) return /* @__PURE__ */ React.createElement("div", {
|
|
37
|
+
ref,
|
|
38
|
+
className: `${blockClass}__media ${blockClass}__media--horizontal`,
|
|
39
|
+
style: { [`--${blockClass}--media-width`]: mediaWidth },
|
|
40
|
+
...getDevtoolsProps(componentName)
|
|
41
|
+
}, children);
|
|
32
42
|
return /* @__PURE__ */ React.createElement(AspectRatio, {
|
|
43
|
+
ratio,
|
|
33
44
|
...rest,
|
|
45
|
+
ref,
|
|
34
46
|
className: classes,
|
|
35
47
|
...getDevtoolsProps(componentName)
|
|
36
48
|
}, children);
|
|
37
|
-
};
|
|
49
|
+
});
|
|
38
50
|
CardMedia.propTypes = {
|
|
39
|
-
/**
|
|
40
|
-
* Provide the contents of the CardMedia.
|
|
41
|
-
*/
|
|
42
51
|
children: PropTypes.node,
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
className: PropTypes.string
|
|
52
|
+
className: PropTypes.string,
|
|
53
|
+
/** Width of the media column in horizontal layout. Any valid CSS width value. */
|
|
54
|
+
mediaWidth: PropTypes.string
|
|
47
55
|
};
|
|
56
|
+
CardMedia = pkg.checkComponentEnabled(CardMedia, componentName);
|
|
48
57
|
CardMedia.displayName = componentName;
|
|
49
58
|
//#endregion
|
|
50
59
|
export { CardMedia };
|
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
7
|
import React, { ReactNode } from 'react';
|
|
8
|
-
import PropTypes from 'prop-types';
|
|
9
8
|
export interface CardTitleProps {
|
|
10
9
|
/**
|
|
11
10
|
* Provide the contents of the CardTitle.
|
|
@@ -21,10 +20,10 @@ export interface CardTitleProps {
|
|
|
21
20
|
* - `number`: Multi-line truncation (line clamp)
|
|
22
21
|
* @default false
|
|
23
22
|
*/
|
|
24
|
-
|
|
23
|
+
titleTruncate?: boolean | number;
|
|
25
24
|
/**
|
|
26
25
|
* Maximum width for the title.
|
|
27
|
-
* @default '
|
|
26
|
+
* @default '100%'
|
|
28
27
|
*/
|
|
29
28
|
maxWidth?: string;
|
|
30
29
|
/**
|
|
@@ -41,6 +40,30 @@ export interface CardTitleProps {
|
|
|
41
40
|
* - Expressive density: 24px icon recommended
|
|
42
41
|
*/
|
|
43
42
|
titleEnd?: ReactNode;
|
|
43
|
+
/**
|
|
44
|
+
* Optional label rendered above the title text.
|
|
45
|
+
* Uses $label-01 typography and $text-secondary color.
|
|
46
|
+
*/
|
|
47
|
+
label?: ReactNode;
|
|
48
|
+
/**
|
|
49
|
+
* Enable truncation on the label text.
|
|
50
|
+
* - `true`: Single line truncation
|
|
51
|
+
* - `number`: Multi-line truncation (line clamp)
|
|
52
|
+
* @default false
|
|
53
|
+
*/
|
|
54
|
+
labelTruncate?: boolean | number;
|
|
55
|
+
/**
|
|
56
|
+
* Optional description rendered below the title text.
|
|
57
|
+
* Uses $label-01 typography and $text-secondary color.
|
|
58
|
+
*/
|
|
59
|
+
description?: ReactNode;
|
|
60
|
+
/**
|
|
61
|
+
* Enable truncation on the description text.
|
|
62
|
+
* - `true`: Single line truncation
|
|
63
|
+
* - `number`: Multi-line truncation (line clamp)
|
|
64
|
+
* @default false
|
|
65
|
+
*/
|
|
66
|
+
descriptionTruncate?: boolean | number;
|
|
44
67
|
}
|
|
45
68
|
/**
|
|
46
69
|
* CardTitle displays the main title text in the card header.
|
|
@@ -49,34 +72,5 @@ export interface CardTitleProps {
|
|
|
49
72
|
* - Expressive: Use $heading-03 (20px/28px)
|
|
50
73
|
* Color uses $text-primary token.
|
|
51
74
|
*/
|
|
52
|
-
export declare
|
|
53
|
-
({ children, className, truncate, maxWidth, titleStart, titleEnd, ...rest }: CardTitleProps): React.JSX.Element;
|
|
54
|
-
propTypes: {
|
|
55
|
-
/**
|
|
56
|
-
* Provide the contents of the CardTitle.
|
|
57
|
-
*/
|
|
58
|
-
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
59
|
-
/**
|
|
60
|
-
* Provide an optional class to be applied to the containing node.
|
|
61
|
-
*/
|
|
62
|
-
className: PropTypes.Requireable<string>;
|
|
63
|
-
/**
|
|
64
|
-
* Maximum width for the title.
|
|
65
|
-
*/
|
|
66
|
-
maxWidth: PropTypes.Requireable<string>;
|
|
67
|
-
/**
|
|
68
|
-
* Optional trailing icon or content to display after the title text.
|
|
69
|
-
*/
|
|
70
|
-
titleEnd: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
71
|
-
/**
|
|
72
|
-
* Optional leading icon or content to display before the title text.
|
|
73
|
-
*/
|
|
74
|
-
titleStart: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
75
|
-
/**
|
|
76
|
-
* Enable text truncation with ellipsis.
|
|
77
|
-
*/
|
|
78
|
-
truncate: PropTypes.Requireable<NonNullable<number | boolean>>;
|
|
79
|
-
};
|
|
80
|
-
displayName: string;
|
|
81
|
-
};
|
|
75
|
+
export declare let CardTitle: React.ForwardRefExoticComponent<CardTitleProps & React.RefAttributes<HTMLDivElement>>;
|
|
82
76
|
//# sourceMappingURL=CardTitle.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardTitle.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/next/CardTitle.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,
|
|
1
|
+
{"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"}
|
|
@@ -9,7 +9,7 @@ import { __toESM } from "../../../_virtual/_rolldown/runtime.js";
|
|
|
9
9
|
import { require_classnames } from "../../../node_modules/classnames/index.js";
|
|
10
10
|
import { pkg } from "../../../settings.js";
|
|
11
11
|
import { getDevtoolsProps } from "../../../global/js/utils/devtools.js";
|
|
12
|
-
import React from "react";
|
|
12
|
+
import React, { forwardRef } from "react";
|
|
13
13
|
import PropTypes from "prop-types";
|
|
14
14
|
//#region src/components/Card/next/CardTitle.tsx
|
|
15
15
|
/**
|
|
@@ -28,24 +28,45 @@ const componentName = "CardTitle";
|
|
|
28
28
|
* - Expressive: Use $heading-03 (20px/28px)
|
|
29
29
|
* Color uses $text-primary token.
|
|
30
30
|
*/
|
|
31
|
-
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
}
|
|
31
|
+
let CardTitle = forwardRef(({ children, className, titleTruncate = false, maxWidth = "100%", titleStart, titleEnd, label, labelTruncate = false, description, descriptionTruncate = false, ...rest }, ref) => {
|
|
32
|
+
const isTitleMulti = typeof titleTruncate === "number";
|
|
33
|
+
const isLabelMulti = typeof labelTruncate === "number";
|
|
34
|
+
const isDescMulti = typeof descriptionTruncate === "number";
|
|
35
|
+
const containerClasses = (0, import_classnames.default)(`${blockClass}__title`, className);
|
|
36
|
+
const textRowClasses = (0, import_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
|
+
[`--${blockClass}--title-max-width`]: maxWidth,
|
|
44
|
+
...isTitleMulti && { [`--${blockClass}--title-line-clamp`]: titleTruncate }
|
|
45
|
+
} : void 0;
|
|
46
|
+
const labelVars = isLabelMulti ? { [`--${blockClass}--label-line-clamp`]: labelTruncate } : void 0;
|
|
47
|
+
const descVars = isDescMulti ? { [`--${blockClass}--description-line-clamp`]: descriptionTruncate } : void 0;
|
|
42
48
|
return /* @__PURE__ */ React.createElement("div", {
|
|
43
49
|
...rest,
|
|
44
|
-
|
|
45
|
-
|
|
50
|
+
ref,
|
|
51
|
+
className: containerClasses,
|
|
46
52
|
...getDevtoolsProps(componentName)
|
|
47
|
-
},
|
|
48
|
-
}
|
|
53
|
+
}, label && /* @__PURE__ */ React.createElement("div", {
|
|
54
|
+
className: (0, import_classnames.default)(`${blockClass}__label`, {
|
|
55
|
+
[`${blockClass}__label--truncate`]: labelTruncate === true,
|
|
56
|
+
[`${blockClass}__label--truncate-multi`]: isLabelMulti
|
|
57
|
+
}),
|
|
58
|
+
style: labelVars
|
|
59
|
+
}, label), /* @__PURE__ */ React.createElement("span", {
|
|
60
|
+
className: textRowClasses,
|
|
61
|
+
style: titleVars
|
|
62
|
+
}, titleStart && /* @__PURE__ */ React.createElement("span", { className: `${blockClass}__title-start-icon` }, titleStart), children, titleEnd && /* @__PURE__ */ React.createElement("span", { className: `${blockClass}__title-end-icon` }, titleEnd)), description && /* @__PURE__ */ React.createElement("div", {
|
|
63
|
+
className: (0, import_classnames.default)(`${blockClass}__description`, {
|
|
64
|
+
[`${blockClass}__description--truncate`]: descriptionTruncate === true,
|
|
65
|
+
[`${blockClass}__description--truncate-multi`]: isDescMulti
|
|
66
|
+
}),
|
|
67
|
+
style: descVars
|
|
68
|
+
}, description));
|
|
69
|
+
});
|
|
49
70
|
CardTitle.propTypes = {
|
|
50
71
|
/**
|
|
51
72
|
* Provide the contents of the CardTitle.
|
|
@@ -56,7 +77,27 @@ CardTitle.propTypes = {
|
|
|
56
77
|
*/
|
|
57
78
|
className: PropTypes.string,
|
|
58
79
|
/**
|
|
59
|
-
*
|
|
80
|
+
* Optional description rendered below the title text.
|
|
81
|
+
*/
|
|
82
|
+
description: PropTypes.node,
|
|
83
|
+
/**
|
|
84
|
+
* Enable truncation on the description text.
|
|
85
|
+
* - `true`: Single line truncation
|
|
86
|
+
* - `number`: Multi-line truncation (line clamp)
|
|
87
|
+
*/
|
|
88
|
+
descriptionTruncate: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),
|
|
89
|
+
/**
|
|
90
|
+
* Optional label rendered above the title text.
|
|
91
|
+
*/
|
|
92
|
+
label: PropTypes.node,
|
|
93
|
+
/**
|
|
94
|
+
* Enable truncation on the label text.
|
|
95
|
+
* - `true`: Single line truncation
|
|
96
|
+
* - `number`: Multi-line truncation (line clamp)
|
|
97
|
+
*/
|
|
98
|
+
labelTruncate: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),
|
|
99
|
+
/**
|
|
100
|
+
* Maximum width for the title when truncation is active.
|
|
60
101
|
*/
|
|
61
102
|
maxWidth: PropTypes.string,
|
|
62
103
|
/**
|
|
@@ -69,9 +110,12 @@ CardTitle.propTypes = {
|
|
|
69
110
|
titleStart: PropTypes.node,
|
|
70
111
|
/**
|
|
71
112
|
* Enable text truncation with ellipsis.
|
|
113
|
+
* - `true`: Single line truncation
|
|
114
|
+
* - `number`: Multi-line truncation (line clamp)
|
|
72
115
|
*/
|
|
73
|
-
|
|
116
|
+
titleTruncate: PropTypes.oneOfType([PropTypes.bool, PropTypes.number])
|
|
74
117
|
};
|
|
118
|
+
CardTitle = pkg.checkComponentEnabled(CardTitle, componentName);
|
|
75
119
|
CardTitle.displayName = componentName;
|
|
76
120
|
//#endregion
|
|
77
121
|
export { CardTitle };
|
|
@@ -20,5 +20,5 @@ export interface CardTitleMediaProps {
|
|
|
20
20
|
* The media slot adapts to the heading area height (min 48px, max 64px) and stays
|
|
21
21
|
* top-aligned when the title wraps to multiple lines.
|
|
22
22
|
*/
|
|
23
|
-
export declare
|
|
23
|
+
export declare let CardTitleMedia: React.ForwardRefExoticComponent<CardTitleMediaProps & React.RefAttributes<HTMLDivElement>>;
|
|
24
24
|
//# sourceMappingURL=CardTitleMedia.d.ts.map
|
|
@@ -1 +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,
|
|
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,IAAI,cAAc,4FAUxB,CAAC"}
|
|
@@ -25,7 +25,7 @@ const componentName = "CardTitleMedia";
|
|
|
25
25
|
* The media slot adapts to the heading area height (min 48px, max 64px) and stays
|
|
26
26
|
* top-aligned when the title wraps to multiple lines.
|
|
27
27
|
*/
|
|
28
|
-
|
|
28
|
+
let CardTitleMedia = forwardRef(({ className, children, ...rest }, ref) => {
|
|
29
29
|
const titleMediaClasses = (0, import_classnames.default)(blockClass, className);
|
|
30
30
|
return /* @__PURE__ */ React.createElement("div", {
|
|
31
31
|
...rest,
|
|
@@ -33,7 +33,6 @@ const CardTitleMedia = forwardRef(({ className, children, ...rest }, ref) => {
|
|
|
33
33
|
className: titleMediaClasses
|
|
34
34
|
}, children);
|
|
35
35
|
});
|
|
36
|
-
CardTitleMedia.displayName = componentName;
|
|
37
36
|
CardTitleMedia.propTypes = {
|
|
38
37
|
/**
|
|
39
38
|
* Content to be rendered in the title media slot (typically an icon or small image)
|
|
@@ -44,5 +43,7 @@ CardTitleMedia.propTypes = {
|
|
|
44
43
|
*/
|
|
45
44
|
className: PropTypes.string
|
|
46
45
|
};
|
|
46
|
+
CardTitleMedia = pkg.checkComponentEnabled(CardTitleMedia, componentName);
|
|
47
|
+
CardTitleMedia.displayName = componentName;
|
|
47
48
|
//#endregion
|
|
48
49
|
export { CardTitleMedia };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/next/_story-assets/data.js"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,48 @@
|
|
|
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;
|
|
48
|
+
//# sourceMappingURL=options.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/next/_story-assets/options.js"],"names":[],"mappings":""}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*/
|
|
7
|
-
export { Card, CardHeader, CardBody, CardFooter, CardHeaderMedia, CardMedia,
|
|
8
|
-
export type { CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, CardHeaderMediaProps, CardMediaProps,
|
|
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';
|
|
9
9
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +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,
|
|
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,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"}
|
|
@@ -11,10 +11,8 @@ import { CardBody } from "./CardBody.js";
|
|
|
11
11
|
import { CardFooter } from "./CardFooter.js";
|
|
12
12
|
import { CardHeaderMedia } from "./CardHeaderMedia.js";
|
|
13
13
|
import { CardMedia } from "./CardMedia.js";
|
|
14
|
-
import { CardLabel } from "./CardLabel.js";
|
|
15
14
|
import { CardTitle } from "./CardTitle.js";
|
|
16
15
|
import { CardTitleMedia } from "./CardTitleMedia.js";
|
|
17
|
-
import { CardCaption } from "./CardCaption.js";
|
|
18
16
|
import { CardActions } from "./CardActions.js";
|
|
19
17
|
import { CardAction } from "./CardAction.js";
|
|
20
18
|
import { Card } from "./Card.js";
|
|
@@ -24,11 +22,9 @@ var next_exports = /* @__PURE__ */ __exportAll({
|
|
|
24
22
|
CardAction: () => CardAction,
|
|
25
23
|
CardActions: () => CardActions,
|
|
26
24
|
CardBody: () => CardBody,
|
|
27
|
-
CardCaption: () => CardCaption,
|
|
28
25
|
CardFooter: () => CardFooter,
|
|
29
26
|
CardHeader: () => CardHeader,
|
|
30
27
|
CardHeaderMedia: () => CardHeaderMedia,
|
|
31
|
-
CardLabel: () => CardLabel,
|
|
32
28
|
CardMedia: () => CardMedia,
|
|
33
29
|
CardTitle: () => CardTitle,
|
|
34
30
|
CardTitleMedia: () => CardTitleMedia
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tearsheet.d.ts","sourceRoot":"","sources":["../../../../src/components/Tearsheet/next/Tearsheet.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,EAKZ,SAAS,EAET,EAAE,EAEH,MAAM,OAAO,CAAC;AAOf,OAAO,EAEL,KAAK,kBAAkB,EAKxB,MAAM,eAAe,CAAC;AAEvB,OAAwB,EACtB,KAAK,oBAAoB,EAEzB,KAAK,2BAA2B,EAEhC,KAAK,0BAA0B,EAChC,MAAM,mBAAmB,CAAC;AAC3B,OAA+B,EAC7B,KAAK,2BAA2B,EACjC,MAAM,0BAA0B,CAAC;AAClC,OAAsB,EAEpB,KAAK,eAAe,EAEpB,KAAK,gBAAgB,EAErB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACxB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAEL,KAAK,8BAA8B,EAEnC,KAAK,2BAA2B,EACjC,MAAM,0BAA0B,CAAC;AAClC,OAAwB,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAQ/E;;;;GAIG;AAEH,MAAM,WAAW,cAAe,SAAQ,kBAAkB;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAE5B;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,MAAM,EAAE,CAAC;IAElC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B;;OAEG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC;IAE3B;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,yBAAyB,CAClE,cAAc,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CACrD,GAAG;IACF,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,CAAC;IACjC,aAAa,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC/C,UAAU,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC;IAChC,aAAa,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC/C,YAAY,EAAE,EAAE,CAAC,0BAA0B,CAAC,CAAC;IAC7C,aAAa,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC/C,gBAAgB,EAAE,EAAE,CAAC,8BAA8B,CAAC,CAAC;IACrD,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAClC,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAAC,CAAC;IACxC,IAAI,EAAE,EAAE,CAAC,kBAAkB,CAAC,CAAC;IAC7B,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,CAAC;CAClC,CAAC;
|
|
1
|
+
{"version":3,"file":"Tearsheet.d.ts","sourceRoot":"","sources":["../../../../src/components/Tearsheet/next/Tearsheet.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,EAKZ,SAAS,EAET,EAAE,EAEH,MAAM,OAAO,CAAC;AAOf,OAAO,EAEL,KAAK,kBAAkB,EAKxB,MAAM,eAAe,CAAC;AAEvB,OAAwB,EACtB,KAAK,oBAAoB,EAEzB,KAAK,2BAA2B,EAEhC,KAAK,0BAA0B,EAChC,MAAM,mBAAmB,CAAC;AAC3B,OAA+B,EAC7B,KAAK,2BAA2B,EACjC,MAAM,0BAA0B,CAAC;AAClC,OAAsB,EAEpB,KAAK,eAAe,EAEpB,KAAK,gBAAgB,EAErB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACxB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAEL,KAAK,8BAA8B,EAEnC,KAAK,2BAA2B,EACjC,MAAM,0BAA0B,CAAC;AAClC,OAAwB,EAAE,KAAK,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAQ/E;;;;GAIG;AAEH,MAAM,WAAW,cAAe,SAAQ,kBAAkB;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAE5B;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,MAAM,EAAE,CAAC;IAElC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B;;OAEG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC;IAE3B;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,yBAAyB,CAClE,cAAc,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CACrD,GAAG;IACF,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,CAAC;IACjC,aAAa,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC/C,UAAU,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC;IAChC,aAAa,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC/C,YAAY,EAAE,EAAE,CAAC,0BAA0B,CAAC,CAAC;IAC7C,aAAa,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC/C,gBAAgB,EAAE,EAAE,CAAC,8BAA8B,CAAC,CAAC;IACrD,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAClC,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAAC,CAAC;IACxC,IAAI,EAAE,EAAE,CAAC,kBAAkB,CAAC,CAAC;IAC7B,MAAM,EAAE,EAAE,CAAC,oBAAoB,CAAC,CAAC;CAClC,CAAC;AA2RF;;;GAGG;AACH,eAAO,MAAM,SAAS,EA0BjB,sBAAsB,CAAC"}
|
|
@@ -58,9 +58,12 @@ const TearsheetInternal = forwardRef(({ children, variant = "wide", selectorsFlo
|
|
|
58
58
|
const titleId = useRef(`${blockClass}__title-${uniqueId.current}`);
|
|
59
59
|
const { notifyStack, stack, getDepth, getScaleFactor, getBlockSizeChange } = useStackContext();
|
|
60
60
|
const [depth, setDepth] = useState(0);
|
|
61
|
-
const [mountNode, setMountNode] = useState(
|
|
61
|
+
const [mountNode, setMountNode] = useState(() => {
|
|
62
|
+
if (disablePortal || typeof document === "undefined") return null;
|
|
63
|
+
return portalTarget ?? document.body;
|
|
64
|
+
});
|
|
62
65
|
useIsomorphicEffect(() => {
|
|
63
|
-
|
|
66
|
+
setMountNode(disablePortal ? null : portalTarget ?? document.body);
|
|
64
67
|
}, [portalTarget, disablePortal]);
|
|
65
68
|
useIsomorphicEffect(() => {
|
|
66
69
|
const headerActionMarginRight = (localRef.current?.querySelector(`.${carbonPrefix}--ai-label`)?.clientWidth ?? 0) + 24 + (isSm ? 8 : 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TearsheetBody.d.ts","sourceRoot":"","sources":["../../../../src/components/Tearsheet/next/TearsheetBody.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,EAGZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAOf;;;;GAIG;AAEH,MAAM,WAAW,kBAAkB;IACjC,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,aAAa,2FAQlB,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AACD;;;;GAIG;AACH,eAAO,MAAM,WAAW,yFAuDvB,CAAC;AAGF;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,IAAI,IAAI,CAAC;IAC7B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,sBAAsB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7D;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC;AACD,eAAO,MAAM,cAAc,4FAoD1B,CAAC;AAGF;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,sBAAsB,CAAC,IAAI,IAAI,CAAC;IAChC,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,yBAAyB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzD;;OAEG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC;AACD,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"TearsheetBody.d.ts","sourceRoot":"","sources":["../../../../src/components/Tearsheet/next/TearsheetBody.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,EAGZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAOf;;;;GAIG;AAEH,MAAM,WAAW,kBAAkB;IACjC,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,wDAAwD;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,aAAa,2FAQlB,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AACD;;;;GAIG;AACH,eAAO,MAAM,WAAW,yFAuDvB,CAAC;AAGF;;;;GAIG;AACH,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,IAAI,IAAI,CAAC;IAC7B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,sBAAsB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7D;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC;AACD,eAAO,MAAM,cAAc,4FAoD1B,CAAC;AAGF;;;;GAIG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,sBAAsB,CAAC,IAAI,IAAI,CAAC;IAChC,0DAA0D;IAC1D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,yBAAyB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzD;;OAEG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;CACnC;AACD,eAAO,MAAM,UAAU,wFAsDtB,CAAC;AAGF,eAAe,aAAa,CAAC"}
|