@giteeteam/apps-team-components 1.1.1-alpha.1 → 1.1.1-alpha.2
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.
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { ReadViewBaseProps } from '../types';
|
|
3
3
|
type DropdownReadViewProps = ReadViewBaseProps & {
|
|
4
4
|
userData?: Record<string, any>;
|
|
5
|
+
mode?: string;
|
|
5
6
|
};
|
|
6
7
|
declare const DropdownReadView: import("react").NamedExoticComponent<DropdownReadViewProps>;
|
|
7
8
|
export default DropdownReadView;
|
|
@@ -3,11 +3,12 @@ import { memo, useMemo } from 'react';
|
|
|
3
3
|
import EmptyField from '../../common/EmptyField';
|
|
4
4
|
import SimpleOverflowToolTip from '../../common/overflow-tooltip/SimpleOverflowToolTip';
|
|
5
5
|
import { handleValue } from './BaseField';
|
|
6
|
+
const MUTIPLE_MODE = { multiple: 'multiple', tags: 'tags' };
|
|
6
7
|
const getFormattedLabel = ({ label, style = {}, }) => {
|
|
7
8
|
return _jsx("span", { style: { borderRadius: 2, color: style === null || style === void 0 ? void 0 : style.color, background: style === null || style === void 0 ? void 0 : style.background }, children: label });
|
|
8
9
|
};
|
|
9
10
|
const DropdownReadView = memo(props => {
|
|
10
|
-
const { value, options, readonly: propsReadonly, userData } = props;
|
|
11
|
+
const { value, options, readonly: propsReadonly, userData, mode } = props;
|
|
11
12
|
const readonly = useMemo(() => {
|
|
12
13
|
if ((userData === null || userData === void 0 ? void 0 : userData.source) === 'apps-function') {
|
|
13
14
|
return (userData === null || userData === void 0 ? void 0 : userData.readonly) || propsReadonly;
|
|
@@ -16,44 +17,42 @@ const DropdownReadView = memo(props => {
|
|
|
16
17
|
return propsReadonly;
|
|
17
18
|
}
|
|
18
19
|
}, [propsReadonly, userData]);
|
|
19
|
-
const
|
|
20
|
-
var _a;
|
|
21
|
-
if (!(value === null || value === void 0 ? void 0 : value.length))
|
|
22
|
-
return '';
|
|
23
|
-
if ((_a = value[0]) === null || _a === void 0 ? void 0 : _a.label) {
|
|
24
|
-
return value.map(item => item.label).join(',');
|
|
25
|
-
}
|
|
26
|
-
if (!(options === null || options === void 0 ? void 0 : options.length))
|
|
27
|
-
return '';
|
|
28
|
-
const result = value
|
|
29
|
-
.map(item => { var _a; return (item === null || item === void 0 ? void 0 : item.label) || ((_a = options.find(opt => opt.value === handleValue(item))) === null || _a === void 0 ? void 0 : _a.label); })
|
|
30
|
-
.filter(Boolean)
|
|
31
|
-
.join(',');
|
|
32
|
-
return result;
|
|
33
|
-
}, [options, value]);
|
|
34
|
-
const showValue = useMemo(() => {
|
|
35
|
-
var _a;
|
|
36
|
-
if (!(value === null || value === void 0 ? void 0 : value.length))
|
|
37
|
-
return '';
|
|
38
|
-
if ((_a = value[0]) === null || _a === void 0 ? void 0 : _a.label) {
|
|
39
|
-
return value.map(item => item.label).join(',');
|
|
40
|
-
}
|
|
41
|
-
if (!(options === null || options === void 0 ? void 0 : options.length))
|
|
42
|
-
return '';
|
|
20
|
+
const optionsMap = useMemo(() => {
|
|
43
21
|
const optionsMap = {};
|
|
44
22
|
options === null || options === void 0 ? void 0 : options.forEach(item => {
|
|
45
23
|
optionsMap[item.label] = item;
|
|
46
24
|
});
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
return
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
25
|
+
return optionsMap;
|
|
26
|
+
}, [options]);
|
|
27
|
+
const showValue = useMemo(() => {
|
|
28
|
+
var _a, _b;
|
|
29
|
+
if (!(value === null || value === void 0 ? void 0 : value.length))
|
|
30
|
+
return '';
|
|
31
|
+
if (mode in MUTIPLE_MODE) {
|
|
32
|
+
if ((_a = value[0]) === null || _a === void 0 ? void 0 : _a.label) {
|
|
33
|
+
return value.map(item => item.label).join(',');
|
|
34
|
+
}
|
|
35
|
+
if (!(options === null || options === void 0 ? void 0 : options.length))
|
|
36
|
+
return '';
|
|
37
|
+
return value
|
|
38
|
+
.map(item => { var _a; return (item === null || item === void 0 ? void 0 : item.label) || ((_a = options.find(opt => opt.value === handleValue(item))) === null || _a === void 0 ? void 0 : _a.label); })
|
|
39
|
+
.filter(Boolean)
|
|
40
|
+
.map((item, index) => {
|
|
41
|
+
const content = getFormattedLabel(optionsMap[item]);
|
|
42
|
+
return index === value.length - 1 ? content : _jsxs(_Fragment, { children: [content, ","] });
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
else {
|
|
46
|
+
const item = value[0];
|
|
47
|
+
if (item.label)
|
|
48
|
+
return item.label;
|
|
49
|
+
if (!(options === null || options === void 0 ? void 0 : options.length))
|
|
50
|
+
return '';
|
|
51
|
+
const label = (item === null || item === void 0 ? void 0 : item.label) || ((_b = options.find(opt => opt.value === handleValue(item))) === null || _b === void 0 ? void 0 : _b.label);
|
|
52
|
+
return getFormattedLabel(optionsMap[label]);
|
|
53
|
+
}
|
|
54
|
+
}, [mode, options, optionsMap, value]);
|
|
55
|
+
return (_jsx(_Fragment, { children: showValue ? (_jsx(SimpleOverflowToolTip, { title: showValue, children: showValue })) : (_jsx(EmptyField, { readonly: readonly })) }));
|
|
57
56
|
});
|
|
58
57
|
DropdownReadView.displayName = 'DropdownReadView';
|
|
59
58
|
export default DropdownReadView;
|
package/package.json
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@giteeteam/apps-team-components",
|
|
3
|
-
"version": "1.1.1-alpha.
|
|
3
|
+
"version": "1.1.1-alpha.2",
|
|
4
4
|
"description": "Gitee team components",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.js",
|
|
7
7
|
"scripts": {
|
|
8
8
|
"prepare": "husky install && pnpm build",
|
|
9
9
|
"build": "rm -rf dist && tsc && cp -r src/icons/svg dist/icons/svg",
|
|
10
|
-
"publish:alpha": "
|
|
10
|
+
"publish:alpha": "npm publish --tag alpha",
|
|
11
11
|
"prepack": "pnpm build",
|
|
12
12
|
"prepublish": "pnpm build",
|
|
13
13
|
"prepublishOnly": "pnpm build",
|