@kdcloudjs/kdesign 1.2.1 → 1.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.
Files changed (86) hide show
  1. package/CHANGELOG.md +48 -0
  2. package/dist/kdesign-complete.less +84 -65
  3. package/dist/kdesign.css +80 -86
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +197 -146
  6. package/dist/kdesign.js.map +1 -1
  7. package/dist/kdesign.min.css +3 -3
  8. package/dist/kdesign.min.js +8 -8
  9. package/dist/kdesign.min.js.map +1 -1
  10. package/es/badge/style/index.css +3 -4
  11. package/es/badge/style/index.less +3 -4
  12. package/es/badge/style/token.less +1 -0
  13. package/es/button/style/index.css +3 -3
  14. package/es/button/style/token.less +3 -3
  15. package/es/carousel/displayList.js +8 -4
  16. package/es/carousel/fadeList.js +9 -5
  17. package/es/carousel/slideList.js +6 -3
  18. package/es/carousel/style/index.css +35 -45
  19. package/es/carousel/style/index.less +50 -42
  20. package/es/checkbox/checkbox.js +4 -2
  21. package/es/collapse/panel.js +1 -1
  22. package/es/config-provider/compDefaultProps.d.ts +1 -0
  23. package/es/config-provider/compDefaultProps.js +2 -1
  24. package/es/dropdown/style/index.css +5 -5
  25. package/es/form/Field.d.ts +2 -1
  26. package/es/form/Field.js +39 -22
  27. package/es/form/Form.js +7 -2
  28. package/es/form/hooks/useForm.js +1 -0
  29. package/es/form/interface.d.ts +5 -0
  30. package/es/input-number/inputNumber.d.ts +1 -0
  31. package/es/input-number/inputNumber.js +3 -2
  32. package/es/locale/locale.d.ts +1 -0
  33. package/es/locale/zh-CN.d.ts +1 -0
  34. package/es/locale/zh-CN.js +2 -1
  35. package/es/menu/subMenu.js +6 -2
  36. package/es/popconfirm/style/index.css +5 -5
  37. package/es/radio/style/index.css +7 -8
  38. package/es/radio/style/index.less +2 -2
  39. package/es/select/index.d.ts +2 -2
  40. package/es/select/interface.d.ts +7 -7
  41. package/es/select/style/index.css +13 -7
  42. package/es/select/style/index.less +14 -6
  43. package/es/select/style/token.less +4 -1
  44. package/es/style/mixins/index.less +5 -5
  45. package/es/tabs/tabs.js +5 -1
  46. package/es/tooltip/style/index.css +8 -8
  47. package/es/tooltip/style/index.less +2 -2
  48. package/lib/badge/style/index.css +3 -4
  49. package/lib/badge/style/index.less +3 -4
  50. package/lib/badge/style/token.less +1 -0
  51. package/lib/button/style/index.css +3 -3
  52. package/lib/button/style/token.less +3 -3
  53. package/lib/carousel/displayList.js +9 -4
  54. package/lib/carousel/fadeList.js +10 -5
  55. package/lib/carousel/slideList.js +6 -3
  56. package/lib/carousel/style/index.css +35 -45
  57. package/lib/carousel/style/index.less +50 -42
  58. package/lib/checkbox/checkbox.js +4 -2
  59. package/lib/collapse/panel.js +1 -1
  60. package/lib/config-provider/compDefaultProps.d.ts +1 -0
  61. package/lib/config-provider/compDefaultProps.js +2 -1
  62. package/lib/dropdown/style/index.css +5 -5
  63. package/lib/form/Field.d.ts +2 -1
  64. package/lib/form/Field.js +42 -24
  65. package/lib/form/Form.js +7 -2
  66. package/lib/form/hooks/useForm.js +1 -0
  67. package/lib/form/interface.d.ts +5 -0
  68. package/lib/input-number/inputNumber.d.ts +1 -0
  69. package/lib/input-number/inputNumber.js +3 -2
  70. package/lib/locale/locale.d.ts +1 -0
  71. package/lib/locale/zh-CN.d.ts +1 -0
  72. package/lib/locale/zh-CN.js +2 -1
  73. package/lib/menu/subMenu.js +6 -2
  74. package/lib/popconfirm/style/index.css +5 -5
  75. package/lib/radio/style/index.css +7 -8
  76. package/lib/radio/style/index.less +2 -2
  77. package/lib/select/index.d.ts +2 -2
  78. package/lib/select/interface.d.ts +7 -7
  79. package/lib/select/style/index.css +13 -7
  80. package/lib/select/style/index.less +14 -6
  81. package/lib/select/style/token.less +4 -1
  82. package/lib/style/mixins/index.less +5 -5
  83. package/lib/tabs/tabs.js +6 -1
  84. package/lib/tooltip/style/index.css +8 -8
  85. package/lib/tooltip/style/index.less +2 -2
  86. package/package.json +1 -1
package/lib/form/Field.js CHANGED
@@ -13,7 +13,7 @@ Object.defineProperty(exports, "__esModule", {
13
13
  });
14
14
  exports.default = void 0;
15
15
 
16
- var _extends3 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
16
+ var _extends5 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
17
17
 
18
18
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
19
19
 
@@ -23,8 +23,12 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/hel
23
23
 
24
24
  var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
25
25
 
26
+ var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
27
+
26
28
  var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
27
29
 
30
+ var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
31
+
28
32
  var _react = _interopRequireWildcard(require("react"));
29
33
 
30
34
  var _get = _interopRequireDefault(require("lodash/get"));
@@ -65,6 +69,7 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
65
69
  };
66
70
 
67
71
  var DEFAULT_TRIGGER = 'onChange';
72
+ var FormEventValuePropNames = ['value', 'checked'];
68
73
 
69
74
  var generateEventHandler = function generateEventHandler(handler, validateTrigger) {
70
75
  var eventHandler = {};
@@ -85,7 +90,7 @@ var generateEventHandler = function generateEventHandler(handler, validateTrigge
85
90
  };
86
91
 
87
92
  var Field = function Field(props) {
88
- var _classnames, _context;
93
+ var _classnames, _context2;
89
94
 
90
95
  (0, _devwarning.default)(! /*#__PURE__*/_react.default.isValidElement(props.children), 'Form.Item', 'Children of Form.Item is not a valid element');
91
96
  (0, _devwarning.default)(!props.name, 'Form.Item', 'Form.Item must have a name');
@@ -107,7 +112,8 @@ var Field = function Field(props) {
107
112
  getFieldError = fieldContext.getFieldError,
108
113
  getInternalHooks = fieldContext.getInternalHooks,
109
114
  vertical = fieldContext.vertical,
110
- getDefaultValue = fieldContext.getDefaultValue;
115
+ getDefaultValue = fieldContext.getDefaultValue,
116
+ local = fieldContext.local;
111
117
 
112
118
  var _getInternalHooks = getInternalHooks(_useForm.INTERNAL_HOOK_KEY),
113
119
  registerField = _getInternalHooks.registerField,
@@ -128,7 +134,9 @@ var Field = function Field(props) {
128
134
  rules = _props$rules === void 0 ? [] : _props$rules,
129
135
  wrapperWidth = props.wrapperWidth,
130
136
  validateTrigger = props.validateTrigger,
131
- defaultValue = props.defaultValue;
137
+ defaultValue = props.defaultValue,
138
+ _props$valuePropName = props.valuePropName,
139
+ valuePropName = _props$valuePropName === void 0 ? 'value' : _props$valuePropName;
132
140
 
133
141
  var onStoreChange = function onStoreChange(stores, _namePathList, source) {
134
142
  var prev = stores.prev,
@@ -162,8 +170,11 @@ var Field = function Field(props) {
162
170
  if (Array.isArray(rules) && !rules.some(function (rule) {
163
171
  return Object.prototype.hasOwnProperty.call(rule, 'required');
164
172
  }) && required) {
173
+ var _context;
174
+
165
175
  rules.push({
166
- required: true
176
+ required: true,
177
+ message: (0, _concat.default)(_context = "".concat(local && local.requiredMessage)).call(_context, label)
167
178
  });
168
179
  }
169
180
 
@@ -200,10 +211,22 @@ var Field = function Field(props) {
200
211
  var value = getFieldValue(name);
201
212
  var validateMessage = getFieldError(name);
202
213
 
203
- var handleValueChange = _react.default.useCallback(function (evt) {
214
+ var getInputValueFormProp = function getInputValueFormProp(evt) {
204
215
  var _a;
205
216
 
206
- var inputValue = typeof evt === 'string' ? evt : (_a = evt.target) === null || _a === void 0 ? void 0 : _a.value;
217
+ var inputValue;
218
+
219
+ if (Object.prototype.hasOwnProperty.call(evt, 'target') && (0, _includes.default)(FormEventValuePropNames).call(FormEventValuePropNames, valuePropName)) {
220
+ inputValue = (_a = evt.target) === null || _a === void 0 ? void 0 : _a[valuePropName];
221
+ } else {
222
+ inputValue = evt;
223
+ }
224
+
225
+ return inputValue;
226
+ };
227
+
228
+ var handleValueChange = _react.default.useCallback(function (evt) {
229
+ var inputValue = getInputValueFormProp(evt);
207
230
  dispatch({
208
231
  type: 'updateValue',
209
232
  namePath: name,
@@ -218,9 +241,11 @@ var Field = function Field(props) {
218
241
  });
219
242
  }, [name]);
220
243
 
221
- var trigger = (0, _extends3.default)((0, _defineProperty2.default)({}, DEFAULT_TRIGGER, handleValueChange), generateEventHandler(handleValueValidate, validateTrigger));
244
+ var trigger = (0, _extends5.default)((0, _defineProperty2.default)({}, DEFAULT_TRIGGER, handleValueChange), generateEventHandler(handleValueValidate, validateTrigger));
222
245
 
223
246
  var mergeProps = function mergeProps(fa, ch) {
247
+ var _extends3;
248
+
224
249
  if (!ch) {
225
250
  return {};
226
251
  }
@@ -231,17 +256,13 @@ var Field = function Field(props) {
231
256
 
232
257
  var _ch$props = ch.props,
233
258
  chChange = _ch$props.onChange,
234
- chValue = _ch$props.value,
259
+ chValue = _ch$props[valuePropName],
235
260
  chDisabled = _ch$props.disabled,
236
261
  chDefaultValue = _ch$props.defaultValue;
237
262
 
238
263
  var onChange = function onChange(evt) {
239
264
  if (chValue === undefined) {
240
- if (typeof evt === 'string') {
241
- setFieldValue(evt);
242
- } else {
243
- setFieldValue(evt.target.value);
244
- }
265
+ setFieldValue(getInputValueFormProp(evt));
245
266
  }
246
267
 
247
268
  if (typeof faChange === 'function') {
@@ -264,12 +285,10 @@ var Field = function Field(props) {
264
285
  forceUpdate();
265
286
  }
266
287
 
267
- return (0, _extends3.default)((0, _extends3.default)({}, rest), {
288
+ return (0, _extends5.default)((0, _extends5.default)({}, rest), (_extends3 = {
268
289
  onChange: onChange,
269
- defaultValue: defaultValue,
270
- value: fieldValue,
271
- disabled: chDisabled || faDisabled
272
- });
290
+ defaultValue: defaultValue
291
+ }, (0, _defineProperty2.default)(_extends3, valuePropName, fieldValue), (0, _defineProperty2.default)(_extends3, "disabled", chDisabled || faDisabled), _extends3));
273
292
  };
274
293
 
275
294
  return /*#__PURE__*/_react.default.createElement("div", {
@@ -282,11 +301,10 @@ var Field = function Field(props) {
282
301
  }), /*#__PURE__*/_react.default.createElement(_FieldWrapper.default, {
283
302
  width: wrapperWidth,
284
303
  validateMessage: validateMessage
285
- }, (0, _map.default)(_context = (0, _reactChildren.toArray)(children)).call(_context, function (child, index) {
286
- var keys = mergeProps((0, _extends3.default)((0, _extends3.default)({
287
- disabled: disabled,
288
- value: value
289
- }, trigger), {
304
+ }, (0, _map.default)(_context2 = (0, _reactChildren.toArray)(children)).call(_context2, function (child, index) {
305
+ var keys = mergeProps((0, _extends5.default)((0, _extends5.default)((0, _defineProperty2.default)({
306
+ disabled: disabled
307
+ }, valuePropName, value), trigger), {
290
308
  key: index
291
309
  }), child);
292
310
  return child ? /*#__PURE__*/_react.default.cloneElement(child, keys) : child;
package/lib/form/Form.js CHANGED
@@ -60,9 +60,13 @@ var Form = function Form(props, ref) {
60
60
  var _useContext = (0, _react.useContext)(_configProvider.ConfigContext),
61
61
  getPrefixCls = _useContext.getPrefixCls,
62
62
  prefixCls = _useContext.prefixCls,
63
- userDefaultProps = _useContext.compDefaultProps;
63
+ userDefaultProps = _useContext.compDefaultProps,
64
+ globalLocale = _useContext.locale;
64
65
 
65
66
  var formProps = (0, _utils.getCompProps)('Form', userDefaultProps, props);
67
+ var formLang = globalLocale.getCompLangMsg({
68
+ componentName: 'Form'
69
+ });
66
70
 
67
71
  var children = formProps.children,
68
72
  defaultValues = formProps.defaultValues,
@@ -116,9 +120,10 @@ var Form = function Form(props, ref) {
116
120
  labelAlign: labelAlign,
117
121
  labelWidth: labelWidth,
118
122
  wrapperWidth: wrapperWidth,
123
+ local: formLang,
119
124
  vertical: layout === 'vertical'
120
125
  });
121
- }, [formInstance, labelAlign, labelWidth, wrapperWidth, layout]);
126
+ }, [formInstance, labelAlign, labelWidth, wrapperWidth, layout, formLang]);
122
127
 
123
128
  var handleSubmit = function handleSubmit(evt) {
124
129
  evt.preventDefault();
@@ -229,6 +229,7 @@ var FormStore = /*#__PURE__*/(0, _createClass2.default)(function FormStore() {
229
229
  }
230
230
 
231
231
  _this.store = newStore;
232
+ _this.errorMessages = {};
232
233
 
233
234
  _this.notifyObservers(prevStore, null, 'reset');
234
235
  };
@@ -25,11 +25,16 @@ export interface FormInstance<Values = any> {
25
25
  submit: () => void;
26
26
  getInternalHooks: (secret: string) => InternalHooks | null;
27
27
  }
28
+ export interface InnerLocale {
29
+ locale: string;
30
+ requiredMessage: string;
31
+ }
28
32
  export interface InternalFormInstance extends FormInstance {
29
33
  labelWidth?: string | number;
30
34
  labelAlign?: LabelAlign;
31
35
  wrapperWidth?: string | number;
32
36
  vertical?: boolean;
37
+ local?: InnerLocale;
33
38
  getInternalHooks: (key: string) => InternalHooks | null;
34
39
  }
35
40
  export declare type Stores = {
@@ -21,6 +21,7 @@ export interface InputNumberProps extends InputProps {
21
21
  mustInPrecisionScope?: boolean;
22
22
  stepOption?: StepOption;
23
23
  stepperrref?: any;
24
+ formatter?: (value: string | undefined) => string;
24
25
  }
25
26
  declare const InputNumber: React.ForwardRefExoticComponent<InputNumberProps & React.RefAttributes<unknown>>;
26
27
  export default InputNumber;
@@ -84,7 +84,8 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
84
84
  maxMark = inputNumberProps.maxMark,
85
85
  prefix = inputNumberProps.prefix,
86
86
  suffix = inputNumberProps.suffix,
87
- others = __rest(inputNumberProps, ["value", "defaultValue", "mustInScope", "decimalLength", "mustInPrecisionScope", "digitLength", "onChange", "symbol", "zeroShow", "showDecimalTailZero", "code", "roundMethod", "mask", "stepOption", "min", "minMark", "max", "maxMark", "prefix", "suffix"]);
87
+ formatter = inputNumberProps.formatter,
88
+ others = __rest(inputNumberProps, ["value", "defaultValue", "mustInScope", "decimalLength", "mustInPrecisionScope", "digitLength", "onChange", "symbol", "zeroShow", "showDecimalTailZero", "code", "roundMethod", "mask", "stepOption", "min", "minMark", "max", "maxMark", "prefix", "suffix", "formatter"]);
88
89
 
89
90
  var initVal = value === undefined ? defaultValue : value;
90
91
 
@@ -364,7 +365,7 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
364
365
  });
365
366
  return /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({}, others, {
366
367
  ref: inputNumberRef,
367
- value: inputValue,
368
+ value: inputValue ? (formatter === null || formatter === void 0 ? void 0 : formatter(inputValue)) || inputValue : inputValue,
368
369
  prefix: prefix,
369
370
  suffix: suffix,
370
371
  onChange: handleChange,
@@ -84,6 +84,7 @@ declare class LocaleCache {
84
84
  'Filter.and': string;
85
85
  'Filter.settings': string;
86
86
  'Filter.schemeNamePlaceholder': string;
87
+ 'Form.requiredMessage': string;
87
88
  'DatePicker.placeholder': string;
88
89
  'DatePicker.yearPlaceholder': string;
89
90
  'DatePicker.quarterPlaceholder': string;
@@ -58,6 +58,7 @@ declare const locale: {
58
58
  'Filter.and': string;
59
59
  'Filter.settings': string;
60
60
  'Filter.schemeNamePlaceholder': string;
61
+ 'Form.requiredMessage': string;
61
62
  'DatePicker.placeholder': string;
62
63
  'DatePicker.yearPlaceholder': string;
63
64
  'DatePicker.quarterPlaceholder': string;
@@ -72,7 +72,8 @@ var locale = (0, _extends2.default)((0, _extends2.default)({
72
72
  'Filter.query': '查询',
73
73
  'Filter.and': '并且',
74
74
  'Filter.settings': '设置',
75
- 'Filter.schemeNamePlaceholder': '请输入方案名称'
75
+ 'Filter.schemeNamePlaceholder': '请输入方案名称',
76
+ 'Form.requiredMessage': '请输入您的'
76
77
  });
77
78
  var _default = locale;
78
79
  exports.default = _default;
@@ -241,6 +241,11 @@ var SubMenu = function SubMenu(props) {
241
241
 
242
242
  // 保存路径
243
243
  info.keyPath = (0, _concat.default)(_context = info.keyPath).call(_context, [keyValue]);
244
+
245
+ if (triggerSubMenuAction === 'click' && mode === 'vertical') {
246
+ closeSubMenu();
247
+ }
248
+
244
249
  restProps.handleOnClick && restProps.handleOnClick(info);
245
250
  }; // 子菜单展开收缩
246
251
 
@@ -390,8 +395,7 @@ var SubMenu = function SubMenu(props) {
390
395
  return /*#__PURE__*/React.createElement("li", (0, _extends2.default)({
391
396
  ref: subMenuRef,
392
397
  className: (0, _classnames.default)(prefixCls, className, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-hover"), !disabled && isVisible), _classNames2)),
393
- key: keyValue,
394
- title: title
398
+ key: keyValue
395
399
  }, mouseEvent, {
396
400
  style: style
397
401
  }), /*#__PURE__*/React.createElement("div", {
@@ -142,7 +142,7 @@
142
142
  .kd-popconfirm.arrow::before {
143
143
  position: absolute;
144
144
  z-index: -2;
145
- background: transparent;
145
+ background: var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff));
146
146
  border-style: solid;
147
147
  border-width: var(--arrowSize);
148
148
  -webkit-transform: rotate(45deg);
@@ -167,7 +167,7 @@
167
167
  top: var(--arrowSpill);
168
168
  -webkit-box-shadow: -2px -2px calc(16px - 1px) rgba(0, 0, 0, 0.1);
169
169
  box-shadow: -2px -2px calc(16px - 1px) rgba(0, 0, 0, 0.1);
170
- border-color: var(--kd-g-color-white, #fff) transparent transparent var(--kd-g-color-white, #fff);
170
+ border-color: var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) transparent transparent var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff));
171
171
  }
172
172
  .kd-popconfirm.arrow.topLeft::before,
173
173
  .kd-popconfirm.arrow.top::before,
@@ -176,7 +176,7 @@
176
176
  bottom: var(--arrowSpill);
177
177
  -webkit-box-shadow: 3px 3px calc(16px + 1px) rgba(0, 0, 0, 0.15);
178
178
  box-shadow: 3px 3px calc(16px + 1px) rgba(0, 0, 0, 0.15);
179
- border-color: transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent;
179
+ border-color: transparent var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) transparent;
180
180
  }
181
181
  .kd-popconfirm.arrow.leftTop::before,
182
182
  .kd-popconfirm.arrow.left::before,
@@ -185,7 +185,7 @@
185
185
  right: var(--arrowSpill);
186
186
  -webkit-box-shadow: 3px 0 16px rgba(0, 0, 0, 0.12), 0 -2px 16px rgba(204, 149, 149, 0.12);
187
187
  box-shadow: 3px 0 16px rgba(0, 0, 0, 0.12), 0 -2px 16px rgba(204, 149, 149, 0.12);
188
- border-color: var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent transparent;
188
+ border-color: var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) transparent transparent;
189
189
  }
190
190
  .kd-popconfirm.arrow.rightTop::before,
191
191
  .kd-popconfirm.arrow.right::before,
@@ -194,7 +194,7 @@
194
194
  left: var(--arrowSpill);
195
195
  -webkit-box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1), -2px 0 16px rgba(0, 0, 0, 0.1);
196
196
  box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1), -2px 0 16px rgba(0, 0, 0, 0.1);
197
- border-color: transparent transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff);
197
+ border-color: transparent transparent var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-popconfirm-color-background, var(--kd-g-color-background, #fff));
198
198
  }
199
199
  .kd-popconfirm-content {
200
200
  -webkit-box-sizing: border-box;
@@ -113,13 +113,12 @@
113
113
  list-style: none;
114
114
  -webkit-font-feature-settings: 'tnum';
115
115
  font-feature-settings: 'tnum';
116
- overflow: hidden;
117
- text-overflow: ellipsis;
118
116
  position: relative;
119
117
  display: inline-block;
120
118
  padding-left: var(--kd-c-radio-square-sizing-width-height, 14px);
121
119
  margin-right: var(--kd-c-radio-spacing-margin-right, 8px);
122
120
  white-space: nowrap;
121
+ text-overflow: ellipsis;
123
122
  cursor: pointer;
124
123
  vertical-align: middle;
125
124
  color: var(--kd-c-radio-color-font, var(--kd-g-color-text-primary, #212121));
@@ -179,8 +178,8 @@
179
178
  border-color: var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3));
180
179
  }
181
180
  .kd-radio-checked:focus-within::before {
182
- -webkit-box-shadow: 0 0 0 3px rgba(var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3)), 10%);
183
- box-shadow: 0 0 0 3px rgba(var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3)), 10%);
181
+ -webkit-box-shadow: 0 0 0 3px rgba(85, 130, 243, 0.1);
182
+ box-shadow: 0 0 0 3px rgba(85, 130, 243, 0.1);
184
183
  }
185
184
  .kd-radio-checked::after {
186
185
  position: absolute;
@@ -293,8 +292,8 @@
293
292
  border-color: var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3));
294
293
  }
295
294
  .kd-radio-square-checked:focus-within {
296
- -webkit-box-shadow: 0 0 0 3px rgba(var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3)), 10%);
297
- box-shadow: 0 0 0 3px rgba(var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3)), 10%);
295
+ -webkit-box-shadow: 0 0 0 3px rgba(85, 130, 243, 0.1);
296
+ box-shadow: 0 0 0 3px rgba(85, 130, 243, 0.1);
298
297
  }
299
298
  .kd-radio-square-checked::after {
300
299
  position: absolute;
@@ -402,8 +401,8 @@
402
401
  background-color: var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3));
403
402
  }
404
403
  .kd-radio-button-checked:focus-within {
405
- -webkit-box-shadow: 0 0 0 3px rgba(var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3)), 10%);
406
- box-shadow: 0 0 0 3px rgba(var(--kd-c-radio-color-theme, var(--kd-g-color-theme, #5582f3)), 10%);
404
+ -webkit-box-shadow: 0 0 0 3px rgba(85, 130, 243, 0.1);
405
+ box-shadow: 0 0 0 3px rgba(85, 130, 243, 0.1);
407
406
  }
408
407
  .kd-radio-button-checked:hover {
409
408
  color: var(--kd-c-radio-color-background, var(--kd-g-color-white, #fff));
@@ -5,12 +5,11 @@
5
5
  @radio-square-prefix-cls: ~'@{radio-prefix-cls}-square';
6
6
  @radio-button-prefix-cls: ~'@{radio-prefix-cls}-button';
7
7
  @radio-group-prefix-cls: ~'@{radio-prefix-cls}-group';
8
- @radio-focus-shadow: 0 0 0 3px rgba(@radio-color-theme, 10%);
8
+ @radio-focus-shadow: 0 0 0 3px rgba(85, 130, 243, 10%);
9
9
 
10
10
  // 默认类型(单选项)
11
11
  .@{radio-prefix-cls} {
12
12
  .reset-component();
13
- .ellipsis();
14
13
 
15
14
  // 默认状态
16
15
  position: relative;
@@ -18,6 +17,7 @@
18
17
  padding-left: @radio-circle-size;
19
18
  margin-right: @radio-margin-right;
20
19
  white-space: nowrap;
20
+ text-overflow: ellipsis;
21
21
  cursor: pointer;
22
22
  vertical-align: middle;
23
23
  color: @radio-font-color;
@@ -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;
@@ -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 = SelectValue> extends AbstractSelectProps {
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: 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;
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: T) => void;
58
+ onDropdownVisibleChange?: (value?: T) => void;
59
59
  }
@@ -274,7 +274,7 @@
274
274
  transition: transform calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
275
275
  }
276
276
  .kd-select-icon-arrow-focus {
277
- color: #3761ca;
277
+ color: var(--kd-c-select-color-border-foucs, var(--kd-g-color-theme, #5582f3));
278
278
  }
279
279
  .kd-select-icon-clear {
280
280
  opacity: 0;
@@ -308,7 +308,7 @@
308
308
  border-color: var(--kd-c-select-color-border-foucs, var(--kd-g-color-theme, #5582f3)) !important;
309
309
  }
310
310
  .kd-select-placeholder {
311
- color: var(--kd-c-select-placeholder-color-text, var(--kd-g-color-text-third, #999));
311
+ color: var(--kd-c-select-placeholder-color-text, #b2b2b2);
312
312
  overflow: hidden;
313
313
  white-space: nowrap;
314
314
  text-overflow: ellipsis;
@@ -471,12 +471,15 @@
471
471
  border-color: var(--kd-c-select-color-border-foucs, var(--kd-g-color-theme, #5582f3)) !important;
472
472
  }
473
473
  .kd-select-single-disabled {
474
- background-color: #f5f5f5;
475
- color: #b2b2b2;
474
+ background-color: var(--kd-c-select-color-background-disabled, #f5f5f5);
475
+ color: var(--kd-c-select-color-text-disabled, #212121);
476
476
  }
477
477
  .kd-select-single-disabled:hover {
478
478
  cursor: not-allowed;
479
479
  }
480
+ .kd-select-single-disabled .kd-select-suffix {
481
+ color: var(--kd-c-select-arrow-icon-color-text-disabled, #b2b2b2);
482
+ }
480
483
  .kd-select-single:hover .kd-select-icon-clear {
481
484
  opacity: 1;
482
485
  }
@@ -487,7 +490,7 @@
487
490
  text-overflow: ellipsis;
488
491
  }
489
492
  .kd-select-single-disabled-text {
490
- color: #b2b2b2;
493
+ color: var(--kd-c-select-color-text-disabled, #212121);
491
494
  }
492
495
  .kd-select .kd-select-selection-item {
493
496
  display: -webkit-inline-box;
@@ -560,8 +563,11 @@
560
563
  }
561
564
  .kd-select-multiple-disabled {
562
565
  cursor: not-allowed;
563
- background-color: #f5f5f5;
564
- color: #b2b2b2;
566
+ background-color: var(--kd-c-select-color-background-disabled, #f5f5f5);
567
+ color: var(--kd-c-select-color-text-disabled, #212121);
568
+ }
569
+ .kd-select-multiple-disabled .kd-select-suffix {
570
+ color: var(--kd-c-select-arrow-icon-color-text-disabled, #b2b2b2);
565
571
  }
566
572
  .kd-select-multiple:hover .kd-select-icon-clear {
567
573
  opacity: 1;
@@ -40,7 +40,7 @@
40
40
  }
41
41
 
42
42
  &-focus {
43
- color: #3761ca;
43
+ color: @select-g-color-border-foucs;
44
44
  }
45
45
  }
46
46
 
@@ -220,11 +220,15 @@
220
220
  .focusColor();
221
221
  }
222
222
  &-disabled {
223
- background-color: @disabled-contain-bg;
224
- color: @disabled-color;
223
+ background-color: @select-color-background-disabled;
224
+ color: @select-color-text-disabled;
225
225
  &:hover {
226
226
  cursor: not-allowed;
227
227
  }
228
+
229
+ .@{select-prefix-cls}-suffix {
230
+ color: @select-arrow-icon-color-text-disabled;
231
+ }
228
232
  }
229
233
  &:hover .@{select-prefix-cls}-icon-clear {
230
234
  opacity: 1;
@@ -234,7 +238,7 @@
234
238
  .over();
235
239
  }
236
240
  &-disabled-text {
237
- color: @disabled-color;
241
+ color: @select-color-text-disabled;
238
242
  }
239
243
  }
240
244
 
@@ -319,8 +323,12 @@
319
323
  &-multiple {
320
324
  &-disabled {
321
325
  cursor: not-allowed;
322
- background-color: @disabled-contain-bg;
323
- color: @disabled-color;
326
+ background-color: @select-color-background-disabled;
327
+ color: @select-color-text-disabled;
328
+
329
+ .@{select-prefix-cls}-suffix {
330
+ color: @select-arrow-icon-color-text-disabled;
331
+ }
324
332
  }
325
333
  &:hover .@{select-prefix-cls}-icon-clear {
326
334
  opacity: 1;
@@ -12,11 +12,14 @@
12
12
  @select-g-color-border-foucs: var(~'@{select-custom-prefix}-color-border-foucs', @color-theme);
13
13
  @select-g-color-border-hover: var(~'@{select-custom-prefix}-color-border-hover', @color-theme);
14
14
  @select-border-g-color-border: var(~'@{select-custom-prefix}-border-color-border', @color-border-strong);
15
- @select-placeholder-color: var(~'@{select-custom-prefix}-placeholder-color-text', @color-text-third);
15
+ @select-placeholder-color: var(~'@{select-custom-prefix}-placeholder-color-text', #b2b2b2);
16
16
  @select-item-selected-color: var(~'@{select-custom-prefix}-item-color-text-selected', @color-theme);
17
17
  @select-font-color: var(~'@{select-custom-prefix}-footer-color-text', @color-text-primary);
18
18
  @select-footer-g-text-color-selected: var(~'@{select-custom-prefix}-footer-color-text-selected', #0e5fd8);
19
19
  @select-g-item-text-color-disabled: var(~'@{select-custom-prefix}-item-color-text-disabled', @color-disabled);
20
+ @select-color-background-disabled: var(~'@{select-custom-prefix}-color-background-disabled', #f5f5f5);
21
+ @select-color-text-disabled: var(~'@{select-custom-prefix}-color-text-disabled', #212121);
22
+ @select-arrow-icon-color-text-disabled: var(~'@{select-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
20
23
 
21
24
  // font
22
25
  @select-list-font-size: var(~'@{select-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
@@ -25,7 +25,7 @@
25
25
  &::before {
26
26
  position: absolute;
27
27
  z-index: -2;
28
- background: transparent;
28
+ background: @popperBg;
29
29
  border-style: solid;
30
30
  border-width: var(--arrowSize);
31
31
  transform: rotate(45deg);
@@ -51,7 +51,7 @@
51
51
  left: var(--arrowLeft);
52
52
  top: var(--arrowSpill);
53
53
  box-shadow: -2px -2px calc(@blur - 1px) rgba(0, 0, 0, 0.1);
54
- border-color: @color-white transparent transparent @color-white;
54
+ border-color: @popperBg transparent transparent @popperBg;
55
55
  }
56
56
  }
57
57
 
@@ -62,7 +62,7 @@
62
62
  left: var(--arrowLeft);
63
63
  bottom: var(--arrowSpill);
64
64
  box-shadow: 3px 3px calc(@blur + 1px) rgba(0, 0, 0, 0.15);
65
- border-color: transparent @color-white @color-white transparent;
65
+ border-color: transparent @popperBg @popperBg transparent;
66
66
  }
67
67
  }
68
68
 
@@ -73,7 +73,7 @@
73
73
  top: var(--arrowTop);
74
74
  right: var(--arrowSpill);
75
75
  box-shadow: 3px 0 @blur rgba(0, 0, 0, 0.12), 0 -2px @blur rgba(204, 149, 149, 0.12);
76
- border-color: @color-white @color-white transparent transparent;
76
+ border-color: @popperBg @popperBg transparent transparent;
77
77
  }
78
78
  }
79
79
 
@@ -84,7 +84,7 @@
84
84
  top: var(--arrowTop);
85
85
  left: var(--arrowSpill);
86
86
  box-shadow: 0 3px @blur rgba(0, 0, 0, 0.1), -2px 0 @blur rgba(0, 0, 0, 0.1);
87
- border-color: transparent transparent @color-white @color-white;
87
+ border-color: transparent transparent @popperBg @popperBg;
88
88
  }
89
89
  }
90
90
  }
package/lib/tabs/tabs.js CHANGED
@@ -178,7 +178,7 @@ var Tabs = function Tabs(props) {
178
178
  });
179
179
 
180
180
  if (index !== -1) {
181
- (_a = carouselRef.current) === null || _a === void 0 ? void 0 : _a.jumpTo(index);
181
+ (_a = carouselRef.current) === null || _a === void 0 ? void 0 : _a.jumpTo(index, true);
182
182
  }
183
183
  }, [curActiveKey, carouselRef, carouselData]);
184
184
  (0, _react.useEffect)(function () {
@@ -464,6 +464,11 @@ var Tabs = function Tabs(props) {
464
464
 
465
465
  carouselData.push(item);
466
466
  });
467
+
468
+ if (effect !== 'none') {
469
+ console.log('effect', effect);
470
+ }
471
+
467
472
  return /*#__PURE__*/_react.default.createElement(_carousel.default, {
468
473
  ref: carouselRef,
469
474
  dots: false,