@lunit/oui 2.3.5 → 2.3.6
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Grow, Typography, Box } from '@mui/material';
|
|
3
|
-
import {
|
|
3
|
+
import { ArrowDown, Close, Success, Warning16, RefreshLeft } from '../../icons';
|
|
4
4
|
import { useState, Fragment, useMemo } from 'react';
|
|
5
5
|
import { Divider } from '../Divider';
|
|
6
6
|
import { Button } from '../Button';
|
|
@@ -14,12 +14,12 @@ import { StyledPaper, StyledToolbar, StyledToolbarButtonContainer, StyledCollaps
|
|
|
14
14
|
const UploadFile = ({ file, onCancel, onRetry }) => {
|
|
15
15
|
const [mouseOnErrorIconButton, setMouseOnErrorIconButton] = useState(false);
|
|
16
16
|
const progress = useMemo(() => {
|
|
17
|
-
if (file.meta
|
|
17
|
+
if (file.meta.calculatedProgress) {
|
|
18
18
|
// return calculated progress for mrxs files
|
|
19
19
|
return file.meta.calculatedProgress;
|
|
20
20
|
}
|
|
21
21
|
return file.progress?.percentage || 0;
|
|
22
|
-
}, [file.meta, file.progress?.percentage]);
|
|
22
|
+
}, [file.meta.calculatedProgress, file.progress?.percentage]);
|
|
23
23
|
const fileFormatConverting = useMemo(() => {
|
|
24
24
|
if (file.extension === 'isyntax') {
|
|
25
25
|
return 'iSyntax';
|
|
@@ -29,23 +29,29 @@ const UploadFile = ({ file, onCancel, onRetry }) => {
|
|
|
29
29
|
}
|
|
30
30
|
return '';
|
|
31
31
|
}, [file]);
|
|
32
|
-
return (_jsxs(_Fragment, { children: [_jsxs(StyledUploadFile, {
|
|
32
|
+
return (_jsxs(_Fragment, { children: [_jsxs(StyledUploadFile, { sx: {
|
|
33
|
+
justifyContent: file.meta.postProcessConverting ? 'flex-start' : 'space-between',
|
|
34
|
+
}, children: [!file.meta.errorMessage && (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body5", sx: {
|
|
35
|
+
width: file.meta?.postProcessConverting ? '80px' : '100%',
|
|
36
|
+
marginRight: '16px',
|
|
33
37
|
overflow: 'hidden',
|
|
34
38
|
textOverflow: 'ellipsis',
|
|
35
|
-
}, children: file.name }), progress < 100 && (_jsx(Tooltip, { title: "Cancel", children: _jsx(Box, { children: _jsx(Button, { onClick: () => onCancel && onCancel(file.id), variant: "ghost", color: "secondary", icon: _jsx(Close, { style: { color: theme.palette.neutralGrey[40] } }) }) }) })), progress === 100 && file.meta.postProcessComplete && (_jsx(Tooltip, { title: "Done", children: _jsx(Box, { children: _jsx(Button, { variant: "ghost", icon: _jsx(Success, {}) }) }) }))] })), file.meta
|
|
39
|
+
}, children: file.name }), progress < 100 && (_jsx(Tooltip, { title: "Cancel", children: _jsx(Box, { children: _jsx(Button, { onClick: () => onCancel && onCancel(file.id), variant: "ghost", color: "secondary", icon: _jsx(Close, { style: { color: theme.palette.neutralGrey[40] } }) }) }) })), progress === 100 && file.meta.postProcessComplete && (_jsx(Tooltip, { title: "Done", children: _jsx(Box, { children: _jsx(Button, { variant: "ghost", icon: _jsx(Success, {}) }) }) }))] })), file.meta.errorMessage && (_jsxs(_Fragment, { children: [_jsx(Typography, { variant: "body5", sx: {
|
|
40
|
+
width: '80px',
|
|
41
|
+
marginRight: '16px',
|
|
36
42
|
whiteSpace: 'nowrap',
|
|
37
43
|
overflow: 'hidden',
|
|
38
44
|
textOverflow: 'ellipsis',
|
|
39
45
|
flexShrink: 6,
|
|
40
46
|
}, children: file.name }), _jsx(Typography, { color: "error", variant: "body4", sx: {
|
|
41
|
-
marginRight: '
|
|
47
|
+
marginRight: '24px',
|
|
42
48
|
flexGrow: 3,
|
|
43
49
|
flexShrink: 0,
|
|
44
50
|
flexBasis: 'auto',
|
|
45
|
-
textAlign: '
|
|
51
|
+
textAlign: 'left',
|
|
46
52
|
maxWidth: '290px',
|
|
47
53
|
whiteSpace: 'pre-wrap',
|
|
48
|
-
}, children: file.meta
|
|
54
|
+
}, children: file.meta.errorMessage }), _jsx(Tooltip, { title: file.meta.retry ? 'Retry' : 'Retry by dragging and dropping the file again.', placement: "top", children: _jsx(Box, { children: _jsx(Button, { onMouseEnter: () => file.meta.retry && setMouseOnErrorIconButton(true), onMouseLeave: () => file.meta.retry && setMouseOnErrorIconButton(false), onClick: () => {
|
|
49
55
|
if (file.meta.retry) {
|
|
50
56
|
setMouseOnErrorIconButton(false);
|
|
51
57
|
if (onRetry)
|
|
@@ -53,15 +59,14 @@ const UploadFile = ({ file, onCancel, onRetry }) => {
|
|
|
53
59
|
}
|
|
54
60
|
}, icon: mouseOnErrorIconButton ? (_jsx(RefreshLeft, { style: { color: theme.palette.neutralGrey[0] } })) : (_jsx(Warning16, { style: { color: theme.palette.red[5] } })), variant: "ghost", color: "secondary", sx: {
|
|
55
61
|
cursor: file.meta.retry ? 'pointer' : 'default',
|
|
56
|
-
} }) }) })] })), !file.meta
|
|
57
|
-
marginRight: '30px',
|
|
62
|
+
} }) }) })] })), !file.meta.errorMessage && file.meta.postProcessConverting && (_jsxs(Typography, { variant: "body5", sx: {
|
|
58
63
|
flexGrow: 3,
|
|
59
64
|
flexShrink: 0,
|
|
60
65
|
flexBasis: 'auto',
|
|
61
|
-
textAlign: '
|
|
66
|
+
textAlign: 'left',
|
|
62
67
|
maxWidth: '290px',
|
|
63
68
|
whiteSpace: 'pre-wrap',
|
|
64
|
-
}, children: ["Converting ", fileFormatConverting, " file..."] }))] }), !file.meta
|
|
69
|
+
}, children: ["Converting ", fileFormatConverting, " file..."] }))] }), !file.meta.errorMessage && (_jsx(_Fragment, { children: file.progress?.uploadStarted > 0 && (_jsxs(_Fragment, { children: [progress < 100 && (_jsx(LinearProgress, { variant: "determinate", value: progress })), progress >= 100 && !file.meta.postProcessComplete && _jsx(LinearProgress, {})] })) }))] }));
|
|
65
70
|
};
|
|
66
71
|
/**
|
|
67
72
|
* Component used to display a list of files
|
|
@@ -77,7 +82,7 @@ const UploadManager = ({ title, subTitle, files, onClose, onCancel, onRetry, })
|
|
|
77
82
|
position: 'absolute',
|
|
78
83
|
bottom: '20px',
|
|
79
84
|
right: '20px',
|
|
80
|
-
}, children: _jsxs(StyledPaper, { elevation: 1, children: [_jsxs(StyledToolbar, { children: [_jsx(Typography, { variant: "h9", children: title }), _jsx(Typography, { variant: "body1", sx: { marginLeft: '8px' }, children: subTitle }), _jsxs(StyledToolbarButtonContainer, { children: [_jsx(Tooltip, { title: expanded ? 'Minimize' : 'Maximize', children: _jsx(Box, { children: _jsx(Button, { onClick: handleExpandClick, variant: "ghost", color: "secondary", icon: _jsx(
|
|
85
|
+
}, children: _jsxs(StyledPaper, { elevation: 1, children: [_jsxs(StyledToolbar, { children: [_jsx(Typography, { variant: "h9", children: title }), _jsx(Typography, { variant: "body1", sx: { marginLeft: '8px' }, children: subTitle }), _jsxs(StyledToolbarButtonContainer, { children: [_jsx(Tooltip, { title: expanded ? 'Minimize' : 'Maximize', children: _jsx(Box, { children: _jsx(Button, { onClick: handleExpandClick, variant: "ghost", color: "secondary", icon: _jsx(ArrowDown, { style: { color: theme.palette.neutralGrey[40] } }), size: "small", sx: {
|
|
81
86
|
transform: expanded ? 'rotate(0deg)' : 'rotate(180deg)',
|
|
82
87
|
} }) }) }), _jsx(Tooltip, { title: "Close", children: _jsx(Box, { children: _jsx(Button, { onClick: onClose, variant: "ghost", color: "secondary", icon: _jsx(Close, { style: { color: theme.palette.neutralGrey[40] } }), size: "small" }) }) })] })] }), expanded && _jsx(Divider, { orientation: "horizontal" }), _jsx(StyledCollapse, { in: expanded, timeout: "auto", unmountOnExit: true, children: files.map((download, index) => (_jsxs(Fragment, { children: [_jsx(UploadFile, { file: download, onCancel: onCancel, onRetry: onRetry }), index !== files.length - 1 && _jsx(Divider, { orientation: "horizontal" })] }, download.id))) })] }) }));
|
|
83
88
|
};
|
package/package.json
CHANGED