@kdcloudjs/kdesign 1.4.0 → 1.5.1

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 (66) hide show
  1. package/CHANGELOG.md +41 -0
  2. package/dist/kdesign-complete.less +50 -5
  3. package/dist/kdesign.css +48 -5
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +363 -171
  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/carousel/carousel.js +4 -4
  11. package/es/config-provider/compDefaultProps.d.ts +0 -1
  12. package/es/config-provider/compDefaultProps.js +0 -1
  13. package/es/date-picker/range-picker.d.ts +1 -0
  14. package/es/date-picker/range-picker.js +2 -0
  15. package/es/date-picker/style/index.css +6 -3
  16. package/es/date-picker/style/index.less +7 -3
  17. package/es/dropdown/style/index.css +3 -0
  18. package/es/dropdown/style/index.less +4 -0
  19. package/es/dropdown/style/token.less +1 -0
  20. package/es/input/style/index.css +8 -0
  21. package/es/input/style/index.less +4 -0
  22. package/es/input/style/mixin.less +6 -1
  23. package/es/menu/menu.d.ts +1 -0
  24. package/es/menu/menu.js +11 -10
  25. package/es/radio/radio.js +6 -1
  26. package/es/table/table.js +8 -2
  27. package/es/tree/style/index.css +30 -1
  28. package/es/tree/style/index.less +25 -1
  29. package/es/tree/style/token.less +3 -0
  30. package/es/tree/tree.d.ts +2 -0
  31. package/es/tree/tree.js +77 -12
  32. package/es/tree/treeHooks.d.ts +1 -1
  33. package/es/tree/treeHooks.js +3 -3
  34. package/es/tree/treeNode.d.ts +1 -0
  35. package/es/tree/treeNode.js +11 -8
  36. package/es/tree/utils/treeUtils.d.ts +4 -2
  37. package/es/tree/utils/treeUtils.js +64 -10
  38. package/lib/carousel/carousel.js +4 -4
  39. package/lib/config-provider/compDefaultProps.d.ts +0 -1
  40. package/lib/config-provider/compDefaultProps.js +0 -1
  41. package/lib/date-picker/range-picker.d.ts +1 -0
  42. package/lib/date-picker/range-picker.js +2 -0
  43. package/lib/date-picker/style/index.css +6 -3
  44. package/lib/date-picker/style/index.less +7 -3
  45. package/lib/dropdown/style/index.css +3 -0
  46. package/lib/dropdown/style/index.less +4 -0
  47. package/lib/dropdown/style/token.less +1 -0
  48. package/lib/input/style/index.css +8 -0
  49. package/lib/input/style/index.less +4 -0
  50. package/lib/input/style/mixin.less +6 -1
  51. package/lib/menu/menu.d.ts +1 -0
  52. package/lib/menu/menu.js +11 -10
  53. package/lib/radio/radio.js +7 -1
  54. package/lib/table/table.js +8 -2
  55. package/lib/tree/style/index.css +30 -1
  56. package/lib/tree/style/index.less +25 -1
  57. package/lib/tree/style/token.less +3 -0
  58. package/lib/tree/tree.d.ts +2 -0
  59. package/lib/tree/tree.js +79 -11
  60. package/lib/tree/treeHooks.d.ts +1 -1
  61. package/lib/tree/treeHooks.js +3 -3
  62. package/lib/tree/treeNode.d.ts +1 -0
  63. package/lib/tree/treeNode.js +11 -8
  64. package/lib/tree/utils/treeUtils.d.ts +4 -2
  65. package/lib/tree/utils/treeUtils.js +71 -13
  66. package/package.json +2 -2
@@ -56,6 +56,7 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
56
56
  style = TreeNodeProps.style,
57
57
  indeterminate = TreeNodeProps.indeterminate,
58
58
  estimatedItemSize = TreeNodeProps.estimatedItemSize,
59
+ dragOver = TreeNodeProps.dragOver,
59
60
  onExpand = TreeNodeProps.onExpand,
60
61
  onCheck = TreeNodeProps.onCheck,
61
62
  onDragStart = TreeNodeProps.onDragStart,
@@ -65,7 +66,7 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
65
66
  onDragEnd = TreeNodeProps.onDragEnd,
66
67
  onDrop = TreeNodeProps.onDrop,
67
68
  onSelect = TreeNodeProps.onSelect,
68
- others = __rest(TreeNodeProps, ["nodeKey", "prefixCls", "selectable", "checkable", "className", "icon", "switcherIcon", "disabled", "draggable", "pos", "checked", "level", "getDragNode", "hasChildNode", "expand", "title", "showLine", "showIcon", "selected", "setDragNode", "style", "indeterminate", "estimatedItemSize", "onExpand", "onCheck", "onDragStart", "onDragOver", "onDragLeave", "onDragEnter", "onDragEnd", "onDrop", "onSelect"]);
69
+ others = __rest(TreeNodeProps, ["nodeKey", "prefixCls", "selectable", "checkable", "className", "icon", "switcherIcon", "disabled", "draggable", "pos", "checked", "level", "getDragNode", "hasChildNode", "expand", "title", "showLine", "showIcon", "selected", "setDragNode", "style", "indeterminate", "estimatedItemSize", "dragOver", "onExpand", "onCheck", "onDragStart", "onDragOver", "onDragLeave", "onDragEnter", "onDragEnd", "onDrop", "onSelect"]);
69
70
 
70
71
  var nodeData = React.useMemo(function () {
71
72
  return _extends({
@@ -234,7 +235,7 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
234
235
 
235
236
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
236
237
  draggable: draggable && !disabled,
237
- className: classNames((_classNames3 = {}, _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-draggabled"), true), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-root"), true), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-fb-children-pointerEvents"), forbiddenChildrenPointerEvents), _classNames3)),
238
+ className: classNames((_classNames3 = {}, _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-draggabled"), true), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-root"), true), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-fb-children-pointerEvents"), forbiddenChildrenPointerEvents), _defineProperty(_classNames3, "".concat(treeNodePrefixCls, "-drag-over"), dragOver), _classNames3)),
238
239
  onDragStart: handleDragStart,
239
240
  onDragEnd: handleDragEnd,
240
241
  onDragOver: handleDragOver,
@@ -242,7 +243,9 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
242
243
  onDragEnter: handleDragEnter,
243
244
  onDrop: handleDrop,
244
245
  ref: dragRef
245
- }, indent(), renderExpandIcon(), showIcon && renderNodeIcon(), checkable ? /*#__PURE__*/React.createElement(Checkbox, {
246
+ }, indent(), renderExpandIcon(), showIcon && renderNodeIcon(), /*#__PURE__*/React.createElement("div", {
247
+ className: "".concat(treeNodePrefixCls, "-title-wrap")
248
+ }, checkable ? /*#__PURE__*/React.createElement(Checkbox, {
246
249
  onChange: handleOnchange,
247
250
  checked: checked,
248
251
  indeterminate: !disabled && indeterminate,
@@ -251,9 +254,9 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
251
254
  className: classNames("".concat(treeNodePrefixCls, "-title"), _defineProperty({}, "".concat(treeNodePrefixCls, "-title-disabled"), disabled))
252
255
  }, title)) : /*#__PURE__*/React.createElement("span", {
253
256
  className: classNames("".concat(treeNodePrefixCls, "-title"), _defineProperty({}, "".concat(treeNodePrefixCls, "-title-disabled"), disabled))
254
- }, title), showDragLine && /*#__PURE__*/React.createElement("span", {
257
+ }, title), showDragLine && !dragOver && /*#__PURE__*/React.createElement("span", {
255
258
  className: classNames("".concat(treeNodePrefixCls, "-drag-line"))
256
- })));
259
+ }))));
257
260
  };
258
261
 
259
262
  var handleOnchange = React.useCallback(function (e) {
@@ -278,11 +281,11 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
278
281
  if (!draggable) return;
279
282
  setDragNode(nodeData);
280
283
  onDragStart && onDragStart(e, props);
281
- }, [onDragStart, nodeData, props, draggable]);
284
+ }, [draggable, setDragNode, nodeData, onDragStart, props]);
282
285
  var handleDragOver = React.useCallback(function (e) {
283
286
  if (!draggable) return;
284
287
  e.preventDefault();
285
- onDragOver && onDragOver(e, nodeData);
288
+ onDragOver && onDragOver(e, nodeData, dragRef.current);
286
289
  }, [onDragOver, nodeData, draggable]);
287
290
  var handleDragLeave = React.useCallback(function (e) {
288
291
  var _a;
@@ -300,7 +303,7 @@ var TreeNode = /*#__PURE__*/React.forwardRef(function (props, ref) {
300
303
  setForbiddenChildrenPointerEvents(true);
301
304
  if (!((_a = dragRef.current) === null || _a === void 0 ? void 0 : _a.isEqualNode(e.target))) return;
302
305
  setShowDragLine(true);
303
- onDragEnter && onDragEnter(e, nodeData);
306
+ onDragEnter && onDragEnter(e, nodeData, dragRef.current);
304
307
  }, [onDragEnter, nodeData, draggable]);
305
308
  var handleDragEnd = React.useCallback(function (e) {
306
309
  if (!draggable) return;
@@ -12,7 +12,8 @@ export declare const getExpand: (expandedKeys: string[], key: string) => boolean
12
12
  export declare const getChecked: (checkedKeys: string[], key: string) => boolean;
13
13
  export declare const getSelected: (selectedKeys: string[], key: string) => boolean;
14
14
  export declare const getHalfChecked: (halfCheckedKeys: string[], key: string) => boolean;
15
- export declare const getFilterData: (data: any[]) => any[];
15
+ export declare const getAllFilterKeys: (data: any[], filterTreeNode: FunctionConstructor) => any[];
16
+ export declare const getFilterData: (data: any[], filterTreeNode: FunctionConstructor, filterValue: string) => any[];
16
17
  export declare const getMaxLevel: (data: any[]) => number;
17
18
  /**
18
19
  *计算node的属性后返回新的 treedata
@@ -42,5 +43,6 @@ export declare const getDataCheckededStateStrictly: (checkedKeys: string[]) => {
42
43
  };
43
44
  export declare const delKey: (prevKeys: string[], delKeys: string[]) => never[] & string[];
44
45
  export declare const getAllNodeKeys: (data: any[]) => string[];
45
- export declare const getInitExpandedKeys: (data: any[], expandedKeys: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, expandScrollkeys?: string[]) => string[];
46
+ export declare const getInitExpandedKeys: (data: any[], expandedKeys: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, expandScrollkeys: string[] | undefined, filterTreeNode: FunctionConstructor, filterValue: string) => string[];
46
47
  export declare const getExpandedKeys: (expandedKeys: string[], expandScrollkeys?: string[]) => string[];
48
+ export declare const calcDropPosition: (event: React.MouseEvent, dropNode: HTMLElement) => 0 | 1 | -1;
@@ -4,10 +4,11 @@ import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable
4
4
  import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
5
5
  import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
6
6
  import _findInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find";
7
- import _startsWithInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/starts-with";
8
7
  import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
9
- import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
8
+ import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
10
9
  import _Set from "@babel/runtime-corejs3/core-js-stable/set";
10
+ import _startsWithInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/starts-with";
11
+ import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
11
12
  import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/splice";
12
13
 
13
14
  var __rest = this && this.__rest || function (s, e) {
@@ -22,6 +23,8 @@ var __rest = this && this.__rest || function (s, e) {
22
23
  }
23
24
  return t;
24
25
  };
26
+
27
+ var DRAG_OFFSET = 0.4;
25
28
  /**
26
29
  * 打平所有数组,并添加pos位置信息,
27
30
  * 方便根据expandKeys等计算节点的expand,checkedKeys计算节点checked状态
@@ -31,7 +34,6 @@ var __rest = this && this.__rest || function (s, e) {
31
34
  * @param pos
32
35
  */
33
36
 
34
-
35
37
  export var flattenAll = function flattenAll(treeData) {
36
38
  var newTreeData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
37
39
  var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
@@ -94,11 +96,37 @@ var isAllParentExpand = function isAllParentExpand(data, pos) {
94
96
  return expand;
95
97
  };
96
98
 
97
- export var getFilterData = function getFilterData(data) {
99
+ export var getAllFilterKeys = function getAllFilterKeys(data, filterTreeNode) {
100
+ var filterData = _filterInstanceProperty(data).call(data, function (item) {
101
+ return filterTreeNode === null || filterTreeNode === void 0 ? void 0 : filterTreeNode(item);
102
+ });
103
+
104
+ var filterKeys = getAllNodeKeys(filterData);
105
+ var allFilterKeys = [];
106
+
107
+ _mapInstanceProperty(filterKeys).call(filterKeys, function (key) {
108
+ var _context2;
109
+
110
+ return allFilterKeys.push.apply(allFilterKeys, _concatInstanceProperty(_context2 = _toConsumableArray(getAllParentKeys(data, key))).call(_context2, [key]));
111
+ });
112
+
113
+ return _toConsumableArray(new _Set(allFilterKeys));
114
+ };
115
+ export var getFilterData = function getFilterData(data, filterTreeNode, filterValue) {
116
+ var filterData = data;
117
+
118
+ if (typeof filterTreeNode === 'function' && filterValue) {
119
+ filterData = _filterInstanceProperty(filterData).call(filterData, function (item) {
120
+ var _context3;
121
+
122
+ return _includesInstanceProperty(_context3 = getAllFilterKeys(filterData, filterTreeNode)).call(_context3, item.key);
123
+ });
124
+ }
125
+
98
126
  var newData = [];
99
- data.forEach(function (item) {
127
+ filterData.forEach(function (item) {
100
128
  var pos = item.pos;
101
- var parentExpand = isAllParentExpand(data, pos);
129
+ var parentExpand = isAllParentExpand(filterData, pos);
102
130
 
103
131
  if (parentExpand) {
104
132
  newData.push(item);
@@ -230,11 +258,11 @@ export var getSpreadAttrData = function getSpreadAttrData(treeData, expandedKeys
230
258
  return newTreeData;
231
259
  };
232
260
  export var addKeys = function addKeys() {
233
- var _context2;
261
+ var _context4;
234
262
 
235
263
  var prevKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
236
264
  var newKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
237
- return _Array$from(new _Set(_concatInstanceProperty(_context2 = []).call(_context2, _toConsumableArray(prevKeys), _toConsumableArray(newKeys))));
265
+ return _Array$from(new _Set(_concatInstanceProperty(_context4 = []).call(_context4, _toConsumableArray(prevKeys), _toConsumableArray(newKeys))));
238
266
  };
239
267
  export var getAllParentKeys = function getAllParentKeys(data) {
240
268
  var pos = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
@@ -287,14 +315,14 @@ export var getPos = function getPos(data, key) {
287
315
  return node === null || node === void 0 ? void 0 : node.pos;
288
316
  };
289
317
  export var getInitCheckedKeys = function getInitCheckedKeys(data, keys) {
290
- var _context3;
318
+ var _context5;
291
319
 
292
320
  var checkedKeys = [];
293
321
  keys.forEach(function (item) {
294
322
  var pos = getPos(data, item);
295
323
  checkedKeys.push.apply(checkedKeys, _toConsumableArray(getAllChildKeys(data, pos)));
296
324
  });
297
- return _Array$from(new _Set(_concatInstanceProperty(_context3 = []).call(_context3, checkedKeys, _toConsumableArray(keys))));
325
+ return _Array$from(new _Set(_concatInstanceProperty(_context5 = []).call(_context5, checkedKeys, _toConsumableArray(keys))));
298
326
  };
299
327
  export var getInitCheckededState = function getInitCheckededState(data) {
300
328
  var checkedKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
@@ -468,6 +496,8 @@ var getRootKeys = function getRootKeys(data) {
468
496
 
469
497
  export var getInitExpandedKeys = function getInitExpandedKeys(data, expandedKeys, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent) {
470
498
  var expandScrollkeys = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : [];
499
+ var filterTreeNode = arguments.length > 7 ? arguments[7] : undefined;
500
+ var filterValue = arguments.length > 8 ? arguments[8] : undefined;
471
501
  var keys = (expandedKeys === null || expandedKeys === void 0 ? void 0 : _concatInstanceProperty(expandedKeys).call(expandedKeys, expandScrollkeys)) || (defaultExpandedKeys === null || defaultExpandedKeys === void 0 ? void 0 : _concatInstanceProperty(defaultExpandedKeys).call(defaultExpandedKeys, expandScrollkeys)) || [];
472
502
 
473
503
  if (defaultExpandAll) {
@@ -490,10 +520,34 @@ export var getInitExpandedKeys = function getInitExpandedKeys(data, expandedKeys
490
520
  }
491
521
  }
492
522
 
523
+ if (typeof filterTreeNode === 'function' && filterValue) {
524
+ var _context6;
525
+
526
+ keys = _concatInstanceProperty(_context6 = []).call(_context6, _toConsumableArray(keys), _toConsumableArray(getAllFilterKeys(data, filterTreeNode)));
527
+ }
528
+
493
529
  return _Array$from(new _Set(_toConsumableArray(keys)));
494
530
  };
495
531
  export var getExpandedKeys = function getExpandedKeys(expandedKeys) {
496
532
  var expandScrollkeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
497
533
  var keys = (expandedKeys === null || expandedKeys === void 0 ? void 0 : _concatInstanceProperty(expandedKeys).call(expandedKeys, expandScrollkeys)) || [];
498
534
  return _Array$from(new _Set(_toConsumableArray(keys)));
535
+ };
536
+ export var calcDropPosition = function calcDropPosition(event, dropNode) {
537
+ var clientY = event.clientY;
538
+
539
+ var _dropNode$getBounding = dropNode.getBoundingClientRect(),
540
+ top = _dropNode$getBounding.top,
541
+ bottom = _dropNode$getBounding.bottom,
542
+ height = _dropNode$getBounding.height;
543
+
544
+ if (clientY <= top + height * DRAG_OFFSET) {
545
+ return -1;
546
+ }
547
+
548
+ if (clientY >= bottom - height * DRAG_OFFSET) {
549
+ return 1;
550
+ }
551
+
552
+ return 0;
499
553
  };
@@ -136,7 +136,7 @@ var InternalCarousel = function InternalCarousel(props, ref) {
136
136
  setCurrentIndex(index);
137
137
  setNeedAnimation(needAnimation);
138
138
  }
139
- }, [isFadeEffect, beforeChange, currentIndex, children.length]);
139
+ }, [isFadeEffect, beforeChange, currentIndex, children === null || children === void 0 ? void 0 : children.length]);
140
140
 
141
141
  var next = _react.default.useCallback(function () {
142
142
  jumpTo(currentIndex + 1, true);
@@ -234,7 +234,7 @@ var InternalCarousel = function InternalCarousel(props, ref) {
234
234
  }, [beforeChange, currentIndex]);
235
235
 
236
236
  var handleTransitionEnd = _react.default.useCallback(function () {
237
- if (!autoplay) return;
237
+ if (!autoplay || !(children === null || children === void 0 ? void 0 : children.length)) return;
238
238
  var childrenL = children.length;
239
239
  var newCurrentIndex = currentIndex;
240
240
 
@@ -251,7 +251,7 @@ var InternalCarousel = function InternalCarousel(props, ref) {
251
251
  afterChange && afterChange(currentIndex);
252
252
  setCurrentIndex(newCurrentIndex);
253
253
  isScrollxEffect && setNeedAnimation(false);
254
- }, [currentIndex, children.length, afterChange, isScrollxEffect, autoplay]);
254
+ }, [currentIndex, children === null || children === void 0 ? void 0 : children.length, afterChange, isScrollxEffect, autoplay]);
255
255
 
256
256
  var handleMouseEnter = _react.default.useCallback(function () {
257
257
  autoplayRef.current && clearTimeout(autoplayRef.current);
@@ -302,7 +302,7 @@ var InternalCarousel = function InternalCarousel(props, ref) {
302
302
  style: style,
303
303
  onMouseEnter: handleMouseEnter,
304
304
  onMouseLeave: handleMouseLeave
305
- }, renderDisplayList(), showDot() && /*#__PURE__*/_react.default.createElement(_slidebar.Slidebar, {
305
+ }, (children === null || children === void 0 ? void 0 : children.length) && renderDisplayList(), (children === null || children === void 0 ? void 0 : children.length) && showDot() && /*#__PURE__*/_react.default.createElement(_slidebar.Slidebar, {
306
306
  number: children.length,
307
307
  currentIndex: currentIndex,
308
308
  dotsClassName: dots,
@@ -210,7 +210,6 @@ declare const compDefaultProps: {
210
210
  strokeWidth: number;
211
211
  };
212
212
  Radio: {
213
- checked: boolean;
214
213
  defaultChecked: boolean;
215
214
  disabled: boolean;
216
215
  };
@@ -235,7 +235,6 @@ var compDefaultProps = {
235
235
  strokeWidth: 4
236
236
  },
237
237
  Radio: {
238
- checked: false,
239
238
  defaultChecked: false,
240
239
  disabled: false
241
240
  },
@@ -17,6 +17,7 @@ export interface RangePickerSharedProps {
17
17
  ranges?: Record<string, DateType[] | (() => DateType[])>;
18
18
  separator?: React.ReactNode;
19
19
  allowEmpty?: [boolean, boolean];
20
+ suffixIcon?: React.ReactNode;
20
21
  mode?: [PanelMode, PanelMode];
21
22
  onChange?: (values: RangeValue, formatString: [string | null, string | null]) => void;
22
23
  onCalendarChange?: (values: RangeValue, formatString: [string | null, string | null], info: RangeInfo) => void;
@@ -150,6 +150,7 @@ function DatePicker(props) {
150
150
  minuteStep = _datePickerProps$minu === void 0 ? 1 : _datePickerProps$minu,
151
151
  _datePickerProps$seco = datePickerProps.secondStep,
152
152
  secondStep = _datePickerProps$seco === void 0 ? 1 : _datePickerProps$seco,
153
+ suffixIcon = datePickerProps.suffixIcon,
153
154
  renderExtraFooter = datePickerProps.renderExtraFooter,
154
155
  disabledHours = datePickerProps.disabledHours,
155
156
  disabledMinutes = datePickerProps.disabledMinutes,
@@ -732,6 +733,7 @@ function DatePicker(props) {
732
733
  startOpen: startOpen,
733
734
  endOpen: endOpen,
734
735
  needConfirmButton: needConfirmButton,
736
+ suffixIcon: suffixIcon,
735
737
  format: _format,
736
738
  open: mergedOpen,
737
739
  readOnly: inputReadOnly,
@@ -128,7 +128,7 @@
128
128
  right: calc(var(--kd-c-date-picker-small-font-size, var(--kd-g-font-size-small, 12px)) + 1px);
129
129
  }
130
130
  .kd-date-picker-small.kd-date-picker-range .kd-date-picker-clear {
131
- right: calc(var(--kd-c-date-picker-small-font-size, var(--kd-g-font-size-small, 12px)) + 9px);
131
+ right: calc(var(--kd-c-date-picker-small-font-size, var(--kd-g-font-size-small, 12px)) + 12px);
132
132
  }
133
133
  .kd-date-picker-large {
134
134
  height: var(--kd-c-date-picker-large-sizing-height, 36px);
@@ -158,7 +158,7 @@
158
158
  right: calc(var(--kd-c-date-picker-middle-font-size, var(--kd-g-font-size-middle, 14px)) + 1px);
159
159
  }
160
160
  .kd-date-picker-middle.kd-date-picker-range .kd-date-picker-clear {
161
- right: calc(var(--kd-c-date-picker-middle-font-size, var(--kd-g-font-size-middle, 14px)) + 9px);
161
+ right: calc(var(--kd-c-date-picker-middle-font-size, var(--kd-g-font-size-middle, 14px)) + 11px);
162
162
  }
163
163
  .kd-date-picker-borderless {
164
164
  border: 0;
@@ -276,7 +276,7 @@
276
276
  -ms-flex-item-align: center;
277
277
  align-self: center;
278
278
  margin-left: var(--kd-c-date-picker-suffix-spacing-margin-left, 10px);
279
- color: var(--kd-c-date-picker-icon-color, var(--kd-g-color-disabled, #b2b2b2));
279
+ color: var(--kd-c-date-picker-input-color, var(--kd-g-color-text-secondary, #666));
280
280
  line-height: 1;
281
281
  pointer-events: none;
282
282
  }
@@ -286,6 +286,9 @@
286
286
  .kd-date-picker:hover .kd-date-picker-clear {
287
287
  opacity: 1;
288
288
  }
289
+ .kd-date-picker:hover .kd-date-picker-suffix {
290
+ color: var(--kd-c-date-picker-color-background-checked, var(--kd-g-color-theme, #5582f3));
291
+ }
289
292
  .kd-date-picker-clear {
290
293
  position: absolute;
291
294
  top: 50%;
@@ -27,7 +27,7 @@
27
27
  }
28
28
 
29
29
  &.@{datePicker-prefix-cls}-range .@{datePicker-prefix-cls}-clear {
30
- right: calc(@date-small-font-size + 9px);
30
+ right: calc(@date-small-font-size + 12px);
31
31
  }
32
32
  }
33
33
 
@@ -59,7 +59,7 @@
59
59
  }
60
60
 
61
61
  &.@{datePicker-prefix-cls}-range .@{datePicker-prefix-cls}-clear {
62
- right: calc(@date-middle-font-size + 9px);
62
+ right: calc(@date-middle-font-size + 11px);
63
63
  }
64
64
  }
65
65
 
@@ -131,7 +131,7 @@
131
131
  &-suffix {
132
132
  align-self: center;
133
133
  margin-left: @date-suffix-spacing-margin-left;
134
- color: @date-icon-color;
134
+ color: @date-input-color;
135
135
  line-height: 1;
136
136
  pointer-events: none;
137
137
 
@@ -144,6 +144,10 @@
144
144
  .@{datePicker-prefix-cls}-clear {
145
145
  opacity: 1;
146
146
  }
147
+
148
+ .@{datePicker-prefix-cls}-suffix {
149
+ color: @date-color-background-checked;
150
+ }
147
151
  }
148
152
 
149
153
  &-clear {
@@ -229,6 +229,9 @@
229
229
  .kd-dropdown-menu-item:not(.disabled):hover {
230
230
  background-color: var(--kd-c-dropdown-item-color-background-hover, var(--kd-g-color-hover, #f5f5f5));
231
231
  }
232
+ .kd-dropdown-menu-item:not(.disabled):hover > a {
233
+ color: var(--kd-c-dropdown-item-color-text-hover, var(--kd-g-color-text-primary, #212121));
234
+ }
232
235
  .kd-dropdown-menu-item:not(.disabled):active,
233
236
  .kd-dropdown-menu-item:not(.disabled).selected {
234
237
  color: var(--kd-g-color-theme, #5582f3);
@@ -72,6 +72,10 @@
72
72
  transition: background-color @duration-promptly;
73
73
  &:not(.disabled):hover {
74
74
  background-color: @dropdown-item-hover-bg-color;
75
+
76
+ > a {
77
+ color: @dropdown-item-hover-color-text;
78
+ }
75
79
  }
76
80
 
77
81
  &:not(.disabled):active,
@@ -8,6 +8,7 @@
8
8
  @dropdown-item-color-disabled: var(~'@{dropdown-custom-prefix}-item-color-text-disabled', @color-disabled);
9
9
  @dropdown-item-color-text-danger: var(~'@{dropdown-custom-prefix}-item-color-text-danger', @color-error);
10
10
  @dropdown-item-color-background-danger-hover: var(~'@{dropdown-custom-prefix}-item-color-background-danger-hover', @color-error);
11
+ @dropdown-item-hover-color-text: var(~'@{dropdown-custom-prefix}-item-color-text-hover', @color-text-primary);
11
12
  @dropdown-divided-color-bg: var(~'@{dropdown-custom-prefix}-divided-color-background', @color-border-weak);
12
13
  @dropdown-color: var(~'@{dropdown-custom-prefix}-menu-item-color-text', @color-text-primary);
13
14
 
@@ -356,6 +356,10 @@ textarea {
356
356
  .kd-input-wrapper-focused {
357
357
  border-color: var(--kd-c-input-color-border-focused, var(--kd-g-color-theme, #5582f3));
358
358
  }
359
+ .kd-input-wrapper-focused .kd-input-clear-icon,
360
+ .kd-input-wrapper-focused .kd-input-textarea-clear-icon {
361
+ color: var(--kd-c-input-color-border-focused, var(--kd-g-color-theme, #5582f3));
362
+ }
359
363
  .kd-input-wrapper-textarea {
360
364
  width: 100%;
361
365
  min-width: 0;
@@ -404,6 +408,10 @@ textarea {
404
408
  .kd-input-clear-icon,
405
409
  .kd-input-textarea-clear-icon {
406
410
  cursor: pointer;
411
+ color: var(--kd-c-input-color-border, #999);
412
+ }
413
+ .kd-input-clear-icon:hover,
414
+ .kd-input-textarea-clear-icon:hover {
407
415
  color: var(--kd-c-input-color-border-focused, var(--kd-g-color-theme, #5582f3));
408
416
  }
409
417
  .kd-input-clear-icon i,
@@ -121,6 +121,10 @@ textarea {
121
121
 
122
122
  &-focused {
123
123
  border-color: @input-border-color-focused;
124
+
125
+ .@{input-prefix-cls}-clear-icon, .@{input-prefix-cls}-textarea-clear-icon {
126
+ color: @input-border-color-focused;
127
+ }
124
128
  }
125
129
  }
126
130
  &-wrapper-textarea {
@@ -47,7 +47,12 @@
47
47
 
48
48
  .input-clear-icon() {
49
49
  cursor: pointer;
50
- color: @input-border-color-focused;
50
+ color: @input-color-border;
51
+
52
+ &:hover {
53
+ color: @input-border-color-focused;
54
+ }
55
+
51
56
  i {
52
57
  vertical-align: middle;
53
58
  font-size: 12px !important;
@@ -15,6 +15,7 @@ export interface MenuProps extends React.HTMLAttributes<HTMLElement> {
15
15
  additionalTools?: React.ReactNode;
16
16
  onOpenChange?: SubMenuChangeEventHandler;
17
17
  theme?: MenuTheme;
18
+ accordion?: boolean;
18
19
  }
19
20
  interface MenuType extends React.FC<MenuProps> {
20
21
  Item: typeof MenuItem;
package/lib/menu/menu.js CHANGED
@@ -93,10 +93,12 @@ var Menu = function Menu(props) {
93
93
  className = _b.className,
94
94
  theme = _b.theme,
95
95
  collapsed = _b.collapsed,
96
- restProps = __rest(_b, ["prefixCls", "mode", "inlineIndent", "forceSubMenuRender", "additionalTools", "onClick", "onOpenChange", "children", "className", "theme", "collapsed"]);
96
+ accordion = _b.accordion,
97
+ restProps = __rest(_b, ["prefixCls", "mode", "inlineIndent", "forceSubMenuRender", "additionalTools", "onClick", "onOpenChange", "children", "className", "theme", "collapsed", "accordion"]);
97
98
 
98
99
  var prefixCls = getPrefixCls(pkgPrefixCls, 'menu', customPrefixcls);
99
100
  (0, _devwarning.default)(['inline', 'vertical', undefined].indexOf(mode) === -1, 'menu', "cannot found menu mode '".concat(mode, "'"));
101
+ (0, _devwarning.default)(mode !== 'inline' && accordion !== undefined, 'menu', "'accordion' is valid only in mode='inline'");
100
102
 
101
103
  var _React$useState = _react.default.useState(''),
102
104
  _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
@@ -131,17 +133,12 @@ var Menu = function Menu(props) {
131
133
  (0, _react.useEffect)(function () {
132
134
  if (userOpenKeys !== undefined && Array.isArray(userOpenKeys)) {
133
135
  setOpenKeys(userOpenKeys);
134
- }
135
- }, [userOpenKeys]);
136
- (0, _react.useEffect)(function () {
137
- if (userSelectedKey !== undefined && userOpenKeys !== undefined && Array.isArray(userOpenKeys)) {
138
- setTimeout(function () {
139
- userOpenKeys.forEach(function (d) {
140
- openSubMenuSet.add(d);
141
- });
136
+ openSubMenuSet.clear();
137
+ userOpenKeys.forEach(function (d) {
138
+ openSubMenuSet.add(d);
142
139
  });
143
140
  }
144
- }, []);
141
+ }, [userOpenKeys]);
145
142
 
146
143
  var handleOnClick = function handleOnClick(info) {
147
144
  if (userSelectedKey === undefined) {
@@ -175,6 +172,10 @@ var Menu = function Menu(props) {
175
172
  if (clean) {
176
173
  openSubMenuSet.clear();
177
174
  } else {
175
+ if (mode === 'inline' && accordion) {
176
+ openSubMenuSet.clear();
177
+ }
178
+
178
179
  if (isAdd) {
179
180
  openSubMenuSet.add(openKey);
180
181
  } else {
@@ -25,6 +25,8 @@ var _react = _interopRequireWildcard(require("react"));
25
25
 
26
26
  var _classnames = _interopRequireDefault(require("classnames"));
27
27
 
28
+ var _isBoolean = _interopRequireDefault(require("lodash/isBoolean"));
29
+
28
30
  var _ConfigContext = _interopRequireDefault(require("../config-provider/ConfigContext"));
29
31
 
30
32
  var _utils = require("../_utils");
@@ -73,13 +75,17 @@ var InternalRadio = function InternalRadio(props, ref) {
73
75
  restProps = __rest(_a, ["style", "checked", "children", "className", "radioType", "defaultChecked", "prefixCls"]); // 属性需要合并一遍用户定义的默认属性
74
76
 
75
77
 
78
+ var getChecked = function getChecked() {
79
+ return (0, _isBoolean.default)(checked) ? checked : defaultChecked;
80
+ };
81
+
76
82
  var getPrefix = function getPrefix(radioType) {
77
83
  return "radio".concat(radioType === 'square' ? "-".concat(radioType) : '');
78
84
  };
79
85
 
80
86
  var radioPrefixCls = getPrefixCls === null || getPrefixCls === void 0 ? void 0 : getPrefixCls(prefixCls, getPrefix(radioType), customPrefixcls); // 样式前缀
81
87
 
82
- var _React$useState = _react.default.useState(checked || defaultChecked),
88
+ var _React$useState = _react.default.useState(getChecked()),
83
89
  _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
84
90
  isChecked = _React$useState2[0],
85
91
  setIsChecked = _React$useState2[1];
@@ -87,7 +87,10 @@ function Table(props) {
87
87
  getTableProps = props.getTableProps,
88
88
  contextMenu = props.contextMenu,
89
89
  rangeSelection = props.rangeSelection,
90
- cssVariables = props.cssVariables;
90
+ cssVariables = props.cssVariables,
91
+ stickyScrollHeight = props.stickyScrollHeight,
92
+ scrollbarWidth = props.scrollbarWidth,
93
+ scrollLoad = props.scrollLoad;
91
94
 
92
95
  var _useContext = (0, _react.useContext)(_ConfigContext.default),
93
96
  getPrefixCls = _useContext.getPrefixCls,
@@ -166,7 +169,10 @@ function Table(props) {
166
169
  hasHeader: hasHeader,
167
170
  useOuterBorder: useOuterBorder,
168
171
  defaultColumnWidth: defaultColumnWidth,
169
- cssVariables: cssVariables
172
+ cssVariables: cssVariables,
173
+ stickyScrollHeight: stickyScrollHeight,
174
+ scrollbarWidth: scrollbarWidth,
175
+ scrollLoad: scrollLoad
170
176
  }));
171
177
  }
172
178
 
@@ -221,6 +221,19 @@
221
221
  .kd-tree-node-title-disabled {
222
222
  color: var(--kd-c-tree-node-color-disabled, var(--kd-g-color-disabled, #b2b2b2));
223
223
  }
224
+ .kd-tree-node-title-wrap {
225
+ -webkit-box-flex: 1;
226
+ -ms-flex: 1;
227
+ flex: 1;
228
+ position: relative;
229
+ display: -webkit-box;
230
+ display: -ms-flexbox;
231
+ display: flex;
232
+ -webkit-box-align: center;
233
+ -ms-flex-align: center;
234
+ align-items: center;
235
+ height: 100%;
236
+ }
224
237
  .kd-tree-node-title {
225
238
  white-space: nowrap;
226
239
  margin-left: 6px;
@@ -248,12 +261,28 @@
248
261
  width: 100%;
249
262
  height: 100%;
250
263
  }
264
+ .kd-tree-node-drag-over {
265
+ background-color: var(--kd-c-tree-node-drag-over-color-background, #E3EBFF);
266
+ border: 2px solid var(--kd-c-tree-node-drag-over-color-border, #5582f3);
267
+ }
251
268
  .kd-tree-node-drag-line {
252
269
  position: absolute;
253
270
  left: 0;
254
271
  top: 100%;
255
272
  width: 100%;
256
- border-top: 1px solid #fc8555;
273
+ border-top: 2px solid var(--kd-c-tree-node-drag-line-color-background, #276FF5);
274
+ }
275
+ .kd-tree-node-drag-line::before {
276
+ content: '';
277
+ width: 4px;
278
+ height: 4px;
279
+ background-color: #fff;
280
+ border-radius: 50%;
281
+ border: 2px solid var(--kd-c-tree-node-drag-line-color-background, #276FF5);
282
+ position: absolute;
283
+ top: -1px;
284
+ -webkit-transform: translateY(-50%);
285
+ transform: translateY(-50%);
257
286
  }
258
287
  .kd-tree-node-leaf-icon {
259
288
  height: var(--kd-c-tree-node-icon-sizing-height, 20px);