@kdcloudjs/kdesign 1.7.24 → 1.7.26
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 +46 -0
- package/dist/kdesign-complete.less +101 -43
- package/dist/kdesign.css +81 -37
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +251 -132
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +3 -3
- package/dist/kdesign.min.js +5 -5
- package/dist/kdesign.min.js.map +1 -1
- package/es/_utils/usePopper.d.ts +1 -0
- package/es/_utils/usePopper.js +4 -2
- package/es/cascader/cascader.js +64 -32
- package/es/cascader/style/index.css +40 -24
- package/es/cascader/style/index.less +49 -27
- package/es/cascader/style/token.less +4 -3
- package/es/city-picker/city-picker.js +33 -26
- package/es/city-picker/option.js +4 -3
- package/es/city-picker/style/index.css +24 -10
- package/es/city-picker/style/index.less +22 -6
- package/es/city-picker/style/token.less +4 -5
- package/es/collapse/panel.js +31 -18
- package/es/collapse/style/index.css +4 -1
- package/es/collapse/style/index.less +4 -1
- package/es/form/Field.d.ts +1 -0
- package/es/form/Field.js +5 -3
- package/es/form/FieldWrapper.d.ts +1 -0
- package/es/form/FieldWrapper.js +13 -5
- package/es/form/style/index.css +11 -1
- package/es/form/style/index.less +16 -1
- package/es/form/style/token.less +1 -0
- package/es/input-number/inputNumber.js +15 -3
- package/es/input-number/useSelectionRange.d.ts +4 -0
- package/es/input-number/useSelectionRange.js +22 -0
- package/es/locale/locale.d.ts +4 -4
- package/es/locale/zh-CN.d.ts +4 -2
- package/es/locale/zh-CN.js +4 -2
- package/es/radio/style/index.css +1 -0
- package/es/radio/style/index.less +1 -0
- package/es/select/select.js +3 -3
- package/es/tag/tag.d.ts +1 -0
- package/es/tree-select/tree-select.js +2 -1
- package/lib/_utils/usePopper.d.ts +1 -0
- package/lib/_utils/usePopper.js +4 -2
- package/lib/cascader/cascader.js +63 -31
- package/lib/cascader/style/index.css +40 -24
- package/lib/cascader/style/index.less +49 -27
- package/lib/cascader/style/token.less +4 -3
- package/lib/city-picker/city-picker.js +33 -26
- package/lib/city-picker/option.js +4 -3
- package/lib/city-picker/style/index.css +24 -10
- package/lib/city-picker/style/index.less +22 -6
- package/lib/city-picker/style/token.less +4 -5
- package/lib/collapse/panel.js +32 -19
- package/lib/collapse/style/index.css +4 -1
- package/lib/collapse/style/index.less +4 -1
- package/lib/form/Field.d.ts +1 -0
- package/lib/form/Field.js +5 -3
- package/lib/form/FieldWrapper.d.ts +1 -0
- package/lib/form/FieldWrapper.js +13 -5
- package/lib/form/style/index.css +11 -1
- package/lib/form/style/index.less +16 -1
- package/lib/form/style/token.less +1 -0
- package/lib/input-number/inputNumber.js +14 -2
- package/lib/input-number/useSelectionRange.d.ts +4 -0
- package/lib/input-number/useSelectionRange.js +29 -0
- package/lib/locale/locale.d.ts +4 -4
- package/lib/locale/zh-CN.d.ts +4 -2
- package/lib/locale/zh-CN.js +4 -2
- package/lib/radio/style/index.css +1 -0
- package/lib/radio/style/index.less +1 -0
- package/lib/select/select.js +3 -3
- package/lib/tag/tag.d.ts +1 -0
- package/lib/tree-select/tree-select.js +2 -1
- package/package.json +1 -1
|
@@ -20,6 +20,7 @@ var InternalOption = function InternalOption(props, ref) {
|
|
|
20
20
|
var children = props.children,
|
|
21
21
|
value = props.value,
|
|
22
22
|
disabled = props.disabled,
|
|
23
|
+
className = props.className,
|
|
23
24
|
onChangeSelect = props.onChangeSelect,
|
|
24
25
|
_props$city = props.city,
|
|
25
26
|
city = _props$city === void 0 ? {} : _props$city,
|
|
@@ -32,7 +33,7 @@ var InternalOption = function InternalOption(props, ref) {
|
|
|
32
33
|
prefixCls = _useContext.prefixCls;
|
|
33
34
|
var selectOptionPrefixCls = getPrefixCls(prefixCls, 'city-picker-list-item');
|
|
34
35
|
var isSelected = id !== undefined ? id === value : false;
|
|
35
|
-
var optionCls = (0, _classnames.default)(selectOptionPrefixCls, (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(selectOptionPrefixCls, "-selected"), isSelected), (0, _defineProperty2.default)(_classNames, "".concat(selectOptionPrefixCls, "-disabled"), disabled), _classNames));
|
|
36
|
+
var optionCls = (0, _classnames.default)(selectOptionPrefixCls, className, (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(selectOptionPrefixCls, "-selected"), isSelected), (0, _defineProperty2.default)(_classNames, "".concat(selectOptionPrefixCls, "-disabled"), disabled), _classNames));
|
|
36
37
|
var handleClick = function handleClick(e) {
|
|
37
38
|
e.preventDefault();
|
|
38
39
|
if (disabled || id === undefined) return;
|
|
@@ -43,9 +44,9 @@ var InternalOption = function InternalOption(props, ref) {
|
|
|
43
44
|
className: optionCls,
|
|
44
45
|
title: name,
|
|
45
46
|
onClick: handleClick
|
|
46
|
-
}, typeof itemRender === 'function' ? itemRender(city) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("
|
|
47
|
+
}, typeof itemRender === 'function' ? itemRender(city) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
|
|
47
48
|
className: "".concat(selectOptionPrefixCls, "-content")
|
|
48
|
-
}, children), /*#__PURE__*/_react.default.createElement("
|
|
49
|
+
}, children), /*#__PURE__*/_react.default.createElement("span", {
|
|
49
50
|
className: "".concat(selectOptionPrefixCls, "-info")
|
|
50
51
|
}, renderCityInfo === null || renderCityInfo === void 0 ? void 0 : renderCityInfo(city, true)))));
|
|
51
52
|
};
|
|
@@ -121,6 +121,9 @@
|
|
|
121
121
|
-ms-flex-direction: column;
|
|
122
122
|
flex-direction: column;
|
|
123
123
|
}
|
|
124
|
+
.kd-city-picker-selector {
|
|
125
|
+
width: 100%;
|
|
126
|
+
}
|
|
124
127
|
.kd-city-picker-selector:hover .kd-city-picker-icon-active {
|
|
125
128
|
color: #3761ca;
|
|
126
129
|
}
|
|
@@ -264,6 +267,12 @@
|
|
|
264
267
|
padding: 0 12px;
|
|
265
268
|
font-size: 12px;
|
|
266
269
|
}
|
|
270
|
+
.kd-city-picker-dropdown .kd-tabs-tab-list .kd-tab-pane-type-line .kd-tab-pane-text {
|
|
271
|
+
overflow: hidden;
|
|
272
|
+
white-space: nowrap;
|
|
273
|
+
text-overflow: ellipsis;
|
|
274
|
+
width: 100%;
|
|
275
|
+
}
|
|
267
276
|
.kd-city-picker-dropdown .kd-tabs-noContainer {
|
|
268
277
|
height: unset;
|
|
269
278
|
}
|
|
@@ -311,6 +320,9 @@
|
|
|
311
320
|
box-sizing: content-box;
|
|
312
321
|
}
|
|
313
322
|
.kd-city-picker-list-item {
|
|
323
|
+
overflow: hidden;
|
|
324
|
+
white-space: nowrap;
|
|
325
|
+
text-overflow: ellipsis;
|
|
314
326
|
position: relative;
|
|
315
327
|
display: block;
|
|
316
328
|
font-weight: normal;
|
|
@@ -319,16 +331,8 @@
|
|
|
319
331
|
padding: 5px 12px;
|
|
320
332
|
color: var(--kd-c-city-picker-footer-color-text, var(--kd-g-color-text-primary, #212121));
|
|
321
333
|
line-height: var(--kd-c-city-picker-dropdown-line-height, 22px);
|
|
322
|
-
display: -webkit-box;
|
|
323
|
-
display: -ms-flexbox;
|
|
324
|
-
display: flex;
|
|
325
334
|
cursor: pointer;
|
|
326
335
|
}
|
|
327
|
-
.kd-city-picker-list-item-content {
|
|
328
|
-
overflow: hidden;
|
|
329
|
-
white-space: nowrap;
|
|
330
|
-
text-overflow: ellipsis;
|
|
331
|
-
}
|
|
332
336
|
.kd-city-picker-list-item-info {
|
|
333
337
|
color: var(--kd-c-city-picker-placeholder-color-text, #b2b2b2);
|
|
334
338
|
white-space: nowrap;
|
|
@@ -337,15 +341,25 @@
|
|
|
337
341
|
background-color: var(--kd-c-city-picker-color-background, #f5f5f5);
|
|
338
342
|
}
|
|
339
343
|
.kd-city-picker-list-item-selected:not(.kd-city-picker-list-item-disabled) {
|
|
340
|
-
background-color: var(--kd-c-city-picker-color-background-selected, #
|
|
344
|
+
background-color: var(--kd-c-city-picker-color-background-selected, var(--kd-g-color-theme-3, #e3eeff));
|
|
345
|
+
color: var(--kd-c-city-picker-list-item-color-text-selected, var(--kd-g-color-theme, #5582f3));
|
|
346
|
+
}
|
|
347
|
+
.kd-city-picker-list-item-selected:not(.kd-city-picker-list-item-disabled) .kd-city-picker-list-item-info {
|
|
348
|
+
color: var(--kd-c-city-picker-list-item-color-text-selected, var(--kd-g-color-theme, #5582f3));
|
|
341
349
|
}
|
|
342
350
|
.kd-city-picker-list-item-disabled {
|
|
343
351
|
color: var(--kd-c-city-picker-item-color-text-disabled, var(--kd-g-color-disabled, #b2b2b2));
|
|
344
352
|
cursor: not-allowed;
|
|
345
353
|
background-color: var(--kd-c-city-picker-item-color-background-disabled, #fff);
|
|
346
354
|
}
|
|
355
|
+
.kd-city-picker-list > .kd-city-picker-list-item-match {
|
|
356
|
+
color: var(--kd-c-city-picker-footer-color-text, var(--kd-g-color-text-primary, #212121));
|
|
357
|
+
}
|
|
358
|
+
.kd-city-picker-list > .kd-city-picker-list-item-match .kd-city-picker-list-item-info {
|
|
359
|
+
color: var(--kd-c-city-picker-placeholder-color-text, #b2b2b2);
|
|
360
|
+
}
|
|
347
361
|
.kd-city-picker-highlight {
|
|
348
|
-
color: #5582f3;
|
|
362
|
+
color: var(--kd-c-city-picker-highlight-color-text, var(--kd-g-color-theme, #5582f3));
|
|
349
363
|
}
|
|
350
364
|
.kd-city-picker-size-small {
|
|
351
365
|
min-height: var(--kd-c-city-picker-sizing-height-small, 24px);
|
|
@@ -14,6 +14,9 @@
|
|
|
14
14
|
display: flex;
|
|
15
15
|
flex-direction: column;
|
|
16
16
|
|
|
17
|
+
&-selector {
|
|
18
|
+
width: 100%;
|
|
19
|
+
}
|
|
17
20
|
&-selector:hover {
|
|
18
21
|
.@{city-picker-prefix-cls}-icon-active {
|
|
19
22
|
color: #3761ca;
|
|
@@ -159,6 +162,11 @@
|
|
|
159
162
|
&-type-line {
|
|
160
163
|
padding: 0 12px;
|
|
161
164
|
font-size: 12px;
|
|
165
|
+
|
|
166
|
+
.@{kd-prefix}-tab-pane-text {
|
|
167
|
+
.over();
|
|
168
|
+
width: 100%;
|
|
169
|
+
}
|
|
162
170
|
}
|
|
163
171
|
}
|
|
164
172
|
}
|
|
@@ -204,14 +212,10 @@
|
|
|
204
212
|
|
|
205
213
|
// 下拉列表选项
|
|
206
214
|
&-item {
|
|
215
|
+
.over();
|
|
207
216
|
.item();
|
|
208
|
-
display: flex;
|
|
209
217
|
cursor: pointer;
|
|
210
218
|
|
|
211
|
-
&-content {
|
|
212
|
-
.over();
|
|
213
|
-
}
|
|
214
|
-
|
|
215
219
|
&-info {
|
|
216
220
|
color: @city-picker-placeholder-color;
|
|
217
221
|
white-space: nowrap;
|
|
@@ -223,6 +227,11 @@
|
|
|
223
227
|
|
|
224
228
|
&-selected:not(&-disabled) {
|
|
225
229
|
background-color: @city-picker-item-selected-bg;
|
|
230
|
+
color: @city-picker-list-item-color-selected;
|
|
231
|
+
|
|
232
|
+
.@{city-picker-prefix-cls}-list-item-info {
|
|
233
|
+
color: @city-picker-list-item-color-selected;
|
|
234
|
+
}
|
|
226
235
|
}
|
|
227
236
|
|
|
228
237
|
&-disabled {
|
|
@@ -231,10 +240,17 @@
|
|
|
231
240
|
background-color: @city-picker-disabled-option-bg;
|
|
232
241
|
}
|
|
233
242
|
}
|
|
243
|
+
|
|
244
|
+
& > .@{city-picker-prefix-cls}-list-item-match {
|
|
245
|
+
color: @city-picker-font-color;
|
|
246
|
+
.@{city-picker-prefix-cls}-list-item-info {
|
|
247
|
+
color: @city-picker-placeholder-color;
|
|
248
|
+
}
|
|
249
|
+
}
|
|
234
250
|
}
|
|
235
251
|
|
|
236
252
|
&-highlight {
|
|
237
|
-
color:
|
|
253
|
+
color: @city-picker-highlight-color;
|
|
238
254
|
}
|
|
239
255
|
|
|
240
256
|
// 选择器框大小
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
@city-picker-dropdown-bg: var(~'@{city-picker-custom-prefix}-dropdown-color-background', @color-background);
|
|
7
7
|
@city-picker-disabled-option-bg: var(~'@{city-picker-custom-prefix}-item-color-background-disabled', #fff);
|
|
8
8
|
@city-picker-item-active-bg: var(~'@{city-picker-custom-prefix}-color-background', #f5f5f5);
|
|
9
|
-
@city-picker-item-selected-bg: var(~'@{city-picker-custom-prefix}-color-background-selected',
|
|
9
|
+
@city-picker-item-selected-bg: var(~'@{city-picker-custom-prefix}-color-background-selected', @color-theme-3);
|
|
10
10
|
@city-picker-g-color-border: var(~'@{city-picker-custom-prefix}-color-border', @color-input);
|
|
11
11
|
@city-picker-g-color-border-foucs: var(~'@{city-picker-custom-prefix}-color-border-foucs', @color-theme);
|
|
12
12
|
@city-picker-g-color-border-hover: var(~'@{city-picker-custom-prefix}-color-border-hover', @color-theme);
|
|
@@ -16,12 +16,11 @@
|
|
|
16
16
|
@city-picker-g-item-text-color-disabled: var(~'@{city-picker-custom-prefix}-item-color-text-disabled', @color-disabled);
|
|
17
17
|
@city-picker-color-background-disabled: var(~'@{city-picker-custom-prefix}-color-background-disabled', #fff);
|
|
18
18
|
@city-picker-color-text-disabled: var(~'@{city-picker-custom-prefix}-color-text-disabled', @color-disabled);
|
|
19
|
-
@city-picker-arrow-icon-color-text-disabled: var(
|
|
20
|
-
~'@{city-picker-custom-prefix}-arrow-icon-color-text-disabled',
|
|
21
|
-
#b2b2b2
|
|
22
|
-
);
|
|
19
|
+
@city-picker-arrow-icon-color-text-disabled: var(~'@{city-picker-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
|
|
23
20
|
@city-picker-clear-color: var(~'@{city-picker-custom-prefix}-icon-clear-color-text', #d9d9d9);
|
|
24
21
|
@city-picker-clear-color-hover: var(~'@{city-picker-custom-prefix}-icon-clear-color-text-hover', #999);
|
|
22
|
+
@city-picker-list-item-color-selected: var(~'@{city-picker-custom-prefix}-list-item-color-text-selected', @color-theme);
|
|
23
|
+
@city-picker-highlight-color: var(~'@{city-picker-custom-prefix}-highlight-color-text', @color-theme);
|
|
25
24
|
|
|
26
25
|
// font
|
|
27
26
|
@city-picker-list-font-size: var(~'@{city-picker-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
|
package/lib/collapse/panel.js
CHANGED
|
@@ -8,9 +8,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
10
10
|
exports.default = void 0;
|
|
11
|
-
var
|
|
11
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
|
|
12
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
|
|
13
13
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
|
|
14
|
+
var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
|
|
15
|
+
var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
|
|
14
16
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
17
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
16
18
|
var _ConfigContext = _interopRequireDefault(require("../config-provider/ConfigContext"));
|
|
@@ -18,27 +20,37 @@ var _utils = require("../_utils");
|
|
|
18
20
|
var _icon = _interopRequireDefault(require("../icon"));
|
|
19
21
|
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
20
22
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
|
+
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
24
|
+
var t = {};
|
|
25
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
26
|
+
if (s != null && typeof _getOwnPropertySymbols.default === "function") for (var i = 0, p = (0, _getOwnPropertySymbols.default)(s); i < p.length; i++) {
|
|
27
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
28
|
+
}
|
|
29
|
+
return t;
|
|
30
|
+
};
|
|
21
31
|
var Panel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
22
32
|
var _classNames6, _classNames7, _classNames8;
|
|
23
33
|
var _React$useContext = _react.default.useContext(_ConfigContext.default),
|
|
24
34
|
getPrefixCls = _React$useContext.getPrefixCls,
|
|
25
35
|
prefixCls = _React$useContext.prefixCls,
|
|
26
36
|
userDefaultProps = _React$useContext.compDefaultProps;
|
|
27
|
-
var
|
|
28
|
-
disabled =
|
|
29
|
-
extra =
|
|
30
|
-
assist =
|
|
31
|
-
header =
|
|
32
|
-
onChange =
|
|
33
|
-
panelKey =
|
|
34
|
-
innerKey =
|
|
35
|
-
bordered =
|
|
36
|
-
expandIcon =
|
|
37
|
-
expandIconPosition =
|
|
38
|
-
style =
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
37
|
+
var _a = (0, _utils.getCompProps)('CollapsePanel', userDefaultProps, props),
|
|
38
|
+
disabled = _a.disabled,
|
|
39
|
+
extra = _a.extra,
|
|
40
|
+
assist = _a.assist,
|
|
41
|
+
header = _a.header,
|
|
42
|
+
onChange = _a.onChange,
|
|
43
|
+
panelKey = _a.panelKey,
|
|
44
|
+
innerKey = _a.innerKey,
|
|
45
|
+
bordered = _a.bordered,
|
|
46
|
+
expandIcon = _a.expandIcon,
|
|
47
|
+
expandIconPosition = _a.expandIconPosition,
|
|
48
|
+
style = _a.style,
|
|
49
|
+
title = _a.title,
|
|
50
|
+
className = _a.className,
|
|
51
|
+
children = _a.children,
|
|
52
|
+
customPrefixcls = _a.prefixCls,
|
|
53
|
+
others = __rest(_a, ["disabled", "extra", "assist", "header", "onChange", "panelKey", "innerKey", "bordered", "expandIcon", "expandIconPosition", "style", "title", "className", "children", "prefixCls"]);
|
|
42
54
|
var panelPrefixCls = getPrefixCls(prefixCls, 'collapse-panel', customPrefixcls); // 样式前缀
|
|
43
55
|
var childrenRef = (0, _react.useRef)();
|
|
44
56
|
var setHeightTimerRef = (0, _react.useRef)(null);
|
|
@@ -80,7 +92,8 @@ var Panel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
80
92
|
className: className,
|
|
81
93
|
onClick: handleClick
|
|
82
94
|
}, expandIconPosition === 'left' ? renderIcon() : null, header && /*#__PURE__*/_react.default.createElement("span", {
|
|
83
|
-
className: headerClassName
|
|
95
|
+
className: headerClassName,
|
|
96
|
+
title: title
|
|
84
97
|
}, renderReactNode(header)));
|
|
85
98
|
};
|
|
86
99
|
var renderRight = function renderRight() {
|
|
@@ -147,11 +160,11 @@ var Panel = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
|
|
|
147
160
|
expand ? expandWidthoutAnimation(childrenRef.current) : runCollapseAnimation(childrenRef.current);
|
|
148
161
|
}
|
|
149
162
|
}, [childrenRef.current, expandAnimation, expand]);
|
|
150
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
163
|
+
return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
|
|
151
164
|
className: rootClassName,
|
|
152
165
|
style: style,
|
|
153
166
|
ref: panelPrefixClsRef
|
|
154
|
-
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
167
|
+
}, others), /*#__PURE__*/_react.default.createElement("span", {
|
|
155
168
|
className: topClassName
|
|
156
169
|
}, renderLeft(), renderMiddle(), renderRight()), /*#__PURE__*/_react.default.createElement("div", {
|
|
157
170
|
className: childrenClassName,
|
|
@@ -116,9 +116,12 @@
|
|
|
116
116
|
.kd-collapse-panel:last-child {
|
|
117
117
|
border-top: none;
|
|
118
118
|
}
|
|
119
|
-
.kd-collapse-panel:first-child {
|
|
119
|
+
.kd-collapse-panel-border.kd-collapse-panel:first-child {
|
|
120
120
|
border-top: var(--kd-c-collapse-border-width, 1px) solid var(--kd-c-collapse-color-border-strong-2, var(--kd-g-color-border-strong-2, #d9d9d9));
|
|
121
121
|
}
|
|
122
|
+
.kd-collapse-panel-border.kd-collapse-panel:not(:nth-child(1)) {
|
|
123
|
+
border-top: none;
|
|
124
|
+
}
|
|
122
125
|
.kd-collapse-panel {
|
|
123
126
|
display: -webkit-inline-box;
|
|
124
127
|
display: -ms-inline-flexbox;
|
|
@@ -9,9 +9,12 @@
|
|
|
9
9
|
&-panel:last-child {
|
|
10
10
|
border-top: none;
|
|
11
11
|
}
|
|
12
|
-
&-panel:first-child {
|
|
12
|
+
&-panel-border&-panel:first-child {
|
|
13
13
|
border-top: @collapse-border-width solid @collapse-border-color;
|
|
14
14
|
}
|
|
15
|
+
&-panel-border&-panel:not(:nth-child(1)) {
|
|
16
|
+
border-top: none;
|
|
17
|
+
}
|
|
15
18
|
&-panel {
|
|
16
19
|
display: inline-flex;
|
|
17
20
|
flex-direction: column;
|
package/lib/form/Field.d.ts
CHANGED
package/lib/form/Field.js
CHANGED
|
@@ -114,7 +114,8 @@ var Field = function Field(props) {
|
|
|
114
114
|
wrapperWidth = props.wrapperWidth,
|
|
115
115
|
validateTrigger = props.validateTrigger,
|
|
116
116
|
defaultValue = props.defaultValue,
|
|
117
|
-
valuePropName = props.valuePropName
|
|
117
|
+
valuePropName = props.valuePropName,
|
|
118
|
+
extra = props.extra;
|
|
118
119
|
var htmlFor = customizeHtmlFor || (name ? (0, _concat.default)(_context = "form_".concat(name, "_")).call(_context, (Math.random() * 100).toFixed(0)) : undefined);
|
|
119
120
|
var childrenNode = null;
|
|
120
121
|
var innerValuePropName = 'value';
|
|
@@ -200,7 +201,7 @@ var Field = function Field(props) {
|
|
|
200
201
|
};
|
|
201
202
|
}, []);
|
|
202
203
|
var formPrefixCls = getPrefixCls === null || getPrefixCls === void 0 ? void 0 : getPrefixCls(prefixCls, 'form', customizePrefixcls);
|
|
203
|
-
var formItemClassName = (0, _classnames2.default)((_classnames = {}, (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls), true), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field"), true), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field-hidden"), hidden), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field-vertical"), vertical), _classnames), className);
|
|
204
|
+
var formItemClassName = (0, _classnames2.default)((_classnames = {}, (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls), true), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field"), true), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field-hidden"), hidden), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field-vertical"), vertical), (0, _defineProperty2.default)(_classnames, "".concat(formPrefixCls, "-field-extra"), extra), _classnames), className);
|
|
204
205
|
var value = getFieldValue(name);
|
|
205
206
|
var validateMessage = getFieldError(name);
|
|
206
207
|
var getInputValueFormProp = function getInputValueFormProp(evt) {
|
|
@@ -295,7 +296,8 @@ var Field = function Field(props) {
|
|
|
295
296
|
requiredMark: mergedRequired
|
|
296
297
|
}), /*#__PURE__*/_react.default.createElement(_FieldWrapper.default, {
|
|
297
298
|
width: wrapperWidth,
|
|
298
|
-
validateMessage: validateMessage
|
|
299
|
+
validateMessage: validateMessage,
|
|
300
|
+
extra: extra
|
|
299
301
|
}, (0, _map.default)(childrenArray).call(childrenArray, function (child, index) {
|
|
300
302
|
var keys = mergeProps((0, _extends3.default)((0, _extends3.default)({}, generateEventHandler(handleValueValidate, validateTrigger)), {
|
|
301
303
|
key: index,
|
package/lib/form/FieldWrapper.js
CHANGED
|
@@ -23,19 +23,27 @@ var FieldWrapper = function FieldWrapper(props) {
|
|
|
23
23
|
var children = wrapperProps.children,
|
|
24
24
|
customizePrefixCls = wrapperProps.prefixCls,
|
|
25
25
|
width = wrapperProps.width,
|
|
26
|
-
validateMessage = wrapperProps.validateMessage
|
|
26
|
+
validateMessage = wrapperProps.validateMessage,
|
|
27
|
+
extra = wrapperProps.extra;
|
|
27
28
|
var wrapperPrefixCls = getPrefixCls === null || getPrefixCls === void 0 ? void 0 : getPrefixCls(prefixCls, 'form-field-wrapper', customizePrefixCls);
|
|
28
29
|
var wrapperClassName = (0, _classnames.default)(["".concat(wrapperPrefixCls)]);
|
|
29
30
|
var messageClassName = (0, _classnames.default)(["".concat(wrapperPrefixCls, "-message")]);
|
|
31
|
+
var validate = validateMessage ? /*#__PURE__*/_react.default.createElement("p", {
|
|
32
|
+
className: messageClassName,
|
|
33
|
+
title: validateMessage
|
|
34
|
+
}, validateMessage) : null;
|
|
30
35
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
31
36
|
className: wrapperClassName,
|
|
32
37
|
style: {
|
|
33
38
|
width: width
|
|
34
39
|
}
|
|
35
|
-
}, children,
|
|
36
|
-
className:
|
|
37
|
-
|
|
38
|
-
|
|
40
|
+
}, children, extra ? /*#__PURE__*/_react.default.createElement("div", {
|
|
41
|
+
className: "".concat(wrapperPrefixCls, "-extra")
|
|
42
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
43
|
+
className: "".concat(wrapperPrefixCls, "-extra-message")
|
|
44
|
+
}, validateMessage), /*#__PURE__*/_react.default.createElement("div", {
|
|
45
|
+
className: "".concat(wrapperPrefixCls, "-extra-text")
|
|
46
|
+
}, extra)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, validate));
|
|
39
47
|
};
|
|
40
48
|
var _default = FieldWrapper;
|
|
41
49
|
exports.default = _default;
|
package/lib/form/style/index.css
CHANGED
|
@@ -152,6 +152,9 @@
|
|
|
152
152
|
.kd-form-field-hidden {
|
|
153
153
|
display: none !important;
|
|
154
154
|
}
|
|
155
|
+
.kd-form-field-extra {
|
|
156
|
+
margin-bottom: calc(var(--kd-c-form-field-spacing-margin-bottom, 22px) * 2);
|
|
157
|
+
}
|
|
155
158
|
.kd-form-field-label {
|
|
156
159
|
font-size: var(--kd-c-form-field-label-font-size, 12px);
|
|
157
160
|
line-height: var(--kd-c-form-field-label-line-height, 18px);
|
|
@@ -178,7 +181,8 @@
|
|
|
178
181
|
.kd-form-field-wrapper {
|
|
179
182
|
position: relative;
|
|
180
183
|
}
|
|
181
|
-
.kd-form-field-wrapper-message
|
|
184
|
+
.kd-form-field-wrapper-message,
|
|
185
|
+
.kd-form-field-wrapper-extra {
|
|
182
186
|
position: absolute;
|
|
183
187
|
left: -7px;
|
|
184
188
|
right: 0;
|
|
@@ -191,3 +195,9 @@
|
|
|
191
195
|
white-space: nowrap;
|
|
192
196
|
text-overflow: ellipsis;
|
|
193
197
|
}
|
|
198
|
+
.kd-form-field-wrapper-extra-message {
|
|
199
|
+
color: var(--kd-c-form-error-color, var(--kd-g-color-error, #fb2323));
|
|
200
|
+
}
|
|
201
|
+
.kd-form-field-wrapper-extra-text {
|
|
202
|
+
color: var(--kd-c-form-extra-color, var(--kd-g-color-text-third, #999));
|
|
203
|
+
}
|
|
@@ -46,6 +46,10 @@
|
|
|
46
46
|
&-hidden {
|
|
47
47
|
display: none !important;
|
|
48
48
|
}
|
|
49
|
+
|
|
50
|
+
&-extra {
|
|
51
|
+
margin-bottom: calc(@form-field-spacing-margin-bottom * 2);
|
|
52
|
+
}
|
|
49
53
|
}
|
|
50
54
|
|
|
51
55
|
.@{field-label-cls} {
|
|
@@ -76,7 +80,8 @@
|
|
|
76
80
|
|
|
77
81
|
.@{field-wrapper-cls} {
|
|
78
82
|
position: relative;
|
|
79
|
-
|
|
83
|
+
|
|
84
|
+
&-message, &-extra {
|
|
80
85
|
position: absolute;
|
|
81
86
|
left: -7px;
|
|
82
87
|
right: 0;
|
|
@@ -89,4 +94,14 @@
|
|
|
89
94
|
white-space: nowrap;
|
|
90
95
|
text-overflow: ellipsis;
|
|
91
96
|
}
|
|
97
|
+
|
|
98
|
+
&-extra {
|
|
99
|
+
&-message {
|
|
100
|
+
color: @form-error-color;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
&-text {
|
|
104
|
+
color: @form-extra-color;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
92
107
|
}
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
// color
|
|
6
6
|
@form-field-color: var(~'@{form-prefix}-field-color', @color-text-secondary);
|
|
7
7
|
@form-error-color: var(~'@{form-prefix}-error-color', @color-error);
|
|
8
|
+
@form-extra-color: var(~'@{form-prefix}-extra-color', @color-text-third);
|
|
8
9
|
|
|
9
10
|
// font
|
|
10
11
|
@form-field-label-font-size: var(~'@{form-prefix}-field-label-font-size',12px);
|
|
@@ -22,6 +22,7 @@ var _formatUtil = require("../_utils/formatUtil");
|
|
|
22
22
|
var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
|
|
23
23
|
var _big = _interopRequireDefault(require("big.js"));
|
|
24
24
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
25
|
+
var _useSelectionRange = _interopRequireDefault(require("./useSelectionRange"));
|
|
25
26
|
function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
26
27
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
27
28
|
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
@@ -33,6 +34,7 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
|
33
34
|
return t;
|
|
34
35
|
};
|
|
35
36
|
var InternalInputNumber = function InternalInputNumber(props, ref) {
|
|
37
|
+
var _a;
|
|
36
38
|
var _useContext = (0, _react.useContext)(_ConfigContext.default),
|
|
37
39
|
userDefaultProps = _useContext.compDefaultProps,
|
|
38
40
|
getPrefixCls = _useContext.getPrefixCls,
|
|
@@ -122,6 +124,7 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
|
|
|
122
124
|
if (legalNumber === false) {
|
|
123
125
|
return false;
|
|
124
126
|
}
|
|
127
|
+
updateSelectionRangePosition(event);
|
|
125
128
|
value === undefined && setInputValue(legalNumber);
|
|
126
129
|
onChange && onChange(handleEventAttachValue(event, numberMode ? Number(legalNumber) : legalNumber));
|
|
127
130
|
};
|
|
@@ -237,10 +240,12 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
|
|
|
237
240
|
// 还原最小值
|
|
238
241
|
if (typeof min === 'number' && bigValue.lt(min)) {
|
|
239
242
|
_inputValue = min.toString();
|
|
243
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(handleEventAttachValue(event, numberMode ? Number(_inputValue) : _inputValue));
|
|
240
244
|
}
|
|
241
245
|
// 还原最大值
|
|
242
|
-
if (typeof
|
|
246
|
+
if (typeof max === 'number' && bigValue.gt(max)) {
|
|
243
247
|
_inputValue = max.toString();
|
|
248
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(handleEventAttachValue(event, numberMode ? Number(_inputValue) : _inputValue));
|
|
244
249
|
}
|
|
245
250
|
// 超过精度位数直接截断
|
|
246
251
|
_inputValue = handleNumericalAccuracy(_inputValue);
|
|
@@ -312,9 +317,16 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
|
|
|
312
317
|
}
|
|
313
318
|
};
|
|
314
319
|
});
|
|
320
|
+
var displayedInputValue = (0, _react.useMemo)(function () {
|
|
321
|
+
return formatter ? formatter(inputValue) : inputValue;
|
|
322
|
+
}, [inputValue, formatter]);
|
|
323
|
+
var updateSelectionRangePosition = (0, _useSelectionRange.default)({
|
|
324
|
+
inputElement: (_a = inputNumberRef.current) === null || _a === void 0 ? void 0 : _a.input,
|
|
325
|
+
inputValue: displayedInputValue
|
|
326
|
+
});
|
|
315
327
|
return /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({}, others, {
|
|
316
328
|
ref: inputNumberRef,
|
|
317
|
-
value:
|
|
329
|
+
value: displayedInputValue,
|
|
318
330
|
prefix: prefix,
|
|
319
331
|
suffix: suffix,
|
|
320
332
|
onChange: handleChange,
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = useSelectionRange;
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
|
|
10
|
+
function useSelectionRange(_ref) {
|
|
11
|
+
var inputElement = _ref.inputElement,
|
|
12
|
+
inputValue = _ref.inputValue;
|
|
13
|
+
var refSelectionPosition = (0, _react.useRef)();
|
|
14
|
+
(0, _react.useLayoutEffect)(function () {
|
|
15
|
+
var position = refSelectionPosition.current;
|
|
16
|
+
if (inputElement && inputValue && (0, _isNumber.default)(position)) {
|
|
17
|
+
var start = Math.max(0, inputValue.length - position);
|
|
18
|
+
inputElement.setSelectionRange(start, start);
|
|
19
|
+
}
|
|
20
|
+
}, [inputValue]);
|
|
21
|
+
return function (event) {
|
|
22
|
+
var _event$target = event.target,
|
|
23
|
+
end = _event$target.selectionEnd,
|
|
24
|
+
value = _event$target.value;
|
|
25
|
+
if ((0, _isNumber.default)(end)) {
|
|
26
|
+
refSelectionPosition.current = value.length - end;
|
|
27
|
+
}
|
|
28
|
+
};
|
|
29
|
+
}
|
package/lib/locale/locale.d.ts
CHANGED
|
@@ -61,11 +61,11 @@ declare class LocaleCache {
|
|
|
61
61
|
'QuickSearch.emptyTip': string;
|
|
62
62
|
'QuickSearch.or': string;
|
|
63
63
|
'CityPicker.domestic': string;
|
|
64
|
-
'CityPicker.internation': string;
|
|
65
64
|
'CityPicker.common': string;
|
|
66
|
-
'CityPicker.
|
|
67
|
-
|
|
68
|
-
|
|
65
|
+
'CityPicker.emptyText': string;
|
|
66
|
+
'CityPicker.commonEmptyText': string;
|
|
67
|
+
'CityPicker.tabsDomestic': string;
|
|
68
|
+
'CityPicker.tabsInternation': string;
|
|
69
69
|
'ColorPicker.followFunctionalColor': string;
|
|
70
70
|
'Search.placeholder': string;
|
|
71
71
|
'Search.desc': string[];
|
package/lib/locale/zh-CN.d.ts
CHANGED
|
@@ -35,9 +35,11 @@ declare const locale: {
|
|
|
35
35
|
'QuickSearch.emptyTip': string;
|
|
36
36
|
'QuickSearch.or': string;
|
|
37
37
|
'CityPicker.domestic': string;
|
|
38
|
-
'CityPicker.internation': string;
|
|
39
38
|
'CityPicker.common': string;
|
|
40
|
-
'CityPicker.
|
|
39
|
+
'CityPicker.emptyText': string;
|
|
40
|
+
'CityPicker.commonEmptyText': string;
|
|
41
|
+
'CityPicker.tabsDomestic': string;
|
|
42
|
+
'CityPicker.tabsInternation': string;
|
|
41
43
|
'ColorPicker.followFunctionalColor': string;
|
|
42
44
|
'Search.placeholder': string;
|
|
43
45
|
'Search.desc': string[];
|
package/lib/locale/zh-CN.js
CHANGED
|
@@ -46,9 +46,11 @@ var locale = (0, _extends2.default)((0, _extends2.default)({
|
|
|
46
46
|
'QuickSearch.emptyTip': '暂无数据',
|
|
47
47
|
'QuickSearch.or': '或',
|
|
48
48
|
'CityPicker.domestic': '国内',
|
|
49
|
-
'CityPicker.internation': '国际',
|
|
50
49
|
'CityPicker.common': '常用',
|
|
51
|
-
'CityPicker.
|
|
50
|
+
'CityPicker.emptyText': '暂无数据',
|
|
51
|
+
'CityPicker.commonEmptyText': '无常用城市',
|
|
52
|
+
'CityPicker.tabsDomestic': '国内',
|
|
53
|
+
'CityPicker.tabsInternation': '国际/中国港澳台',
|
|
52
54
|
'ColorPicker.followFunctionalColor': '跟随功能色',
|
|
53
55
|
'Search.placeholder': '请输入需要搜索的内容',
|
|
54
56
|
'Search.desc': ['空格代表"或",回车代表"且"'],
|