@kdcloudjs/kdesign 1.4.1 → 1.5.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.
- package/dist/kdesign-complete.less +50 -5
- package/dist/kdesign.css +48 -5
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +275 -134
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +3 -3
- package/dist/kdesign.min.js +8 -8
- package/dist/kdesign.min.js.map +1 -1
- package/es/carousel/carousel.js +4 -4
- package/es/config-provider/compDefaultProps.d.ts +0 -1
- package/es/config-provider/compDefaultProps.js +0 -1
- package/es/date-picker/range-picker.d.ts +1 -0
- package/es/date-picker/range-picker.js +2 -0
- package/es/date-picker/style/index.css +6 -3
- package/es/date-picker/style/index.less +7 -3
- package/es/dropdown/style/index.css +3 -0
- package/es/dropdown/style/index.less +4 -0
- package/es/dropdown/style/token.less +1 -0
- package/es/input/style/index.css +8 -0
- package/es/input/style/index.less +4 -0
- package/es/input/style/mixin.less +6 -1
- package/es/menu/menu.d.ts +1 -0
- package/es/menu/menu.js +7 -1
- package/es/radio/radio.js +6 -1
- package/es/tree/style/index.css +30 -1
- package/es/tree/style/index.less +25 -1
- package/es/tree/style/token.less +3 -0
- package/es/tree/tree.d.ts +2 -0
- package/es/tree/tree.js +77 -12
- package/es/tree/treeHooks.d.ts +1 -1
- package/es/tree/treeHooks.js +3 -3
- package/es/tree/treeNode.d.ts +1 -0
- package/es/tree/treeNode.js +11 -8
- package/es/tree/utils/treeUtils.d.ts +4 -2
- package/es/tree/utils/treeUtils.js +64 -10
- package/lib/carousel/carousel.js +4 -4
- package/lib/config-provider/compDefaultProps.d.ts +0 -1
- package/lib/config-provider/compDefaultProps.js +0 -1
- package/lib/date-picker/range-picker.d.ts +1 -0
- package/lib/date-picker/range-picker.js +2 -0
- package/lib/date-picker/style/index.css +6 -3
- package/lib/date-picker/style/index.less +7 -3
- package/lib/dropdown/style/index.css +3 -0
- package/lib/dropdown/style/index.less +4 -0
- package/lib/dropdown/style/token.less +1 -0
- package/lib/input/style/index.css +8 -0
- package/lib/input/style/index.less +4 -0
- package/lib/input/style/mixin.less +6 -1
- package/lib/menu/menu.d.ts +1 -0
- package/lib/menu/menu.js +7 -1
- package/lib/radio/radio.js +7 -1
- package/lib/tree/style/index.css +30 -1
- package/lib/tree/style/index.less +25 -1
- package/lib/tree/style/token.less +3 -0
- package/lib/tree/tree.d.ts +2 -0
- package/lib/tree/tree.js +79 -11
- package/lib/tree/treeHooks.d.ts +1 -1
- package/lib/tree/treeHooks.js +3 -3
- package/lib/tree/treeNode.d.ts +1 -0
- package/lib/tree/treeNode.js +11 -8
- package/lib/tree/utils/treeUtils.d.ts +4 -2
- package/lib/tree/utils/treeUtils.js +71 -13
- package/package.json +1 -1
package/es/tree/treeNode.js
CHANGED
|
@@ -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(),
|
|
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
|
-
}, [
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
-
|
|
127
|
+
filterData.forEach(function (item) {
|
|
100
128
|
var pos = item.pos;
|
|
101
|
-
var parentExpand = isAllParentExpand(
|
|
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
|
|
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(
|
|
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
|
|
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(
|
|
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
|
};
|
package/lib/carousel/carousel.js
CHANGED
|
@@ -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,
|
|
@@ -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)) +
|
|
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)) +
|
|
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-
|
|
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 +
|
|
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 +
|
|
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-
|
|
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);
|
|
@@ -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,
|
package/lib/menu/menu.d.ts
CHANGED
|
@@ -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
|
-
|
|
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),
|
|
@@ -170,6 +172,10 @@ var Menu = function Menu(props) {
|
|
|
170
172
|
if (clean) {
|
|
171
173
|
openSubMenuSet.clear();
|
|
172
174
|
} else {
|
|
175
|
+
if (mode === 'inline' && accordion) {
|
|
176
|
+
openSubMenuSet.clear();
|
|
177
|
+
}
|
|
178
|
+
|
|
173
179
|
if (isAdd) {
|
|
174
180
|
openSubMenuSet.add(openKey);
|
|
175
181
|
} else {
|
package/lib/radio/radio.js
CHANGED
|
@@ -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(
|
|
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];
|
package/lib/tree/style/index.css
CHANGED
|
@@ -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:
|
|
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);
|
|
@@ -93,6 +93,13 @@
|
|
|
93
93
|
&-title-disabled {
|
|
94
94
|
color: @tree-node-disabled-color;
|
|
95
95
|
}
|
|
96
|
+
&-title-wrap {
|
|
97
|
+
flex: 1;
|
|
98
|
+
position: relative;
|
|
99
|
+
display: flex;
|
|
100
|
+
align-items: center;
|
|
101
|
+
height: 100%;
|
|
102
|
+
}
|
|
96
103
|
&-title {
|
|
97
104
|
white-space: nowrap;
|
|
98
105
|
margin-left: 6px;
|
|
@@ -118,12 +125,29 @@
|
|
|
118
125
|
height: 100%;
|
|
119
126
|
}
|
|
120
127
|
|
|
128
|
+
&-drag-over {
|
|
129
|
+
background-color: @tree-node-drag-over-color-background;
|
|
130
|
+
border: 2px solid @tree-node-drag-over-border-color;
|
|
131
|
+
}
|
|
132
|
+
|
|
121
133
|
&-drag-line {
|
|
122
134
|
position: absolute;
|
|
123
135
|
left: 0;
|
|
124
136
|
top: 100%;
|
|
125
137
|
width: 100%;
|
|
126
|
-
border-top:
|
|
138
|
+
border-top: 2px solid @tree-node-drag-line-border-color;
|
|
139
|
+
|
|
140
|
+
&::before {
|
|
141
|
+
content: '';
|
|
142
|
+
width: 4px;
|
|
143
|
+
height: 4px;
|
|
144
|
+
background-color: #fff;
|
|
145
|
+
border-radius: 50%;
|
|
146
|
+
border: 2px solid @tree-node-drag-line-border-color;
|
|
147
|
+
position: absolute;
|
|
148
|
+
top: -1px;
|
|
149
|
+
transform: translateY(-50%);
|
|
150
|
+
}
|
|
127
151
|
}
|
|
128
152
|
&-leaf-icon {
|
|
129
153
|
height: @tree-node-icon-height;
|
|
@@ -11,6 +11,9 @@
|
|
|
11
11
|
@tree-node-checked-text-color: var(~'@{tree-prefix}-node-color-text-checked', @color-theme);
|
|
12
12
|
@tree-node-hover-bg-color: var(~'@{tree-prefix}-node-color-backgroung-hover', @color-hover);
|
|
13
13
|
@tree-node-icon-color-text: var(~'@{tree-prefix}-node-icon-color-text', #666666);
|
|
14
|
+
@tree-node-drag-over-border-color: var(~'@{tree-prefix}-node-drag-over-color-border', #5582f3);
|
|
15
|
+
@tree-node-drag-over-color-background: var(~'@{tree-prefix}-node-drag-over-color-background', #E3EBFF);
|
|
16
|
+
@tree-node-drag-line-border-color: var(~'@{tree-prefix}-node-drag-line-color-background', #276FF5);
|
|
14
17
|
|
|
15
18
|
// sizing
|
|
16
19
|
@tree-expand-icon-height: var(~'@{tree-prefix}-expand-icon-sizing-height', 22px);
|
package/lib/tree/tree.d.ts
CHANGED
|
@@ -12,6 +12,8 @@ export interface TreeProps {
|
|
|
12
12
|
disabled?: boolean;
|
|
13
13
|
draggable?: boolean;
|
|
14
14
|
expandedKeys?: string[];
|
|
15
|
+
filterValue?: string;
|
|
16
|
+
filterTreeNode?: () => boolean;
|
|
15
17
|
height?: number;
|
|
16
18
|
icon?: ReactNode | ((props: any) => ReactNode);
|
|
17
19
|
switcherIcon?: ReactNode | ((props: any) => ReactNode) | [ReactNode | ((props: any) => ReactNode)];
|