Skip to content

Commit 3c28505

Browse files
coding-iceli-jia-nanMadCcc
committed
feat(Button): support variant and color (ant-design#50051)
* feat(button): variant & color types * feat: type -> color/variant * feat: type -> color/variant * feat: add variant filled * test: snap * refactor(button): rename type -> variant * docs: add demo * feat: add danger ghost style * refactor: remove deprecated * refactor: eslint * docs: change color&variant * test: updated snap * docs: color-variant * docs: add debug color&variant * feat: global token * refactor: remove comment * docs: add color&variant docs * docs: remove default * docs: add space * docs: code * test: update snap * test: fix snap * test: btn querySelect * feat: change filled hoverStyle * test: fix * feat: support grey wave * refactor: enhance * docs: color/variant -> v 5.21 * test: snap * feat: add token * test: to do * test: fix test * ci: rebuild * style: remove * style: space * docs: add note & FQA * feat: add componentsToken * refactor: remove isNotGrey * test: add case * docs: tile button * test: snap * docs: site & snap * Update components/button/index.en-US.md Co-authored-by: lijianan <[email protected]> Signed-off-by: ice <[email protected]> * fix: token color & undef * docs: site * docs: responsive * docs: enhance FAQ * docs: gap middle * test: snap * Update components/theme/interface/maps/colors.ts Co-authored-by: MadCcc <[email protected]> Signed-off-by: ice <[email protected]> * Update components/theme/interface/maps/colors.ts Co-authored-by: MadCcc <[email protected]> Signed-off-by: ice <[email protected]> * Update components/theme/interface/maps/colors.ts Co-authored-by: MadCcc <[email protected]> Signed-off-by: ice <[email protected]> * Update components/button/style/token.ts Co-authored-by: MadCcc <[email protected]> Signed-off-by: ice <[email protected]> * Update components/button/style/token.ts Co-authored-by: MadCcc <[email protected]> Signed-off-by: ice <[email protected]> * refactor: rename * docs: prettier * chore: eslint * refactor: cls * test: add solidTextColor case * refactor: genVariantButtonStyle * refactor: genVariantButtonStyle * refactor: genVariantButtonStyle * fix: rename * docs: text * fix: remove border * feat: add token colorErrorBgFilledHover * chore: add size-limit * refactor: rename --------- Signed-off-by: ice <[email protected]> Co-authored-by: lijianan <[email protected]> Co-authored-by: MadCcc <[email protected]>
1 parent 027f9cb commit 3c28505

File tree

134 files changed

+376044
-375307
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

134 files changed

+376044
-375307
lines changed

‎.dumirc.ts

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,9 +57,12 @@ export default defineConfig({
5757
analytics: {
5858
ga_v2: 'UA-72788897-1',
5959
},
60-
analyze: process.env.NODE_ENV === 'production' ? false : {
61-
analyzerPort: 'auto',
62-
},
60+
analyze:
61+
process.env.NODE_ENV === 'production'
62+
? false
63+
: {
64+
analyzerPort: 'auto',
65+
},
6366
links: [
6467
{
6568
rel: 'prefetch',

‎components/_util/__tests__/wave.test.tsx

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -116,13 +116,10 @@ describe('Wave component', () => {
116116
unmount();
117117
});
118118

119-
it('wave color is grey', () => {
119+
it('wave color is nonexistent', () => {
120120
const { container, unmount } = render(
121121
<Wave>
122-
<button
123-
type="button"
124-
style={{ borderColor: 'rgb(0, 0, 0)', backgroundColor: 'transparent' }}
125-
>
122+
<button type="button" style={{ border: '#fff', background: '#fff' }}>
126123
button
127124
</button>
128125
</Wave>,
@@ -132,8 +129,7 @@ describe('Wave component', () => {
132129
waitRaf();
133130

134131
const style = getWaveStyle();
135-
136-
expect(style['--wave-color']).toBeFalsy();
132+
expect(style['--wave-color']).toEqual(undefined);
137133

138134
unmount();
139135
});

‎components/_util/type.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,13 @@ export type CustomComponent<P = AnyObject> = React.ComponentType<P> | string;
1818
* ```
1919
* @since 5.13.0
2020
*/
21-
export type GetProps<T extends React.ComponentType<any> | object> =
22-
T extends React.ComponentType<infer P> ? P : T extends object ? T : never;
21+
export type GetProps<T extends React.ComponentType<any> | object> = T extends React.ComponentType<
22+
infer P
23+
>
24+
? P
25+
: T extends object
26+
? T
27+
: never;
2328

2429
/**
2530
* Get component props by component name

‎components/_util/wave/util.ts

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,10 @@
1-
export function isNotGrey(color: string) {
2-
// eslint-disable-next-line no-useless-escape
3-
const match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\d.]*)?\)/);
4-
// biome-ignore lint/complexity/useOptionalChain: this is way is more simple
5-
if (match && match[1] && match[2] && match[3]) {
6-
return !(match[1] === match[2] && match[2] === match[3]);
7-
}
8-
return true;
9-
}
10-
111
export function isValidWaveColor(color: string) {
122
return (
133
color &&
144
color !== '#fff' &&
155
color !== '#ffffff' &&
166
color !== 'rgb(255, 255, 255)' &&
177
color !== 'rgba(255, 255, 255, 1)' &&
18-
isNotGrey(color) &&
198
!/rgba\((?:\d*, ){3}0\)/.test(color) && // any transparent rgba color
209
color !== 'transparent'
2110
);

‎components/affix/__tests__/__snapshots__/demo-extend.test.ts.snap

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ Array [
77
class=""
88
>
99
<button
10-
class="ant-btn ant-btn-primary"
10+
class="ant-btn ant-btn-primary ant-btn-solid"
1111
type="button"
1212
>
1313
<span>
@@ -22,7 +22,7 @@ Array [
2222
class=""
2323
>
2424
<button
25-
class="ant-btn ant-btn-primary"
25+
class="ant-btn ant-btn-primary ant-btn-solid"
2626
type="button"
2727
>
2828
<span>
@@ -51,7 +51,7 @@ exports[`renders components/affix/demo/debug.tsx extend context correctly 1`] =
5151
style="background: red;"
5252
>
5353
<button
54-
class="ant-btn ant-btn-primary"
54+
class="ant-btn ant-btn-primary ant-btn-solid"
5555
type="button"
5656
>
5757
<span>
@@ -75,7 +75,7 @@ exports[`renders components/affix/demo/on-change.tsx extend context correctly 1`
7575
class=""
7676
>
7777
<button
78-
class="ant-btn ant-btn-default"
78+
class="ant-btn ant-btn-default ant-btn-outlined"
7979
type="button"
8080
>
8181
<span>
@@ -100,7 +100,7 @@ exports[`renders components/affix/demo/target.tsx extend context correctly 1`] =
100100
class=""
101101
>
102102
<button
103-
class="ant-btn ant-btn-primary"
103+
class="ant-btn ant-btn-primary ant-btn-solid"
104104
type="button"
105105
>
106106
<span>

‎components/affix/__tests__/__snapshots__/demo.test.tsx.snap

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ Array [
77
class=""
88
>
99
<button
10-
class="ant-btn ant-btn-primary"
10+
class="ant-btn ant-btn-primary ant-btn-solid"
1111
type="button"
1212
>
1313
<span>
@@ -22,7 +22,7 @@ Array [
2222
class=""
2323
>
2424
<button
25-
class="ant-btn ant-btn-primary"
25+
class="ant-btn ant-btn-primary ant-btn-solid"
2626
type="button"
2727
>
2828
<span>
@@ -49,7 +49,7 @@ exports[`renders components/affix/demo/debug.tsx correctly 1`] = `
4949
style="background:red"
5050
>
5151
<button
52-
class="ant-btn ant-btn-primary"
52+
class="ant-btn ant-btn-primary ant-btn-solid"
5353
type="button"
5454
>
5555
<span>
@@ -71,7 +71,7 @@ exports[`renders components/affix/demo/on-change.tsx correctly 1`] = `
7171
class=""
7272
>
7373
<button
74-
class="ant-btn ant-btn-default"
74+
class="ant-btn ant-btn-default ant-btn-outlined"
7575
type="button"
7676
>
7777
<span>
@@ -94,7 +94,7 @@ exports[`renders components/affix/demo/target.tsx correctly 1`] = `
9494
class=""
9595
>
9696
<button
97-
class="ant-btn ant-btn-primary"
97+
class="ant-btn ant-btn-primary ant-btn-solid"
9898
type="button"
9999
>
100100
<span>

‎components/alert/__tests__/__snapshots__/demo-extend.test.ts.snap

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ Array [
3939
class="ant-alert-action"
4040
>
4141
<button
42-
class="ant-btn ant-btn-text ant-btn-sm"
42+
class="ant-btn ant-btn-default ant-btn-text ant-btn-sm"
4343
type="button"
4444
>
4545
<span>
@@ -118,7 +118,7 @@ Array [
118118
class="ant-alert-action"
119119
>
120120
<button
121-
class="ant-btn ant-btn-default ant-btn-sm ant-btn-dangerous"
121+
class="ant-btn ant-btn-dangerous ant-btn-outlined ant-btn-sm"
122122
type="button"
123123
>
124124
<span>
@@ -152,7 +152,7 @@ Array [
152152
class="ant-space-item"
153153
>
154154
<button
155-
class="ant-btn ant-btn-text ant-btn-sm"
155+
class="ant-btn ant-btn-default ant-btn-text ant-btn-sm"
156156
type="button"
157157
>
158158
<span>
@@ -219,7 +219,7 @@ Array [
219219
class="ant-space-item"
220220
>
221221
<button
222-
class="ant-btn ant-btn-primary ant-btn-sm"
222+
class="ant-btn ant-btn-primary ant-btn-solid ant-btn-sm"
223223
type="button"
224224
>
225225
<span>
@@ -231,7 +231,7 @@ Array [
231231
class="ant-space-item"
232232
>
233233
<button
234-
class="ant-btn ant-btn-default ant-btn-sm ant-btn-background-ghost ant-btn-dangerous"
234+
class="ant-btn ant-btn-dangerous ant-btn-outlined ant-btn-sm ant-btn-background-ghost"
235235
type="button"
236236
>
237237
<span>
@@ -1008,7 +1008,7 @@ exports[`renders components/alert/demo/description.tsx extend context correctly
10081008

10091009
exports[`renders components/alert/demo/error-boundary.tsx extend context correctly 1`] = `
10101010
<button
1011-
class="ant-btn ant-btn-default ant-btn-dangerous"
1011+
class="ant-btn ant-btn-dangerous ant-btn-outlined"
10121012
type="button"
10131013
>
10141014
<span>

‎components/alert/__tests__/__snapshots__/demo.test.ts.snap

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ Array [
3939
class="ant-alert-action"
4040
>
4141
<button
42-
class="ant-btn ant-btn-text ant-btn-sm"
42+
class="ant-btn ant-btn-default ant-btn-text ant-btn-sm"
4343
type="button"
4444
>
4545
<span>
@@ -118,7 +118,7 @@ Array [
118118
class="ant-alert-action"
119119
>
120120
<button
121-
class="ant-btn ant-btn-default ant-btn-sm ant-btn-dangerous"
121+
class="ant-btn ant-btn-dangerous ant-btn-outlined ant-btn-sm"
122122
type="button"
123123
>
124124
<span>
@@ -152,7 +152,7 @@ Array [
152152
class="ant-space-item"
153153
>
154154
<button
155-
class="ant-btn ant-btn-text ant-btn-sm"
155+
class="ant-btn ant-btn-default ant-btn-text ant-btn-sm"
156156
type="button"
157157
>
158158
<span>
@@ -219,7 +219,7 @@ Array [
219219
class="ant-space-item"
220220
>
221221
<button
222-
class="ant-btn ant-btn-primary ant-btn-sm"
222+
class="ant-btn ant-btn-primary ant-btn-solid ant-btn-sm"
223223
type="button"
224224
>
225225
<span>
@@ -231,7 +231,7 @@ Array [
231231
class="ant-space-item"
232232
>
233233
<button
234-
class="ant-btn ant-btn-default ant-btn-sm ant-btn-background-ghost ant-btn-dangerous"
234+
class="ant-btn ant-btn-dangerous ant-btn-outlined ant-btn-sm ant-btn-background-ghost"
235235
type="button"
236236
>
237237
<span>
@@ -992,7 +992,7 @@ Array [
992992

993993
exports[`renders components/alert/demo/error-boundary.tsx correctly 1`] = `
994994
<button
995-
class="ant-btn ant-btn-default ant-btn-dangerous"
995+
class="ant-btn ant-btn-dangerous ant-btn-outlined"
996996
type="button"
997997
>
998998
<span>

‎components/alert/__tests__/__snapshots__/index.test.tsx.snap

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ exports[`Alert custom action 1`] = `
3838
class="ant-alert-action"
3939
>
4040
<button
41-
class="ant-btn ant-btn-text ant-btn-sm"
41+
class="ant-btn ant-btn-default ant-btn-text ant-btn-sm"
4242
type="button"
4343
>
4444
<span>

‎components/app/__tests__/__snapshots__/demo-extend.test.ts.snap

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ exports[`renders components/app/demo/basic.tsx extend context correctly 1`] = `
1212
class="ant-space-item"
1313
>
1414
<button
15-
class="ant-btn ant-btn-primary"
15+
class="ant-btn ant-btn-primary ant-btn-solid"
1616
type="button"
1717
>
1818
<span>
@@ -24,7 +24,7 @@ exports[`renders components/app/demo/basic.tsx extend context correctly 1`] = `
2424
class="ant-space-item"
2525
>
2626
<button
27-
class="ant-btn ant-btn-primary"
27+
class="ant-btn ant-btn-primary ant-btn-solid"
2828
type="button"
2929
>
3030
<span>
@@ -36,7 +36,7 @@ exports[`renders components/app/demo/basic.tsx extend context correctly 1`] = `
3636
class="ant-space-item"
3737
>
3838
<button
39-
class="ant-btn ant-btn-primary"
39+
class="ant-btn ant-btn-primary ant-btn-solid"
4040
type="button"
4141
>
4242
<span>
@@ -62,7 +62,7 @@ exports[`renders components/app/demo/config.tsx extend context correctly 1`] = `
6262
class="ant-space-item"
6363
>
6464
<button
65-
class="ant-btn ant-btn-primary"
65+
class="ant-btn ant-btn-primary ant-btn-solid"
6666
type="button"
6767
>
6868
<span>
@@ -74,7 +74,7 @@ exports[`renders components/app/demo/config.tsx extend context correctly 1`] = `
7474
class="ant-space-item"
7575
>
7676
<button
77-
class="ant-btn ant-btn-primary"
77+
class="ant-btn ant-btn-primary ant-btn-solid"
7878
type="button"
7979
>
8080
<span>

‎components/app/__tests__/__snapshots__/demo.test.ts.snap

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ exports[`renders components/app/demo/basic.tsx correctly 1`] = `
1212
class="ant-space-item"
1313
>
1414
<button
15-
class="ant-btn ant-btn-primary"
15+
class="ant-btn ant-btn-primary ant-btn-solid"
1616
type="button"
1717
>
1818
<span>
@@ -24,7 +24,7 @@ exports[`renders components/app/demo/basic.tsx correctly 1`] = `
2424
class="ant-space-item"
2525
>
2626
<button
27-
class="ant-btn ant-btn-primary"
27+
class="ant-btn ant-btn-primary ant-btn-solid"
2828
type="button"
2929
>
3030
<span>
@@ -36,7 +36,7 @@ exports[`renders components/app/demo/basic.tsx correctly 1`] = `
3636
class="ant-space-item"
3737
>
3838
<button
39-
class="ant-btn ant-btn-primary"
39+
class="ant-btn ant-btn-primary ant-btn-solid"
4040
type="button"
4141
>
4242
<span>
@@ -60,7 +60,7 @@ exports[`renders components/app/demo/config.tsx correctly 1`] = `
6060
class="ant-space-item"
6161
>
6262
<button
63-
class="ant-btn ant-btn-primary"
63+
class="ant-btn ant-btn-primary ant-btn-solid"
6464
type="button"
6565
>
6666
<span>
@@ -72,7 +72,7 @@ exports[`renders components/app/demo/config.tsx correctly 1`] = `
7272
class="ant-space-item"
7373
>
7474
<button
75-
class="ant-btn ant-btn-primary"
75+
class="ant-btn ant-btn-primary ant-btn-solid"
7676
type="button"
7777
>
7878
<span>

0 commit comments

Comments
 (0)