assui 2.0.102 → 2.0.105
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/es/keep-tab/index.js +1 -1
- package/es/label-auto-complete/index.js +2 -1
- package/es/label-input/index.d.ts +2 -0
- package/es/label-input/index.js +14 -12
- package/es/label-select/index.js +1 -1
- package/es/label-text-area/index.js +1 -1
- package/es/label-tree-select/index.d.ts +14 -0
- package/es/label-tree-select/index.js +113 -0
- package/es/label-tree-select/style/index.css +46 -0
- package/es/label-tree-select/style/index.d.ts +2 -0
- package/es/label-tree-select/style/index.js +2 -0
- package/es/label-tree-select/style/index.less +56 -0
- package/es/single-img-upload/index.js +1 -0
- package/lib/keep-tab/index.js +2 -2
- package/lib/label-auto-complete/index.js +5 -3
- package/lib/label-input/index.d.ts +2 -0
- package/lib/label-input/index.js +15 -13
- package/lib/label-select/index.js +2 -2
- package/lib/label-text-area/index.js +2 -2
- package/lib/label-tree-select/index.d.ts +14 -0
- package/lib/label-tree-select/index.js +129 -0
- package/lib/label-tree-select/style/index.css +46 -0
- package/lib/label-tree-select/style/index.d.ts +2 -0
- package/lib/label-tree-select/style/index.js +9 -0
- package/lib/label-tree-select/style/index.less +56 -0
- package/lib/single-img-upload/index.js +1 -0
- package/package.json +3 -3
package/es/keep-tab/index.js
CHANGED
|
@@ -55,7 +55,7 @@ var __read = this && this.__read || function (o, n) {
|
|
|
55
55
|
};
|
|
56
56
|
|
|
57
57
|
import * as React from 'react';
|
|
58
|
-
import
|
|
58
|
+
import find from 'lodash/find';
|
|
59
59
|
import qsHelp from 'aa-utils/lib/qsHelp';
|
|
60
60
|
import Badge from 'antd/es/badge';
|
|
61
61
|
import Tabs from 'antd/es/tabs';
|
|
@@ -45,7 +45,8 @@ import React from 'react';
|
|
|
45
45
|
import useControllableValue from 'ahooks/lib/useControllableValue';
|
|
46
46
|
import AutoComplete from 'antd/es/auto-complete';
|
|
47
47
|
import classNames from 'classnames';
|
|
48
|
-
import
|
|
48
|
+
import omit from 'lodash/omit';
|
|
49
|
+
import trimStart from 'lodash/trimStart';
|
|
49
50
|
|
|
50
51
|
var LabelAutoComplete = function LabelAutoComplete(props) {
|
|
51
52
|
var className = props.className,
|
package/es/label-input/index.js
CHANGED
|
@@ -27,7 +27,7 @@ var __read = this && this.__read || function (o, n) {
|
|
|
27
27
|
|
|
28
28
|
import React from 'react';
|
|
29
29
|
import classNames from 'classnames';
|
|
30
|
-
import
|
|
30
|
+
import trimStart from 'lodash/trimStart';
|
|
31
31
|
import EyeFilled from 'a-icons/lib/EyeFilled';
|
|
32
32
|
import EyeOutlined from 'a-icons/lib/EyeOutlined';
|
|
33
33
|
import useControllableValue from 'ahooks/lib/useControllableValue';
|
|
@@ -58,23 +58,25 @@ var LabelInput = function LabelInput(props) {
|
|
|
58
58
|
onBlur = props.onBlur,
|
|
59
59
|
_a = props.type,
|
|
60
60
|
type = _a === void 0 ? 'text' : _a,
|
|
61
|
-
maxLength = props.maxLength
|
|
61
|
+
maxLength = props.maxLength,
|
|
62
|
+
_b = props.baseMinWidth,
|
|
63
|
+
baseMinWidth = _b === void 0 ? 50 : _b;
|
|
62
64
|
var labelDomRef = React.useRef(null);
|
|
63
65
|
var labelSize = useSize(labelDomRef);
|
|
64
66
|
|
|
65
|
-
var
|
|
66
|
-
focused =
|
|
67
|
-
setFocused =
|
|
67
|
+
var _c = __read(React.useState(false), 2),
|
|
68
|
+
focused = _c[0],
|
|
69
|
+
setFocused = _c[1];
|
|
68
70
|
|
|
69
|
-
var
|
|
71
|
+
var _d = __read(useControllableValue(props, {
|
|
70
72
|
defaultValue: ''
|
|
71
73
|
}), 2),
|
|
72
|
-
value =
|
|
73
|
-
setValue =
|
|
74
|
+
value = _d[0],
|
|
75
|
+
setValue = _d[1];
|
|
74
76
|
|
|
75
|
-
var
|
|
76
|
-
inputType =
|
|
77
|
-
setInputType =
|
|
77
|
+
var _e = __read(React.useState(type), 2),
|
|
78
|
+
inputType = _e[0],
|
|
79
|
+
setInputType = _e[1];
|
|
78
80
|
|
|
79
81
|
var InputDomRef = React.useRef(null);
|
|
80
82
|
var isPasswordInput = type === 'password';
|
|
@@ -103,7 +105,7 @@ var LabelInput = function LabelInput(props) {
|
|
|
103
105
|
var onChangeInputType = React.useCallback(function (nextInputType) {
|
|
104
106
|
setInputType(nextInputType);
|
|
105
107
|
}, []);
|
|
106
|
-
var controlMinWidth = (labelSize === null || labelSize === void 0 ? void 0 : labelSize.width) ? labelSize.width +
|
|
108
|
+
var controlMinWidth = (labelSize === null || labelSize === void 0 ? void 0 : labelSize.width) ? labelSize.width + baseMinWidth : undefined;
|
|
107
109
|
return /*#__PURE__*/React.createElement("div", {
|
|
108
110
|
className: classNames('label-input-control', className),
|
|
109
111
|
id: id,
|
package/es/label-select/index.js
CHANGED
|
@@ -46,7 +46,7 @@ import useControllableValue from 'ahooks/lib/useControllableValue';
|
|
|
46
46
|
import Select from 'antd/es/select';
|
|
47
47
|
import classNames from 'classnames';
|
|
48
48
|
import ArrowDropDownFilled from 'a-icons/lib/ArrowDropDownFilled';
|
|
49
|
-
import
|
|
49
|
+
import omit from 'lodash/omit';
|
|
50
50
|
var Option = Select.Option;
|
|
51
51
|
export { Option };
|
|
52
52
|
|
|
@@ -28,7 +28,7 @@ var __read = this && this.__read || function (o, n) {
|
|
|
28
28
|
import React from 'react';
|
|
29
29
|
import classNames from 'classnames';
|
|
30
30
|
import { useControllableValue } from 'ahooks';
|
|
31
|
-
import
|
|
31
|
+
import trimStart from 'lodash/trimStart';
|
|
32
32
|
|
|
33
33
|
var LabelTextArea = function LabelTextArea(props) {
|
|
34
34
|
var className = props.className,
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { TreeSelectProps } from 'antd/es/tree-select';
|
|
3
|
+
export interface LabelTreeSelectProps extends Omit<TreeSelectProps<string[]>, 'onDropdownVisibleChange'> {
|
|
4
|
+
/** 输入框的label */
|
|
5
|
+
label: React.ReactNode;
|
|
6
|
+
/** 输入框value的单位 */
|
|
7
|
+
unit?: React.ReactNode;
|
|
8
|
+
onDropdownVisibleChange?: (value: boolean) => void;
|
|
9
|
+
}
|
|
10
|
+
declare const LabelTreeSelect: {
|
|
11
|
+
(props: LabelTreeSelectProps): JSX.Element;
|
|
12
|
+
Option: new (text?: string | undefined, value?: string | undefined, defaultSelected?: boolean | undefined, selected?: boolean | undefined) => HTMLOptionElement;
|
|
13
|
+
};
|
|
14
|
+
export default LabelTreeSelect;
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
var __assign = this && this.__assign || function () {
|
|
2
|
+
__assign = Object.assign || function (t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
|
|
6
|
+
for (var p in s) {
|
|
7
|
+
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
return __assign.apply(this, arguments);
|
|
15
|
+
};
|
|
16
|
+
|
|
17
|
+
var __read = this && this.__read || function (o, n) {
|
|
18
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
19
|
+
if (!m) return o;
|
|
20
|
+
var i = m.call(o),
|
|
21
|
+
r,
|
|
22
|
+
ar = [],
|
|
23
|
+
e;
|
|
24
|
+
|
|
25
|
+
try {
|
|
26
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) {
|
|
27
|
+
ar.push(r.value);
|
|
28
|
+
}
|
|
29
|
+
} catch (error) {
|
|
30
|
+
e = {
|
|
31
|
+
error: error
|
|
32
|
+
};
|
|
33
|
+
} finally {
|
|
34
|
+
try {
|
|
35
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
36
|
+
} finally {
|
|
37
|
+
if (e) throw e.error;
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
return ar;
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
import React from 'react';
|
|
45
|
+
import useControllableValue from 'ahooks/lib/useControllableValue';
|
|
46
|
+
import TreeSelect from 'antd/es/tree-select';
|
|
47
|
+
import classNames from 'classnames';
|
|
48
|
+
import omit from 'lodash/omit';
|
|
49
|
+
|
|
50
|
+
var LabelTreeSelect = function LabelTreeSelect(props) {
|
|
51
|
+
var className = props.className,
|
|
52
|
+
label = props.label,
|
|
53
|
+
unit = props.unit,
|
|
54
|
+
_a = props.showSearch,
|
|
55
|
+
showSearch = _a === void 0 ? false : _a,
|
|
56
|
+
onDropdownVisibleChange = props.onDropdownVisibleChange;
|
|
57
|
+
var selectRef = React.useRef(null);
|
|
58
|
+
|
|
59
|
+
var _b = __read(useControllableValue(props, {
|
|
60
|
+
valuePropName: 'open',
|
|
61
|
+
trigger: 'setOpen'
|
|
62
|
+
}), 2),
|
|
63
|
+
open = _b[0],
|
|
64
|
+
setOpen = _b[1];
|
|
65
|
+
|
|
66
|
+
var _c = __read(useControllableValue(props), 2),
|
|
67
|
+
value = _c[0],
|
|
68
|
+
setValue = _c[1];
|
|
69
|
+
|
|
70
|
+
var handleChange = function handleChange(nextValue) {
|
|
71
|
+
setValue(nextValue);
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
var handleLabelClick = function handleLabelClick() {
|
|
75
|
+
var _a;
|
|
76
|
+
|
|
77
|
+
if (!open) {
|
|
78
|
+
setOpen(!open);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
(_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
82
|
+
};
|
|
83
|
+
|
|
84
|
+
var handleDropdownVisibleChange = function handleDropdownVisibleChange(nextOpen) {
|
|
85
|
+
setOpen(nextOpen);
|
|
86
|
+
onDropdownVisibleChange === null || onDropdownVisibleChange === void 0 ? void 0 : onDropdownVisibleChange(nextOpen);
|
|
87
|
+
};
|
|
88
|
+
|
|
89
|
+
var isValueNotEmpty = !!(value === null || value === void 0 ? void 0 : value.length);
|
|
90
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
91
|
+
className: classNames({
|
|
92
|
+
'label-tree-select': true,
|
|
93
|
+
'label-tree-select-label-scale': open || isValueNotEmpty
|
|
94
|
+
}, className)
|
|
95
|
+
}, /*#__PURE__*/React.createElement(TreeSelect, __assign({
|
|
96
|
+
showSearch: showSearch
|
|
97
|
+
}, omit(props, ['open', 'onChange', 'className', 'label']), {
|
|
98
|
+
open: open,
|
|
99
|
+
ref: selectRef,
|
|
100
|
+
size: "large",
|
|
101
|
+
className: "label-select-selector",
|
|
102
|
+
onChange: handleChange,
|
|
103
|
+
onDropdownVisibleChange: handleDropdownVisibleChange
|
|
104
|
+
})), isValueNotEmpty && /*#__PURE__*/React.createElement("div", {
|
|
105
|
+
className: "label-tree-select-value-length"
|
|
106
|
+
}, /*#__PURE__*/React.createElement("span", null, value.length), unit && /*#__PURE__*/React.createElement("span", null, unit)), /*#__PURE__*/React.createElement("label", {
|
|
107
|
+
className: "label-tree-select-text",
|
|
108
|
+
onClick: handleLabelClick
|
|
109
|
+
}, label));
|
|
110
|
+
};
|
|
111
|
+
|
|
112
|
+
export default LabelTreeSelect;
|
|
113
|
+
LabelTreeSelect.Option = Option;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
/* stylelint-disable indentation */
|
|
2
|
+
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
|
|
3
|
+
/* stylelint-disable no-duplicate-selectors */
|
|
4
|
+
/* stylelint-disable */
|
|
5
|
+
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
|
|
6
|
+
.label-tree-select {
|
|
7
|
+
position: relative;
|
|
8
|
+
width: 100%;
|
|
9
|
+
height: 100%;
|
|
10
|
+
}
|
|
11
|
+
.label-tree-select .ant-select:not(.ant-select-customize-input) .ant-select-selector {
|
|
12
|
+
height: 52px;
|
|
13
|
+
border: 1px solid #e5e5e5;
|
|
14
|
+
border-radius: 12px;
|
|
15
|
+
outline: none;
|
|
16
|
+
}
|
|
17
|
+
.label-tree-select .ant-select-selection-overflow {
|
|
18
|
+
display: none;
|
|
19
|
+
}
|
|
20
|
+
.label-tree-select .ant-select-open:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
|
|
21
|
+
border-color: #ff6b00;
|
|
22
|
+
box-shadow: none;
|
|
23
|
+
}
|
|
24
|
+
.label-tree-select-text {
|
|
25
|
+
position: absolute;
|
|
26
|
+
top: 18px;
|
|
27
|
+
left: 16px;
|
|
28
|
+
z-index: 2;
|
|
29
|
+
height: 20px;
|
|
30
|
+
color: #9aa5b5;
|
|
31
|
+
font-size: 14px;
|
|
32
|
+
line-height: 20px;
|
|
33
|
+
transform-origin: top left;
|
|
34
|
+
cursor: pointer;
|
|
35
|
+
transition: all 0.2s ease-out;
|
|
36
|
+
}
|
|
37
|
+
.label-tree-select-label-scale .label-tree-select-text {
|
|
38
|
+
transform: translateY(-10px) scale(0.86);
|
|
39
|
+
cursor: text;
|
|
40
|
+
pointer-events: none;
|
|
41
|
+
}
|
|
42
|
+
.label-tree-select-label-scale .label-tree-select-value-length {
|
|
43
|
+
position: absolute;
|
|
44
|
+
top: 23px;
|
|
45
|
+
left: 16px;
|
|
46
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/* stylelint-disable indentation */
|
|
2
|
+
@import '~antd/es/style/themes/index';
|
|
3
|
+
|
|
4
|
+
@color_9aa5b5: #9aa5b5;
|
|
5
|
+
@font-size-base: 14px;
|
|
6
|
+
|
|
7
|
+
.label-tree-select {
|
|
8
|
+
position: relative;
|
|
9
|
+
width: 100%;
|
|
10
|
+
height: 100%;
|
|
11
|
+
|
|
12
|
+
.@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input) .@{ant-prefix}-select-selector {
|
|
13
|
+
height: 52px;
|
|
14
|
+
border: 1px solid #e5e5e5;
|
|
15
|
+
border-radius: 12px;
|
|
16
|
+
outline: none;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.@{ant-prefix}-select-selection-overflow {
|
|
20
|
+
display: none;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.@{ant-prefix}-select-open:not(.@{ant-prefix}-select-disabled).@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input)
|
|
24
|
+
.@{ant-prefix}-select-selector {
|
|
25
|
+
border-color: #ff6b00;
|
|
26
|
+
box-shadow: none;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&-text {
|
|
30
|
+
position: absolute;
|
|
31
|
+
top: 18px;
|
|
32
|
+
left: 16px;
|
|
33
|
+
z-index: 2;
|
|
34
|
+
height: 20px;
|
|
35
|
+
color: @color_9aa5b5;
|
|
36
|
+
font-size: @font-size-base;
|
|
37
|
+
line-height: 20px;
|
|
38
|
+
transform-origin: top left;
|
|
39
|
+
cursor: pointer;
|
|
40
|
+
transition: all 0.2s ease-out;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
&-label-scale {
|
|
44
|
+
.label-tree-select-text {
|
|
45
|
+
transform: translateY(-10px) scale(0.86);
|
|
46
|
+
cursor: text;
|
|
47
|
+
pointer-events: none;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.label-tree-select-value-length {
|
|
51
|
+
position: absolute;
|
|
52
|
+
top: 23px;
|
|
53
|
+
left: 16px;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
package/lib/keep-tab/index.js
CHANGED
|
@@ -102,7 +102,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
102
102
|
|
|
103
103
|
var React = __importStar(require("react"));
|
|
104
104
|
|
|
105
|
-
var
|
|
105
|
+
var find_1 = __importDefault(require("lodash/find"));
|
|
106
106
|
|
|
107
107
|
var qsHelp_1 = __importDefault(require("aa-utils/lib/qsHelp"));
|
|
108
108
|
|
|
@@ -148,7 +148,7 @@ var KeepTab = function KeepTab(props) {
|
|
|
148
148
|
var _a;
|
|
149
149
|
|
|
150
150
|
if (!('activeKey' in props)) {
|
|
151
|
-
var resultActiveTab =
|
|
151
|
+
var resultActiveTab = find_1["default"](arrayChildren, {
|
|
152
152
|
key: urlParams[saveActiveKeyName]
|
|
153
153
|
});
|
|
154
154
|
|
|
@@ -61,7 +61,9 @@ var auto_complete_1 = __importDefault(require("antd/es/auto-complete"));
|
|
|
61
61
|
|
|
62
62
|
var classnames_1 = __importDefault(require("classnames"));
|
|
63
63
|
|
|
64
|
-
var
|
|
64
|
+
var omit_1 = __importDefault(require("lodash/omit"));
|
|
65
|
+
|
|
66
|
+
var trimStart_1 = __importDefault(require("lodash/trimStart"));
|
|
65
67
|
|
|
66
68
|
var LabelAutoComplete = function LabelAutoComplete(props) {
|
|
67
69
|
var className = props.className,
|
|
@@ -82,7 +84,7 @@ var LabelAutoComplete = function LabelAutoComplete(props) {
|
|
|
82
84
|
setValue = _b[1];
|
|
83
85
|
|
|
84
86
|
var handleChange = function handleChange(nextValue) {
|
|
85
|
-
var finallyValue =
|
|
87
|
+
var finallyValue = trimStart_1["default"](nextValue);
|
|
86
88
|
setValue(finallyValue);
|
|
87
89
|
onChange && onChange(finallyValue, options || []);
|
|
88
90
|
};
|
|
@@ -106,7 +108,7 @@ var LabelAutoComplete = function LabelAutoComplete(props) {
|
|
|
106
108
|
'label-auto-complete': true,
|
|
107
109
|
'label-auto-complete-label-scale': open || value
|
|
108
110
|
}, className)
|
|
109
|
-
}, react_1["default"].createElement(auto_complete_1["default"], __assign({},
|
|
111
|
+
}, react_1["default"].createElement(auto_complete_1["default"], __assign({}, omit_1["default"](props, ['open', 'onChange', 'className', 'label']), {
|
|
110
112
|
open: open,
|
|
111
113
|
ref: autoComplete,
|
|
112
114
|
value: value,
|
package/lib/label-input/index.js
CHANGED
|
@@ -41,7 +41,7 @@ var react_1 = __importDefault(require("react"));
|
|
|
41
41
|
|
|
42
42
|
var classnames_1 = __importDefault(require("classnames"));
|
|
43
43
|
|
|
44
|
-
var
|
|
44
|
+
var trimStart_1 = __importDefault(require("lodash/trimStart"));
|
|
45
45
|
|
|
46
46
|
var EyeFilled_1 = __importDefault(require("a-icons/lib/EyeFilled"));
|
|
47
47
|
|
|
@@ -77,23 +77,25 @@ var LabelInput = function LabelInput(props) {
|
|
|
77
77
|
onBlur = props.onBlur,
|
|
78
78
|
_a = props.type,
|
|
79
79
|
type = _a === void 0 ? 'text' : _a,
|
|
80
|
-
maxLength = props.maxLength
|
|
80
|
+
maxLength = props.maxLength,
|
|
81
|
+
_b = props.baseMinWidth,
|
|
82
|
+
baseMinWidth = _b === void 0 ? 50 : _b;
|
|
81
83
|
var labelDomRef = react_1["default"].useRef(null);
|
|
82
84
|
var labelSize = useSize_1["default"](labelDomRef);
|
|
83
85
|
|
|
84
|
-
var
|
|
85
|
-
focused =
|
|
86
|
-
setFocused =
|
|
86
|
+
var _c = __read(react_1["default"].useState(false), 2),
|
|
87
|
+
focused = _c[0],
|
|
88
|
+
setFocused = _c[1];
|
|
87
89
|
|
|
88
|
-
var
|
|
90
|
+
var _d = __read(useControllableValue_1["default"](props, {
|
|
89
91
|
defaultValue: ''
|
|
90
92
|
}), 2),
|
|
91
|
-
value =
|
|
92
|
-
setValue =
|
|
93
|
+
value = _d[0],
|
|
94
|
+
setValue = _d[1];
|
|
93
95
|
|
|
94
|
-
var
|
|
95
|
-
inputType =
|
|
96
|
-
setInputType =
|
|
96
|
+
var _e = __read(react_1["default"].useState(type), 2),
|
|
97
|
+
inputType = _e[0],
|
|
98
|
+
setInputType = _e[1];
|
|
97
99
|
|
|
98
100
|
var InputDomRef = react_1["default"].useRef(null);
|
|
99
101
|
var isPasswordInput = type === 'password';
|
|
@@ -109,7 +111,7 @@ var LabelInput = function LabelInput(props) {
|
|
|
109
111
|
};
|
|
110
112
|
|
|
111
113
|
var handleChange = function handleChange(e) {
|
|
112
|
-
var finallyValue =
|
|
114
|
+
var finallyValue = trimStart_1["default"](e.target.value);
|
|
113
115
|
setValue(finallyValue);
|
|
114
116
|
};
|
|
115
117
|
|
|
@@ -122,7 +124,7 @@ var LabelInput = function LabelInput(props) {
|
|
|
122
124
|
var onChangeInputType = react_1["default"].useCallback(function (nextInputType) {
|
|
123
125
|
setInputType(nextInputType);
|
|
124
126
|
}, []);
|
|
125
|
-
var controlMinWidth = (labelSize === null || labelSize === void 0 ? void 0 : labelSize.width) ? labelSize.width +
|
|
127
|
+
var controlMinWidth = (labelSize === null || labelSize === void 0 ? void 0 : labelSize.width) ? labelSize.width + baseMinWidth : undefined;
|
|
126
128
|
return react_1["default"].createElement("div", {
|
|
127
129
|
className: classnames_1["default"]('label-input-control', className),
|
|
128
130
|
id: id,
|
|
@@ -64,7 +64,7 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
|
64
64
|
|
|
65
65
|
var ArrowDropDownFilled_1 = __importDefault(require("a-icons/lib/ArrowDropDownFilled"));
|
|
66
66
|
|
|
67
|
-
var
|
|
67
|
+
var omit_1 = __importDefault(require("lodash/omit"));
|
|
68
68
|
|
|
69
69
|
var Option = select_1["default"].Option;
|
|
70
70
|
exports.Option = Option;
|
|
@@ -108,7 +108,7 @@ var LabelSelect = function LabelSelect(props) {
|
|
|
108
108
|
'label-select': true,
|
|
109
109
|
'label-select-label-scale': open || value
|
|
110
110
|
}, className)
|
|
111
|
-
}, react_1["default"].createElement(select_1["default"], __assign({},
|
|
111
|
+
}, react_1["default"].createElement(select_1["default"], __assign({}, omit_1["default"](props, ['open', 'onChange', 'className', 'label']), {
|
|
112
112
|
open: open,
|
|
113
113
|
ref: selectRef,
|
|
114
114
|
size: "large",
|
|
@@ -43,7 +43,7 @@ var classnames_1 = __importDefault(require("classnames"));
|
|
|
43
43
|
|
|
44
44
|
var ahooks_1 = require("ahooks");
|
|
45
45
|
|
|
46
|
-
var
|
|
46
|
+
var trimStart_1 = __importDefault(require("lodash/trimStart"));
|
|
47
47
|
|
|
48
48
|
var LabelTextArea = function LabelTextArea(props) {
|
|
49
49
|
var className = props.className,
|
|
@@ -80,7 +80,7 @@ var LabelTextArea = function LabelTextArea(props) {
|
|
|
80
80
|
};
|
|
81
81
|
|
|
82
82
|
var handleChange = function handleChange(e) {
|
|
83
|
-
var finallyValue =
|
|
83
|
+
var finallyValue = trimStart_1["default"](e.target.value);
|
|
84
84
|
|
|
85
85
|
if (formatter) {
|
|
86
86
|
finallyValue = formatter(finallyValue);
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { TreeSelectProps } from 'antd/es/tree-select';
|
|
3
|
+
export interface LabelTreeSelectProps extends Omit<TreeSelectProps<string[]>, 'onDropdownVisibleChange'> {
|
|
4
|
+
/** 输入框的label */
|
|
5
|
+
label: React.ReactNode;
|
|
6
|
+
/** 输入框value的单位 */
|
|
7
|
+
unit?: React.ReactNode;
|
|
8
|
+
onDropdownVisibleChange?: (value: boolean) => void;
|
|
9
|
+
}
|
|
10
|
+
declare const LabelTreeSelect: {
|
|
11
|
+
(props: LabelTreeSelectProps): JSX.Element;
|
|
12
|
+
Option: new (text?: string | undefined, value?: string | undefined, defaultSelected?: boolean | undefined, selected?: boolean | undefined) => HTMLOptionElement;
|
|
13
|
+
};
|
|
14
|
+
export default LabelTreeSelect;
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var __assign = this && this.__assign || function () {
|
|
4
|
+
__assign = Object.assign || function (t) {
|
|
5
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
6
|
+
s = arguments[i];
|
|
7
|
+
|
|
8
|
+
for (var p in s) {
|
|
9
|
+
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
return t;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
return __assign.apply(this, arguments);
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
var __read = this && this.__read || function (o, n) {
|
|
20
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
21
|
+
if (!m) return o;
|
|
22
|
+
var i = m.call(o),
|
|
23
|
+
r,
|
|
24
|
+
ar = [],
|
|
25
|
+
e;
|
|
26
|
+
|
|
27
|
+
try {
|
|
28
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) {
|
|
29
|
+
ar.push(r.value);
|
|
30
|
+
}
|
|
31
|
+
} catch (error) {
|
|
32
|
+
e = {
|
|
33
|
+
error: error
|
|
34
|
+
};
|
|
35
|
+
} finally {
|
|
36
|
+
try {
|
|
37
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
38
|
+
} finally {
|
|
39
|
+
if (e) throw e.error;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
return ar;
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
var __importDefault = this && this.__importDefault || function (mod) {
|
|
47
|
+
return mod && mod.__esModule ? mod : {
|
|
48
|
+
"default": mod
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
Object.defineProperty(exports, "__esModule", {
|
|
53
|
+
value: true
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
var react_1 = __importDefault(require("react"));
|
|
57
|
+
|
|
58
|
+
var useControllableValue_1 = __importDefault(require("ahooks/lib/useControllableValue"));
|
|
59
|
+
|
|
60
|
+
var tree_select_1 = __importDefault(require("antd/es/tree-select"));
|
|
61
|
+
|
|
62
|
+
var classnames_1 = __importDefault(require("classnames"));
|
|
63
|
+
|
|
64
|
+
var omit_1 = __importDefault(require("lodash/omit"));
|
|
65
|
+
|
|
66
|
+
var LabelTreeSelect = function LabelTreeSelect(props) {
|
|
67
|
+
var className = props.className,
|
|
68
|
+
label = props.label,
|
|
69
|
+
unit = props.unit,
|
|
70
|
+
_a = props.showSearch,
|
|
71
|
+
showSearch = _a === void 0 ? false : _a,
|
|
72
|
+
onDropdownVisibleChange = props.onDropdownVisibleChange;
|
|
73
|
+
var selectRef = react_1["default"].useRef(null);
|
|
74
|
+
|
|
75
|
+
var _b = __read(useControllableValue_1["default"](props, {
|
|
76
|
+
valuePropName: 'open',
|
|
77
|
+
trigger: 'setOpen'
|
|
78
|
+
}), 2),
|
|
79
|
+
open = _b[0],
|
|
80
|
+
setOpen = _b[1];
|
|
81
|
+
|
|
82
|
+
var _c = __read(useControllableValue_1["default"](props), 2),
|
|
83
|
+
value = _c[0],
|
|
84
|
+
setValue = _c[1];
|
|
85
|
+
|
|
86
|
+
var handleChange = function handleChange(nextValue) {
|
|
87
|
+
setValue(nextValue);
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
var handleLabelClick = function handleLabelClick() {
|
|
91
|
+
var _a;
|
|
92
|
+
|
|
93
|
+
if (!open) {
|
|
94
|
+
setOpen(!open);
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
(_a = selectRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
98
|
+
};
|
|
99
|
+
|
|
100
|
+
var handleDropdownVisibleChange = function handleDropdownVisibleChange(nextOpen) {
|
|
101
|
+
setOpen(nextOpen);
|
|
102
|
+
onDropdownVisibleChange === null || onDropdownVisibleChange === void 0 ? void 0 : onDropdownVisibleChange(nextOpen);
|
|
103
|
+
};
|
|
104
|
+
|
|
105
|
+
var isValueNotEmpty = !!(value === null || value === void 0 ? void 0 : value.length);
|
|
106
|
+
return react_1["default"].createElement("div", {
|
|
107
|
+
className: classnames_1["default"]({
|
|
108
|
+
'label-tree-select': true,
|
|
109
|
+
'label-tree-select-label-scale': open || isValueNotEmpty
|
|
110
|
+
}, className)
|
|
111
|
+
}, react_1["default"].createElement(tree_select_1["default"], __assign({
|
|
112
|
+
showSearch: showSearch
|
|
113
|
+
}, omit_1["default"](props, ['open', 'onChange', 'className', 'label']), {
|
|
114
|
+
open: open,
|
|
115
|
+
ref: selectRef,
|
|
116
|
+
size: "large",
|
|
117
|
+
className: "label-select-selector",
|
|
118
|
+
onChange: handleChange,
|
|
119
|
+
onDropdownVisibleChange: handleDropdownVisibleChange
|
|
120
|
+
})), isValueNotEmpty && react_1["default"].createElement("div", {
|
|
121
|
+
className: "label-tree-select-value-length"
|
|
122
|
+
}, react_1["default"].createElement("span", null, value.length), unit && react_1["default"].createElement("span", null, unit)), react_1["default"].createElement("label", {
|
|
123
|
+
className: "label-tree-select-text",
|
|
124
|
+
onClick: handleLabelClick
|
|
125
|
+
}, label));
|
|
126
|
+
};
|
|
127
|
+
|
|
128
|
+
exports["default"] = LabelTreeSelect;
|
|
129
|
+
LabelTreeSelect.Option = Option;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
/* stylelint-disable indentation */
|
|
2
|
+
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
|
|
3
|
+
/* stylelint-disable no-duplicate-selectors */
|
|
4
|
+
/* stylelint-disable */
|
|
5
|
+
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
|
|
6
|
+
.label-tree-select {
|
|
7
|
+
position: relative;
|
|
8
|
+
width: 100%;
|
|
9
|
+
height: 100%;
|
|
10
|
+
}
|
|
11
|
+
.label-tree-select .ant-select:not(.ant-select-customize-input) .ant-select-selector {
|
|
12
|
+
height: 52px;
|
|
13
|
+
border: 1px solid #e5e5e5;
|
|
14
|
+
border-radius: 12px;
|
|
15
|
+
outline: none;
|
|
16
|
+
}
|
|
17
|
+
.label-tree-select .ant-select-selection-overflow {
|
|
18
|
+
display: none;
|
|
19
|
+
}
|
|
20
|
+
.label-tree-select .ant-select-open:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
|
|
21
|
+
border-color: #ff6b00;
|
|
22
|
+
box-shadow: none;
|
|
23
|
+
}
|
|
24
|
+
.label-tree-select-text {
|
|
25
|
+
position: absolute;
|
|
26
|
+
top: 18px;
|
|
27
|
+
left: 16px;
|
|
28
|
+
z-index: 2;
|
|
29
|
+
height: 20px;
|
|
30
|
+
color: #9aa5b5;
|
|
31
|
+
font-size: 14px;
|
|
32
|
+
line-height: 20px;
|
|
33
|
+
transform-origin: top left;
|
|
34
|
+
cursor: pointer;
|
|
35
|
+
transition: all 0.2s ease-out;
|
|
36
|
+
}
|
|
37
|
+
.label-tree-select-label-scale .label-tree-select-text {
|
|
38
|
+
transform: translateY(-10px) scale(0.86);
|
|
39
|
+
cursor: text;
|
|
40
|
+
pointer-events: none;
|
|
41
|
+
}
|
|
42
|
+
.label-tree-select-label-scale .label-tree-select-value-length {
|
|
43
|
+
position: absolute;
|
|
44
|
+
top: 23px;
|
|
45
|
+
left: 16px;
|
|
46
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/* stylelint-disable indentation */
|
|
2
|
+
@import '~antd/es/style/themes/index';
|
|
3
|
+
|
|
4
|
+
@color_9aa5b5: #9aa5b5;
|
|
5
|
+
@font-size-base: 14px;
|
|
6
|
+
|
|
7
|
+
.label-tree-select {
|
|
8
|
+
position: relative;
|
|
9
|
+
width: 100%;
|
|
10
|
+
height: 100%;
|
|
11
|
+
|
|
12
|
+
.@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input) .@{ant-prefix}-select-selector {
|
|
13
|
+
height: 52px;
|
|
14
|
+
border: 1px solid #e5e5e5;
|
|
15
|
+
border-radius: 12px;
|
|
16
|
+
outline: none;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.@{ant-prefix}-select-selection-overflow {
|
|
20
|
+
display: none;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.@{ant-prefix}-select-open:not(.@{ant-prefix}-select-disabled).@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input)
|
|
24
|
+
.@{ant-prefix}-select-selector {
|
|
25
|
+
border-color: #ff6b00;
|
|
26
|
+
box-shadow: none;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&-text {
|
|
30
|
+
position: absolute;
|
|
31
|
+
top: 18px;
|
|
32
|
+
left: 16px;
|
|
33
|
+
z-index: 2;
|
|
34
|
+
height: 20px;
|
|
35
|
+
color: @color_9aa5b5;
|
|
36
|
+
font-size: @font-size-base;
|
|
37
|
+
line-height: 20px;
|
|
38
|
+
transform-origin: top left;
|
|
39
|
+
cursor: pointer;
|
|
40
|
+
transition: all 0.2s ease-out;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
&-label-scale {
|
|
44
|
+
.label-tree-select-text {
|
|
45
|
+
transform: translateY(-10px) scale(0.86);
|
|
46
|
+
cursor: text;
|
|
47
|
+
pointer-events: none;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.label-tree-select-value-length {
|
|
51
|
+
position: absolute;
|
|
52
|
+
top: 23px;
|
|
53
|
+
left: 16px;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "assui",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.105",
|
|
4
4
|
"description": "react ui library",
|
|
5
5
|
"author": "jason <usochen@gmail.com>",
|
|
6
6
|
"main": "./lib/index.js",
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"@ahooksjs/use-url-state": "^2.5.8",
|
|
34
34
|
"@tinymce/tinymce-react": "^3.13.0",
|
|
35
35
|
"@types/react-beautiful-dnd": "^13.1.2",
|
|
36
|
-
"a-icons": "^1.0.
|
|
36
|
+
"a-icons": "^1.0.54",
|
|
37
37
|
"ahooks": "^3.0.8",
|
|
38
38
|
"bignumber.js": "^9.0.1",
|
|
39
39
|
"copy-to-clipboard": "^3.3.1",
|
|
@@ -69,5 +69,5 @@
|
|
|
69
69
|
"node": ">=10.0.0"
|
|
70
70
|
},
|
|
71
71
|
"license": "MIT",
|
|
72
|
-
"gitHead": "
|
|
72
|
+
"gitHead": "0e74826c7477d3525a583de82993626f54158390"
|
|
73
73
|
}
|