shared-design-system 1.102.0 → 1.103.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.
|
@@ -12,5 +12,11 @@ export interface CardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 't
|
|
|
12
12
|
bordered?: boolean;
|
|
13
13
|
loading?: boolean;
|
|
14
14
|
accentColor?: string;
|
|
15
|
+
bodyStyle?: React.CSSProperties;
|
|
16
|
+
bodyClassName?: string;
|
|
17
|
+
headerStyle?: React.CSSProperties;
|
|
18
|
+
headerClassName?: string;
|
|
19
|
+
footerStyle?: React.CSSProperties;
|
|
20
|
+
footerClassName?: string;
|
|
15
21
|
}
|
|
16
22
|
export declare const Card: React.FC<CardProps>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useState } from 'react';
|
|
3
3
|
import { tokens } from '../tokens';
|
|
4
|
-
export const Card = ({ children, title, subtitle, avatar, headerAction, extra, footer, className = '', style = {}, padding = 'md', variant = 'default', hoverable = false, bordered = true, loading = false, accentColor, ...props }) => {
|
|
4
|
+
export const Card = ({ children, title, subtitle, avatar, headerAction, extra, footer, className = '', style = {}, padding = 'md', variant = 'default', hoverable = false, bordered = true, loading = false, accentColor, bodyStyle: customBodyStyle, bodyClassName = '', headerStyle: customHeaderStyle, headerClassName = '', footerStyle: customFooterStyle, footerClassName = '', ...props }) => {
|
|
5
5
|
const [hovered, setHovered] = useState(false);
|
|
6
6
|
const getPadding = () => {
|
|
7
7
|
switch (padding) {
|
|
@@ -69,15 +69,18 @@ export const Card = ({ children, title, subtitle, avatar, headerAction, extra, f
|
|
|
69
69
|
alignItems: 'center',
|
|
70
70
|
gap: tokens.spacing[3],
|
|
71
71
|
backgroundColor: variant === 'glass' ? 'rgba(255,255,255,0.4)' : tokens.color.white,
|
|
72
|
+
...customHeaderStyle,
|
|
72
73
|
};
|
|
73
74
|
const bodyStyle = {
|
|
74
75
|
padding: getPadding(),
|
|
75
76
|
flex: 1,
|
|
77
|
+
...customBodyStyle,
|
|
76
78
|
};
|
|
77
79
|
const footerStyle = {
|
|
78
80
|
padding: `${tokens.spacing[4]} ${getPadding()}`,
|
|
79
81
|
borderTop: `1px solid ${tokens.color.slate100}`,
|
|
80
82
|
backgroundColor: variant === 'glass' ? 'rgba(248,250,252,0.5)' : tokens.color.slate50,
|
|
83
|
+
...customFooterStyle,
|
|
81
84
|
};
|
|
82
85
|
return (_jsxs("div", { style: containerStyle, className: `ds-card ds-card--${variant} ${className}`, onMouseEnter: () => { if (hoverable)
|
|
83
86
|
setHovered(true); }, onMouseLeave: () => { if (hoverable)
|
|
@@ -102,15 +105,13 @@ export const Card = ({ children, title, subtitle, avatar, headerAction, extra, f
|
|
|
102
105
|
borderTopColor: tokens.color.primary,
|
|
103
106
|
borderRadius: '50%',
|
|
104
107
|
animation: 'ds-spin 0.7s linear infinite',
|
|
105
|
-
} }) })), (title || subtitle || avatar || headerAction || extra) && (_jsxs("div", { style: headerStyle, children: [avatar && _jsx("div", { style: { flexShrink: 0 }, children: avatar }), _jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [title && (_jsx("h3", { style: {
|
|
108
|
+
} }) })), (title || subtitle || avatar || headerAction || extra) && (_jsxs("div", { style: headerStyle, className: `ds-card-header ${headerClassName}`, children: [avatar && _jsx("div", { style: { flexShrink: 0 }, children: avatar }), _jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [title && (_jsx("h3", { style: {
|
|
106
109
|
margin: 0,
|
|
107
110
|
fontSize: tokens.font.sm,
|
|
108
111
|
fontWeight: tokens.font.weightBold,
|
|
109
112
|
color: tokens.color.slate800,
|
|
110
113
|
letterSpacing: '-0.015em',
|
|
111
114
|
lineHeight: 1.3,
|
|
112
|
-
whiteSpace: 'nowrap',
|
|
113
|
-
overflow: 'hidden',
|
|
114
115
|
textOverflow: 'ellipsis',
|
|
115
116
|
}, children: title })), subtitle && (_jsx("p", { style: {
|
|
116
117
|
margin: `${tokens.spacing[1]} 0 0 0`,
|
|
@@ -118,6 +119,6 @@ export const Card = ({ children, title, subtitle, avatar, headerAction, extra, f
|
|
|
118
119
|
color: tokens.color.textMuted,
|
|
119
120
|
fontWeight: tokens.font.weightMedium,
|
|
120
121
|
lineHeight: 1.4,
|
|
121
|
-
}, children: subtitle }))] }), (headerAction || extra) && (_jsx("div", { style: { flexShrink: 0, marginLeft: tokens.spacing[2] }, children: headerAction || extra }))] })), _jsx("div", { style: bodyStyle, children: children }), footer && (_jsx("div", { style: footerStyle, children: footer }))] }));
|
|
122
|
+
}, children: subtitle }))] }), (headerAction || extra) && (_jsx("div", { style: { flexShrink: 0, marginLeft: tokens.spacing[2] }, children: headerAction || extra }))] })), _jsx("div", { style: bodyStyle, className: `ds-card-body ${bodyClassName}`, children: children }), footer && (_jsx("div", { style: footerStyle, className: `ds-card-footer ${footerClassName}`, children: footer }))] }));
|
|
122
123
|
};
|
|
123
124
|
//# sourceMappingURL=Card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card.tsx"],"names":[],"mappings":"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"}
|