@cloudflare/component-button 5.2.0 → 5.3.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/CHANGELOG.md +11 -0
- package/dist/Button.d.ts +3 -3
- package/es/Button.js +28 -24
- package/lib/Button.js +28 -25
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,16 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
+
## 5.3.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- ebecfbb551: Change inverted styles, add plainDestructive type
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- 97244e8fe0: Increase transition time
|
|
12
|
+
- d74e81de82: Fix default button hover effect, plainDestructive focus outline color
|
|
13
|
+
|
|
3
14
|
## 5.2.0
|
|
4
15
|
|
|
5
16
|
### Minor Changes
|
package/dist/Button.d.ts
CHANGED
|
@@ -37,7 +37,7 @@ export declare const buttonStyles: (props: PropsWithTheme) => {
|
|
|
37
37
|
readonly position: "relative";
|
|
38
38
|
readonly textAlign: "center";
|
|
39
39
|
readonly transitionProperty: "all";
|
|
40
|
-
readonly transitionDuration: "
|
|
40
|
+
readonly transitionDuration: "300ms";
|
|
41
41
|
readonly transitionTimingFunction: "ease";
|
|
42
42
|
readonly userSelect: "none";
|
|
43
43
|
readonly maxWidth: "initial";
|
|
@@ -93,7 +93,7 @@ declare type Props = {
|
|
|
93
93
|
space?: number;
|
|
94
94
|
direction?: 'column' | 'row';
|
|
95
95
|
group?: 'first' | 'inbetween' | 'last';
|
|
96
|
-
type?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'plain' | 'plainMono';
|
|
96
|
+
type?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'plain' | 'plainMono' | 'plainDestructive';
|
|
97
97
|
testId?: string;
|
|
98
98
|
loading?: boolean;
|
|
99
99
|
inverted?: boolean;
|
|
@@ -114,7 +114,7 @@ declare const _default: React.ComponentType<{
|
|
|
114
114
|
className?: string | undefined;
|
|
115
115
|
id?: string | undefined;
|
|
116
116
|
tabIndex?: number | undefined;
|
|
117
|
-
type?: "default" | "primary" | "success" | "warning" | "danger" | "plain" | "plainMono" | undefined;
|
|
117
|
+
type?: "default" | "primary" | "success" | "warning" | "danger" | "plain" | "plainMono" | "plainDestructive" | undefined;
|
|
118
118
|
direction?: "column" | "row" | undefined;
|
|
119
119
|
key?: React.Key | null | undefined;
|
|
120
120
|
onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined;
|
package/es/Button.js
CHANGED
|
@@ -14,7 +14,7 @@ import { Icon } from '@cloudflare/component-icon';
|
|
|
14
14
|
var borderRadius = '4px';
|
|
15
15
|
|
|
16
16
|
var standardColors = (theme, state) => {
|
|
17
|
-
var _theme$colors$button$, _theme$colors$button$2, _theme$colors$button$3, _theme$colors$button$4, _theme$colors$button$5, _theme$colors$button$6;
|
|
17
|
+
var _theme$colors$button$, _theme$colors$button$2, _theme$colors$button$3, _theme$colors$button$4, _theme$colors$button$5, _theme$colors$button$6, _theme$colors$button$7;
|
|
18
18
|
|
|
19
19
|
var color = theme.colors.gray[9];
|
|
20
20
|
return {
|
|
@@ -22,13 +22,14 @@ var standardColors = (theme, state) => {
|
|
|
22
22
|
success: color,
|
|
23
23
|
warning: color,
|
|
24
24
|
inverted: {
|
|
25
|
-
danger: (_theme$colors$button$ = theme.colors.button.
|
|
26
|
-
primary: (_theme$colors$button$2 = theme.colors.button.
|
|
25
|
+
danger: (_theme$colors$button$ = theme.colors.button.plainDestructive[state]) === null || _theme$colors$button$ === void 0 ? void 0 : _theme$colors$button$.text,
|
|
26
|
+
primary: (_theme$colors$button$2 = theme.colors.button.plain[state]) === null || _theme$colors$button$2 === void 0 ? void 0 : _theme$colors$button$2.text
|
|
27
27
|
},
|
|
28
28
|
primary: ((_theme$colors$button$3 = theme.colors.button.primary[state]) === null || _theme$colors$button$3 === void 0 ? void 0 : _theme$colors$button$3.text) || color,
|
|
29
29
|
danger: ((_theme$colors$button$4 = theme.colors.button.danger[state]) === null || _theme$colors$button$4 === void 0 ? void 0 : _theme$colors$button$4.text) || color,
|
|
30
30
|
plain: ((_theme$colors$button$5 = theme.colors.button.plain[state]) === null || _theme$colors$button$5 === void 0 ? void 0 : _theme$colors$button$5.text) || color,
|
|
31
|
-
plainMono: ((_theme$colors$button$6 = theme.colors.button.plainMono[state]) === null || _theme$colors$button$6 === void 0 ? void 0 : _theme$colors$button$6.text) || color
|
|
31
|
+
plainMono: ((_theme$colors$button$6 = theme.colors.button.plainMono[state]) === null || _theme$colors$button$6 === void 0 ? void 0 : _theme$colors$button$6.text) || color,
|
|
32
|
+
plainDestructive: ((_theme$colors$button$7 = theme.colors.button.plainDestructive[state]) === null || _theme$colors$button$7 === void 0 ? void 0 : _theme$colors$button$7.text) || color
|
|
32
33
|
};
|
|
33
34
|
};
|
|
34
35
|
|
|
@@ -45,11 +46,12 @@ var buttonColors = theme => {
|
|
|
45
46
|
warning: theme.colors.orange[standardIndex],
|
|
46
47
|
danger: theme.colors.button.danger.normal.background,
|
|
47
48
|
inverted: {
|
|
48
|
-
danger:
|
|
49
|
-
primary:
|
|
49
|
+
danger: theme.colors.button.plainDestructive.normal.background,
|
|
50
|
+
primary: theme.colors.button.plain.normal.background
|
|
50
51
|
},
|
|
51
52
|
plain: theme.colors.button.plain.normal.background,
|
|
52
|
-
plainMono: theme.colors.button.plainMono.normal.background
|
|
53
|
+
plainMono: theme.colors.button.plainMono.normal.background,
|
|
54
|
+
plainDestructive: theme.colors.button.plainDestructive.normal.background
|
|
53
55
|
},
|
|
54
56
|
color: standardColors(theme, 'normal')
|
|
55
57
|
},
|
|
@@ -62,11 +64,12 @@ var buttonColors = theme => {
|
|
|
62
64
|
warning: theme.colors.orange[hoverIndex],
|
|
63
65
|
danger: theme.colors.button.danger.hover.background,
|
|
64
66
|
inverted: {
|
|
65
|
-
danger: theme.colors.
|
|
66
|
-
primary: theme.colors.
|
|
67
|
+
danger: theme.colors.button.plainDestructive.hover.background,
|
|
68
|
+
primary: theme.colors.button.plain.hover.background
|
|
67
69
|
},
|
|
68
70
|
plain: theme.colors.button.plain.hover.background,
|
|
69
|
-
plainMono: theme.colors.button.plainMono.hover.background
|
|
71
|
+
plainMono: theme.colors.button.plainMono.hover.background,
|
|
72
|
+
plainDestructive: theme.colors.button.plainDestructive.hover.background
|
|
70
73
|
},
|
|
71
74
|
color: standardColors(theme, 'hover')
|
|
72
75
|
},
|
|
@@ -79,28 +82,30 @@ var buttonColors = theme => {
|
|
|
79
82
|
warning: theme.colors.orange[standardIndex],
|
|
80
83
|
danger: theme.colors.button.danger.active.background,
|
|
81
84
|
inverted: {
|
|
82
|
-
danger: theme.colors.
|
|
83
|
-
primary: theme.colors.
|
|
85
|
+
danger: theme.colors.button.plainDestructive.active.background,
|
|
86
|
+
primary: theme.colors.button.plain.active.background
|
|
84
87
|
},
|
|
85
88
|
plain: theme.colors.button.plain.active.background,
|
|
86
|
-
plainMono: theme.colors.button.plainMono.active.background
|
|
89
|
+
plainMono: theme.colors.button.plainMono.active.background,
|
|
90
|
+
plainDestructive: theme.colors.button.plainDestructive.active.background
|
|
87
91
|
},
|
|
88
92
|
color: standardColors(theme, 'active')
|
|
89
93
|
},
|
|
90
94
|
// Focus
|
|
91
95
|
focus: {
|
|
92
96
|
backgroundColor: {
|
|
93
|
-
default: theme.colors.gray[isDarkMode() ?
|
|
97
|
+
default: theme.colors.gray[isDarkMode() ? 2 : 7],
|
|
94
98
|
primary: theme.colors.button.primary.focus.background,
|
|
95
99
|
success: theme.colors.green[standardIndex],
|
|
96
100
|
warning: theme.colors.orange[standardIndex],
|
|
97
101
|
danger: theme.colors.button.danger.focus.background,
|
|
98
102
|
inverted: {
|
|
99
|
-
danger:
|
|
100
|
-
primary:
|
|
103
|
+
danger: theme.colors.button.plainDestructive.focus.background,
|
|
104
|
+
primary: theme.colors.button.plain.focus.background
|
|
101
105
|
},
|
|
102
106
|
plain: theme.colors.button.plain.focus.background,
|
|
103
|
-
plainMono: theme.colors.button.plainMono.focus.background
|
|
107
|
+
plainMono: theme.colors.button.plainMono.focus.background,
|
|
108
|
+
plainDestructive: theme.colors.button.plainDestructive.focus.background
|
|
104
109
|
},
|
|
105
110
|
color: standardColors(theme, 'focus')
|
|
106
111
|
}
|
|
@@ -128,7 +133,7 @@ var interactionStyleAccessor = (interactionState, props) => {
|
|
|
128
133
|
return isInteractive ? {
|
|
129
134
|
backgroundColor,
|
|
130
135
|
color,
|
|
131
|
-
boxShadow: props.inverted ? "inset 0px 0px 0px 1px ".concat(
|
|
136
|
+
boxShadow: props.inverted ? "inset 0px 0px 0px 1px ".concat(color) : undefined
|
|
132
137
|
} : undefined;
|
|
133
138
|
};
|
|
134
139
|
|
|
@@ -140,7 +145,6 @@ export var buttonStyles = props => {
|
|
|
140
145
|
loading = false,
|
|
141
146
|
disabled,
|
|
142
147
|
direction,
|
|
143
|
-
inverted = false,
|
|
144
148
|
group,
|
|
145
149
|
spaced,
|
|
146
150
|
space = 2,
|
|
@@ -166,7 +170,7 @@ export var buttonStyles = props => {
|
|
|
166
170
|
'&:focus-visible': {
|
|
167
171
|
outlineOffset: 3,
|
|
168
172
|
outlineStyle: 'auto',
|
|
169
|
-
outlineColor: type === 'danger' ? theme.colors.red[isDarkMode() ? 3 : 4] : theme.colors.focus
|
|
173
|
+
outlineColor: type === 'danger' || type === 'plainDestructive' ? theme.colors.red[isDarkMode() ? 3 : 4] : theme.colors.focus
|
|
170
174
|
},
|
|
171
175
|
'&[title]': {
|
|
172
176
|
pointerEvents: disabled ? 'auto' : 'none'
|
|
@@ -183,8 +187,8 @@ export var buttonStyles = props => {
|
|
|
183
187
|
fontWeight: 400,
|
|
184
188
|
lineHeight: 1.2,
|
|
185
189
|
border: 'none'
|
|
186
|
-
}, inverted ? {
|
|
187
|
-
boxShadow: "inset 0px 0px 0px 1px ".concat(
|
|
190
|
+
}, props.inverted ? {
|
|
191
|
+
boxShadow: "inset 0px 0px 0px 1px ".concat(color)
|
|
188
192
|
} : {}), {}, {
|
|
189
193
|
borderTopRightRadius: (group === 'first' || group === 'inbetween') && !spaced ? 0 : borderRadius,
|
|
190
194
|
borderTopLeftRadius: (group === 'last' || group === 'inbetween') && !spaced ? 0 : borderRadius,
|
|
@@ -221,7 +225,7 @@ export var buttonStyles = props => {
|
|
|
221
225
|
position: 'relative',
|
|
222
226
|
textAlign: 'center',
|
|
223
227
|
transitionProperty: 'all',
|
|
224
|
-
transitionDuration: '
|
|
228
|
+
transitionDuration: '300ms',
|
|
225
229
|
transitionTimingFunction: 'ease',
|
|
226
230
|
userSelect: 'none',
|
|
227
231
|
maxWidth: 'initial',
|
|
@@ -283,7 +287,7 @@ Button.propTypes = {
|
|
|
283
287
|
direction: PropTypes.oneOf(['column', 'row']),
|
|
284
288
|
className: PropTypes.string,
|
|
285
289
|
group: PropTypes.oneOf(['first', 'inbetween', 'last']),
|
|
286
|
-
type: PropTypes.oneOf(['default', 'primary', 'success', 'warning', 'danger', 'plain', 'plainMono']),
|
|
290
|
+
type: PropTypes.oneOf(['default', 'primary', 'success', 'warning', 'danger', 'plain', 'plainMono', 'plainDestructive']),
|
|
287
291
|
testId: PropTypes.string,
|
|
288
292
|
disabled: PropTypes.bool,
|
|
289
293
|
loading: PropTypes.bool,
|
package/lib/Button.js
CHANGED
|
@@ -28,7 +28,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
28
28
|
var borderRadius = '4px';
|
|
29
29
|
|
|
30
30
|
var standardColors = function standardColors(theme, state) {
|
|
31
|
-
var _theme$colors$button$, _theme$colors$button$2, _theme$colors$button$3, _theme$colors$button$4, _theme$colors$button$5, _theme$colors$button$6;
|
|
31
|
+
var _theme$colors$button$, _theme$colors$button$2, _theme$colors$button$3, _theme$colors$button$4, _theme$colors$button$5, _theme$colors$button$6, _theme$colors$button$7;
|
|
32
32
|
|
|
33
33
|
var color = theme.colors.gray[9];
|
|
34
34
|
return {
|
|
@@ -36,13 +36,14 @@ var standardColors = function standardColors(theme, state) {
|
|
|
36
36
|
success: color,
|
|
37
37
|
warning: color,
|
|
38
38
|
inverted: {
|
|
39
|
-
danger: (_theme$colors$button$ = theme.colors.button.
|
|
40
|
-
primary: (_theme$colors$button$2 = theme.colors.button.
|
|
39
|
+
danger: (_theme$colors$button$ = theme.colors.button.plainDestructive[state]) === null || _theme$colors$button$ === void 0 ? void 0 : _theme$colors$button$.text,
|
|
40
|
+
primary: (_theme$colors$button$2 = theme.colors.button.plain[state]) === null || _theme$colors$button$2 === void 0 ? void 0 : _theme$colors$button$2.text
|
|
41
41
|
},
|
|
42
42
|
primary: ((_theme$colors$button$3 = theme.colors.button.primary[state]) === null || _theme$colors$button$3 === void 0 ? void 0 : _theme$colors$button$3.text) || color,
|
|
43
43
|
danger: ((_theme$colors$button$4 = theme.colors.button.danger[state]) === null || _theme$colors$button$4 === void 0 ? void 0 : _theme$colors$button$4.text) || color,
|
|
44
44
|
plain: ((_theme$colors$button$5 = theme.colors.button.plain[state]) === null || _theme$colors$button$5 === void 0 ? void 0 : _theme$colors$button$5.text) || color,
|
|
45
|
-
plainMono: ((_theme$colors$button$6 = theme.colors.button.plainMono[state]) === null || _theme$colors$button$6 === void 0 ? void 0 : _theme$colors$button$6.text) || color
|
|
45
|
+
plainMono: ((_theme$colors$button$6 = theme.colors.button.plainMono[state]) === null || _theme$colors$button$6 === void 0 ? void 0 : _theme$colors$button$6.text) || color,
|
|
46
|
+
plainDestructive: ((_theme$colors$button$7 = theme.colors.button.plainDestructive[state]) === null || _theme$colors$button$7 === void 0 ? void 0 : _theme$colors$button$7.text) || color
|
|
46
47
|
};
|
|
47
48
|
};
|
|
48
49
|
|
|
@@ -59,11 +60,12 @@ var buttonColors = function buttonColors(theme) {
|
|
|
59
60
|
warning: theme.colors.orange[standardIndex],
|
|
60
61
|
danger: theme.colors.button.danger.normal.background,
|
|
61
62
|
inverted: {
|
|
62
|
-
danger:
|
|
63
|
-
primary:
|
|
63
|
+
danger: theme.colors.button.plainDestructive.normal.background,
|
|
64
|
+
primary: theme.colors.button.plain.normal.background
|
|
64
65
|
},
|
|
65
66
|
plain: theme.colors.button.plain.normal.background,
|
|
66
|
-
plainMono: theme.colors.button.plainMono.normal.background
|
|
67
|
+
plainMono: theme.colors.button.plainMono.normal.background,
|
|
68
|
+
plainDestructive: theme.colors.button.plainDestructive.normal.background
|
|
67
69
|
},
|
|
68
70
|
color: standardColors(theme, 'normal')
|
|
69
71
|
},
|
|
@@ -76,11 +78,12 @@ var buttonColors = function buttonColors(theme) {
|
|
|
76
78
|
warning: theme.colors.orange[hoverIndex],
|
|
77
79
|
danger: theme.colors.button.danger.hover.background,
|
|
78
80
|
inverted: {
|
|
79
|
-
danger: theme.colors.
|
|
80
|
-
primary: theme.colors.
|
|
81
|
+
danger: theme.colors.button.plainDestructive.hover.background,
|
|
82
|
+
primary: theme.colors.button.plain.hover.background
|
|
81
83
|
},
|
|
82
84
|
plain: theme.colors.button.plain.hover.background,
|
|
83
|
-
plainMono: theme.colors.button.plainMono.hover.background
|
|
85
|
+
plainMono: theme.colors.button.plainMono.hover.background,
|
|
86
|
+
plainDestructive: theme.colors.button.plainDestructive.hover.background
|
|
84
87
|
},
|
|
85
88
|
color: standardColors(theme, 'hover')
|
|
86
89
|
},
|
|
@@ -93,28 +96,30 @@ var buttonColors = function buttonColors(theme) {
|
|
|
93
96
|
warning: theme.colors.orange[standardIndex],
|
|
94
97
|
danger: theme.colors.button.danger.active.background,
|
|
95
98
|
inverted: {
|
|
96
|
-
danger: theme.colors.
|
|
97
|
-
primary: theme.colors.
|
|
99
|
+
danger: theme.colors.button.plainDestructive.active.background,
|
|
100
|
+
primary: theme.colors.button.plain.active.background
|
|
98
101
|
},
|
|
99
102
|
plain: theme.colors.button.plain.active.background,
|
|
100
|
-
plainMono: theme.colors.button.plainMono.active.background
|
|
103
|
+
plainMono: theme.colors.button.plainMono.active.background,
|
|
104
|
+
plainDestructive: theme.colors.button.plainDestructive.active.background
|
|
101
105
|
},
|
|
102
106
|
color: standardColors(theme, 'active')
|
|
103
107
|
},
|
|
104
108
|
// Focus
|
|
105
109
|
focus: {
|
|
106
110
|
backgroundColor: {
|
|
107
|
-
default: theme.colors.gray[(0, _styleConst.isDarkMode)() ?
|
|
111
|
+
default: theme.colors.gray[(0, _styleConst.isDarkMode)() ? 2 : 7],
|
|
108
112
|
primary: theme.colors.button.primary.focus.background,
|
|
109
113
|
success: theme.colors.green[standardIndex],
|
|
110
114
|
warning: theme.colors.orange[standardIndex],
|
|
111
115
|
danger: theme.colors.button.danger.focus.background,
|
|
112
116
|
inverted: {
|
|
113
|
-
danger:
|
|
114
|
-
primary:
|
|
117
|
+
danger: theme.colors.button.plainDestructive.focus.background,
|
|
118
|
+
primary: theme.colors.button.plain.focus.background
|
|
115
119
|
},
|
|
116
120
|
plain: theme.colors.button.plain.focus.background,
|
|
117
|
-
plainMono: theme.colors.button.plainMono.focus.background
|
|
121
|
+
plainMono: theme.colors.button.plainMono.focus.background,
|
|
122
|
+
plainDestructive: theme.colors.button.plainDestructive.focus.background
|
|
118
123
|
},
|
|
119
124
|
color: standardColors(theme, 'focus')
|
|
120
125
|
}
|
|
@@ -140,7 +145,7 @@ var interactionStyleAccessor = function interactionStyleAccessor(interactionStat
|
|
|
140
145
|
return isInteractive ? {
|
|
141
146
|
backgroundColor: backgroundColor,
|
|
142
147
|
color: color,
|
|
143
|
-
boxShadow: props.inverted ? "inset 0px 0px 0px 1px ".concat(
|
|
148
|
+
boxShadow: props.inverted ? "inset 0px 0px 0px 1px ".concat(color) : undefined
|
|
144
149
|
} : undefined;
|
|
145
150
|
};
|
|
146
151
|
|
|
@@ -152,8 +157,6 @@ var buttonStyles = function buttonStyles(props) {
|
|
|
152
157
|
loading = _props$loading === void 0 ? false : _props$loading,
|
|
153
158
|
disabled = props.disabled,
|
|
154
159
|
direction = props.direction,
|
|
155
|
-
_props$inverted = props.inverted,
|
|
156
|
-
inverted = _props$inverted === void 0 ? false : _props$inverted,
|
|
157
160
|
group = props.group,
|
|
158
161
|
spaced = props.spaced,
|
|
159
162
|
_props$space = props.space,
|
|
@@ -180,7 +183,7 @@ var buttonStyles = function buttonStyles(props) {
|
|
|
180
183
|
'&:focus-visible': {
|
|
181
184
|
outlineOffset: 3,
|
|
182
185
|
outlineStyle: 'auto',
|
|
183
|
-
outlineColor: type === 'danger' ? theme.colors.red[(0, _styleConst.isDarkMode)() ? 3 : 4] : theme.colors.focus
|
|
186
|
+
outlineColor: type === 'danger' || type === 'plainDestructive' ? theme.colors.red[(0, _styleConst.isDarkMode)() ? 3 : 4] : theme.colors.focus
|
|
184
187
|
},
|
|
185
188
|
'&[title]': {
|
|
186
189
|
pointerEvents: disabled ? 'auto' : 'none'
|
|
@@ -197,8 +200,8 @@ var buttonStyles = function buttonStyles(props) {
|
|
|
197
200
|
fontWeight: 400,
|
|
198
201
|
lineHeight: 1.2,
|
|
199
202
|
border: 'none'
|
|
200
|
-
}, inverted ? {
|
|
201
|
-
boxShadow: "inset 0px 0px 0px 1px ".concat(
|
|
203
|
+
}, props.inverted ? {
|
|
204
|
+
boxShadow: "inset 0px 0px 0px 1px ".concat(color)
|
|
202
205
|
} : {}), {}, {
|
|
203
206
|
borderTopRightRadius: (group === 'first' || group === 'inbetween') && !spaced ? 0 : borderRadius,
|
|
204
207
|
borderTopLeftRadius: (group === 'last' || group === 'inbetween') && !spaced ? 0 : borderRadius,
|
|
@@ -235,7 +238,7 @@ var buttonStyles = function buttonStyles(props) {
|
|
|
235
238
|
position: 'relative',
|
|
236
239
|
textAlign: 'center',
|
|
237
240
|
transitionProperty: 'all',
|
|
238
|
-
transitionDuration: '
|
|
241
|
+
transitionDuration: '300ms',
|
|
239
242
|
transitionTimingFunction: 'ease',
|
|
240
243
|
userSelect: 'none',
|
|
241
244
|
maxWidth: 'initial',
|
|
@@ -304,7 +307,7 @@ Button.propTypes = {
|
|
|
304
307
|
direction: _propTypes.default.oneOf(['column', 'row']),
|
|
305
308
|
className: _propTypes.default.string,
|
|
306
309
|
group: _propTypes.default.oneOf(['first', 'inbetween', 'last']),
|
|
307
|
-
type: _propTypes.default.oneOf(['default', 'primary', 'success', 'warning', 'danger', 'plain', 'plainMono']),
|
|
310
|
+
type: _propTypes.default.oneOf(['default', 'primary', 'success', 'warning', 'danger', 'plain', 'plainMono', 'plainDestructive']),
|
|
308
311
|
testId: _propTypes.default.string,
|
|
309
312
|
disabled: _propTypes.default.bool,
|
|
310
313
|
loading: _propTypes.default.bool,
|
package/package.json
CHANGED