@kdcloudjs/kdesign 1.2.2 → 1.2.3

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 (58) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/kdesign-complete.less +29 -18
  3. package/dist/kdesign.css +36 -32
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +74 -56
  6. package/dist/kdesign.js.map +1 -1
  7. package/dist/kdesign.min.css +3 -3
  8. package/dist/kdesign.min.js +2 -2
  9. package/dist/kdesign.min.js.map +1 -1
  10. package/es/button/style/index.css +3 -3
  11. package/es/button/style/token.less +3 -3
  12. package/es/carousel/style/index.css +1 -3
  13. package/es/carousel/style/index.less +1 -1
  14. package/es/config-provider/compDefaultProps.d.ts +1 -0
  15. package/es/config-provider/compDefaultProps.js +2 -1
  16. package/es/dropdown/style/index.css +5 -5
  17. package/es/form/Field.js +9 -4
  18. package/es/form/Form.js +7 -2
  19. package/es/form/hooks/useForm.js +1 -0
  20. package/es/form/interface.d.ts +5 -0
  21. package/es/input-number/inputNumber.d.ts +1 -0
  22. package/es/input-number/inputNumber.js +3 -2
  23. package/es/locale/locale.d.ts +1 -0
  24. package/es/locale/zh-CN.d.ts +1 -0
  25. package/es/locale/zh-CN.js +2 -1
  26. package/es/menu/subMenu.js +6 -2
  27. package/es/popconfirm/style/index.css +5 -5
  28. package/es/select/style/index.css +13 -7
  29. package/es/select/style/index.less +14 -6
  30. package/es/select/style/token.less +4 -1
  31. package/es/style/mixins/index.less +5 -5
  32. package/es/tooltip/style/index.css +8 -8
  33. package/es/tooltip/style/index.less +2 -2
  34. package/lib/button/style/index.css +3 -3
  35. package/lib/button/style/token.less +3 -3
  36. package/lib/carousel/style/index.css +1 -3
  37. package/lib/carousel/style/index.less +1 -1
  38. package/lib/config-provider/compDefaultProps.d.ts +1 -0
  39. package/lib/config-provider/compDefaultProps.js +2 -1
  40. package/lib/dropdown/style/index.css +5 -5
  41. package/lib/form/Field.js +10 -4
  42. package/lib/form/Form.js +7 -2
  43. package/lib/form/hooks/useForm.js +1 -0
  44. package/lib/form/interface.d.ts +5 -0
  45. package/lib/input-number/inputNumber.d.ts +1 -0
  46. package/lib/input-number/inputNumber.js +3 -2
  47. package/lib/locale/locale.d.ts +1 -0
  48. package/lib/locale/zh-CN.d.ts +1 -0
  49. package/lib/locale/zh-CN.js +2 -1
  50. package/lib/menu/subMenu.js +6 -2
  51. package/lib/popconfirm/style/index.css +5 -5
  52. package/lib/select/style/index.css +13 -7
  53. package/lib/select/style/index.less +14 -6
  54. package/lib/select/style/token.less +4 -1
  55. package/lib/style/mixins/index.less +5 -5
  56. package/lib/tooltip/style/index.css +8 -8
  57. package/lib/tooltip/style/index.less +2 -2
  58. package/package.json +1 -1
@@ -53,7 +53,7 @@
53
53
  list-style: none;
54
54
  display: flex;
55
55
  flex-direction: row;
56
- flex: 1;
56
+ width: 100%;
57
57
  position: relative;
58
58
  &-item {
59
59
  display: block;
@@ -383,6 +383,7 @@ declare const compDefaultProps: {
383
383
  minMark: string;
384
384
  maxMark: string;
385
385
  mustInScope: boolean;
386
+ zeroShow: boolean;
386
387
  };
387
388
  BaseData: {
388
389
  mode: string;
@@ -415,7 +415,8 @@ var compDefaultProps = {
415
415
  borderType: 'bordered',
416
416
  minMark: '[',
417
417
  maxMark: ']',
418
- mustInScope: false
418
+ mustInScope: false,
419
+ zeroShow: true
419
420
  },
420
421
  BaseData: {
421
422
  mode: 'single',
@@ -151,7 +151,7 @@
151
151
  .kd-dropdown.arrow::before {
152
152
  position: absolute;
153
153
  z-index: -2;
154
- background: transparent;
154
+ background: var(--kd-g-color-background, #fff);
155
155
  border-style: solid;
156
156
  border-width: var(--arrowSize);
157
157
  -webkit-transform: rotate(45deg);
@@ -176,7 +176,7 @@
176
176
  top: var(--arrowSpill);
177
177
  -webkit-box-shadow: -2px -2px calc(10px - 1px) rgba(0, 0, 0, 0.1);
178
178
  box-shadow: -2px -2px calc(10px - 1px) rgba(0, 0, 0, 0.1);
179
- border-color: var(--kd-g-color-white, #fff) transparent transparent var(--kd-g-color-white, #fff);
179
+ border-color: var(--kd-g-color-background, #fff) transparent transparent var(--kd-g-color-background, #fff);
180
180
  }
181
181
  .kd-dropdown.arrow.topLeft::before,
182
182
  .kd-dropdown.arrow.top::before,
@@ -185,7 +185,7 @@
185
185
  bottom: var(--arrowSpill);
186
186
  -webkit-box-shadow: 3px 3px calc(10px + 1px) rgba(0, 0, 0, 0.15);
187
187
  box-shadow: 3px 3px calc(10px + 1px) rgba(0, 0, 0, 0.15);
188
- border-color: transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent;
188
+ border-color: transparent var(--kd-g-color-background, #fff) var(--kd-g-color-background, #fff) transparent;
189
189
  }
190
190
  .kd-dropdown.arrow.leftTop::before,
191
191
  .kd-dropdown.arrow.left::before,
@@ -194,7 +194,7 @@
194
194
  right: var(--arrowSpill);
195
195
  -webkit-box-shadow: 3px 0 10px rgba(0, 0, 0, 0.12), 0 -2px 10px rgba(204, 149, 149, 0.12);
196
196
  box-shadow: 3px 0 10px rgba(0, 0, 0, 0.12), 0 -2px 10px rgba(204, 149, 149, 0.12);
197
- border-color: var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent transparent;
197
+ border-color: var(--kd-g-color-background, #fff) var(--kd-g-color-background, #fff) transparent transparent;
198
198
  }
199
199
  .kd-dropdown.arrow.rightTop::before,
200
200
  .kd-dropdown.arrow.right::before,
@@ -203,7 +203,7 @@
203
203
  left: var(--arrowSpill);
204
204
  -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), -2px 0 10px rgba(0, 0, 0, 0.1);
205
205
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), -2px 0 10px rgba(0, 0, 0, 0.1);
206
- border-color: transparent transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff);
206
+ border-color: transparent transparent var(--kd-g-color-background, #fff) var(--kd-g-color-background, #fff);
207
207
  }
208
208
  .kd-dropdown-menu {
209
209
  max-height: var(--kd-c-dropdown-menu-sizing-max-height, 336px);
package/lib/form/Field.js CHANGED
@@ -23,6 +23,8 @@ 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
 
28
30
  var _react = _interopRequireWildcard(require("react"));
@@ -85,7 +87,7 @@ var generateEventHandler = function generateEventHandler(handler, validateTrigge
85
87
  };
86
88
 
87
89
  var Field = function Field(props) {
88
- var _classnames, _context;
90
+ var _classnames, _context2;
89
91
 
90
92
  (0, _devwarning.default)(! /*#__PURE__*/_react.default.isValidElement(props.children), 'Form.Item', 'Children of Form.Item is not a valid element');
91
93
  (0, _devwarning.default)(!props.name, 'Form.Item', 'Form.Item must have a name');
@@ -107,7 +109,8 @@ var Field = function Field(props) {
107
109
  getFieldError = fieldContext.getFieldError,
108
110
  getInternalHooks = fieldContext.getInternalHooks,
109
111
  vertical = fieldContext.vertical,
110
- getDefaultValue = fieldContext.getDefaultValue;
112
+ getDefaultValue = fieldContext.getDefaultValue,
113
+ local = fieldContext.local;
111
114
 
112
115
  var _getInternalHooks = getInternalHooks(_useForm.INTERNAL_HOOK_KEY),
113
116
  registerField = _getInternalHooks.registerField,
@@ -162,8 +165,11 @@ var Field = function Field(props) {
162
165
  if (Array.isArray(rules) && !rules.some(function (rule) {
163
166
  return Object.prototype.hasOwnProperty.call(rule, 'required');
164
167
  }) && required) {
168
+ var _context;
169
+
165
170
  rules.push({
166
- required: true
171
+ required: true,
172
+ message: (0, _concat.default)(_context = "".concat(local && local.requiredMessage)).call(_context, label)
167
173
  });
168
174
  }
169
175
 
@@ -282,7 +288,7 @@ var Field = function Field(props) {
282
288
  }), /*#__PURE__*/_react.default.createElement(_FieldWrapper.default, {
283
289
  width: wrapperWidth,
284
290
  validateMessage: validateMessage
285
- }, (0, _map.default)(_context = (0, _reactChildren.toArray)(children)).call(_context, function (child, index) {
291
+ }, (0, _map.default)(_context2 = (0, _reactChildren.toArray)(children)).call(_context2, function (child, index) {
286
292
  var keys = mergeProps((0, _extends3.default)((0, _extends3.default)({
287
293
  disabled: disabled,
288
294
  value: value
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;
@@ -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
  }
@@ -118,10 +118,10 @@
118
118
  color: var(--kd-c-tooltip-color-text, var(--kd-g-color-text-primary, #212121));
119
119
  border-radius: var(--kd-c-tooltip-radius-border, var(--kd-g-radius-border, 2px));
120
120
  font-size: var(--kd-c-tooltip-color-text, var(--kd-g-font-size-small, 12px));
121
- line-height: 18px;
121
+ line-height: 1.5;
122
122
  background-color: var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff));
123
- -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
124
- box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
123
+ -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
124
+ box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
125
125
  opacity: 1;
126
126
  z-index: var(--kd-g-z-index-popper, 1050);
127
127
  visibility: visible;
@@ -133,7 +133,7 @@
133
133
  .kd-tooltip.arrow::before {
134
134
  position: absolute;
135
135
  z-index: -2;
136
- background: transparent;
136
+ background: var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff));
137
137
  border-style: solid;
138
138
  border-width: var(--arrowSize);
139
139
  -webkit-transform: rotate(45deg);
@@ -158,7 +158,7 @@
158
158
  top: var(--arrowSpill);
159
159
  -webkit-box-shadow: -2px -2px calc(6px - 1px) rgba(0, 0, 0, 0.1);
160
160
  box-shadow: -2px -2px calc(6px - 1px) rgba(0, 0, 0, 0.1);
161
- border-color: var(--kd-g-color-white, #fff) transparent transparent var(--kd-g-color-white, #fff);
161
+ border-color: var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff)) transparent transparent var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff));
162
162
  }
163
163
  .kd-tooltip.arrow.topLeft::before,
164
164
  .kd-tooltip.arrow.top::before,
@@ -167,7 +167,7 @@
167
167
  bottom: var(--arrowSpill);
168
168
  -webkit-box-shadow: 3px 3px calc(6px + 1px) rgba(0, 0, 0, 0.15);
169
169
  box-shadow: 3px 3px calc(6px + 1px) rgba(0, 0, 0, 0.15);
170
- border-color: transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent;
170
+ border-color: transparent var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff)) transparent;
171
171
  }
172
172
  .kd-tooltip.arrow.leftTop::before,
173
173
  .kd-tooltip.arrow.left::before,
@@ -176,7 +176,7 @@
176
176
  right: var(--arrowSpill);
177
177
  -webkit-box-shadow: 3px 0 6px rgba(0, 0, 0, 0.12), 0 -2px 6px rgba(204, 149, 149, 0.12);
178
178
  box-shadow: 3px 0 6px rgba(0, 0, 0, 0.12), 0 -2px 6px rgba(204, 149, 149, 0.12);
179
- border-color: var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff) transparent transparent;
179
+ border-color: var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff)) transparent transparent;
180
180
  }
181
181
  .kd-tooltip.arrow.rightTop::before,
182
182
  .kd-tooltip.arrow.right::before,
@@ -185,5 +185,5 @@
185
185
  left: var(--arrowSpill);
186
186
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), -2px 0 6px rgba(0, 0, 0, 0.1);
187
187
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), -2px 0 6px rgba(0, 0, 0, 0.1);
188
- border-color: transparent transparent var(--kd-g-color-white, #fff) var(--kd-g-color-white, #fff);
188
+ border-color: transparent transparent var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff)) var(--kd-c-tooltip-color-background, var(--kd-g-color-background, #fff));
189
189
  }
@@ -11,9 +11,9 @@
11
11
  color: @tooltip-color;
12
12
  border-radius: @tooltip-border-radius;
13
13
  font-size: @tooltip-font-size;
14
- line-height: 18px;
14
+ line-height: 1.5;
15
15
  background-color: @tooltip-background-color;
16
- box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
16
+ box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
17
17
  opacity: 1;
18
18
  z-index: @z-index-popper;
19
19
  visibility: visible;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/kdesign",
3
- "version": "1.2.2",
3
+ "version": "1.2.3",
4
4
  "description": "KDesign 金蝶前端react 组件库",
5
5
  "title": "kdesign",
6
6
  "keywords": [