shared-design-system 1.117.0 → 1.119.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/dist/src/components/Alert.js +14 -13
- package/dist/src/components/Alert.js.map +1 -1
- package/dist/src/components/Badge.js +25 -109
- package/dist/src/components/Badge.js.map +1 -1
- package/dist/src/components/Button.d.ts +1 -1
- package/dist/src/components/Button.js +67 -40
- package/dist/src/components/Button.js.map +1 -1
- package/dist/src/components/ConfigProvider.d.ts +1 -1
- package/dist/src/components/ConfigProvider.js +3 -3
- package/dist/src/components/ConfigProvider.js.map +1 -1
- package/dist/src/components/DatePicker.js +1 -1
- package/dist/src/components/InputComponents.js +20 -17
- package/dist/src/components/InputComponents.js.map +1 -1
- package/dist/src/components/MultiSelect.js +16 -15
- package/dist/src/components/MultiSelect.js.map +1 -1
- package/dist/src/components/ReadOnlyField.js +1 -1
- package/dist/src/components/Select.js +16 -15
- package/dist/src/components/Select.js.map +1 -1
- package/dist/src/components/Tag.js +9 -9
- package/dist/src/components/Tag.js.map +1 -1
- package/dist/src/components/TagInput.js +1 -1
- package/dist/src/components/Typography.js +18 -18
- package/dist/src/components/Typography.js.map +1 -1
- package/dist/src/tokens.d.ts +46 -0
- package/dist/src/tokens.js +195 -43
- package/dist/src/tokens.js.map +1 -1
- package/package.json +1 -1
- package/src/theme.css +135 -82
|
@@ -4,33 +4,33 @@ import { tokens } from '../tokens';
|
|
|
4
4
|
const SEVERITY_CONFIG = {
|
|
5
5
|
success: {
|
|
6
6
|
bg: tokens.color.successBg,
|
|
7
|
-
border: 'rgba(
|
|
7
|
+
border: 'rgba(34, 149, 93, 0.2)', // green/6
|
|
8
8
|
text: tokens.color.success,
|
|
9
|
-
darkText:
|
|
9
|
+
darkText: tokens.color.green[7], // #1F8855
|
|
10
10
|
accentBar: tokens.color.success,
|
|
11
11
|
filledBg: tokens.color.success,
|
|
12
12
|
},
|
|
13
13
|
warning: {
|
|
14
14
|
bg: tokens.color.warningBg,
|
|
15
|
-
border: 'rgba(245, 102, 0, 0.2)',
|
|
15
|
+
border: 'rgba(245, 102, 0, 0.2)', // volcano/6
|
|
16
16
|
text: tokens.color.warning,
|
|
17
|
-
darkText:
|
|
17
|
+
darkText: tokens.color.volcano[7], // #AB4700
|
|
18
18
|
accentBar: tokens.color.warning,
|
|
19
19
|
filledBg: tokens.color.warning,
|
|
20
20
|
},
|
|
21
21
|
error: {
|
|
22
22
|
bg: tokens.color.dangerBg,
|
|
23
|
-
border: 'rgba(
|
|
23
|
+
border: 'rgba(218, 33, 40, 0.2)', // red/6
|
|
24
24
|
text: tokens.color.danger,
|
|
25
|
-
darkText:
|
|
25
|
+
darkText: tokens.color.red[7], // #C61F24
|
|
26
26
|
accentBar: tokens.color.danger,
|
|
27
27
|
filledBg: tokens.color.danger,
|
|
28
28
|
},
|
|
29
29
|
info: {
|
|
30
30
|
bg: tokens.color.infoBg,
|
|
31
|
-
border: 'rgba(
|
|
31
|
+
border: 'rgba(10, 109, 199, 0.2)', // blue/6
|
|
32
32
|
text: tokens.color.info,
|
|
33
|
-
darkText:
|
|
33
|
+
darkText: tokens.color.blue[7], // #0963B5
|
|
34
34
|
accentBar: tokens.color.info,
|
|
35
35
|
filledBg: tokens.color.info,
|
|
36
36
|
},
|
|
@@ -61,7 +61,7 @@ export const Alert = React.forwardRef(({ severity = 'info', title, children, cla
|
|
|
61
61
|
...(isFilled
|
|
62
62
|
? {
|
|
63
63
|
backgroundColor: s.filledBg,
|
|
64
|
-
color:
|
|
64
|
+
color: tokens.color.white,
|
|
65
65
|
border: 'none',
|
|
66
66
|
boxShadow: 'none',
|
|
67
67
|
}
|
|
@@ -69,17 +69,18 @@ export const Alert = React.forwardRef(({ severity = 'info', title, children, cla
|
|
|
69
69
|
? {
|
|
70
70
|
backgroundColor: 'transparent',
|
|
71
71
|
color: s.darkText,
|
|
72
|
-
border: `
|
|
72
|
+
border: `1px solid ${s.accentBar}`,
|
|
73
|
+
borderLeft: `3px solid ${s.accentBar}`,
|
|
73
74
|
}
|
|
74
75
|
: {
|
|
75
76
|
backgroundColor: s.bg,
|
|
76
77
|
color: s.darkText,
|
|
77
78
|
border: `1px solid ${s.border}`,
|
|
78
|
-
borderLeft: `
|
|
79
|
+
borderLeft: `3px solid ${s.accentBar}`,
|
|
79
80
|
}),
|
|
80
81
|
...style,
|
|
81
82
|
};
|
|
82
|
-
const iconColor = isFilled ?
|
|
83
|
+
const iconColor = isFilled ? tokens.color.white : s.text;
|
|
83
84
|
const resolvedIcon = icon || DEFAULT_ICONS[severity];
|
|
84
85
|
return (_jsxs("div", { ref: ref, role: "alert", style: baseStyle, className: `ds-alert ds-alert--${severity} ds-alert--${variant} ${className}`, ...props, children: [_jsx("div", { style: {
|
|
85
86
|
color: iconColor,
|
|
@@ -100,7 +101,7 @@ export const Alert = React.forwardRef(({ severity = 'info', title, children, cla
|
|
|
100
101
|
border: 'none',
|
|
101
102
|
cursor: 'pointer',
|
|
102
103
|
padding: '3px',
|
|
103
|
-
color: isFilled ?
|
|
104
|
+
color: isFilled ? tokens.color.overlayWhite80 : s.darkText,
|
|
104
105
|
display: 'flex',
|
|
105
106
|
alignItems: 'center',
|
|
106
107
|
justifyContent: 'center',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../src/components/Alert.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAoBnC,MAAM,eAAe,GAAmC;IACtD,OAAO,EAAE;QACP,EAAE,EAAE,MAAM,CAAC,KAAK,CAAC,SAAS;QAC1B,MAAM,EAAE,
|
|
1
|
+
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../src/components/Alert.tsx"],"names":[],"mappings":"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"}
|
|
@@ -8,141 +8,57 @@ export const Badge = React.forwardRef(({ children, variant = 'slate', type = 'su
|
|
|
8
8
|
switch (variant) {
|
|
9
9
|
case 'primary':
|
|
10
10
|
return isSubtle
|
|
11
|
-
? {
|
|
12
|
-
backgroundColor: tokens.color.primaryLight,
|
|
13
|
-
color: tokens.color.primary,
|
|
14
|
-
borderColor: 'rgba(190, 17, 40, 0.2)',
|
|
15
|
-
}
|
|
11
|
+
? { backgroundColor: tokens.color.primaryLight, color: tokens.color.primary, borderColor: 'rgba(218, 33, 40, 0.2)' }
|
|
16
12
|
: isOutline
|
|
17
|
-
? {
|
|
18
|
-
|
|
19
|
-
color: tokens.color.primary,
|
|
20
|
-
borderColor: tokens.color.primary,
|
|
21
|
-
}
|
|
22
|
-
: {
|
|
23
|
-
backgroundColor: tokens.color.primary,
|
|
24
|
-
color: '#fff',
|
|
25
|
-
borderColor: 'transparent',
|
|
26
|
-
};
|
|
13
|
+
? { backgroundColor: 'transparent', color: tokens.color.primary, borderColor: tokens.color.primary }
|
|
14
|
+
: { backgroundColor: tokens.color.primary, color: tokens.color.white, borderColor: 'transparent' };
|
|
27
15
|
case 'success':
|
|
28
16
|
return isSubtle
|
|
29
|
-
? {
|
|
30
|
-
backgroundColor: tokens.color.successBg,
|
|
31
|
-
color: tokens.color.success,
|
|
32
|
-
borderColor: 'rgba(79, 168, 0, 0.2)',
|
|
33
|
-
}
|
|
17
|
+
? { backgroundColor: tokens.color.successBg, color: tokens.color.success, borderColor: 'rgba(34, 149, 93, 0.2)' }
|
|
34
18
|
: isOutline
|
|
35
|
-
? {
|
|
36
|
-
|
|
37
|
-
color: tokens.color.success,
|
|
38
|
-
borderColor: tokens.color.success,
|
|
39
|
-
}
|
|
40
|
-
: {
|
|
41
|
-
backgroundColor: tokens.color.success,
|
|
42
|
-
color: '#fff',
|
|
43
|
-
borderColor: 'transparent',
|
|
44
|
-
};
|
|
19
|
+
? { backgroundColor: 'transparent', color: tokens.color.success, borderColor: tokens.color.success }
|
|
20
|
+
: { backgroundColor: tokens.color.success, color: tokens.color.white, borderColor: 'transparent' };
|
|
45
21
|
case 'warning':
|
|
46
22
|
return isSubtle
|
|
47
|
-
? {
|
|
48
|
-
backgroundColor: tokens.color.warningBg,
|
|
49
|
-
color: tokens.color.warning,
|
|
50
|
-
borderColor: 'rgba(245, 102, 0, 0.2)',
|
|
51
|
-
}
|
|
23
|
+
? { backgroundColor: tokens.color.warningBg, color: tokens.color.warning, borderColor: 'rgba(245, 102, 0, 0.2)' }
|
|
52
24
|
: isOutline
|
|
53
|
-
? {
|
|
54
|
-
|
|
55
|
-
color: tokens.color.warning,
|
|
56
|
-
borderColor: tokens.color.warning,
|
|
57
|
-
}
|
|
58
|
-
: {
|
|
59
|
-
backgroundColor: tokens.color.warning,
|
|
60
|
-
color: '#fff',
|
|
61
|
-
borderColor: 'transparent',
|
|
62
|
-
};
|
|
25
|
+
? { backgroundColor: 'transparent', color: tokens.color.warning, borderColor: tokens.color.warning }
|
|
26
|
+
: { backgroundColor: tokens.color.warning, color: tokens.color.white, borderColor: 'transparent' };
|
|
63
27
|
case 'danger':
|
|
64
28
|
return isSubtle
|
|
65
|
-
? {
|
|
66
|
-
backgroundColor: tokens.color.dangerBg,
|
|
67
|
-
color: tokens.color.danger,
|
|
68
|
-
borderColor: 'rgba(209, 36, 33, 0.2)',
|
|
69
|
-
}
|
|
29
|
+
? { backgroundColor: tokens.color.dangerBg, color: tokens.color.danger, borderColor: 'rgba(218, 33, 40, 0.2)' }
|
|
70
30
|
: isOutline
|
|
71
|
-
? {
|
|
72
|
-
|
|
73
|
-
color: tokens.color.danger,
|
|
74
|
-
borderColor: tokens.color.danger,
|
|
75
|
-
}
|
|
76
|
-
: {
|
|
77
|
-
backgroundColor: tokens.color.danger,
|
|
78
|
-
color: '#fff',
|
|
79
|
-
borderColor: 'transparent',
|
|
80
|
-
};
|
|
31
|
+
? { backgroundColor: 'transparent', color: tokens.color.danger, borderColor: tokens.color.danger }
|
|
32
|
+
: { backgroundColor: tokens.color.danger, color: tokens.color.white, borderColor: 'transparent' };
|
|
81
33
|
case 'info':
|
|
82
34
|
return isSubtle
|
|
83
|
-
? {
|
|
84
|
-
backgroundColor: tokens.color.infoBg,
|
|
85
|
-
color: tokens.color.info,
|
|
86
|
-
borderColor: 'rgba(24, 144, 255, 0.2)',
|
|
87
|
-
}
|
|
35
|
+
? { backgroundColor: tokens.color.infoBg, color: tokens.color.info, borderColor: 'rgba(10, 109, 199, 0.2)' }
|
|
88
36
|
: isOutline
|
|
89
|
-
? {
|
|
90
|
-
|
|
91
|
-
color: tokens.color.info,
|
|
92
|
-
borderColor: tokens.color.info,
|
|
93
|
-
}
|
|
94
|
-
: {
|
|
95
|
-
backgroundColor: tokens.color.info,
|
|
96
|
-
color: '#fff',
|
|
97
|
-
borderColor: 'transparent',
|
|
98
|
-
};
|
|
37
|
+
? { backgroundColor: 'transparent', color: tokens.color.info, borderColor: tokens.color.info }
|
|
38
|
+
: { backgroundColor: tokens.color.info, color: tokens.color.white, borderColor: 'transparent' };
|
|
99
39
|
case 'white':
|
|
100
40
|
return isSubtle
|
|
101
|
-
? {
|
|
102
|
-
backgroundColor: 'rgba(255, 255, 255, 0.1)',
|
|
103
|
-
color: '#fff',
|
|
104
|
-
borderColor: 'rgba(255, 255, 255, 0.2)',
|
|
105
|
-
}
|
|
41
|
+
? { backgroundColor: tokens.color.overlayWhite40, color: tokens.color.white, borderColor: tokens.color.overlayWhite80 }
|
|
106
42
|
: isOutline
|
|
107
|
-
? {
|
|
108
|
-
|
|
109
|
-
color: '#fff',
|
|
110
|
-
borderColor: '#fff',
|
|
111
|
-
}
|
|
112
|
-
: {
|
|
113
|
-
backgroundColor: '#fff',
|
|
114
|
-
color: tokens.color.primary,
|
|
115
|
-
borderColor: 'transparent',
|
|
116
|
-
};
|
|
43
|
+
? { backgroundColor: 'transparent', color: tokens.color.white, borderColor: tokens.color.white }
|
|
44
|
+
: { backgroundColor: tokens.color.white, color: tokens.color.primary, borderColor: 'transparent' };
|
|
117
45
|
case 'slate':
|
|
118
46
|
default:
|
|
119
47
|
return isSubtle
|
|
120
|
-
? {
|
|
121
|
-
backgroundColor: tokens.color.slate100,
|
|
122
|
-
color: tokens.color.slate600,
|
|
123
|
-
borderColor: tokens.color.slate200,
|
|
124
|
-
}
|
|
48
|
+
? { backgroundColor: tokens.color.slate100, color: tokens.color.slate600, borderColor: tokens.color.slate200 }
|
|
125
49
|
: isOutline
|
|
126
|
-
? {
|
|
127
|
-
|
|
128
|
-
color: tokens.color.slate600,
|
|
129
|
-
borderColor: tokens.color.slate400,
|
|
130
|
-
}
|
|
131
|
-
: {
|
|
132
|
-
backgroundColor: tokens.color.slate700,
|
|
133
|
-
color: '#fff',
|
|
134
|
-
borderColor: 'transparent',
|
|
135
|
-
};
|
|
50
|
+
? { backgroundColor: 'transparent', color: tokens.color.slate600, borderColor: tokens.color.slate400 }
|
|
51
|
+
: { backgroundColor: tokens.color.slate700, color: tokens.color.white, borderColor: 'transparent' };
|
|
136
52
|
}
|
|
137
53
|
};
|
|
138
54
|
const getSizeStyles = () => {
|
|
139
55
|
switch (size) {
|
|
140
56
|
case 'sm':
|
|
141
|
-
return { padding:
|
|
57
|
+
return { padding: `2px ${tokens.spacing[2]}`, fontSize: '10px', gap: tokens.spacing[1] };
|
|
142
58
|
case 'lg':
|
|
143
|
-
return { padding:
|
|
144
|
-
default:
|
|
145
|
-
return { padding:
|
|
59
|
+
return { padding: `${tokens.spacing[1]} ${tokens.spacing[4]}`, fontSize: tokens.font.xs, gap: tokens.spacing[2] };
|
|
60
|
+
default: // md
|
|
61
|
+
return { padding: `${tokens.spacing[1]} ${tokens.spacing[3]}`, fontSize: '11px', gap: tokens.spacing[1] };
|
|
146
62
|
}
|
|
147
63
|
};
|
|
148
64
|
const baseStyle = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/Badge.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAWnC,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CACE,EACE,QAAQ,EACR,OAAO,GAAG,OAAO,EACjB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,IAAI,EACX,GAAG,GAAG,KAAK,EACX,IAAI,EACJ,KAAK,GAAG,MAAM,EACd,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,gBAAgB,GAAG,GAAwB,EAAE;QACjD,MAAM,QAAQ,GAAG,IAAI,KAAK,QAAQ,CAAC;QACnC,MAAM,SAAS,GAAG,IAAI,KAAK,SAAS,CAAC;QAErC,QAAQ,OAAO,EAAE,CAAC;YAChB,KAAK,SAAS;gBACZ,OAAO,QAAQ;oBACb,CAAC,CAAC
|
|
1
|
+
{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../src/components/Badge.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAWnC,MAAM,CAAC,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CACnC,CACE,EACE,QAAQ,EACR,OAAO,GAAG,OAAO,EACjB,IAAI,GAAG,QAAQ,EACf,IAAI,GAAG,IAAI,EACX,GAAG,GAAG,KAAK,EACX,IAAI,EACJ,KAAK,GAAG,MAAM,EACd,SAAS,GAAG,EAAE,EACd,KAAK,GAAG,EAAE,EACV,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,gBAAgB,GAAG,GAAwB,EAAE;QACjD,MAAM,QAAQ,GAAG,IAAI,KAAK,QAAQ,CAAC;QACnC,MAAM,SAAS,GAAG,IAAI,KAAK,SAAS,CAAC;QAErC,QAAQ,OAAO,EAAE,CAAC;YAChB,KAAK,SAAS;gBACZ,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,YAAY,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE;oBACpH,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE;wBACpG,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;YACvG,KAAK,SAAS;gBACZ,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE;oBACjH,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE;wBACpG,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;YACvG,KAAK,SAAS;gBACZ,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,wBAAwB,EAAE;oBACjH,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE;wBACpG,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;YACvG,KAAK,QAAQ;gBACX,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,EAAE,wBAAwB,EAAE;oBAC/G,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE;wBAClG,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;YACtG,KAAK,MAAM;gBACT,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,WAAW,EAAE,yBAAyB,EAAE;oBAC5G,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE;wBAC9F,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;YACpG,KAAK,OAAO;gBACV,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,cAAc,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,cAAc,EAAE;oBACvH,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE;wBAChG,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;YACvG,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,QAAQ;oBACb,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE;oBAC9G,CAAC,CAAC,SAAS;wBACX,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE;wBACtG,CAAC,CAAC,EAAE,eAAe,EAAE,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC;QAC1G,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,GAAG,EAAE;QACzB,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,IAAI;gBACP,OAAO,EAAE,OAAO,EAAE,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;YAC3F,KAAK,IAAI;gBACP,OAAO,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;YACpH,SAAS,KAAK;gBACZ,OAAO,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;QAC9G,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,SAAS,GAAwB;QACrC,OAAO,EAAE,aAAa;QACtB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,YAAY,EAAE,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;QACtE,UAAU,EAAE,MAAM,CAAC,IAAI,CAAC,cAAc;QACtC,aAAa,EAAE,WAAoB;QACnC,aAAa,EAAE,QAAQ;QACvB,MAAM,EAAE,WAAW;QACnB,UAAU,EAAE,QAAiB;QAC7B,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,MAAM,CAAC,IAAI,CAAC,MAAM;QAC9B,UAAU,EAAE,MAAM,CAAC,UAAU,CAAC,IAAI;QAClC,GAAG,aAAa,EAAE;QAClB,GAAG,gBAAgB,EAAE;QACrB,GAAG,KAAK;KACT,CAAC;IAEF,OAAO,CACL,gBAAM,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,SAAS,EAAE,KAAM,KAAK,aAC5E,GAAG,IAAI,CACN,eACE,KAAK,EAAE;oBACL,KAAK,EAAE,KAAK;oBACZ,MAAM,EAAE,KAAK;oBACb,YAAY,EAAE,KAAK;oBACnB,eAAe,EAAE,cAAc;oBAC/B,UAAU,EAAE,CAAC;iBACd,GACD,CACH,EACA,IAAI,IAAI,eAAM,KAAK,EAAE,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,EAAE,YAAG,IAAI,GAAQ,EACnG,QAAQ,IACJ,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}
|
|
@@ -2,7 +2,7 @@ import React from "react";
|
|
|
2
2
|
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
3
3
|
/** Render as a different element or component (e.g. "a", RouterLink) */
|
|
4
4
|
component?: React.ElementType;
|
|
5
|
-
variant?: "primary" | "secondary" | "danger" | "ghost" | "amber" | "success" | "outline";
|
|
5
|
+
variant?: "primary" | "secondary" | "danger" | "ghost" | "amber" | "success" | "warning" | "info" | "outline";
|
|
6
6
|
size?: "xs" | "sm" | "md" | "lg";
|
|
7
7
|
isActive?: boolean;
|
|
8
8
|
startIcon?: React.ReactNode;
|
|
@@ -1,75 +1,102 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { tokens } from "../tokens";
|
|
4
|
-
// Brand red = #BE1128 → rgba(190,17,40,...)
|
|
5
|
-
// Brand yellow = #FFC20E → rgba(255,194,14,...)
|
|
6
4
|
const VARIANT_STYLES = {
|
|
5
|
+
// Main/Red — brand primary action
|
|
7
6
|
primary: {
|
|
8
|
-
bg: tokens.color.primary,
|
|
9
|
-
color:
|
|
7
|
+
bg: tokens.color.primary, // red/6 #DA2128
|
|
8
|
+
color: tokens.color.white,
|
|
10
9
|
border: `1px solid ${tokens.color.primary}`,
|
|
11
10
|
shadow: tokens.shadow.sm,
|
|
12
|
-
hoverBg: tokens.color.primaryDark,
|
|
13
|
-
hoverColor:
|
|
11
|
+
hoverBg: tokens.color.primaryDark, // red/7 #C61F24
|
|
12
|
+
hoverColor: tokens.color.white,
|
|
14
13
|
hoverBorder: `1px solid ${tokens.color.primaryDark}`,
|
|
15
14
|
hoverShadow: tokens.shadow.md,
|
|
16
15
|
},
|
|
16
|
+
// Neutral outline — secondary action
|
|
17
17
|
secondary: {
|
|
18
18
|
bg: tokens.color.white,
|
|
19
|
-
color: tokens.color.slate700,
|
|
19
|
+
color: tokens.color.slate700, // Neutral/8
|
|
20
20
|
border: `1px solid ${tokens.color.slate300}`,
|
|
21
21
|
shadow: "none",
|
|
22
|
-
hoverBg: tokens.color.slate50,
|
|
23
|
-
hoverColor: tokens.color.
|
|
22
|
+
hoverBg: tokens.color.slate50, // Neutral/1
|
|
23
|
+
hoverColor: tokens.color.slate800,
|
|
24
24
|
hoverBorder: `1px solid ${tokens.color.slate400}`,
|
|
25
25
|
hoverShadow: tokens.shadow.sm,
|
|
26
26
|
},
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
// Main/Orange — accent action
|
|
28
|
+
amber: {
|
|
29
|
+
bg: tokens.color.accent, // orange/6 #FAA61A
|
|
30
|
+
color: tokens.color.brandBlack, // #333333
|
|
31
|
+
border: `1px solid ${tokens.color.accent}`,
|
|
31
32
|
shadow: tokens.shadow.sm,
|
|
32
|
-
hoverBg: tokens.color.
|
|
33
|
-
hoverColor: tokens.color.
|
|
34
|
-
hoverBorder: `1px solid ${tokens.color.
|
|
33
|
+
hoverBg: tokens.color.accentDark, // orange/7 #DC8B05
|
|
34
|
+
hoverColor: tokens.color.brandBlack,
|
|
35
|
+
hoverBorder: `1px solid ${tokens.color.accentDark}`,
|
|
35
36
|
hoverShadow: tokens.shadow.md,
|
|
36
37
|
},
|
|
38
|
+
// Polar Green — success
|
|
37
39
|
success: {
|
|
38
|
-
bg: tokens.color.
|
|
39
|
-
color:
|
|
40
|
-
border: `1px solid ${tokens.color.
|
|
40
|
+
bg: tokens.color.polarGreen[6], // #52C41A
|
|
41
|
+
color: tokens.color.white,
|
|
42
|
+
border: `1px solid ${tokens.color.polarGreen[6]}`,
|
|
41
43
|
shadow: tokens.shadow.sm,
|
|
42
|
-
hoverBg: tokens.color.
|
|
43
|
-
hoverColor: tokens.color.
|
|
44
|
-
hoverBorder: `1px solid ${tokens.color.
|
|
44
|
+
hoverBg: tokens.color.polarGreen[7], // #389E0D
|
|
45
|
+
hoverColor: tokens.color.white,
|
|
46
|
+
hoverBorder: `1px solid ${tokens.color.polarGreen[7]}`,
|
|
45
47
|
hoverShadow: tokens.shadow.md,
|
|
46
48
|
},
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
49
|
+
// Volcano — warning
|
|
50
|
+
warning: {
|
|
51
|
+
bg: tokens.color.volcano[6], // #F56600
|
|
52
|
+
color: tokens.color.white,
|
|
53
|
+
border: `1px solid ${tokens.color.volcano[6]}`,
|
|
51
54
|
shadow: tokens.shadow.sm,
|
|
52
|
-
hoverBg: tokens.color.
|
|
53
|
-
hoverColor:
|
|
54
|
-
hoverBorder: `1px solid ${tokens.color.
|
|
55
|
+
hoverBg: tokens.color.volcano[7], // #AB4700
|
|
56
|
+
hoverColor: tokens.color.white,
|
|
57
|
+
hoverBorder: `1px solid ${tokens.color.volcano[7]}`,
|
|
58
|
+
hoverShadow: tokens.shadow.md,
|
|
59
|
+
},
|
|
60
|
+
// Blue — info
|
|
61
|
+
info: {
|
|
62
|
+
bg: tokens.color.blue[6], // #0A6DC7
|
|
63
|
+
color: tokens.color.white,
|
|
64
|
+
border: `1px solid ${tokens.color.blue[6]}`,
|
|
65
|
+
shadow: tokens.shadow.sm,
|
|
66
|
+
hoverBg: tokens.color.blue[7], // #0963B5
|
|
67
|
+
hoverColor: tokens.color.white,
|
|
68
|
+
hoverBorder: `1px solid ${tokens.color.blue[7]}`,
|
|
69
|
+
hoverShadow: tokens.shadow.md,
|
|
70
|
+
},
|
|
71
|
+
// Red/6 — danger (same base as primary, distinct semantic intent)
|
|
72
|
+
danger: {
|
|
73
|
+
bg: tokens.color.red[6], // #DA2128
|
|
74
|
+
color: tokens.color.white,
|
|
75
|
+
border: `1px solid ${tokens.color.red[6]}`,
|
|
76
|
+
shadow: tokens.shadow.sm,
|
|
77
|
+
hoverBg: tokens.color.red[7], // #C61F24
|
|
78
|
+
hoverColor: tokens.color.white,
|
|
79
|
+
hoverBorder: `1px solid ${tokens.color.red[7]}`,
|
|
55
80
|
hoverShadow: tokens.shadow.md,
|
|
56
81
|
},
|
|
82
|
+
// Ghost — text/icon only
|
|
57
83
|
ghost: {
|
|
58
84
|
bg: "transparent",
|
|
59
85
|
color: tokens.color.textMuted,
|
|
60
86
|
border: "1px solid transparent",
|
|
61
87
|
shadow: "none",
|
|
62
|
-
hoverBg:
|
|
88
|
+
hoverBg: tokens.color.slate100,
|
|
63
89
|
hoverColor: tokens.color.text,
|
|
64
90
|
hoverBorder: "1px solid transparent",
|
|
65
91
|
hoverShadow: "none",
|
|
66
92
|
},
|
|
93
|
+
// Outline — bordered, transparent bg
|
|
67
94
|
outline: {
|
|
68
95
|
bg: "transparent",
|
|
69
96
|
color: tokens.color.primary,
|
|
70
97
|
border: `1px solid ${tokens.color.primary}`,
|
|
71
98
|
shadow: "none",
|
|
72
|
-
hoverBg:
|
|
99
|
+
hoverBg: tokens.color.primaryLight, // red/1 #FBE9EA
|
|
73
100
|
hoverColor: tokens.color.primary,
|
|
74
101
|
hoverBorder: `1px solid ${tokens.color.primary}`,
|
|
75
102
|
hoverShadow: "none",
|
|
@@ -77,26 +104,26 @@ const VARIANT_STYLES = {
|
|
|
77
104
|
};
|
|
78
105
|
const SIZE_STYLES = {
|
|
79
106
|
xs: {
|
|
80
|
-
padding: "
|
|
81
|
-
fontSize:
|
|
107
|
+
padding: "0 10px",
|
|
108
|
+
fontSize: tokens.font.xs, // 12px
|
|
82
109
|
height: "26px",
|
|
83
110
|
borderRadius: tokens.radius.md,
|
|
84
111
|
},
|
|
85
112
|
sm: {
|
|
86
|
-
padding: `
|
|
87
|
-
fontSize:
|
|
113
|
+
padding: `0 ${tokens.spacing[4]}`,
|
|
114
|
+
fontSize: tokens.font.xs, // 12px
|
|
88
115
|
height: "32px",
|
|
89
116
|
borderRadius: tokens.radius.md,
|
|
90
117
|
},
|
|
91
118
|
md: {
|
|
92
|
-
padding: `
|
|
93
|
-
fontSize: tokens.font.
|
|
94
|
-
height: "
|
|
119
|
+
padding: `0 ${tokens.spacing[6]}`,
|
|
120
|
+
fontSize: tokens.font.base, // 14px
|
|
121
|
+
height: "40px",
|
|
95
122
|
borderRadius: tokens.radius.lg,
|
|
96
123
|
},
|
|
97
124
|
lg: {
|
|
98
|
-
padding:
|
|
99
|
-
fontSize: tokens.font.md,
|
|
125
|
+
padding: `0 ${tokens.spacing[8]}`,
|
|
126
|
+
fontSize: tokens.font.md, // 16px
|
|
100
127
|
height: "48px",
|
|
101
128
|
borderRadius: tokens.radius.xl,
|
|
102
129
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { DesignTokens } from '../tokens';
|
|
3
3
|
export type ThemeMode = 'light' | 'dark';
|
|
4
4
|
export interface ThemeColor {
|
|
5
|
-
/** Primary brand color (hex, e.g. "#
|
|
5
|
+
/** Primary brand color (hex, e.g. "#DA2128") */
|
|
6
6
|
primary: string;
|
|
7
7
|
/** Darker shade for hover/active states */
|
|
8
8
|
primaryDark?: string;
|
|
@@ -54,9 +54,9 @@ function applyThemeColor(color) {
|
|
|
54
54
|
root.style.setProperty('--ds-color-border-focus', color.primary);
|
|
55
55
|
}
|
|
56
56
|
const DEFAULT_THEME_COLOR = {
|
|
57
|
-
primary: '#
|
|
58
|
-
primaryDark: '#
|
|
59
|
-
primaryLight: '#
|
|
57
|
+
primary: '#DA2128', // Main/Red = red/6
|
|
58
|
+
primaryDark: '#C61F24', // red/7
|
|
59
|
+
primaryLight: '#FBE9EA', // red/1
|
|
60
60
|
};
|
|
61
61
|
export const ConfigProvider = ({ children, defaultTheme = 'light', defaultLocale = 'vi-VN', defaultThemeColor, }) => {
|
|
62
62
|
const [theme, setTheme] = useState(defaultTheme);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfigProvider.js","sourceRoot":"","sources":["../../../src/components/ConfigProvider.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"ConfigProvider.js","sourceRoot":"","sources":["../../../src/components/ConfigProvider.tsx"],"names":[],"mappings":"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"}
|
|
@@ -202,7 +202,7 @@ const floatingLabelStyle = {
|
|
|
202
202
|
const inputContainerStyle = (isFocused, hasError) => ({
|
|
203
203
|
position: 'relative',
|
|
204
204
|
width: '100%',
|
|
205
|
-
height: '
|
|
205
|
+
height: '40px',
|
|
206
206
|
boxSizing: 'border-box',
|
|
207
207
|
backgroundColor: tokens.color.white,
|
|
208
208
|
border: `1px solid ${hasError ? tokens.color.danger : (isFocused ? tokens.color.borderFocus : tokens.color.slate200)}`,
|