@kdcloudjs/kdesign 1.2.3 → 1.3.2
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 +44 -0
- package/dist/kdesign-complete.less +14 -64
- package/dist/kdesign.css +25 -90
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +193 -120
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +3 -3
- package/dist/kdesign.min.js +8 -8
- package/dist/kdesign.min.js.map +1 -1
- package/es/badge/style/index.css +3 -4
- package/es/badge/style/index.less +3 -4
- package/es/badge/style/token.less +1 -0
- package/es/carousel/style/index.css +11 -84
- package/es/carousel/style/index.less +3 -60
- package/es/cascader/cascader.d.ts +7 -3
- package/es/cascader/cascader.js +8 -6
- package/es/checkbox/checkbox.js +4 -2
- package/es/checkbox/style/index.css +7 -0
- package/es/checkbox/style/index.less +7 -0
- package/es/form/Field.d.ts +2 -1
- package/es/form/Field.js +76 -20
- package/es/grid/row.d.ts +1 -1
- package/es/icon/interface.js +1 -1
- package/es/select/index.d.ts +2 -2
- package/es/select/interface.d.ts +7 -7
- package/es/select/select.js +12 -1
- package/es/style/icon/kdicon.css +3 -1
- package/es/style/icon/kdicon.woff +0 -0
- package/lib/badge/style/index.css +3 -4
- package/lib/badge/style/index.less +3 -4
- package/lib/badge/style/token.less +1 -0
- package/lib/carousel/style/index.css +11 -84
- package/lib/carousel/style/index.less +3 -60
- package/lib/cascader/cascader.d.ts +7 -3
- package/lib/cascader/cascader.js +10 -8
- package/lib/checkbox/checkbox.js +4 -2
- package/lib/checkbox/style/index.css +7 -0
- package/lib/checkbox/style/index.less +7 -0
- package/lib/form/Field.d.ts +2 -1
- package/lib/form/Field.js +79 -22
- package/lib/grid/row.d.ts +1 -1
- package/lib/icon/interface.js +1 -1
- package/lib/select/index.d.ts +2 -2
- package/lib/select/interface.d.ts +7 -7
- package/lib/select/select.js +12 -1
- package/lib/style/icon/kdicon.css +3 -1
- package/lib/style/icon/kdicon.woff +0 -0
- package/package.json +1 -1
package/es/badge/style/index.css
CHANGED
|
@@ -172,7 +172,6 @@
|
|
|
172
172
|
background-color: var(--kd-c-badge-color-success, var(--kd-g-color-success, #1ba854));
|
|
173
173
|
}
|
|
174
174
|
.kd-badge-status-processing {
|
|
175
|
-
position: relative;
|
|
176
175
|
background-color: var(--kd-c-badge-color-ongoing, var(--kd-g-color-ongoing, #276ff5));
|
|
177
176
|
}
|
|
178
177
|
.kd-badge-status-processing::after {
|
|
@@ -188,13 +187,13 @@
|
|
|
188
187
|
content: '';
|
|
189
188
|
}
|
|
190
189
|
.kd-badge-status-error {
|
|
191
|
-
background-color: var(--kd-c-badge-color-
|
|
190
|
+
background-color: var(--kd-c-badge-color-error, var(--kd-g-color-error, #fb2323));
|
|
192
191
|
}
|
|
193
192
|
.kd-badge-status-default {
|
|
194
|
-
background-color: var(--kd-c-badge-color-
|
|
193
|
+
background-color: var(--kd-c-badge-color-default, #d9d9d9);
|
|
195
194
|
}
|
|
196
195
|
.kd-badge-status-warning {
|
|
197
|
-
background-color: var(--kd-c-badge-color-
|
|
196
|
+
background-color: var(--kd-c-badge-color-warning, var(--kd-g-color-warning, #ff991c));
|
|
198
197
|
}
|
|
199
198
|
.kd-badge-not-a-wrapper:not(.kd-badge-status) {
|
|
200
199
|
vertical-align: middle;
|
|
@@ -74,7 +74,6 @@
|
|
|
74
74
|
background-color: @badge-color-success;
|
|
75
75
|
}
|
|
76
76
|
&-processing {
|
|
77
|
-
position: relative;
|
|
78
77
|
background-color: @badge-color-ongoing;
|
|
79
78
|
&::after {
|
|
80
79
|
position: absolute;
|
|
@@ -89,13 +88,13 @@
|
|
|
89
88
|
}
|
|
90
89
|
}
|
|
91
90
|
&-error {
|
|
92
|
-
background-color: @badge-color-
|
|
91
|
+
background-color: @badge-color-error;
|
|
93
92
|
}
|
|
94
93
|
&-default {
|
|
95
|
-
background-color: @badge-color-
|
|
94
|
+
background-color: @badge-color-default;
|
|
96
95
|
}
|
|
97
96
|
&-warning {
|
|
98
|
-
background-color: @badge-color-
|
|
97
|
+
background-color: @badge-color-warning;
|
|
99
98
|
}
|
|
100
99
|
}
|
|
101
100
|
|
|
@@ -21,3 +21,4 @@
|
|
|
21
21
|
@badge-color-ongoing: var(~'@{badge-prefix}-color-ongoing', @color-ongoing);
|
|
22
22
|
@badge-color-warning: var(~'@{badge-prefix}-color-warning', @color-warning);
|
|
23
23
|
@badge-color-error: var(~'@{badge-prefix}-color-error', @color-error);
|
|
24
|
+
@badge-color-default: var(~'@{badge-prefix}-color-default', #d9d9d9);
|
|
@@ -107,87 +107,6 @@
|
|
|
107
107
|
-ms-flex: 1;
|
|
108
108
|
flex: 1;
|
|
109
109
|
}
|
|
110
|
-
.kd-carousel-slidelist {
|
|
111
|
-
list-style: none;
|
|
112
|
-
display: -webkit-box;
|
|
113
|
-
display: -ms-flexbox;
|
|
114
|
-
display: flex;
|
|
115
|
-
-webkit-box-orient: horizontal;
|
|
116
|
-
-webkit-box-direction: normal;
|
|
117
|
-
-ms-flex-direction: row;
|
|
118
|
-
flex-direction: row;
|
|
119
|
-
width: 100%;
|
|
120
|
-
}
|
|
121
|
-
.kd-carousel-slidelist-item {
|
|
122
|
-
-ms-flex-negative: 0;
|
|
123
|
-
flex-shrink: 0;
|
|
124
|
-
height: 100%;
|
|
125
|
-
width: 100%;
|
|
126
|
-
overflow: hidden;
|
|
127
|
-
border-radius: var(--kd-c-carousel-border-radius, 0px);
|
|
128
|
-
}
|
|
129
|
-
.kd-carousel-fadelist {
|
|
130
|
-
list-style: none;
|
|
131
|
-
display: -webkit-box;
|
|
132
|
-
display: -ms-flexbox;
|
|
133
|
-
display: flex;
|
|
134
|
-
-webkit-box-orient: horizontal;
|
|
135
|
-
-webkit-box-direction: normal;
|
|
136
|
-
-ms-flex-direction: row;
|
|
137
|
-
flex-direction: row;
|
|
138
|
-
-webkit-box-flex: 1;
|
|
139
|
-
-ms-flex: 1;
|
|
140
|
-
flex: 1;
|
|
141
|
-
position: relative;
|
|
142
|
-
}
|
|
143
|
-
.kd-carousel-fadelist-item {
|
|
144
|
-
opacity: 1;
|
|
145
|
-
position: relative;
|
|
146
|
-
-ms-flex-negative: 0;
|
|
147
|
-
flex-shrink: 0;
|
|
148
|
-
height: 100%;
|
|
149
|
-
width: 100%;
|
|
150
|
-
}
|
|
151
|
-
.kd-carousel-fadelist-item-animation {
|
|
152
|
-
-webkit-transition: opacity 0.3s ease;
|
|
153
|
-
transition: opacity 0.3s ease;
|
|
154
|
-
}
|
|
155
|
-
.kd-carousel-fadelist-item-none-animation {
|
|
156
|
-
-webkit-transition: none;
|
|
157
|
-
transition: none;
|
|
158
|
-
}
|
|
159
|
-
.kd-carousel-fadelist-item-not-hidden {
|
|
160
|
-
opacity: 1;
|
|
161
|
-
}
|
|
162
|
-
.kd-carousel-fadelist-item-hidden {
|
|
163
|
-
opacity: 0;
|
|
164
|
-
}
|
|
165
|
-
.kd-carousel-displaylist {
|
|
166
|
-
list-style: none;
|
|
167
|
-
display: -webkit-box;
|
|
168
|
-
display: -ms-flexbox;
|
|
169
|
-
display: flex;
|
|
170
|
-
-webkit-box-orient: horizontal;
|
|
171
|
-
-webkit-box-direction: normal;
|
|
172
|
-
-ms-flex-direction: row;
|
|
173
|
-
flex-direction: row;
|
|
174
|
-
width: 100%;
|
|
175
|
-
position: relative;
|
|
176
|
-
}
|
|
177
|
-
.kd-carousel-displaylist-item {
|
|
178
|
-
display: block;
|
|
179
|
-
position: relative;
|
|
180
|
-
-ms-flex-negative: 0;
|
|
181
|
-
flex-shrink: 0;
|
|
182
|
-
height: 100%;
|
|
183
|
-
width: 100%;
|
|
184
|
-
}
|
|
185
|
-
.kd-carousel-displaylist-item-not-hidden {
|
|
186
|
-
display: block;
|
|
187
|
-
}
|
|
188
|
-
.kd-carousel-displaylist-item-hidden {
|
|
189
|
-
display: none;
|
|
190
|
-
}
|
|
191
110
|
.kd-carousel-list {
|
|
192
111
|
list-style: none;
|
|
193
112
|
display: -webkit-box;
|
|
@@ -197,9 +116,6 @@
|
|
|
197
116
|
-webkit-box-direction: normal;
|
|
198
117
|
-ms-flex-direction: row;
|
|
199
118
|
flex-direction: row;
|
|
200
|
-
-webkit-box-flex: 1;
|
|
201
|
-
-ms-flex: 1;
|
|
202
|
-
flex: 1;
|
|
203
119
|
position: relative;
|
|
204
120
|
}
|
|
205
121
|
.kd-carousel-list-item {
|
|
@@ -209,6 +125,9 @@
|
|
|
209
125
|
height: 100%;
|
|
210
126
|
width: 100%;
|
|
211
127
|
}
|
|
128
|
+
.kd-carousel-list-slide {
|
|
129
|
+
width: 100%;
|
|
130
|
+
}
|
|
212
131
|
.kd-carousel-list-slide .kd-carousel-list-item {
|
|
213
132
|
opacity: 1;
|
|
214
133
|
border-radius: var(--kd-c-carousel-border-radius, 0px);
|
|
@@ -227,6 +146,11 @@
|
|
|
227
146
|
.kd-carousel-list-slide .kd-carousel-list-item-hidden {
|
|
228
147
|
opacity: 0;
|
|
229
148
|
}
|
|
149
|
+
.kd-carousel-list-fade {
|
|
150
|
+
-webkit-box-flex: 1;
|
|
151
|
+
-ms-flex: 1;
|
|
152
|
+
flex: 1;
|
|
153
|
+
}
|
|
230
154
|
.kd-carousel-list-fade .kd-carousel-list-item {
|
|
231
155
|
opacity: 1;
|
|
232
156
|
}
|
|
@@ -244,6 +168,9 @@
|
|
|
244
168
|
.kd-carousel-list-fade .kd-carousel-list-item-hidden {
|
|
245
169
|
opacity: 0;
|
|
246
170
|
}
|
|
171
|
+
.kd-carousel-list-display {
|
|
172
|
+
width: 100%;
|
|
173
|
+
}
|
|
247
174
|
.kd-carousel-list-display .kd-carousel-list-item {
|
|
248
175
|
display: block;
|
|
249
176
|
}
|
|
@@ -10,71 +10,11 @@
|
|
|
10
10
|
overflow: hidden;
|
|
11
11
|
flex: 1;
|
|
12
12
|
}
|
|
13
|
-
&-slidelist {
|
|
14
|
-
list-style: none;
|
|
15
|
-
display: flex;
|
|
16
|
-
flex-direction: row;
|
|
17
|
-
width: 100%;
|
|
18
|
-
&-item {
|
|
19
|
-
flex-shrink: 0;
|
|
20
|
-
height: 100%;
|
|
21
|
-
width: 100%;
|
|
22
|
-
overflow: hidden;
|
|
23
|
-
border-radius: @carousel-boder-radius;
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
&-fadelist {
|
|
27
|
-
list-style: none;
|
|
28
|
-
display: flex;
|
|
29
|
-
flex-direction: row;
|
|
30
|
-
flex: 1;
|
|
31
|
-
position: relative;
|
|
32
|
-
&-item {
|
|
33
|
-
opacity: 1;
|
|
34
|
-
position: relative;
|
|
35
|
-
flex-shrink: 0;
|
|
36
|
-
height: 100%;
|
|
37
|
-
width: 100%;
|
|
38
|
-
&-animation {
|
|
39
|
-
transition: opacity 0.3s ease;
|
|
40
|
-
}
|
|
41
|
-
&-none-animation {
|
|
42
|
-
transition: none;
|
|
43
|
-
}
|
|
44
|
-
&-not-hidden {
|
|
45
|
-
opacity: 1;
|
|
46
|
-
}
|
|
47
|
-
&-hidden {
|
|
48
|
-
opacity: 0;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
&-displaylist {
|
|
53
|
-
list-style: none;
|
|
54
|
-
display: flex;
|
|
55
|
-
flex-direction: row;
|
|
56
|
-
width: 100%;
|
|
57
|
-
position: relative;
|
|
58
|
-
&-item {
|
|
59
|
-
display: block;
|
|
60
|
-
position: relative;
|
|
61
|
-
flex-shrink: 0;
|
|
62
|
-
height: 100%;
|
|
63
|
-
width: 100%;
|
|
64
|
-
&-not-hidden {
|
|
65
|
-
display: block;
|
|
66
|
-
}
|
|
67
|
-
&-hidden {
|
|
68
|
-
display: none;
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
13
|
|
|
73
14
|
&-list {
|
|
74
15
|
list-style: none;
|
|
75
16
|
display: flex;
|
|
76
17
|
flex-direction: row;
|
|
77
|
-
flex: 1;
|
|
78
18
|
position: relative;
|
|
79
19
|
|
|
80
20
|
&-item {
|
|
@@ -85,6 +25,7 @@
|
|
|
85
25
|
}
|
|
86
26
|
|
|
87
27
|
&-slide {
|
|
28
|
+
width: 100%;
|
|
88
29
|
.@{carousel-prefix-cls}-list-item {
|
|
89
30
|
opacity: 1;
|
|
90
31
|
border-radius: @carousel-boder-radius;
|
|
@@ -104,6 +45,7 @@
|
|
|
104
45
|
}
|
|
105
46
|
|
|
106
47
|
&-fade {
|
|
48
|
+
flex: 1;
|
|
107
49
|
.@{carousel-prefix-cls}-list-item {
|
|
108
50
|
opacity: 1;
|
|
109
51
|
&-animation {
|
|
@@ -122,6 +64,7 @@
|
|
|
122
64
|
}
|
|
123
65
|
|
|
124
66
|
&-display {
|
|
67
|
+
width: 100%;
|
|
125
68
|
.@{carousel-prefix-cls}-list-item {
|
|
126
69
|
display: block;
|
|
127
70
|
&-not-hidden {
|
|
@@ -14,8 +14,8 @@ declare type FieldNames = {
|
|
|
14
14
|
value: string;
|
|
15
15
|
children: string;
|
|
16
16
|
};
|
|
17
|
-
export declare const
|
|
18
|
-
export declare type
|
|
17
|
+
export declare const CascaderPlacement: ["topLeft", "topRight", "bottomLeft", "bottomRight"];
|
|
18
|
+
export declare type CascaderPlacementType = typeof CascaderPlacement[number];
|
|
19
19
|
export declare type CascaderValueType = Array<string | number>;
|
|
20
20
|
export declare type CascaderExpandTrigger = 'click' | 'hover';
|
|
21
21
|
export interface CascaderProps extends PopperProps {
|
|
@@ -29,8 +29,10 @@ export interface CascaderProps extends PopperProps {
|
|
|
29
29
|
allowClear?: boolean;
|
|
30
30
|
placeholder?: string;
|
|
31
31
|
popupVisible?: boolean;
|
|
32
|
+
popperVisible?: boolean;
|
|
32
33
|
fieldNames?: FieldNames;
|
|
33
34
|
popupClassName?: string;
|
|
35
|
+
popperClassName?: string;
|
|
34
36
|
changeOnSelect?: boolean;
|
|
35
37
|
notFoundContent?: string;
|
|
36
38
|
value?: CascaderValueType;
|
|
@@ -40,10 +42,12 @@ export interface CascaderProps extends PopperProps {
|
|
|
40
42
|
expandIcon?: React.ReactNode;
|
|
41
43
|
defaultPopupVisible?: boolean;
|
|
42
44
|
defaultValue?: CascaderValueType;
|
|
43
|
-
popupPlacement?:
|
|
45
|
+
popupPlacement?: CascaderPlacementType;
|
|
46
|
+
popperPlacement?: CascaderPlacementType;
|
|
44
47
|
options?: Array<CascaderOptionType>;
|
|
45
48
|
expandTrigger?: CascaderExpandTrigger;
|
|
46
49
|
onPopupVisibleChange?: (visible: boolean) => void;
|
|
50
|
+
onPopperVisibleChange?: (visible: boolean) => void;
|
|
47
51
|
loadData?: (selectedOptions: CascaderOptionType[]) => void;
|
|
48
52
|
dropdownRender?: (menus: React.ReactNode) => React.ReactNode;
|
|
49
53
|
getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
|
package/es/cascader/cascader.js
CHANGED
|
@@ -14,7 +14,7 @@ import usePopper from '../_utils/usePopper';
|
|
|
14
14
|
import Input from '../input';
|
|
15
15
|
import Icon from '../icon';
|
|
16
16
|
import Empty from '../empty';
|
|
17
|
-
export var
|
|
17
|
+
export var CascaderPlacement = tuple('topLeft', 'topRight', 'bottomLeft', 'bottomRight');
|
|
18
18
|
var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
19
19
|
var _React$useContext = React.useContext(ConfigContext),
|
|
20
20
|
getPrefixCls = _React$useContext.getPrefixCls,
|
|
@@ -39,6 +39,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
39
39
|
getPopupContainer = allProps.getPopupContainer,
|
|
40
40
|
defaultPopupVisible = allProps.defaultPopupVisible,
|
|
41
41
|
onPopupVisibleChange = allProps.onPopupVisibleChange,
|
|
42
|
+
onPopperVisibleChange = allProps.onPopperVisibleChange,
|
|
42
43
|
customPrefixcls = allProps.prefixCls; // className前缀
|
|
43
44
|
|
|
44
45
|
var prefixCls = getPrefixCls(pkgPrefixCls, 'cascader', customPrefixcls);
|
|
@@ -46,14 +47,14 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
46
47
|
var triggerRef = React.useRef();
|
|
47
48
|
var mergeRef = ref || pickerRef;
|
|
48
49
|
|
|
49
|
-
var _React$useState = React.useState(!!props.popupVisible || defaultPopupVisible),
|
|
50
|
+
var _React$useState = React.useState(!!props.popperVisible || !!props.popupVisible || defaultPopupVisible),
|
|
50
51
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
51
52
|
visible = _React$useState2[0],
|
|
52
53
|
setVisible = _React$useState2[1];
|
|
53
54
|
|
|
54
55
|
React.useEffect(function () {
|
|
55
|
-
setVisible(!!props.popupVisible);
|
|
56
|
-
}, [props.popupVisible]);
|
|
56
|
+
setVisible(!!props.popperVisible || !!props.popupVisible);
|
|
57
|
+
}, [props.popperVisible, props.popupVisible]);
|
|
57
58
|
|
|
58
59
|
var _React$useState3 = React.useState([options]),
|
|
59
60
|
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
@@ -200,6 +201,7 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
200
201
|
var onVisibleChange = function onVisibleChange(visible) {
|
|
201
202
|
setVisible(visible);
|
|
202
203
|
onPopupVisibleChange && onPopupVisibleChange(visible);
|
|
204
|
+
onPopperVisibleChange && onPopperVisibleChange(visible);
|
|
203
205
|
visible && setSelectedOptions(_sliceInstanceProperty(currentOptions).call(currentOptions, 0));
|
|
204
206
|
};
|
|
205
207
|
|
|
@@ -252,8 +254,8 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
252
254
|
trigger: 'click',
|
|
253
255
|
getPopupContainer: getPopupContainer,
|
|
254
256
|
prefixCls: "".concat(prefixCls, "-menus"),
|
|
255
|
-
placement: allProps.popupPlacement,
|
|
256
|
-
popperClassName: allProps.popupClassName,
|
|
257
|
+
placement: allProps.popperPlacement || allProps.popupPlacement,
|
|
258
|
+
popperClassName: allProps.popperClassName || allProps.popupClassName,
|
|
257
259
|
getTriggerElement: function getTriggerElement() {
|
|
258
260
|
return triggerRef.current;
|
|
259
261
|
}
|
package/es/checkbox/checkbox.js
CHANGED
|
@@ -32,7 +32,8 @@ var InternalCheckbox = function InternalCheckbox(props, ref) {
|
|
|
32
32
|
children = CheckboxProps.children,
|
|
33
33
|
style = CheckboxProps.style,
|
|
34
34
|
value = CheckboxProps.value,
|
|
35
|
-
indeterminate = CheckboxProps.indeterminate
|
|
35
|
+
indeterminate = CheckboxProps.indeterminate,
|
|
36
|
+
name = CheckboxProps.name;
|
|
36
37
|
|
|
37
38
|
var getChecked = function getChecked() {
|
|
38
39
|
return isBoolean(checked) ? checked : defaultChecked;
|
|
@@ -102,7 +103,8 @@ var InternalCheckbox = function InternalCheckbox(props, ref) {
|
|
|
102
103
|
ref: ref,
|
|
103
104
|
value: value,
|
|
104
105
|
checked: selected,
|
|
105
|
-
disabled: disabled
|
|
106
|
+
disabled: disabled,
|
|
107
|
+
name: name
|
|
106
108
|
})), children && /*#__PURE__*/React.createElement("span", {
|
|
107
109
|
className: "".concat(checkboxPrefixCls, "-children")
|
|
108
110
|
}, children), !isDefaultType() && /*#__PURE__*/React.createElement("span", {
|
|
@@ -151,6 +151,10 @@
|
|
|
151
151
|
-ms-flex-align: center;
|
|
152
152
|
align-items: center;
|
|
153
153
|
z-index: 999;
|
|
154
|
+
-webkit-user-select: none;
|
|
155
|
+
-moz-user-select: none;
|
|
156
|
+
-ms-user-select: none;
|
|
157
|
+
user-select: none;
|
|
154
158
|
}
|
|
155
159
|
.kd-checkbox-children .kd-input-underline {
|
|
156
160
|
background-color: transparent;
|
|
@@ -383,3 +387,6 @@
|
|
|
383
387
|
.kd-checkbox-default.checked .kd-checkbox-children {
|
|
384
388
|
color: var(--kd-c-checkbox-color-text-primary, #212121);
|
|
385
389
|
}
|
|
390
|
+
.kd-checkbox-default-indeterminate .kd-checkbox-children {
|
|
391
|
+
color: var(--kd-c-checkbox-color-text-primary, #212121);
|
|
392
|
+
}
|
|
@@ -38,6 +38,8 @@
|
|
|
38
38
|
justify-content: center;
|
|
39
39
|
align-items: center;
|
|
40
40
|
z-index: 999;
|
|
41
|
+
user-select: none;
|
|
42
|
+
|
|
41
43
|
.kd-input-underline {
|
|
42
44
|
background-color: transparent;
|
|
43
45
|
border-bottom: none;
|
|
@@ -249,4 +251,9 @@
|
|
|
249
251
|
color: @checkbox-font-color;
|
|
250
252
|
}
|
|
251
253
|
}
|
|
254
|
+
&-indeterminate {
|
|
255
|
+
.@{checkbox-prefix-cls}-children {
|
|
256
|
+
color: @checkbox-font-color;
|
|
257
|
+
}
|
|
258
|
+
}
|
|
252
259
|
}
|
package/es/form/Field.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { NamePath, LabelAlign, Rule } from './interface';
|
|
|
3
3
|
export interface FormItemProps {
|
|
4
4
|
children?: React.ReactNode;
|
|
5
5
|
className?: string;
|
|
6
|
-
defaultValue?:
|
|
6
|
+
defaultValue?: any;
|
|
7
7
|
disabled?: boolean;
|
|
8
8
|
hidden?: boolean;
|
|
9
9
|
label?: string | number;
|
|
@@ -15,6 +15,7 @@ export interface FormItemProps {
|
|
|
15
15
|
rules?: Rule[];
|
|
16
16
|
validateTrigger?: string | string[];
|
|
17
17
|
wrapperWidth?: string | number;
|
|
18
|
+
valuePropName?: string;
|
|
18
19
|
}
|
|
19
20
|
declare const Field: React.FC<FormItemProps>;
|
|
20
21
|
export default Field;
|
package/es/form/Field.js
CHANGED
|
@@ -3,8 +3,10 @@ import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
|
|
|
3
3
|
import _typeof from "@babel/runtime-corejs3/helpers/typeof";
|
|
4
4
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
|
|
5
5
|
import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
|
|
6
|
+
import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
|
|
6
7
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
7
8
|
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
|
|
9
|
+
import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
|
|
8
10
|
|
|
9
11
|
var __rest = this && this.__rest || function (s, e) {
|
|
10
12
|
var t = {};
|
|
@@ -31,6 +33,7 @@ import { toArray } from '../_utils/react-children';
|
|
|
31
33
|
import FieldContext from './FieldContext';
|
|
32
34
|
import { INTERNAL_HOOK_KEY } from './hooks/useForm';
|
|
33
35
|
var DEFAULT_TRIGGER = 'onChange';
|
|
36
|
+
var FormEventValuePropNames = ['value', 'checked'];
|
|
34
37
|
|
|
35
38
|
var generateEventHandler = function generateEventHandler(handler, validateTrigger) {
|
|
36
39
|
var eventHandler = {};
|
|
@@ -50,8 +53,30 @@ var generateEventHandler = function generateEventHandler(handler, validateTrigge
|
|
|
50
53
|
return eventHandler;
|
|
51
54
|
};
|
|
52
55
|
|
|
56
|
+
var INNER_VALUE_PROPS_LIST = [{
|
|
57
|
+
name: 'Radio',
|
|
58
|
+
propName: 'checked'
|
|
59
|
+
}, {
|
|
60
|
+
name: 'Checkbox',
|
|
61
|
+
propName: 'checked'
|
|
62
|
+
}, {
|
|
63
|
+
name: 'Switch',
|
|
64
|
+
propName: 'checked'
|
|
65
|
+
}, {
|
|
66
|
+
name: 'Upload',
|
|
67
|
+
propName: 'fileList'
|
|
68
|
+
}, {
|
|
69
|
+
name: 'Transfer',
|
|
70
|
+
propName: 'targetKey'
|
|
71
|
+
}, {
|
|
72
|
+
name: 'RangePicker',
|
|
73
|
+
propName: 'ranges'
|
|
74
|
+
}];
|
|
75
|
+
|
|
53
76
|
var Field = function Field(props) {
|
|
54
|
-
var _classnames
|
|
77
|
+
var _classnames;
|
|
78
|
+
|
|
79
|
+
var _a;
|
|
55
80
|
|
|
56
81
|
devwarning(! /*#__PURE__*/React.isValidElement(props.children), 'Form.Item', 'Children of Form.Item is not a valid element');
|
|
57
82
|
devwarning(!props.name, 'Form.Item', 'Form.Item must have a name');
|
|
@@ -94,7 +119,30 @@ var Field = function Field(props) {
|
|
|
94
119
|
rules = _props$rules === void 0 ? [] : _props$rules,
|
|
95
120
|
wrapperWidth = props.wrapperWidth,
|
|
96
121
|
validateTrigger = props.validateTrigger,
|
|
97
|
-
defaultValue = props.defaultValue
|
|
122
|
+
defaultValue = props.defaultValue,
|
|
123
|
+
valuePropName = props.valuePropName;
|
|
124
|
+
var childrenNode = null;
|
|
125
|
+
var innerValuePropName = 'value';
|
|
126
|
+
var childrenArray = toArray(children);
|
|
127
|
+
|
|
128
|
+
if (childrenArray.length) {
|
|
129
|
+
devwarning(childrenArray.length > 1, 'Form.Item', 'Form.Item must have only child');
|
|
130
|
+
childrenNode = childrenArray[0];
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
var innerDisplayName = (_a = childrenNode === null || childrenNode === void 0 ? void 0 : childrenNode.type) === null || _a === void 0 ? void 0 : _a.displayName;
|
|
134
|
+
|
|
135
|
+
if (valuePropName !== undefined) {
|
|
136
|
+
innerValuePropName = valuePropName;
|
|
137
|
+
} else if (innerDisplayName) {
|
|
138
|
+
var filter = _filterInstanceProperty(INNER_VALUE_PROPS_LIST).call(INNER_VALUE_PROPS_LIST, function (item) {
|
|
139
|
+
return innerDisplayName === item.name;
|
|
140
|
+
});
|
|
141
|
+
|
|
142
|
+
if (filter.length) {
|
|
143
|
+
innerValuePropName = filter[0].propName;
|
|
144
|
+
}
|
|
145
|
+
}
|
|
98
146
|
|
|
99
147
|
var onStoreChange = function onStoreChange(stores, _namePathList, source) {
|
|
100
148
|
var prev = stores.prev,
|
|
@@ -167,10 +215,23 @@ var Field = function Field(props) {
|
|
|
167
215
|
var formItemClassName = classnames((_classnames = {}, _defineProperty(_classnames, "".concat(formPrefixCls), true), _defineProperty(_classnames, "".concat(formPrefixCls, "-field"), true), _defineProperty(_classnames, "".concat(formPrefixCls, "-field-hidden"), hidden), _defineProperty(_classnames, "".concat(formPrefixCls, "-field-vertical"), vertical), _classnames), className);
|
|
168
216
|
var value = getFieldValue(name);
|
|
169
217
|
var validateMessage = getFieldError(name);
|
|
170
|
-
|
|
218
|
+
|
|
219
|
+
var getInputValueFormProp = function getInputValueFormProp(evt) {
|
|
171
220
|
var _a;
|
|
172
221
|
|
|
173
|
-
var inputValue
|
|
222
|
+
var inputValue;
|
|
223
|
+
|
|
224
|
+
if (Object.prototype.hasOwnProperty.call(evt, 'target') && _includesInstanceProperty(FormEventValuePropNames).call(FormEventValuePropNames, innerValuePropName)) {
|
|
225
|
+
inputValue = (_a = evt.target) === null || _a === void 0 ? void 0 : _a[innerValuePropName];
|
|
226
|
+
} else {
|
|
227
|
+
inputValue = evt;
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
return inputValue;
|
|
231
|
+
};
|
|
232
|
+
|
|
233
|
+
var handleValueChange = React.useCallback(function (evt) {
|
|
234
|
+
var inputValue = getInputValueFormProp(evt);
|
|
174
235
|
dispatch({
|
|
175
236
|
type: 'updateValue',
|
|
176
237
|
namePath: name,
|
|
@@ -187,6 +248,8 @@ var Field = function Field(props) {
|
|
|
187
248
|
var trigger = _extends(_defineProperty({}, DEFAULT_TRIGGER, handleValueChange), generateEventHandler(handleValueValidate, validateTrigger));
|
|
188
249
|
|
|
189
250
|
var mergeProps = function mergeProps(fa, ch) {
|
|
251
|
+
var _extends3;
|
|
252
|
+
|
|
190
253
|
if (!ch) {
|
|
191
254
|
return {};
|
|
192
255
|
}
|
|
@@ -197,17 +260,13 @@ var Field = function Field(props) {
|
|
|
197
260
|
|
|
198
261
|
var _ch$props = ch.props,
|
|
199
262
|
chChange = _ch$props.onChange,
|
|
200
|
-
chValue = _ch$props
|
|
263
|
+
chValue = _ch$props[innerValuePropName],
|
|
201
264
|
chDisabled = _ch$props.disabled,
|
|
202
265
|
chDefaultValue = _ch$props.defaultValue;
|
|
203
266
|
|
|
204
267
|
var onChange = function onChange(evt) {
|
|
205
268
|
if (chValue === undefined) {
|
|
206
|
-
|
|
207
|
-
setFieldValue(evt);
|
|
208
|
-
} else {
|
|
209
|
-
setFieldValue(evt.target.value);
|
|
210
|
-
}
|
|
269
|
+
setFieldValue(getInputValueFormProp(evt));
|
|
211
270
|
}
|
|
212
271
|
|
|
213
272
|
if (typeof faChange === 'function') {
|
|
@@ -230,12 +289,10 @@ var Field = function Field(props) {
|
|
|
230
289
|
forceUpdate();
|
|
231
290
|
}
|
|
232
291
|
|
|
233
|
-
return _extends(_extends({}, rest), {
|
|
292
|
+
return _extends(_extends({}, rest), (_extends3 = {
|
|
234
293
|
onChange: onChange,
|
|
235
|
-
defaultValue: defaultValue
|
|
236
|
-
|
|
237
|
-
disabled: chDisabled || faDisabled
|
|
238
|
-
});
|
|
294
|
+
defaultValue: defaultValue
|
|
295
|
+
}, _defineProperty(_extends3, innerValuePropName, fieldValue), _defineProperty(_extends3, "disabled", chDisabled || faDisabled), _extends3));
|
|
239
296
|
};
|
|
240
297
|
|
|
241
298
|
return /*#__PURE__*/React.createElement("div", {
|
|
@@ -248,11 +305,10 @@ var Field = function Field(props) {
|
|
|
248
305
|
}), /*#__PURE__*/React.createElement(FieldWrapper, {
|
|
249
306
|
width: wrapperWidth,
|
|
250
307
|
validateMessage: validateMessage
|
|
251
|
-
}, _mapInstanceProperty(
|
|
252
|
-
var keys = mergeProps(_extends(_extends({
|
|
253
|
-
disabled: disabled
|
|
254
|
-
|
|
255
|
-
}, trigger), {
|
|
308
|
+
}, _mapInstanceProperty(childrenArray).call(childrenArray, function (child, index) {
|
|
309
|
+
var keys = mergeProps(_extends(_extends(_defineProperty({
|
|
310
|
+
disabled: disabled
|
|
311
|
+
}, innerValuePropName, value), trigger), {
|
|
256
312
|
key: index
|
|
257
313
|
}), child);
|
|
258
314
|
return child ? /*#__PURE__*/React.cloneElement(child, keys) : child;
|
package/es/grid/row.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
declare type Align = 'top' | 'middle' | 'bottom';
|
|
2
|
+
declare type Align = 'top' | 'middle' | 'bottom' | 'stretch';
|
|
3
3
|
declare type Justify = 'start' | 'end' | 'center' | 'space-around' | 'space-between';
|
|
4
4
|
interface gutterObject {
|
|
5
5
|
xs?: number;
|
package/es/icon/interface.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
2
2
|
import { tuple } from '../_utils/type';
|
|
3
3
|
export var BaseIcon = ['arrow-up', 'arrow-down', 'arrow-left', 'arrow-right', 'first', 'last', 'double-arrow-left', 'double-arrow-right', 'push-down', 'put-top', 'put-bottom', 'put-on', 'put-off', 'switch-up', 'switch-down', 'all-border', 'top-border', 'right-border', 'bottom-border', 'left-border', 'left-extension', 'right-extension', 'left-unfold', 'right-unfold', 'unfoldmenu', 'foldmenu', 'enlarge', 'expand', 'close-full-screen', 'split', 'back', 'arrow', 'no-border', 'border', 'rough-border', 'align-left', 'align-right', 'align-center', 'vertical-center', 'delete-indentation', 'equal', 'greater-equal', 'not-equal', 'male', 'female', 'copy', 'print', 'lock', 'scanning', 'like', 'project', 'user-info', 'shutdown', 'image', 'delete-line', 'add-line', 'job-info', 'detect', 'cancel', 'stop', 'cell', 'fixed-shrink', 'attachment', 'location', 'reduce', 'resign-report', 'forbid', 'education', 'unlock', 'contract', 'filter', 'more', 'operating-element', 'fail', 'edit', 'have-attachment', 'hide', 'preview', 'unfold-all', 'wrap', 'filter-switch', 'qualification-info', 'cn', 'en', 'git', 'reset', 'preview-view', 'unfold', 'comment', 'shoppingcart', 'add-child', 'save', 'detail', 'table-setting', 'edit-view', 'edit-border', 'hyperlink', 'code', 'import', 'address', 'analysis', 'share', 'chart', 'fixed-window', 'order', 'phone', 'classify', 'feedback', 'menu', 'voice', 'search-border', 'material', 'finish', 'more-info', 'fixed', 'change', 'copy-code', 'return', 'qrcode', 'counterclockwise', 'list', 'switch', 'task-process', 'add', 'delete', 'add-word', 'two-window', 'spin', 'ordered-list', 'cooperation', 'quit', 'shrink', 'zoom', 'graffiti', 'experience', 'medical-report', 'bankcard', 'yunzhijia', 'customize', 'refresh', 'search', 'loadding', 'loadding-circle', 'right', 'close', 'upload', 'download', 'upload-cloud', 'waiting', 'warning', 'exclamatory', 'tips', 'setting', 'chart-display', 'date', 'more-item', 'international', 'little-k', 'bellOutlined', 'sigma'];
|
|
4
|
-
export var SolidIcon = ['arrow-up-solid', 'arrow-right-solid', 'arrow-down-solid', 'arrow-left-solid', 'left-unfold-solid', 'right-unfold-solid', 'unlock-solid', 'multiply', 'division-solid', 'title-solid', 'communication-solid', 'fixed-solid', 'more-info-solid', 'timezone-solid', 'mosaic-solid', 'strike-solid', 'lock-solid', 'filter-solid', 'person-solid', 'bold-solid', 'delete-solid', 'processing-solid', 'tips-solid', 'quote-solid', 'oblique-solid', 'sun-solid', 'underline-solid', 'font-background-solid', 'eliminate-solid', 'font-color-solid', 'fx', 'refresh-solid', 'right-solid', 'location-solid', 'add-solid', 'warning-solid', 'close-solid', 'right-bold', 'close-bold', 'workbench', 'star', 'notice'];
|
|
4
|
+
export var SolidIcon = ['arrow-up-solid', 'arrow-right-solid', 'arrow-down-solid', 'arrow-left-solid', 'left-unfold-solid', 'right-unfold-solid', 'unlock-solid', 'multiply', 'division-solid', 'title-solid', 'communication-solid', 'fixed-solid', 'more-info-solid', 'timezone-solid', 'mosaic-solid', 'strike-solid', 'lock-solid', 'filter-solid', 'person-solid', 'bold-solid', 'delete-solid', 'processing-solid', 'tips-solid', 'quote-solid', 'oblique-solid', 'sun-solid', 'underline-solid', 'font-background-solid', 'eliminate-solid', 'font-color-solid', 'fx', 'refresh-solid', 'right-solid', 'location-solid', 'add-solid', 'warning-solid', 'close-solid', 'right-bold', 'close-bold', 'workbench', 'star', 'notice', 'dashboard'];
|
|
5
5
|
export var IconTypes = tuple.apply(void 0, _concatInstanceProperty(BaseIcon).call(BaseIcon, SolidIcon));
|
package/es/select/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { ISelectProps } from './interface';
|
|
2
|
+
import { ISelectProps, SelectValue } from './interface';
|
|
3
3
|
import Option from './option';
|
|
4
|
-
interface CompoundedComponent extends React.ForwardRefExoticComponent<ISelectProps & React.RefAttributes<HTMLElement>> {
|
|
4
|
+
interface CompoundedComponent extends React.ForwardRefExoticComponent<ISelectProps<SelectValue> & React.RefAttributes<HTMLElement>> {
|
|
5
5
|
Option: typeof Option;
|
|
6
6
|
}
|
|
7
7
|
declare const Select: CompoundedComponent;
|
package/es/select/interface.d.ts
CHANGED
|
@@ -43,17 +43,17 @@ export interface OptionsType {
|
|
|
43
43
|
value?: string;
|
|
44
44
|
label?: React.ReactNode;
|
|
45
45
|
}
|
|
46
|
-
export declare type SelectValue = string | string[] | number | number[] | LabeledValue | LabeledValue[] | null;
|
|
47
|
-
export interface ISelectProps<T
|
|
46
|
+
export declare type SelectValue = string | string[] | number | number[] | LabeledValue | LabeledValue[] | null | undefined;
|
|
47
|
+
export interface ISelectProps<T extends SelectValue> extends AbstractSelectProps {
|
|
48
48
|
value?: T;
|
|
49
49
|
defaultValue?: T;
|
|
50
50
|
mode?: Mode;
|
|
51
51
|
autoFocus?: boolean;
|
|
52
|
-
onChange?: (value
|
|
53
|
-
onSelect?: (value
|
|
54
|
-
onBlur?: (value
|
|
52
|
+
onChange?: (value?: T, option?: React.ReactElement<any> | React.ReactElement<any>[]) => void;
|
|
53
|
+
onSelect?: (value?: T extends (infer I)[] ? I : T, option?: React.ReactElement<any>) => void;
|
|
54
|
+
onBlur?: (value?: T) => void;
|
|
55
55
|
onFocus?: () => void;
|
|
56
|
-
onSearch?: () => void;
|
|
56
|
+
onSearch?: (value?: string) => void;
|
|
57
57
|
onClear?: () => void;
|
|
58
|
-
onDropdownVisibleChange?: (value
|
|
58
|
+
onDropdownVisibleChange?: (value?: T) => void;
|
|
59
59
|
}
|