@kdcloudjs/kdesign 1.5.2 → 1.5.5
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 +64 -0
- package/dist/default-theme.js +4 -4
- package/dist/kdesign-complete.less +169 -88
- package/dist/kdesign.css +165 -86
- package/dist/kdesign.css.map +1 -1
- package/dist/kdesign.js +335 -220
- package/dist/kdesign.js.map +1 -1
- package/dist/kdesign.min.css +4 -4
- package/dist/kdesign.min.js +6 -6
- package/dist/kdesign.min.js.map +1 -1
- package/es/_utils/usePopper.js +17 -8
- package/es/alert/alert.js +2 -2
- package/es/alert/style/index.css +27 -11
- package/es/alert/style/index.less +24 -10
- package/es/alert/style/mixin.less +8 -2
- package/es/alert/style/token.less +16 -8
- package/es/config-provider/compDefaultProps.d.ts +1 -0
- package/es/config-provider/compDefaultProps.js +2 -1
- package/es/drawer/drawer.js +1 -0
- package/es/dropdown/dropdown.js +16 -6
- package/es/dropdown/style/index.css +13 -14
- package/es/dropdown/style/index.less +4 -5
- package/es/dropdown/style/token.less +6 -5
- package/es/input/ClearableLabeledInput.js +5 -5
- package/es/input/style/index.css +5 -0
- package/es/input/style/index.less +5 -0
- package/es/radio/style/index.css +7 -1
- package/es/radio/style/index.less +9 -1
- package/es/search/style/index.css +3 -3
- package/es/select/select.js +1 -1
- package/es/spin/style/index.css +25 -26
- package/es/spin/style/index.less +18 -19
- package/es/spin/style/token.less +9 -3
- package/es/stepper/stepper.js +9 -4
- package/es/stepper/style/index.css +2 -0
- package/es/stepper/style/index.less +2 -0
- package/es/stepper/style/token.less +1 -2
- package/es/style/icon/kdicon.css +2 -1
- package/es/style/icon/kdicon.woff +0 -0
- package/es/style/themes/default.less +3 -4
- package/es/tabs/style/index.css +1 -0
- package/es/tabs/style/index.less +1 -0
- package/es/timeline/style/index.css +22 -21
- package/es/timeline/style/index.less +2 -2
- package/es/timeline/style/token.less +4 -7
- package/es/tooltip/tooltip.js +1 -1
- package/es/tree/style/index.css +56 -7
- package/es/tree/style/index.less +26 -18
- package/es/tree/style/mixin.less +25 -1
- package/es/tree/style/token.less +6 -4
- package/es/tree/tree.d.ts +2 -0
- package/es/tree/tree.js +77 -20
- package/es/tree/treeHooks.d.ts +1 -1
- package/es/tree/treeHooks.js +3 -4
- package/es/tree/treeNode.d.ts +1 -0
- package/es/tree/treeNode.js +45 -49
- package/es/tree/utils/treeUtils.d.ts +6 -3
- package/es/tree/utils/treeUtils.js +66 -42
- package/lib/_utils/usePopper.js +17 -8
- package/lib/alert/alert.js +2 -2
- package/lib/alert/style/index.css +27 -11
- package/lib/alert/style/index.less +24 -10
- package/lib/alert/style/mixin.less +8 -2
- package/lib/alert/style/token.less +16 -8
- package/lib/config-provider/compDefaultProps.d.ts +1 -0
- package/lib/config-provider/compDefaultProps.js +2 -1
- package/lib/drawer/drawer.js +1 -0
- package/lib/dropdown/dropdown.js +15 -6
- package/lib/dropdown/style/index.css +13 -14
- package/lib/dropdown/style/index.less +4 -5
- package/lib/dropdown/style/token.less +6 -5
- package/lib/input/ClearableLabeledInput.js +5 -5
- package/lib/input/style/index.css +5 -0
- package/lib/input/style/index.less +5 -0
- package/lib/radio/style/index.css +7 -1
- package/lib/radio/style/index.less +9 -1
- package/lib/search/style/index.css +3 -3
- package/lib/select/select.js +1 -1
- package/lib/spin/style/index.css +25 -26
- package/lib/spin/style/index.less +18 -19
- package/lib/spin/style/token.less +9 -3
- package/lib/stepper/stepper.js +9 -4
- package/lib/stepper/style/index.css +2 -0
- package/lib/stepper/style/index.less +2 -0
- package/lib/stepper/style/token.less +1 -2
- package/lib/style/icon/kdicon.css +2 -1
- package/lib/style/icon/kdicon.woff +0 -0
- package/lib/style/themes/default.less +3 -4
- package/lib/tabs/style/index.css +1 -0
- package/lib/tabs/style/index.less +1 -0
- package/lib/timeline/style/index.css +22 -21
- package/lib/timeline/style/index.less +2 -2
- package/lib/timeline/style/token.less +4 -7
- package/lib/tooltip/tooltip.js +1 -1
- package/lib/tree/style/index.css +56 -7
- package/lib/tree/style/index.less +26 -18
- package/lib/tree/style/mixin.less +25 -1
- package/lib/tree/style/token.less +6 -4
- package/lib/tree/tree.d.ts +2 -0
- package/lib/tree/tree.js +78 -20
- package/lib/tree/treeHooks.d.ts +1 -1
- package/lib/tree/treeHooks.js +3 -4
- package/lib/tree/treeNode.d.ts +1 -0
- package/lib/tree/treeNode.js +46 -48
- package/lib/tree/utils/treeUtils.d.ts +6 -3
- package/lib/tree/utils/treeUtils.js +64 -42
- package/package.json +1 -1
|
@@ -7,13 +7,16 @@ import { TreeNodeData } from '../tree';
|
|
|
7
7
|
* @param level
|
|
8
8
|
* @param pos
|
|
9
9
|
*/
|
|
10
|
-
export declare const flattenAll: (treeData: any[], newTreeData?: TreeNodeData[], level?: number, pos?: string | undefined) =>
|
|
10
|
+
export declare const flattenAll: (treeData: any[], newTreeData?: TreeNodeData[], level?: number, pos?: string | undefined) => {
|
|
11
|
+
flattenAllData: TreeNodeData[];
|
|
12
|
+
maxLevel: number;
|
|
13
|
+
};
|
|
11
14
|
export declare const getExpand: (expandedKeys: string[], key: string) => boolean;
|
|
12
15
|
export declare const getChecked: (checkedKeys: string[], key: string) => boolean;
|
|
13
16
|
export declare const getSelected: (selectedKeys: string[], key: string) => boolean;
|
|
14
17
|
export declare const getHalfChecked: (halfCheckedKeys: string[], key: string) => boolean;
|
|
15
18
|
export declare const getAllFilterKeys: (data: any[], filterTreeNode: FunctionConstructor) => any[];
|
|
16
|
-
export declare const getFilterData: (data: any[], filterTreeNode: FunctionConstructor,
|
|
19
|
+
export declare const getFilterData: (data: any[], filterTreeNode: FunctionConstructor, isSearching: boolean) => any[];
|
|
17
20
|
export declare const getMaxLevel: (data: any[]) => number;
|
|
18
21
|
/**
|
|
19
22
|
*计算node的属性后返回新的 treedata
|
|
@@ -43,6 +46,6 @@ export declare const getDataCheckededStateStrictly: (checkedKeys: string[]) => {
|
|
|
43
46
|
};
|
|
44
47
|
export declare const delKey: (prevKeys: string[], delKeys: string[]) => never[] & string[];
|
|
45
48
|
export declare const getAllNodeKeys: (data: any[]) => string[];
|
|
46
|
-
export declare const getInitExpandedKeys: (data: any[], expandedKeys: string[], defaultExpandedKeys: string[], defaultExpandAll: boolean, defaultExpandRoot: boolean, defaultExpandParent: boolean, expandScrollkeys: string[] | undefined, filterTreeNode: FunctionConstructor,
|
|
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[];
|
|
47
50
|
export declare const getExpandedKeys: (expandedKeys: string[], expandScrollkeys?: string[]) => string[];
|
|
48
51
|
export declare const calcDropPosition: (event: React.MouseEvent, dropNode: HTMLElement) => 0 | 1 | -1;
|
|
@@ -5,7 +5,6 @@ import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/insta
|
|
|
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
7
|
import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
|
|
8
|
-
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
|
|
9
8
|
import _Set from "@babel/runtime-corejs3/core-js-stable/set";
|
|
10
9
|
import _startsWithInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/starts-with";
|
|
11
10
|
import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
|
|
@@ -38,29 +37,54 @@ export var flattenAll = function flattenAll(treeData) {
|
|
|
38
37
|
var newTreeData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
39
38
|
var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
40
39
|
var pos = arguments.length > 3 ? arguments[3] : undefined;
|
|
41
|
-
|
|
42
|
-
var _context;
|
|
40
|
+
var maxLevel = 0;
|
|
43
41
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
42
|
+
var fn = function fn(treeData) {
|
|
43
|
+
var newTreeData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
44
|
+
var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
45
|
+
var pos = arguments.length > 3 ? arguments[3] : undefined;
|
|
46
|
+
var parent = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
|
|
47
|
+
treeData && treeData.forEach(function (item, index) {
|
|
48
|
+
var _context;
|
|
48
49
|
|
|
49
|
-
|
|
50
|
+
var children = item.children,
|
|
51
|
+
title = item.title,
|
|
52
|
+
key = item.key,
|
|
53
|
+
others = __rest(item, ["children", "title", "key"]);
|
|
50
54
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
55
|
+
item.parent = parent;
|
|
56
|
+
|
|
57
|
+
var _pos = pos ? _concatInstanceProperty(_context = "".concat(pos, "-")).call(_context, index) : "".concat(index);
|
|
58
|
+
|
|
59
|
+
var hasChildNode = item.isLeaf ? false : children && children instanceof Array && children.length > 0;
|
|
60
|
+
|
|
61
|
+
var flattenNode = _extends({
|
|
62
|
+
title: title,
|
|
63
|
+
key: key,
|
|
64
|
+
pos: _pos,
|
|
65
|
+
hasChildNode: hasChildNode,
|
|
66
|
+
level: level,
|
|
67
|
+
parent: parent
|
|
68
|
+
}, others);
|
|
69
|
+
|
|
70
|
+
newTreeData.push(flattenNode);
|
|
71
|
+
var _level = level;
|
|
72
|
+
|
|
73
|
+
if (maxLevel < level) {
|
|
74
|
+
maxLevel = level;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
_level++;
|
|
78
|
+
hasChildNode && fn(children, newTreeData, _level, _pos, flattenNode);
|
|
79
|
+
});
|
|
80
|
+
return newTreeData;
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
var flattenAllData = fn(treeData, newTreeData, level, pos);
|
|
84
|
+
return {
|
|
85
|
+
flattenAllData: flattenAllData,
|
|
86
|
+
maxLevel: maxLevel
|
|
87
|
+
};
|
|
64
88
|
};
|
|
65
89
|
export var getExpand = function getExpand(expandedKeys, key) {
|
|
66
90
|
return expandedKeys === null || expandedKeys === void 0 ? void 0 : _includesInstanceProperty(expandedKeys).call(expandedKeys, key);
|
|
@@ -97,29 +121,29 @@ var isAllParentExpand = function isAllParentExpand(data, pos) {
|
|
|
97
121
|
};
|
|
98
122
|
|
|
99
123
|
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
124
|
var allFilterKeys = [];
|
|
106
125
|
|
|
107
|
-
|
|
108
|
-
|
|
126
|
+
_filterInstanceProperty(data).call(data, function (item) {
|
|
127
|
+
return filterTreeNode === null || filterTreeNode === void 0 ? void 0 : filterTreeNode(item);
|
|
128
|
+
}).forEach(function (item) {
|
|
129
|
+
var node = _extends({}, item);
|
|
109
130
|
|
|
110
|
-
|
|
131
|
+
while (node) {
|
|
132
|
+
allFilterKeys.push(node.key);
|
|
133
|
+
node = node.parent;
|
|
134
|
+
}
|
|
111
135
|
});
|
|
112
136
|
|
|
113
137
|
return _toConsumableArray(new _Set(allFilterKeys));
|
|
114
138
|
};
|
|
115
|
-
export var getFilterData = function getFilterData(data, filterTreeNode,
|
|
139
|
+
export var getFilterData = function getFilterData(data, filterTreeNode, isSearching) {
|
|
116
140
|
var filterData = data;
|
|
141
|
+
var allFilterKeys = null;
|
|
117
142
|
|
|
118
|
-
if (
|
|
143
|
+
if (isSearching) {
|
|
144
|
+
allFilterKeys = getAllFilterKeys(filterData, filterTreeNode);
|
|
119
145
|
filterData = _filterInstanceProperty(filterData).call(filterData, function (item) {
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
return _includesInstanceProperty(_context3 = getAllFilterKeys(filterData, filterTreeNode)).call(_context3, item.key);
|
|
146
|
+
return _includesInstanceProperty(allFilterKeys).call(allFilterKeys, item.key);
|
|
123
147
|
});
|
|
124
148
|
}
|
|
125
149
|
|
|
@@ -258,11 +282,11 @@ export var getSpreadAttrData = function getSpreadAttrData(treeData, expandedKeys
|
|
|
258
282
|
return newTreeData;
|
|
259
283
|
};
|
|
260
284
|
export var addKeys = function addKeys() {
|
|
261
|
-
var
|
|
285
|
+
var _context2;
|
|
262
286
|
|
|
263
287
|
var prevKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
264
288
|
var newKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
265
|
-
return _Array$from(new _Set(_concatInstanceProperty(
|
|
289
|
+
return _Array$from(new _Set(_concatInstanceProperty(_context2 = []).call(_context2, _toConsumableArray(prevKeys), _toConsumableArray(newKeys))));
|
|
266
290
|
};
|
|
267
291
|
export var getAllParentKeys = function getAllParentKeys(data) {
|
|
268
292
|
var pos = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
@@ -315,14 +339,14 @@ export var getPos = function getPos(data, key) {
|
|
|
315
339
|
return node === null || node === void 0 ? void 0 : node.pos;
|
|
316
340
|
};
|
|
317
341
|
export var getInitCheckedKeys = function getInitCheckedKeys(data, keys) {
|
|
318
|
-
var
|
|
342
|
+
var _context3;
|
|
319
343
|
|
|
320
344
|
var checkedKeys = [];
|
|
321
345
|
keys.forEach(function (item) {
|
|
322
346
|
var pos = getPos(data, item);
|
|
323
347
|
checkedKeys.push.apply(checkedKeys, _toConsumableArray(getAllChildKeys(data, pos)));
|
|
324
348
|
});
|
|
325
|
-
return _Array$from(new _Set(_concatInstanceProperty(
|
|
349
|
+
return _Array$from(new _Set(_concatInstanceProperty(_context3 = []).call(_context3, checkedKeys, _toConsumableArray(keys))));
|
|
326
350
|
};
|
|
327
351
|
export var getInitCheckededState = function getInitCheckededState(data) {
|
|
328
352
|
var checkedKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
@@ -497,7 +521,7 @@ var getRootKeys = function getRootKeys(data) {
|
|
|
497
521
|
export var getInitExpandedKeys = function getInitExpandedKeys(data, expandedKeys, defaultExpandedKeys, defaultExpandAll, defaultExpandRoot, defaultExpandParent) {
|
|
498
522
|
var expandScrollkeys = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : [];
|
|
499
523
|
var filterTreeNode = arguments.length > 7 ? arguments[7] : undefined;
|
|
500
|
-
var
|
|
524
|
+
var isSearching = arguments.length > 8 ? arguments[8] : undefined;
|
|
501
525
|
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)) || [];
|
|
502
526
|
|
|
503
527
|
if (defaultExpandAll) {
|
|
@@ -520,10 +544,10 @@ export var getInitExpandedKeys = function getInitExpandedKeys(data, expandedKeys
|
|
|
520
544
|
}
|
|
521
545
|
}
|
|
522
546
|
|
|
523
|
-
if (
|
|
524
|
-
var
|
|
547
|
+
if (isSearching) {
|
|
548
|
+
var _context4;
|
|
525
549
|
|
|
526
|
-
keys = _concatInstanceProperty(
|
|
550
|
+
keys = _concatInstanceProperty(_context4 = []).call(_context4, _toConsumableArray(keys), _toConsumableArray(getAllFilterKeys(data, filterTreeNode)));
|
|
527
551
|
}
|
|
528
552
|
|
|
529
553
|
return _Array$from(new _Set(_toConsumableArray(keys)));
|
package/lib/_utils/usePopper.js
CHANGED
|
@@ -520,6 +520,11 @@ function usePopper(locatorElement, popperElement, props) {
|
|
|
520
520
|
props.visible === undefined && setVisible(false);
|
|
521
521
|
onVisibleChange && onVisibleChange(false);
|
|
522
522
|
}, [onVisibleChange, props.visible]);
|
|
523
|
+
|
|
524
|
+
var matchTrigger = function matchTrigger(words) {
|
|
525
|
+
return Array.isArray(trigger) ? (0, _includes.default)(trigger).call(trigger, words) : trigger === words;
|
|
526
|
+
};
|
|
527
|
+
|
|
523
528
|
(0, _react.useEffect)(function () {
|
|
524
529
|
if (exist && visible) {
|
|
525
530
|
var mouseleaveTimer;
|
|
@@ -536,13 +541,13 @@ function usePopper(locatorElement, popperElement, props) {
|
|
|
536
541
|
Y = e.clientY;
|
|
537
542
|
var inTriggerRect = X > left - 2 && X < right + 2 && Y > top - 2 && Y < bottom + 2;
|
|
538
543
|
var inPopperRect = X > popperRect.left && X < popperRect.right && Y > popperRect.top && Y < popperRect.bottom;
|
|
539
|
-
var ableArea =
|
|
544
|
+
var ableArea = matchTrigger('contextMenu') ? inPopperRect : inTriggerRect || inPopperRect;
|
|
540
545
|
|
|
541
546
|
if (ableArea) {
|
|
542
547
|
mouseleaveTimer && clearTimeout(mouseleaveTimer);
|
|
543
|
-
|
|
548
|
+
matchTrigger('focus') && triggerNode.focus();
|
|
544
549
|
} else {
|
|
545
|
-
|
|
550
|
+
matchTrigger('hover') ? mouseleaveTimer = window.setTimeout(hidePopper, mouseLeaveDelay * 1000) : hidePopper();
|
|
546
551
|
}
|
|
547
552
|
};
|
|
548
553
|
|
|
@@ -550,14 +555,18 @@ function usePopper(locatorElement, popperElement, props) {
|
|
|
550
555
|
leading: true
|
|
551
556
|
});
|
|
552
557
|
var mapEvent = {
|
|
553
|
-
|
|
554
|
-
|
|
558
|
+
hover: 'mousemove',
|
|
559
|
+
click: 'mousedown',
|
|
555
560
|
focus: 'mousedown',
|
|
556
|
-
|
|
561
|
+
contextMenu: 'mousedown'
|
|
557
562
|
};
|
|
558
|
-
|
|
563
|
+
Array.isArray(trigger) ? trigger.forEach(function (action) {
|
|
564
|
+
return document.addEventListener(mapEvent[action], debounceHidePopper);
|
|
565
|
+
}) : document.addEventListener(mapEvent[trigger], debounceHidePopper);
|
|
559
566
|
return function () {
|
|
560
|
-
|
|
567
|
+
Array.isArray(trigger) ? trigger.forEach(function (action) {
|
|
568
|
+
return document.removeEventListener(mapEvent[action], debounceHidePopper);
|
|
569
|
+
}) : document.removeEventListener(mapEvent[trigger], debounceHidePopper);
|
|
561
570
|
};
|
|
562
571
|
}
|
|
563
572
|
}, [currentPlacement, evType, exist, getTriggerElement, hidePopper, locatorRef, mouseLeaveDelay, popperRef, visible]);
|
package/lib/alert/alert.js
CHANGED
|
@@ -217,13 +217,13 @@ var Alert = function Alert(props) {
|
|
|
217
217
|
};
|
|
218
218
|
|
|
219
219
|
var iconNode = /*#__PURE__*/_react.default.createElement("div", {
|
|
220
|
-
className: "".concat(alertPrefixCls, "-icon")
|
|
220
|
+
className: (0, _classnames.default)("".concat(alertPrefixCls, "-icon"), getAlertColorType('icon'))
|
|
221
221
|
}, icon || /*#__PURE__*/_react.default.createElement(_index.Icon, {
|
|
222
222
|
type: alertIconType
|
|
223
223
|
}));
|
|
224
224
|
|
|
225
225
|
var AlertComp = /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
|
|
226
|
-
className: (0, _classnames.default)(alertClasses, getAlertColorType('bg'), getAlertColorType('
|
|
226
|
+
className: (0, _classnames.default)(alertClasses, getAlertColorType('bg'), getAlertColorType('border'))
|
|
227
227
|
}, events, {
|
|
228
228
|
ref: alertRef
|
|
229
229
|
}), showIcon && iconNode, /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -109,12 +109,14 @@
|
|
|
109
109
|
z-index: var(--kd-g-z-index-apex, 9999);
|
|
110
110
|
display: none;
|
|
111
111
|
width: 100%;
|
|
112
|
-
padding: var(--kd-c-alert-sizing-padding-
|
|
112
|
+
padding: var(--kd-c-alert-sizing-padding-vertical, 12px) var(--kd-c-alert-sizing-padding-horizontal, 20px);
|
|
113
113
|
-webkit-box-align: center;
|
|
114
114
|
-ms-flex-align: center;
|
|
115
115
|
align-items: center;
|
|
116
116
|
-webkit-transition: display 3s;
|
|
117
117
|
transition: display 3s;
|
|
118
|
+
border-radius: var(--kd-c-alert-radius-border, 4px);
|
|
119
|
+
border: 1px solid;
|
|
118
120
|
}
|
|
119
121
|
.kd-alert-banner-container {
|
|
120
122
|
display: -webkit-box;
|
|
@@ -140,23 +142,24 @@
|
|
|
140
142
|
.kd-alert.alert-info-bg-color {
|
|
141
143
|
background-color: var(--kd-c-alert-color-background-info, var(--kd-g-color-background-ongoing, #f2f9ff));
|
|
142
144
|
}
|
|
143
|
-
.kd-alert.alert-success-
|
|
144
|
-
color: var(--kd-c-alert-color-
|
|
145
|
+
.kd-alert.alert-success-border-color {
|
|
146
|
+
border-color: var(--kd-c-alert-color-border-success, #DCFAE4);
|
|
145
147
|
}
|
|
146
|
-
.kd-alert.alert-warning-
|
|
147
|
-
color: var(--kd-c-alert-color-
|
|
148
|
+
.kd-alert.alert-warning-border-color {
|
|
149
|
+
border-color: var(--kd-c-alert-color-border-warning, #FFF1D4);
|
|
148
150
|
}
|
|
149
|
-
.kd-alert.alert-error-
|
|
150
|
-
color: var(--kd-c-alert-color-
|
|
151
|
+
.kd-alert.alert-error-border-color {
|
|
152
|
+
border-color: var(--kd-c-alert-color-border-error, #FFDBE0);
|
|
151
153
|
}
|
|
152
|
-
.kd-alert.alert-info-
|
|
153
|
-
color: var(--kd-c-alert-color-
|
|
154
|
+
.kd-alert.alert-info-border-color {
|
|
155
|
+
border-color: var(--kd-c-alert-color-border-info, #E0EFFF);
|
|
154
156
|
}
|
|
155
157
|
.kd-alert-icon {
|
|
156
158
|
display: -webkit-box;
|
|
157
159
|
display: -ms-flexbox;
|
|
158
160
|
display: flex;
|
|
159
161
|
cursor: default;
|
|
162
|
+
height: var(--kd-c-alert-message-icon-font-size, var(--kd-g-font-size-middle, 14px));
|
|
160
163
|
margin-right: var(--kd-c-alert-message-icon-sizing-margin-right, 8px);
|
|
161
164
|
font-size: var(--kd-c-alert-message-icon-font-size, var(--kd-g-font-size-middle, 14px));
|
|
162
165
|
}
|
|
@@ -164,9 +167,22 @@
|
|
|
164
167
|
-ms-flex-item-align: center;
|
|
165
168
|
align-self: center;
|
|
166
169
|
}
|
|
170
|
+
.kd-alert-icon.alert-success-icon-color {
|
|
171
|
+
color: var(--kd-c-alert-color-icon-success, var(--kd-g-color-success, #1ba854));
|
|
172
|
+
}
|
|
173
|
+
.kd-alert-icon.alert-warning-icon-color {
|
|
174
|
+
color: var(--kd-c-alert-color-icon-warning, var(--kd-g-color-warning, #ff991c));
|
|
175
|
+
}
|
|
176
|
+
.kd-alert-icon.alert-error-icon-color {
|
|
177
|
+
color: var(--kd-c-alert-color-icon-error, var(--kd-g-color-error, #fb2323));
|
|
178
|
+
}
|
|
179
|
+
.kd-alert-icon.alert-info-icon-color {
|
|
180
|
+
color: var(--kd-c-alert-color-icon-info, var(--kd-g-color-ongoing, #276ff5));
|
|
181
|
+
}
|
|
167
182
|
.kd-alert-message {
|
|
183
|
+
color: var(--kd-c-alert-color-text, var(--kd-g-color-text-primary, #212121));
|
|
168
184
|
font-size: var(--kd-c-alert-message-font-size, var(--kd-g-font-size-small, 12px));
|
|
169
|
-
line-height:
|
|
185
|
+
line-height: 16px;
|
|
170
186
|
display: -webkit-box;
|
|
171
187
|
display: -ms-flexbox;
|
|
172
188
|
display: flex;
|
|
@@ -196,10 +212,10 @@
|
|
|
196
212
|
display: -webkit-box;
|
|
197
213
|
display: -ms-flexbox;
|
|
198
214
|
display: flex;
|
|
215
|
+
height: var(--kd-c-alert-message-icon-font-size, var(--kd-g-font-size-middle, 14px));
|
|
199
216
|
margin-left: var(--kd-c-alert-close-icon-sizing-margin-left, 8px);
|
|
200
217
|
color: var(--kd-c-alert-close-icon-color-text, var(--kd-g-color-text-secondary, #666));
|
|
201
218
|
font-size: var(--kd-c-alert-close-icon-font-size, var(--kd-g-font-size-middle, 14px));
|
|
202
|
-
justify-self: flex-end;
|
|
203
219
|
cursor: pointer;
|
|
204
220
|
}
|
|
205
221
|
.kd-alert-close-icon:hover {
|
|
@@ -16,11 +16,18 @@
|
|
|
16
16
|
@info: @alert-info-bg-color;
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
.alert-
|
|
20
|
-
@success: @alert-success-
|
|
21
|
-
@warning: @alert-warning-
|
|
22
|
-
@error: @alert-error-
|
|
23
|
-
@info: @alert-info-
|
|
19
|
+
.alert-icon-type-set() {
|
|
20
|
+
@success: @alert-success-icon-color;
|
|
21
|
+
@warning: @alert-warning-icon-color;
|
|
22
|
+
@error: @alert-error-icon-color;
|
|
23
|
+
@info: @alert-info-icon-color;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.alert-border-type-set() {
|
|
27
|
+
@success: @alert-success-border-color;
|
|
28
|
+
@warning: @alert-warning-border-color;
|
|
29
|
+
@error: @alert-error-border-color;
|
|
30
|
+
@info: @alert-info-border-color;
|
|
24
31
|
}
|
|
25
32
|
|
|
26
33
|
@alert-transition-fn: cubic-bezier(0.32, 0.94, 0.6, 1);
|
|
@@ -36,9 +43,11 @@
|
|
|
36
43
|
z-index: @z-index-apex;
|
|
37
44
|
display: none;
|
|
38
45
|
width: 100%;
|
|
39
|
-
padding: @alert-padding-
|
|
46
|
+
padding: @alert-padding-vertical @alert-padding-horizontal;
|
|
40
47
|
align-items: center;
|
|
41
48
|
transition: display 3s;
|
|
49
|
+
border-radius: @alert-radius-border;
|
|
50
|
+
border: 1px solid;
|
|
42
51
|
}
|
|
43
52
|
&-banner-container {
|
|
44
53
|
display: flex;
|
|
@@ -50,19 +59,24 @@
|
|
|
50
59
|
each(.alert-bg-type-set(), {
|
|
51
60
|
.alert-bg-type(@key, @value);
|
|
52
61
|
});
|
|
53
|
-
each(.alert-
|
|
54
|
-
.alert-
|
|
62
|
+
each(.alert-border-type-set(), {
|
|
63
|
+
.alert-border-type(@key, @value);
|
|
55
64
|
});
|
|
56
65
|
&-icon {
|
|
57
66
|
display: flex;
|
|
58
67
|
cursor: default;
|
|
59
68
|
.icon-center();
|
|
69
|
+
height: @alert-message-icon-font-size;
|
|
60
70
|
margin-right: @alert-message-icon-margin-right;
|
|
61
71
|
font-size: @alert-message-icon-font-size;
|
|
72
|
+
each(.alert-icon-type-set(), {
|
|
73
|
+
.alert-icon-type(@key, @value);
|
|
74
|
+
});
|
|
62
75
|
}
|
|
63
76
|
&-message {
|
|
77
|
+
color: @alert-message-color-text;
|
|
64
78
|
font-size: @alert-message-font-size;
|
|
65
|
-
line-height:
|
|
79
|
+
line-height: 16px;
|
|
66
80
|
display: flex;
|
|
67
81
|
flex-grow: 1;
|
|
68
82
|
cursor: default;
|
|
@@ -86,10 +100,10 @@
|
|
|
86
100
|
}
|
|
87
101
|
&-close-icon {
|
|
88
102
|
display: flex;
|
|
103
|
+
height: @alert-message-icon-font-size;
|
|
89
104
|
margin-left: @alert-close-icon-margin-left;
|
|
90
105
|
color: @alert-close-icon-color;
|
|
91
106
|
font-size: @alert-close-icon-font-size;
|
|
92
|
-
justify-self: flex-end;
|
|
93
107
|
cursor: pointer;
|
|
94
108
|
&:hover {
|
|
95
109
|
color: @alert-close-icon-color-hover;
|
|
@@ -4,12 +4,18 @@
|
|
|
4
4
|
}
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
.alert-
|
|
8
|
-
&.alert-@{type}-
|
|
7
|
+
.alert-icon-type(@type, @color) {
|
|
8
|
+
&.alert-@{type}-icon-color {
|
|
9
9
|
color: @color
|
|
10
10
|
}
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
+
.alert-border-type(@type, @color) {
|
|
14
|
+
&.alert-@{type}-border-color {
|
|
15
|
+
border-color: @color
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
13
19
|
.square(@side-length) {
|
|
14
20
|
width: @side-length;
|
|
15
21
|
height: @side-length;
|
|
@@ -8,10 +8,16 @@
|
|
|
8
8
|
@alert-error-bg-color: var(~'@{alert-custom-prefix}-color-background-error', @color-background-error); // 反馈浮层错误提示的背景色
|
|
9
9
|
@alert-info-bg-color: var(~'@{alert-custom-prefix}-color-background-info', @color-background-ongoing); // 反馈浮层一般提示的背景色
|
|
10
10
|
|
|
11
|
-
@alert-
|
|
12
|
-
@alert-
|
|
13
|
-
@alert-
|
|
14
|
-
@alert-
|
|
11
|
+
@alert-message-color-text: var(~'@{alert-custom-prefix}-color-text', @color-text-primary); // 反馈浮层提示的文字色
|
|
12
|
+
@alert-success-icon-color: var(~'@{alert-custom-prefix}-color-icon-success', @color-success); // 反馈浮层成功提示的图标颜色
|
|
13
|
+
@alert-warning-icon-color: var(~'@{alert-custom-prefix}-color-icon-warning', @color-warning); // 反馈浮层警告提示的图标颜色
|
|
14
|
+
@alert-error-icon-color: var(~'@{alert-custom-prefix}-color-icon-error', @color-error); // 反馈浮层错误提示的图标颜色
|
|
15
|
+
@alert-info-icon-color: var(~'@{alert-custom-prefix}-color-icon-info', @color-ongoing); // 反馈浮层一般提示的图标颜色
|
|
16
|
+
|
|
17
|
+
@alert-success-border-color: var(~'@{alert-custom-prefix}-color-border-success', #DCFAE4); // 反馈浮层成功提示的边框色
|
|
18
|
+
@alert-warning-border-color: var(~'@{alert-custom-prefix}-color-border-warning', #FFF1D4); // 反馈浮层警告提示的边框色
|
|
19
|
+
@alert-error-border-color: var(~'@{alert-custom-prefix}-color-border-error', #FFDBE0); // 反馈浮层错误提示的边框色
|
|
20
|
+
@alert-info-border-color: var(~'@{alert-custom-prefix}-color-border-info', #E0EFFF); // 反馈浮层一般提示的边框色
|
|
15
21
|
|
|
16
22
|
@alert-close-icon-color: var(~'@{alert-custom-prefix}-close-icon-color-text', @color-text-secondary);
|
|
17
23
|
@alert-close-icon-color-hover: var(~'@{alert-custom-prefix}-close-icon-color-text-hover', @color-theme-hover);
|
|
@@ -22,8 +28,10 @@
|
|
|
22
28
|
@alert-close-icon-font-size: var(~'@{alert-custom-prefix}-close-icon-font-size', @font-size-middle);
|
|
23
29
|
|
|
24
30
|
// spacing
|
|
25
|
-
@alert-padding-
|
|
26
|
-
@alert-padding-
|
|
27
|
-
@alert-padding-horizontal: var(~'@{alert-custom-prefix}-sizing-padding-horizontal', 12px);
|
|
31
|
+
@alert-padding-vertical: var(~'@{alert-custom-prefix}-sizing-padding-vertical', 12px);
|
|
32
|
+
@alert-padding-horizontal: var(~'@{alert-custom-prefix}-sizing-padding-horizontal', 20px);
|
|
28
33
|
@alert-message-icon-margin-right: var(~'@{alert-custom-prefix}-message-icon-sizing-margin-right', 8px);
|
|
29
|
-
@alert-close-icon-margin-left: var(~'@{alert-custom-prefix}-close-icon-sizing-margin-left', 8px);
|
|
34
|
+
@alert-close-icon-margin-left: var(~'@{alert-custom-prefix}-close-icon-sizing-margin-left', 8px);
|
|
35
|
+
|
|
36
|
+
// radius
|
|
37
|
+
@alert-radius-border: var(~'@{alert-custom-prefix}-radius-border', 4px);
|
package/lib/drawer/drawer.js
CHANGED
package/lib/dropdown/dropdown.js
CHANGED
|
@@ -35,6 +35,16 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
|
|
|
35
35
|
|
|
36
36
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
37
37
|
|
|
38
|
+
var findItem = function findItem(element) {
|
|
39
|
+
var isItem = element.className === 'kd-dropdown-menu-item';
|
|
40
|
+
|
|
41
|
+
if (isItem) {
|
|
42
|
+
return element;
|
|
43
|
+
} else {
|
|
44
|
+
return element.parentNode ? findItem(element.parentNode) : null;
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
|
|
38
48
|
var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
39
49
|
var _a, _b, _c;
|
|
40
50
|
|
|
@@ -65,7 +75,7 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
65
75
|
setVisible(!!props.visible);
|
|
66
76
|
}, [props.visible]);
|
|
67
77
|
var child = /*#__PURE__*/React.cloneElement(React.Children.only(children), {
|
|
68
|
-
ref: ref,
|
|
78
|
+
ref: children.ref || ref,
|
|
69
79
|
className: (0, _classnames.default)("".concat(prefixCls, "-trigger"), children.props.className, {
|
|
70
80
|
disabled: disabled
|
|
71
81
|
})
|
|
@@ -83,13 +93,12 @@ var Dropdown = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
83
93
|
var menuSelectable = ((_b = menu.props) === null || _b === void 0 ? void 0 : _b.selectable) === undefined ? selectable : (_c = menu.props) === null || _c === void 0 ? void 0 : _c.selectable;
|
|
84
94
|
|
|
85
95
|
var handleItemClick = function handleItemClick(e) {
|
|
86
|
-
var _a
|
|
96
|
+
var _a;
|
|
87
97
|
|
|
88
|
-
var
|
|
89
|
-
var
|
|
90
|
-
var key = ((_a = currentTarget.dataset) === null || _a === void 0 ? void 0 : _a.key) || ((_b = currentTarget.parentNode.dataset) === null || _b === void 0 ? void 0 : _b.key);
|
|
98
|
+
var item = findItem(e.target);
|
|
99
|
+
var key = (_a = item === null || item === void 0 ? void 0 : item.dataset) === null || _a === void 0 ? void 0 : _a.key;
|
|
91
100
|
|
|
92
|
-
if (
|
|
101
|
+
if ((item === null || item === void 0 ? void 0 : item.className.indexOf('disabled')) === -1 && key) {
|
|
93
102
|
if (isMenu && menu.props.onClick) {
|
|
94
103
|
menu.props.onClick(key);
|
|
95
104
|
} else if (onItemClick) {
|