@monolith-forensics/monolith-ui 1.2.52 → 1.2.54
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.
|
@@ -5,6 +5,7 @@ import { FloatingPortal } from "@floating-ui/react";
|
|
|
5
5
|
import { DownloadIcon, XIcon, ZoomInIcon, ZoomOutIcon } from "lucide-react";
|
|
6
6
|
import Button from "../Button";
|
|
7
7
|
import { useState } from "react";
|
|
8
|
+
import Loader from "../Loader";
|
|
8
9
|
var ViewerTypes;
|
|
9
10
|
(function (ViewerTypes) {
|
|
10
11
|
ViewerTypes["Office"] = "office";
|
|
@@ -160,8 +161,15 @@ export const FileViewer = ({ file, open, isPending, onClose }) => {
|
|
|
160
161
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
161
162
|
setZoomFactor(1);
|
|
162
163
|
};
|
|
163
|
-
return (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsxs(StyledContainer, { className: "mfui-FileViewer", children: [
|
|
164
|
+
return (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsxs(StyledContainer, { className: "mfui-FileViewer", children: [_jsxs(StyledMenu, { className: "FileViewer-menu", children: [_jsx(Button, { variant: "text", onClick: () => {
|
|
164
165
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
|
165
166
|
setZoomFactor(1);
|
|
166
|
-
}, children: _jsx(XIcon, { size: 18 }) }), _jsx("div", { children: file.name }), _jsxs(StyledActionsMenu, { children: [ZoomableViewerTypes.includes(viewerType) && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "text", children: _jsx(ZoomInIcon, { size: 18, onClick: () => setZoomFactor((prev) => prev * 1.1) }) }), _jsx(Button, { variant: "text", children: _jsx(ZoomOutIcon, { size: 18, onClick: () => setZoomFactor((prev) => prev * 0.9) }) })] })), _jsx("a", { href: file.url, download: file.name, children: _jsx(Button, { variant: "text", children: _jsx(DownloadIcon, { size: 18 }) }) })] })
|
|
167
|
+
}, children: _jsx(XIcon, { size: 18 }) }), _jsx("div", { children: file.name }), file.url ? (_jsxs(StyledActionsMenu, { children: [ZoomableViewerTypes.includes(viewerType) && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "text", children: _jsx(ZoomInIcon, { size: 18, onClick: () => setZoomFactor((prev) => prev * 1.1) }) }), _jsx(Button, { variant: "text", children: _jsx(ZoomOutIcon, { size: 18, onClick: () => setZoomFactor((prev) => prev * 0.9) }) })] })), _jsx("a", { href: file.url, download: file.name, children: _jsx(Button, { variant: "text", children: _jsx(DownloadIcon, { size: 18 }) }) })] })) : (_jsx("div", {}) // used as placeholder for spacing and alignment
|
|
168
|
+
)] }), file.url ? (_jsxs(StyledInnerContainer, { onClick: handleBackgroundClick, "data-type": viewerType, children: [viewerType === ViewerTypes.PDF && (_jsx(PdfViewer, { file: file, zoomFactor: zoomFactor, isPending: isPending })), viewerType === ViewerTypes.Image && (_jsx(ImageViewer, { file: file, zoomFactor: zoomFactor, isPending: isPending })), viewerType === ViewerTypes.Video && (_jsx(VideoViewer, { file: file, zoomFactor: zoomFactor, isPending: isPending })), viewerType === ViewerTypes.Audio && (_jsx(VideoViewer, { file: file, zoomFactor: zoomFactor, isPending: isPending })), viewerType === ViewerTypes.Office && (_jsx(OfficeViewer, { file: file, isPending: isPending })), viewerType === ViewerTypes.Text && (_jsx(CodeViewer, { file: file, zoomFactor: zoomFactor, isPending: isPending })), viewerType === ViewerTypes.Code && (_jsx(CodeViewer, { file: file, zoomFactor: zoomFactor, isPending: isPending }))] })) : (_jsx(StyledInnerContainer, { children: _jsxs("div", { style: {
|
|
169
|
+
margin: "auto",
|
|
170
|
+
display: "flex",
|
|
171
|
+
gap: "10px",
|
|
172
|
+
flexDirection: "column",
|
|
173
|
+
alignItems: "center",
|
|
174
|
+
}, children: [_jsx(Loader, { size: 50 }), _jsx("div", { children: "Loading File..." })] }) }))] }) }));
|
|
167
175
|
};
|
|
@@ -55,6 +55,8 @@ const StyledContainer = styled.div `
|
|
|
55
55
|
.cm-editor {
|
|
56
56
|
border: 1px solid ${(props) => props.theme.palette.divider};
|
|
57
57
|
width: 100%;
|
|
58
|
+
height: 100%;
|
|
59
|
+
margin: 0 auto;
|
|
58
60
|
}
|
|
59
61
|
`;
|
|
60
62
|
const StyledLoader = styled.div `
|
|
@@ -96,7 +98,7 @@ export const CodeViewer = ({ file, zoomFactor, isPending }) => {
|
|
|
96
98
|
extensions.push(CodeMirror.EditorView.lineWrapping);
|
|
97
99
|
}
|
|
98
100
|
if (isPending) {
|
|
99
|
-
return (_jsxs(StyledLoader, { children: [_jsx(Loader, { size: 50 }), _jsx("div", { children: "Loading
|
|
101
|
+
return (_jsxs(StyledLoader, { children: [_jsx(Loader, { size: 50 }), _jsx("div", { children: "Loading File..." })] }));
|
|
100
102
|
}
|
|
101
103
|
return (_jsxs(StyledContainer, { zoomFactor: zoomFactor, children: [loading && (_jsxs(StyledLoader, { children: [_jsx(Loader, { size: 50 }), _jsx("div", { children: "Loading File..." })] })), !loading && (_jsx(CodeMirror.default, { value: query.data || "", theme: theme, extensions: extensions, readOnly: true, editable: false, onClick: (event) => {
|
|
102
104
|
event.stopPropagation();
|