@kdcloudjs/kdesign 1.6.13 → 1.6.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +26 -0
- package/dist/kdesign-complete.less +326 -249
- package/dist/kdesign.css +88 -17
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +732 -399
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +4 -4
- package/dist/kdesign.min.js +5 -5
- package/dist/kdesign.min.js.map +1 -1
- package/es/_utils/usePopper.d.ts +1 -0
- package/es/_utils/usePopper.js +3 -1
- package/es/button/button.js +1 -1
- package/es/button/style/index.css +3 -0
- package/es/button/style/index.less +4 -0
- package/es/button/style/token.less +1 -0
- package/es/carousel/carousel.d.ts +1 -0
- package/es/carousel/carousel.js +66 -3
- package/es/carousel/style/index.css +39 -0
- package/es/carousel/style/index.less +40 -0
- package/es/carousel/style/token.less +2 -0
- package/es/config-provider/compDefaultProps.d.ts +2 -0
- package/es/config-provider/compDefaultProps.js +4 -2
- package/es/date-picker/range-picker.js +6 -17
- package/es/date-picker/style/index.css +9 -9
- package/es/date-picker/style/index.less +1 -1
- package/es/date-picker/style/token.less +1 -1
- package/es/form/Field.js +67 -33
- package/es/form/FieldContext.js +1 -1
- package/es/form/hooks/useForm.js +29 -42
- package/es/form/interface.d.ts +7 -3
- package/es/icon/icon.js +23 -4
- package/es/image/preview.d.ts +1 -0
- package/es/image/preview.js +31 -6
- package/es/input/style/index.css +4 -3
- package/es/input/style/index.less +230 -227
- package/es/input/style/token.less +11 -12
- package/es/modal/modal.js +4 -8
- package/es/modal/style/index.css +7 -0
- package/es/modal/style/index.less +8 -0
- package/es/select/select.js +11 -8
- package/es/select/style/index.css +6 -3
- package/es/select/style/index.less +9 -3
- package/es/select/style/token.less +10 -5
- package/es/style/core/motion/other.less +9 -0
- package/es/style/icon/kdicon.css +3 -1
- package/es/style/icon/kdicon.woff +0 -0
- package/es/style/index.css +16 -0
- package/es/table/interface.d.ts +1 -0
- package/es/tooltip/tooltip.d.ts +1 -1
- package/es/tooltip/tooltip.js +9 -2
- package/es/tree/tree.d.ts +8 -0
- package/es/tree/tree.js +32 -17
- package/es/tree/treeHooks.d.ts +3 -3
- package/es/tree/treeHooks.js +7 -7
- package/es/tree/utils/treeUtils.d.ts +19 -6
- package/es/tree/utils/treeUtils.js +183 -33
- package/lib/_utils/usePopper.d.ts +1 -0
- package/lib/_utils/usePopper.js +3 -1
- package/lib/button/button.js +1 -1
- package/lib/button/style/index.css +3 -0
- package/lib/button/style/index.less +4 -0
- package/lib/button/style/token.less +1 -0
- package/lib/carousel/carousel.d.ts +1 -0
- package/lib/carousel/carousel.js +69 -2
- package/lib/carousel/style/index.css +39 -0
- package/lib/carousel/style/index.less +40 -0
- package/lib/carousel/style/token.less +2 -0
- package/lib/config-provider/compDefaultProps.d.ts +2 -0
- package/lib/config-provider/compDefaultProps.js +4 -2
- package/lib/date-picker/range-picker.js +6 -17
- package/lib/date-picker/style/index.css +9 -9
- package/lib/date-picker/style/index.less +1 -1
- package/lib/date-picker/style/token.less +1 -1
- package/lib/form/Field.js +68 -33
- package/lib/form/FieldContext.js +1 -1
- package/lib/form/hooks/useForm.js +28 -42
- package/lib/form/interface.d.ts +7 -3
- package/lib/icon/icon.js +22 -4
- package/lib/image/preview.d.ts +1 -0
- package/lib/image/preview.js +31 -6
- package/lib/input/style/index.css +4 -3
- package/lib/input/style/index.less +230 -227
- package/lib/input/style/token.less +11 -12
- package/lib/modal/modal.js +4 -8
- package/lib/modal/style/index.css +7 -0
- package/lib/modal/style/index.less +8 -0
- package/lib/select/select.js +11 -11
- package/lib/select/style/index.css +6 -3
- package/lib/select/style/index.less +9 -3
- package/lib/select/style/token.less +10 -5
- package/lib/style/core/motion/other.less +9 -0
- package/lib/style/icon/kdicon.css +3 -1
- package/lib/style/icon/kdicon.woff +0 -0
- package/lib/style/index.css +16 -0
- package/lib/table/interface.d.ts +1 -0
- package/lib/tooltip/tooltip.d.ts +1 -1
- package/lib/tooltip/tooltip.js +15 -5
- package/lib/tree/tree.d.ts +8 -0
- package/lib/tree/tree.js +30 -16
- package/lib/tree/treeHooks.d.ts +3 -3
- package/lib/tree/treeHooks.js +6 -6
- package/lib/tree/utils/treeUtils.d.ts +19 -6
- package/lib/tree/utils/treeUtils.js +193 -33
- package/package.json +1 -1
|
@@ -311,8 +311,8 @@
|
|
|
311
311
|
}
|
|
312
312
|
.kd-select-bordered {
|
|
313
313
|
border: 1px solid var(--kd-c-select-border-color-border, var(--kd-g-color-border-strong, #d9d9d9));
|
|
314
|
-
padding-left: 8px !important;
|
|
315
|
-
border-radius: 2px;
|
|
314
|
+
padding-left: var(--kd-c-select-bordered-spacing-padding-left, 8px) !important;
|
|
315
|
+
border-radius: var(--kd-c-select-bordered-radius-border, 2px);
|
|
316
316
|
}
|
|
317
317
|
.kd-select-bordered:hover:not(.kd-select-multiple-disabled):not(.kd-select-single-disabled) {
|
|
318
318
|
border: 1px solid var(--kd-c-select-color-border-hover, var(--kd-g-color-theme, #5582f3));
|
|
@@ -320,10 +320,13 @@
|
|
|
320
320
|
.kd-select-bordered .kd-select-suffix {
|
|
321
321
|
padding-right: 8px;
|
|
322
322
|
}
|
|
323
|
+
.kd-select-bordered.kd-select-single .kd-select-selection-search {
|
|
324
|
+
left: var(--kd-c-select-bordered-spacing-padding-left, 8px);
|
|
325
|
+
}
|
|
323
326
|
.kd-select-wrapper {
|
|
324
327
|
-webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
325
328
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
326
|
-
padding: 1px 28px 1px 0;
|
|
329
|
+
padding: var(--kd-c-select-wrapper-spacing-padding, 1px 28px 1px 0);
|
|
327
330
|
max-width: 100%;
|
|
328
331
|
color: #212121;
|
|
329
332
|
display: -webkit-box;
|
|
@@ -83,8 +83,8 @@
|
|
|
83
83
|
|
|
84
84
|
&-bordered {
|
|
85
85
|
border: 1px solid @select-border-g-color-border;
|
|
86
|
-
padding-left:
|
|
87
|
-
border-radius:
|
|
86
|
+
padding-left: @select-bordered !important;
|
|
87
|
+
border-radius: @select-border-radius-border;
|
|
88
88
|
&:hover:not(.@{select-prefix-cls}-multiple-disabled):not(.@{select-prefix-cls}-single-disabled) {
|
|
89
89
|
border: 1px solid @select-g-color-border-hover;
|
|
90
90
|
}
|
|
@@ -92,11 +92,17 @@
|
|
|
92
92
|
.@{select-prefix-cls}-suffix {
|
|
93
93
|
padding-right: 8px;
|
|
94
94
|
}
|
|
95
|
+
|
|
96
|
+
&.@{select-prefix-cls}-single {
|
|
97
|
+
.@{select-prefix-cls}-selection-search {
|
|
98
|
+
left: @select-bordered;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
95
101
|
}
|
|
96
102
|
|
|
97
103
|
&-wrapper {
|
|
98
104
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
99
|
-
padding:
|
|
105
|
+
padding: @select-wrapper-padding;
|
|
100
106
|
max-width: 100%;
|
|
101
107
|
color: #212121;
|
|
102
108
|
display: flex;
|
|
@@ -30,20 +30,25 @@
|
|
|
30
30
|
@select-middle-font-size: var(~'@{select-custom-prefix}-font-size-middle', 14px); // 中号高度
|
|
31
31
|
@select-small-font-size: var(~'@{select-custom-prefix}-font-size-small', 12px); // 小号高度
|
|
32
32
|
|
|
33
|
+
// line-height
|
|
34
|
+
@select-dropdown-line-height: var(~'@{select-custom-prefix}-dropdown-line-height', 22px);
|
|
35
|
+
@select-large-line-height: var(~'@{select-custom-prefix}-line-height-large', 28px);
|
|
36
|
+
@select-middle-line-height: var(~'@{select-custom-prefix}-line-height-middle', 22px);
|
|
37
|
+
@select-small-line-height: var(~'@{select-custom-prefix}-line-height-small', 14px);
|
|
38
|
+
|
|
33
39
|
// sizing
|
|
34
40
|
@select-dropdown-height: var(~'@{select-custom-prefix}-item-sizing-height', 22px);
|
|
35
41
|
@select-large-height: var(~'@{select-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
|
|
36
42
|
@select-middle-height: var(~'@{select-custom-prefix}-sizing-height-middle', 30px); // 中号高度lh:22px
|
|
37
43
|
@select-small-height: var(~'@{select-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px
|
|
38
44
|
|
|
39
|
-
//
|
|
40
|
-
@select-
|
|
41
|
-
@select-
|
|
42
|
-
@select-middle-line-height: var(~'@{select-custom-prefix}-line-height-middle', 22px);
|
|
43
|
-
@select-small-line-height: var(~'@{select-custom-prefix}-line-height-small', 14px);
|
|
45
|
+
// spacing
|
|
46
|
+
@select-bordered: var(~'@{select-custom-prefix}-bordered-spacing-padding-left', 8px);
|
|
47
|
+
@select-wrapper-padding: var(~'@{select-custom-prefix}-wrapper-spacing-padding', 1px 28px 1px 0);
|
|
44
48
|
|
|
45
49
|
// radius
|
|
46
50
|
@select-g-radius-border: var(~'@{select-custom-prefix}-radius-border', @radius-border);
|
|
51
|
+
@select-border-radius-border: var(~'@{select-custom-prefix}-bordered-radius-border', 2px);
|
|
47
52
|
|
|
48
53
|
// z-index
|
|
49
54
|
@select-z-index: var(~'@{select-custom-prefix}-z-index', @z-index-popper);
|
package/es/style/icon/kdicon.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
@font-face {
|
|
2
2
|
font-family: "kdicon";
|
|
3
|
-
src: url("kdicon.woff?t=
|
|
3
|
+
src: url("kdicon.woff?t=1668600442688") format("woff")
|
|
4
4
|
}
|
|
5
5
|
.kdicon {
|
|
6
6
|
font-family: 'kdicon' !important;
|
|
@@ -24,8 +24,10 @@
|
|
|
24
24
|
.kdicon-analysis:before { content: "\e6ce"; }
|
|
25
25
|
.kdicon-arrow-down-solid:before { content: "\e656"; }
|
|
26
26
|
.kdicon-arrow-down:before { content: "\e627"; }
|
|
27
|
+
.kdicon-arrow-left-circle-solid:before { content: "\e720"; }
|
|
27
28
|
.kdicon-arrow-left-solid:before { content: "\e657"; }
|
|
28
29
|
.kdicon-arrow-left:before { content: "\e63f"; }
|
|
30
|
+
.kdicon-arrow-right-circle-solid:before { content: "\e71f"; }
|
|
29
31
|
.kdicon-arrow-right-solid:before { content: "\e655"; }
|
|
30
32
|
.kdicon-arrow-right:before { content: "\e62c"; }
|
|
31
33
|
.kdicon-arrow-up-solid:before { content: "\e654"; }
|
|
Binary file
|
package/es/style/index.css
CHANGED
|
@@ -383,6 +383,22 @@
|
|
|
383
383
|
opacity: 0;
|
|
384
384
|
}
|
|
385
385
|
}
|
|
386
|
+
@-webkit-keyframes kdModalEffect {
|
|
387
|
+
0% {
|
|
388
|
+
opacity: 0;
|
|
389
|
+
}
|
|
390
|
+
100% {
|
|
391
|
+
opacity: 1;
|
|
392
|
+
}
|
|
393
|
+
}
|
|
394
|
+
@keyframes kdModalEffect {
|
|
395
|
+
0% {
|
|
396
|
+
opacity: 0;
|
|
397
|
+
}
|
|
398
|
+
100% {
|
|
399
|
+
opacity: 1;
|
|
400
|
+
}
|
|
401
|
+
}
|
|
386
402
|
.top-active {
|
|
387
403
|
-webkit-animation-name: kdZoomBottomIn;
|
|
388
404
|
animation-name: kdZoomBottomIn;
|
package/es/table/interface.d.ts
CHANGED
|
@@ -44,6 +44,7 @@ export interface TableRowSelection {
|
|
|
44
44
|
column?: Partial<ArtColumnStaticPart>;
|
|
45
45
|
onChange?: (selectedRowKeys: string[], actionRowkey?: string, actionRowskeys?: string[], action?: string) => void;
|
|
46
46
|
isDisabled?(row: any, rowIndex: number): boolean;
|
|
47
|
+
highlightRowWhenSelected?: boolean;
|
|
47
48
|
}
|
|
48
49
|
export declare type TableRowDetail = RowDetailFeatureOptions;
|
|
49
50
|
export declare type TableFilter = FilterFeatureOptions;
|
package/es/tooltip/tooltip.d.ts
CHANGED
package/es/tooltip/tooltip.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime-corejs3/helpers/extends";
|
|
2
|
-
import
|
|
2
|
+
import React, { useRef } from 'react';
|
|
3
3
|
import { getCompProps } from '../_utils';
|
|
4
4
|
import { ConfigContext } from '../config-provider';
|
|
5
5
|
import usePopper from '../_utils/usePopper';
|
|
@@ -11,6 +11,7 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
11
11
|
|
|
12
12
|
|
|
13
13
|
var allProps = getCompProps('ToolTip', userDefaultProps, props);
|
|
14
|
+
var status = useRef();
|
|
14
15
|
var tip = allProps.tip,
|
|
15
16
|
children = allProps.children,
|
|
16
17
|
customPrefixcls = allProps.prefixCls; // className前缀
|
|
@@ -20,9 +21,15 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
20
21
|
ref: children.ref || ref
|
|
21
22
|
});
|
|
22
23
|
|
|
24
|
+
var onVisibleChange = function onVisibleChange(v) {
|
|
25
|
+
if (status.current === v) return;
|
|
26
|
+
status.current = v;
|
|
27
|
+
props.onVisibleChange && props.onVisibleChange(v);
|
|
28
|
+
};
|
|
29
|
+
|
|
23
30
|
var popperProps = _extends(_extends({}, allProps), {
|
|
24
31
|
prefixCls: prefixCls,
|
|
25
|
-
|
|
32
|
+
onVisibleChange: onVisibleChange
|
|
26
33
|
});
|
|
27
34
|
|
|
28
35
|
var tipPopper = typeof tip === 'function' ? tip() : tip;
|
package/es/tree/tree.d.ts
CHANGED
|
@@ -57,5 +57,13 @@ export declare type TreeNodeData = {
|
|
|
57
57
|
showIcon?: boolean;
|
|
58
58
|
selectable?: boolean;
|
|
59
59
|
};
|
|
60
|
+
export declare type KeysDataType = {
|
|
61
|
+
[key: string]: TreeNodeData & {
|
|
62
|
+
pathParentKeys: string[];
|
|
63
|
+
};
|
|
64
|
+
};
|
|
65
|
+
export declare type PosDataType = {
|
|
66
|
+
[key: string]: TreeNodeData;
|
|
67
|
+
};
|
|
60
68
|
declare const Tree: React.ForwardRefExoticComponent<TreeProps & React.RefAttributes<unknown>>;
|
|
61
69
|
export default Tree;
|
package/es/tree/tree.js
CHANGED
|
@@ -12,7 +12,7 @@ import cloneDeep from 'lodash/cloneDeep';
|
|
|
12
12
|
import ConfigContext from '../config-provider/ConfigContext';
|
|
13
13
|
import { getCompProps } from '../_utils';
|
|
14
14
|
import TreeNode from './treeNode';
|
|
15
|
-
import { getChecked, getHalfChecked, addKeys, flattenAll, delKey, getFilterData, getSpreadAttrData,
|
|
15
|
+
import { getChecked, getHalfChecked, addKeys, flattenAll, delKey, getFilterData, getSpreadAttrData, getAllCheckedKeys, getDataCheckededStateStrictly, getAllChildKeys, getPos, getSelected, calcDropPosition } from './utils/treeUtils';
|
|
16
16
|
import { useChecked, useExpand, usePlantomHeightEffect, useViewportHeight, useVisibleDataMemo, useScrollToKey, useSelect } from './treeHooks';
|
|
17
17
|
import isBoolean from 'lodash/isBoolean';
|
|
18
18
|
var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
@@ -79,14 +79,8 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
79
79
|
return flattenAll(treeData, []);
|
|
80
80
|
}, [treeData]),
|
|
81
81
|
flattenAllData = _React$useMemo.flattenAllData,
|
|
82
|
-
maxLevel = _React$useMemo.maxLevel
|
|
83
|
-
|
|
84
|
-
var _useChecked = useChecked(checkStrictly, checkedKeysProps, defaultCheckedKeys, flattenAllData, maxLevel, checkable),
|
|
85
|
-
_useChecked2 = _slicedToArray(_useChecked, 4),
|
|
86
|
-
checkedKeys = _useChecked2[0],
|
|
87
|
-
halfCheckedKeys = _useChecked2[1],
|
|
88
|
-
setCheckedKeys = _useChecked2[2],
|
|
89
|
-
setHalfCheckedKeys = _useChecked2[3];
|
|
82
|
+
maxLevel = _React$useMemo.maxLevel,
|
|
83
|
+
keysData = _React$useMemo.keysData;
|
|
90
84
|
|
|
91
85
|
var _React$useState = React.useState(scrollToKey),
|
|
92
86
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
@@ -140,17 +134,27 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
140
134
|
return typeof filterTreeNode === 'function' && filterValue;
|
|
141
135
|
}, [filterValue]);
|
|
142
136
|
|
|
143
|
-
var _useExpand = useExpand(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, isInit, filterTreeNode, isSearching),
|
|
137
|
+
var _useExpand = useExpand(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, isInit, filterTreeNode, isSearching, keysData),
|
|
144
138
|
_useExpand2 = _slicedToArray(_useExpand, 2),
|
|
145
139
|
expandedKeys = _useExpand2[0],
|
|
146
140
|
setExpandedKeys = _useExpand2[1];
|
|
147
141
|
|
|
148
|
-
var
|
|
142
|
+
var _React$useMemo2 = React.useMemo(function () {
|
|
149
143
|
return getSpreadAttrData(flattenAllData, expandedKeys);
|
|
150
|
-
}, [flattenAllData, expandedKeys])
|
|
144
|
+
}, [flattenAllData, expandedKeys]),
|
|
145
|
+
spreadAttrData = _React$useMemo2.spreadAttrData,
|
|
146
|
+
posData = _React$useMemo2.posData;
|
|
147
|
+
|
|
148
|
+
var _useChecked = useChecked(checkStrictly, checkedKeysProps, defaultCheckedKeys, flattenAllData, maxLevel, checkable, keysData),
|
|
149
|
+
_useChecked2 = _slicedToArray(_useChecked, 4),
|
|
150
|
+
checkedKeys = _useChecked2[0],
|
|
151
|
+
halfCheckedKeys = _useChecked2[1],
|
|
152
|
+
setCheckedKeys = _useChecked2[2],
|
|
153
|
+
setHalfCheckedKeys = _useChecked2[3];
|
|
154
|
+
|
|
151
155
|
var filterData = React.useMemo(function () {
|
|
152
|
-
return getFilterData(spreadAttrData, filterTreeNode, isSearching);
|
|
153
|
-
}, [spreadAttrData, isSearching]);
|
|
156
|
+
return getFilterData(spreadAttrData, filterTreeNode, isSearching, posData, keysData);
|
|
157
|
+
}, [spreadAttrData, isSearching, posData, keysData]);
|
|
154
158
|
|
|
155
159
|
var _useViewportHeight = useViewportHeight(height, listRef),
|
|
156
160
|
_useViewportHeight2 = _slicedToArray(_useViewportHeight, 1),
|
|
@@ -232,9 +236,17 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
232
236
|
handleNodeLoad(loadedKeys, loadingKeys, node);
|
|
233
237
|
}
|
|
234
238
|
}, [expandedKeys, onExpand, loadData, handleNodeLoad, loadedKeys, loadingKeys]);
|
|
235
|
-
var handleCheck = React.useCallback(function (key, value, node, event,
|
|
239
|
+
var handleCheck = React.useCallback(function (key, value, node, event, _pos) {
|
|
236
240
|
var newCheckedKeys = value ? addKeys(checkedKeys, [key]) : delKey(checkedKeys, [key]);
|
|
237
|
-
var checkState = checkStrictly ? getDataCheckededStateStrictly(newCheckedKeys) :
|
|
241
|
+
var checkState = checkStrictly ? getDataCheckededStateStrictly(newCheckedKeys) : getAllCheckedKeys(key, value, checkedKeys, keysData, halfCheckedKeys);
|
|
242
|
+
|
|
243
|
+
if (!('checkedKeys' in TreeProps)) {
|
|
244
|
+
setCheckedKeys(checkState.checkedKeys);
|
|
245
|
+
setHalfCheckedKeys(checkState.halfCheckedKeys);
|
|
246
|
+
} else {
|
|
247
|
+
setHalfCheckedKeys(checkState.halfCheckedKeys);
|
|
248
|
+
}
|
|
249
|
+
|
|
238
250
|
onCheck && onCheck(checkState.checkedKeys, {
|
|
239
251
|
event: event,
|
|
240
252
|
node: node,
|
|
@@ -389,7 +401,10 @@ var InternalTree = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
389
401
|
}, [scrollToKey]);
|
|
390
402
|
useEffect(function () {
|
|
391
403
|
setHalfCheckedKeys(halfCheckedKeys);
|
|
392
|
-
}, [halfCheckedKeys]);
|
|
404
|
+
}, [halfCheckedKeys, setHalfCheckedKeys]);
|
|
405
|
+
useEffect(function () {
|
|
406
|
+
setCheckedKeys(checkedKeys);
|
|
407
|
+
}, [checkedKeys, setCheckedKeys]);
|
|
393
408
|
return /*#__PURE__*/React.createElement("div", {
|
|
394
409
|
className: treeNodeClassName,
|
|
395
410
|
style: style,
|
package/es/tree/treeHooks.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { TreeNodeData } from './tree';
|
|
1
|
+
import { TreeNodeData, KeysDataType } from './tree';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
export declare const useViewportHeight: (height: number, listRef: React.RefObject<HTMLElement>) => number[];
|
|
4
4
|
export declare const useVisibleDataMemo: (virtual: boolean, filterData: TreeNodeData[], viewportHeight: number, estimatedItemSize: number, start: number) => TreeNodeData[][];
|
|
5
5
|
export declare const usePlantomHeightEffect: (plantomRef: React.RefObject<HTMLElement>, filterData: TreeNodeData[], estimatedItemSize: number) => void;
|
|
6
|
-
export declare const useChecked: (checkStrictly: boolean, checkedKeysProps: string[], defaultCheckedKeys: string[],
|
|
7
|
-
export declare const useExpand: (flattenAllData: any[], expandedKeysProps: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, scrollKey: string, isInit: boolean, filterTreeNode: FunctionConstructor, isSearching: boolean) => readonly [string[], React.Dispatch<React.SetStateAction<string[]>>];
|
|
6
|
+
export declare const useChecked: (checkStrictly: boolean, checkedKeysProps: string[], defaultCheckedKeys: string[], _flattenAllData: any[], _maxLevel: number, checkable: boolean, keysData: KeysDataType) => readonly [string[], string[], React.Dispatch<React.SetStateAction<string[]>>, React.Dispatch<React.SetStateAction<string[]>>];
|
|
7
|
+
export declare const useExpand: (flattenAllData: any[], expandedKeysProps: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, scrollKey: string, isInit: boolean, filterTreeNode: FunctionConstructor, isSearching: boolean, keysData: KeysDataType) => readonly [string[], React.Dispatch<React.SetStateAction<string[]>>];
|
|
8
8
|
export declare const useScrollToKey: (scrollKey: string, index: number, estimatedItemSize: number, scrollRef: any, viewportHeight: number, treeNodePrefixCls: string) => void;
|
|
9
9
|
export declare const useSelect: (selectedKeysProps: string[], defaultSelectedKeys: string[]) => readonly [string[], React.Dispatch<React.SetStateAction<string[]>>];
|
package/es/tree/treeHooks.js
CHANGED
|
@@ -2,7 +2,7 @@ import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
|
|
|
2
2
|
import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
|
|
3
3
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
4
4
|
import React, { useEffect, useState } from 'react';
|
|
5
|
-
import {
|
|
5
|
+
import { getInitCheckededKeys, getDataCheckededStateStrictly, getInitExpandedKeys, getPos, getAllParentKeys, getExpandedKeys } from './utils/treeUtils';
|
|
6
6
|
export var useViewportHeight = function useViewportHeight(height, listRef) {
|
|
7
7
|
var _React$useState = React.useState(0),
|
|
8
8
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
@@ -35,14 +35,14 @@ export var usePlantomHeightEffect = function usePlantomHeightEffect(plantomRef,
|
|
|
35
35
|
}
|
|
36
36
|
}, [plantomRef, filterData, estimatedItemSize]);
|
|
37
37
|
};
|
|
38
|
-
export var useChecked = function useChecked(checkStrictly, checkedKeysProps, defaultCheckedKeys,
|
|
38
|
+
export var useChecked = function useChecked(checkStrictly, checkedKeysProps, defaultCheckedKeys, _flattenAllData, _maxLevel, checkable, keysData) {
|
|
39
39
|
var initialCheckedState = React.useMemo(function () {
|
|
40
40
|
if (!checkable) return {
|
|
41
41
|
checkedKeys: [],
|
|
42
42
|
halfCheckedKeys: []
|
|
43
43
|
};
|
|
44
|
-
return checkStrictly ? getDataCheckededStateStrictly(checkedKeysProps || defaultCheckedKeys) :
|
|
45
|
-
}, [
|
|
44
|
+
return checkStrictly ? getDataCheckededStateStrictly(checkedKeysProps || defaultCheckedKeys) : getInitCheckededKeys(checkedKeysProps || defaultCheckedKeys, keysData);
|
|
45
|
+
}, [checkable, checkStrictly, checkedKeysProps, defaultCheckedKeys, keysData]);
|
|
46
46
|
|
|
47
47
|
var _React$useState3 = React.useState(initialCheckedState.checkedKeys),
|
|
48
48
|
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
@@ -64,7 +64,7 @@ export var useChecked = function useChecked(checkStrictly, checkedKeysProps, def
|
|
|
64
64
|
}, [nextHalfCheckedKeys]);
|
|
65
65
|
return [checkedKeys, halfCheckedKeys, setCheckedKeys, setHalfCheckedKeys];
|
|
66
66
|
};
|
|
67
|
-
export var useExpand = function useExpand(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, isInit, filterTreeNode, isSearching) {
|
|
67
|
+
export var useExpand = function useExpand(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, isInit, filterTreeNode, isSearching, keysData) {
|
|
68
68
|
var expandScrollkeys = [];
|
|
69
69
|
|
|
70
70
|
if (scrollKey) {
|
|
@@ -73,8 +73,8 @@ export var useExpand = function useExpand(flattenAllData, expandedKeysProps, def
|
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
var initialExpandedKeys = React.useMemo(function () {
|
|
76
|
-
return getInitExpandedKeys(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, expandScrollkeys, filterTreeNode, isSearching);
|
|
77
|
-
}, [flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, filterTreeNode, isSearching]);
|
|
76
|
+
return getInitExpandedKeys(flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, expandScrollkeys, filterTreeNode, isSearching, keysData);
|
|
77
|
+
}, [flattenAllData, expandedKeysProps, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent, scrollKey, filterTreeNode, isSearching, keysData]);
|
|
78
78
|
var newExpandedKeys = React.useMemo(function () {
|
|
79
79
|
return getExpandedKeys(expandedKeysProps, expandScrollkeys);
|
|
80
80
|
}, [expandedKeysProps]);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { TreeNodeData } from '../tree';
|
|
1
|
+
import { TreeNodeData, KeysDataType } from '../tree';
|
|
2
2
|
/**
|
|
3
3
|
* 打平所有数组,并添加pos位置信息,
|
|
4
4
|
* 方便根据expandKeys等计算节点的expand,checkedKeys计算节点checked状态
|
|
@@ -10,13 +10,14 @@ import { TreeNodeData } from '../tree';
|
|
|
10
10
|
export declare const flattenAll: (treeData: any[], newTreeData?: TreeNodeData[], level?: number, pos?: string | undefined) => {
|
|
11
11
|
flattenAllData: TreeNodeData[];
|
|
12
12
|
maxLevel: number;
|
|
13
|
+
keysData: KeysDataType;
|
|
13
14
|
};
|
|
14
15
|
export declare const getExpand: (expandedKeys: string[], key: string) => boolean;
|
|
15
16
|
export declare const getChecked: (checkedKeys: string[], key: string) => boolean;
|
|
16
17
|
export declare const getSelected: (selectedKeys: string[], key: string) => boolean;
|
|
17
18
|
export declare const getHalfChecked: (halfCheckedKeys: string[], key: string) => boolean;
|
|
18
|
-
export declare const getAllFilterKeys: (data: any[], filterTreeNode: FunctionConstructor) => any[];
|
|
19
|
-
export declare const getFilterData: (data: any[], filterTreeNode: FunctionConstructor, isSearching: boolean) => any[];
|
|
19
|
+
export declare const getAllFilterKeys: (data: any[], filterTreeNode: FunctionConstructor, keysData: KeysDataType) => any[];
|
|
20
|
+
export declare const getFilterData: (data: any[], filterTreeNode: FunctionConstructor, isSearching: boolean, posData?: {}, keysData?: {}) => any[];
|
|
20
21
|
export declare const getMaxLevel: (data: any[]) => number;
|
|
21
22
|
/**
|
|
22
23
|
*计算node的属性后返回新的 treedata
|
|
@@ -25,14 +26,26 @@ export declare const getMaxLevel: (data: any[]) => number;
|
|
|
25
26
|
* @param expandedKeys
|
|
26
27
|
* @param defaultExpandAll
|
|
27
28
|
*/
|
|
28
|
-
export declare const getSpreadAttrData: (treeData: any[], expandedKeys: string[]) =>
|
|
29
|
+
export declare const getSpreadAttrData: (treeData: any[], expandedKeys: string[]) => {
|
|
30
|
+
spreadAttrData: any[];
|
|
31
|
+
posData: any;
|
|
32
|
+
};
|
|
29
33
|
export declare const addKeys: (prevKeys?: string[], newKeys?: string[]) => string[];
|
|
30
34
|
export declare const getAllParentKeys: (data: any[], pos?: string) => string[];
|
|
31
35
|
export declare const getAllParentPos: (data: any[], pos?: string) => string[];
|
|
32
36
|
export declare const getAllChildKeys: (data: any[], pos?: string) => string[];
|
|
33
37
|
export declare const getPos: (data: any[], key: string) => any;
|
|
34
38
|
export declare const getInitCheckedKeys: (data: any[], keys: string[]) => any[];
|
|
35
|
-
export declare const getInitCheckededState: (data: any[], checkedKeys: string[] | undefined, maxLevel: number, init
|
|
39
|
+
export declare const getInitCheckededState: (data: any[], checkedKeys: string[] | undefined, maxLevel: number, init: boolean | undefined, posData: any, _keysData: KeysDataType) => {
|
|
40
|
+
checkedKeys: string[];
|
|
41
|
+
halfCheckedKeys: string[];
|
|
42
|
+
};
|
|
43
|
+
export declare function getChildNodeKeys(node: TreeNodeData, keysNodeProps: KeysDataType): Set<string>;
|
|
44
|
+
export declare const getInitCheckededKeys: (checkedKeys: string[] | undefined, keysNodeProps: KeysDataType) => {
|
|
45
|
+
checkedKeys: string[];
|
|
46
|
+
halfCheckedKeys: string[];
|
|
47
|
+
};
|
|
48
|
+
export declare function getAllCheckedKeys(key: string, checked: boolean, checkedKeys: string[], keysNodeProps: KeysDataType, halfCheckedKeys: string[]): {
|
|
36
49
|
checkedKeys: string[];
|
|
37
50
|
halfCheckedKeys: string[];
|
|
38
51
|
};
|
|
@@ -46,6 +59,6 @@ export declare const getDataCheckededStateStrictly: (checkedKeys: string[]) => {
|
|
|
46
59
|
};
|
|
47
60
|
export declare const delKey: (prevKeys: string[], delKeys: string[]) => never[] & string[];
|
|
48
61
|
export declare const getAllNodeKeys: (data: any[]) => string[];
|
|
49
|
-
export declare const getInitExpandedKeys: (data: any[], expandedKeys: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, expandScrollkeys: string[] | undefined, filterTreeNode: FunctionConstructor, isSearching: boolean) => string[];
|
|
62
|
+
export declare const getInitExpandedKeys: (data: any[], expandedKeys: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, expandScrollkeys: string[] | undefined, filterTreeNode: FunctionConstructor, isSearching: boolean, keysData: KeysDataType) => string[];
|
|
50
63
|
export declare const getExpandedKeys: (expandedKeys: string[], expandScrollkeys?: string[]) => string[];
|
|
51
64
|
export declare const calcDropPosition: (event: React.MouseEvent, dropNode: HTMLElement) => 0 | 1 | -1;
|