@cannyminds/dms-file-viewers 0.13.0 → 0.15.0
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/dist/chunk-42VHR3EK.mjs +714 -0
- package/dist/chunk-42VHR3EK.mjs.map +1 -0
- package/dist/{chunk-J3JKVSAM.js → chunk-AYVTSFZA.js} +2 -1
- package/dist/chunk-AYVTSFZA.js.map +1 -0
- package/dist/chunk-C4L2R2QY.mjs +277 -0
- package/dist/chunk-C4L2R2QY.mjs.map +1 -0
- package/dist/chunk-DBXSX2B6.js +277 -0
- package/dist/chunk-DBXSX2B6.js.map +1 -0
- package/dist/chunk-DPSRGULQ.mjs +247 -0
- package/dist/chunk-DPSRGULQ.mjs.map +1 -0
- package/dist/chunk-FK6RYOAZ.mjs +297 -0
- package/dist/chunk-FK6RYOAZ.mjs.map +1 -0
- package/dist/chunk-FZVXQGA7.mjs +466 -0
- package/dist/chunk-FZVXQGA7.mjs.map +1 -0
- package/dist/chunk-GSRAK2YV.js +266 -0
- package/dist/chunk-GSRAK2YV.js.map +1 -0
- package/dist/chunk-HYRQBGAX.js +466 -0
- package/dist/chunk-HYRQBGAX.js.map +1 -0
- package/dist/chunk-RKDOWWQD.js +247 -0
- package/dist/chunk-RKDOWWQD.js.map +1 -0
- package/dist/chunk-TMAHQICY.mjs +1842 -0
- package/dist/chunk-TMAHQICY.mjs.map +1 -0
- package/dist/chunk-VBJVOB45.mjs +266 -0
- package/dist/chunk-VBJVOB45.mjs.map +1 -0
- package/dist/{chunk-DFBVN4MO.mjs → chunk-WR5SJ3LM.mjs} +2 -1
- package/dist/chunk-WR5SJ3LM.mjs.map +1 -0
- package/dist/chunk-XSXOX4MV.js +297 -0
- package/dist/chunk-XSXOX4MV.js.map +1 -0
- package/dist/chunk-XWWMHRVU.js +1842 -0
- package/dist/chunk-XWWMHRVU.js.map +1 -0
- package/dist/chunk-YU535XRJ.js +714 -0
- package/dist/chunk-YU535XRJ.js.map +1 -0
- package/dist/components/viewers/AudioViewer.d.mts +1 -1
- package/dist/components/viewers/AudioViewer.d.ts +1 -1
- package/dist/components/viewers/AudioViewer.js +3 -3
- package/dist/components/viewers/AudioViewer.mjs +2 -2
- package/dist/components/viewers/DefaultViewer.d.mts +1 -1
- package/dist/components/viewers/DefaultViewer.d.ts +1 -1
- package/dist/components/viewers/DefaultViewer.js +3 -3
- package/dist/components/viewers/DefaultViewer.mjs +2 -2
- package/dist/components/viewers/ImageViewer.d.mts +1 -1
- package/dist/components/viewers/ImageViewer.d.ts +1 -1
- package/dist/components/viewers/ImageViewer.js +3 -3
- package/dist/components/viewers/ImageViewer.mjs +2 -2
- package/dist/components/viewers/PDFViewer.d.mts +1 -1
- package/dist/components/viewers/PDFViewer.d.ts +1 -1
- package/dist/components/viewers/PDFViewer.js +3 -3
- package/dist/components/viewers/PDFViewer.mjs +2 -2
- package/dist/components/viewers/TIFFViewer.d.mts +1 -1
- package/dist/components/viewers/TIFFViewer.d.ts +1 -1
- package/dist/components/viewers/TIFFViewer.js +3 -3
- package/dist/components/viewers/TIFFViewer.mjs +2 -2
- package/dist/components/viewers/TextViewer.d.mts +1 -1
- package/dist/components/viewers/TextViewer.d.ts +1 -1
- package/dist/components/viewers/TextViewer.js +3 -3
- package/dist/components/viewers/TextViewer.mjs +2 -2
- package/dist/components/viewers/VideoViewer.d.mts +1 -1
- package/dist/components/viewers/VideoViewer.d.ts +1 -1
- package/dist/components/viewers/VideoViewer.js +3 -3
- package/dist/components/viewers/VideoViewer.mjs +2 -2
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +9 -9
- package/dist/index.mjs +8 -8
- package/dist/{types-DNrkDJdK.d.mts → types-DxRCbIFP.d.mts} +4 -2
- package/dist/{types-DNrkDJdK.d.ts → types-DxRCbIFP.d.ts} +4 -2
- package/package.json +1 -1
- package/dist/chunk-7QRYWFCO.js +0 -639
- package/dist/chunk-7QRYWFCO.js.map +0 -1
- package/dist/chunk-7R2KG3PE.mjs +0 -210
- package/dist/chunk-7R2KG3PE.mjs.map +0 -1
- package/dist/chunk-CFYOPDCG.mjs +0 -235
- package/dist/chunk-CFYOPDCG.mjs.map +0 -1
- package/dist/chunk-D74R4IKW.mjs +0 -341
- package/dist/chunk-D74R4IKW.mjs.map +0 -1
- package/dist/chunk-DFBVN4MO.mjs.map +0 -1
- package/dist/chunk-EXZCEYLI.js +0 -247
- package/dist/chunk-EXZCEYLI.js.map +0 -1
- package/dist/chunk-J3JKVSAM.js.map +0 -1
- package/dist/chunk-NXVIRFGL.mjs +0 -247
- package/dist/chunk-NXVIRFGL.mjs.map +0 -1
- package/dist/chunk-P2VNW6OE.mjs +0 -180
- package/dist/chunk-P2VNW6OE.mjs.map +0 -1
- package/dist/chunk-P5FH7LK7.mjs +0 -639
- package/dist/chunk-P5FH7LK7.mjs.map +0 -1
- package/dist/chunk-PZJSY6OF.mjs +0 -1736
- package/dist/chunk-PZJSY6OF.mjs.map +0 -1
- package/dist/chunk-RVHIXSUP.js +0 -235
- package/dist/chunk-RVHIXSUP.js.map +0 -1
- package/dist/chunk-TGVFAAIP.js +0 -341
- package/dist/chunk-TGVFAAIP.js.map +0 -1
- package/dist/chunk-VOLQW3NF.js +0 -1736
- package/dist/chunk-VOLQW3NF.js.map +0 -1
- package/dist/chunk-VSGX22FQ.js +0 -180
- package/dist/chunk-VSGX22FQ.js.map +0 -1
- package/dist/chunk-WCAXWJE7.js +0 -210
- package/dist/chunk-WCAXWJE7.js.map +0 -1
|
@@ -0,0 +1,466 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
toolbarStyles
|
|
4
|
+
} from "./chunk-GMDRDOWP.mjs";
|
|
5
|
+
import {
|
|
6
|
+
FileIcon_default,
|
|
7
|
+
mergeToolbarConfig
|
|
8
|
+
} from "./chunk-WR5SJ3LM.mjs";
|
|
9
|
+
|
|
10
|
+
// src/components/viewers/ImageViewer.tsx
|
|
11
|
+
import { useRef, useState, useMemo, useEffect } from "react";
|
|
12
|
+
|
|
13
|
+
// src/components/viewers/image/ImageToolbar.tsx
|
|
14
|
+
import React from "react";
|
|
15
|
+
import ZoomInIcon from "@mui/icons-material/ZoomIn";
|
|
16
|
+
import ZoomOutIcon from "@mui/icons-material/ZoomOut";
|
|
17
|
+
import RotateLeftIcon from "@mui/icons-material/RotateLeft";
|
|
18
|
+
import RotateRightIcon from "@mui/icons-material/RotateRight";
|
|
19
|
+
import FitScreenIcon from "@mui/icons-material/FitScreen";
|
|
20
|
+
import AspectRatioIcon from "@mui/icons-material/AspectRatio";
|
|
21
|
+
import FullscreenIcon from "@mui/icons-material/Fullscreen";
|
|
22
|
+
import DownloadIcon from "@mui/icons-material/Download";
|
|
23
|
+
import PrintIcon from "@mui/icons-material/Print";
|
|
24
|
+
import InfoIcon from "@mui/icons-material/Info";
|
|
25
|
+
import DescriptionIcon from "@mui/icons-material/Description";
|
|
26
|
+
import { LocalOffer } from "@mui/icons-material";
|
|
27
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
28
|
+
var ImageToolbar = React.memo(
|
|
29
|
+
({
|
|
30
|
+
zoom,
|
|
31
|
+
rotation,
|
|
32
|
+
onZoomIn,
|
|
33
|
+
onZoomOut,
|
|
34
|
+
onFitToWidth,
|
|
35
|
+
onFitToPage,
|
|
36
|
+
onRotateLeft,
|
|
37
|
+
onRotateRight,
|
|
38
|
+
onToggleFullScreen,
|
|
39
|
+
showDownload,
|
|
40
|
+
showPrint,
|
|
41
|
+
showMetadata,
|
|
42
|
+
showTags,
|
|
43
|
+
showProperties,
|
|
44
|
+
disabledDownload,
|
|
45
|
+
disabledPrint,
|
|
46
|
+
disabledMetadata,
|
|
47
|
+
disabledProperties,
|
|
48
|
+
disabledTags,
|
|
49
|
+
onDownloadClick,
|
|
50
|
+
onPrintClick,
|
|
51
|
+
onTagsClick,
|
|
52
|
+
onMetadataClick,
|
|
53
|
+
onPropertiesClick
|
|
54
|
+
}) => /* @__PURE__ */ jsxs("div", { className: "pdf-viewer-toolbar", children: [
|
|
55
|
+
/* @__PURE__ */ jsx("div", { className: "toolbar-separator" }),
|
|
56
|
+
/* @__PURE__ */ jsxs("div", { className: "toolbar-section", children: [
|
|
57
|
+
/* @__PURE__ */ jsx("button", { className: "toolbar-button", onClick: onZoomOut, title: "Zoom Out", children: /* @__PURE__ */ jsx(ZoomOutIcon, { fontSize: "small" }) }),
|
|
58
|
+
/* @__PURE__ */ jsxs("span", { className: "zoom-display", children: [
|
|
59
|
+
zoom,
|
|
60
|
+
"%"
|
|
61
|
+
] }),
|
|
62
|
+
/* @__PURE__ */ jsx("button", { className: "toolbar-button", onClick: onZoomIn, title: "Zoom In", children: /* @__PURE__ */ jsx(ZoomInIcon, { fontSize: "small" }) }),
|
|
63
|
+
/* @__PURE__ */ jsx(
|
|
64
|
+
"button",
|
|
65
|
+
{
|
|
66
|
+
className: "toolbar-button",
|
|
67
|
+
onClick: onFitToWidth,
|
|
68
|
+
title: "Fit to Width",
|
|
69
|
+
children: /* @__PURE__ */ jsx(AspectRatioIcon, { fontSize: "small" })
|
|
70
|
+
}
|
|
71
|
+
),
|
|
72
|
+
/* @__PURE__ */ jsx(
|
|
73
|
+
"button",
|
|
74
|
+
{
|
|
75
|
+
className: "toolbar-button",
|
|
76
|
+
onClick: onFitToPage,
|
|
77
|
+
title: "Fit to Page",
|
|
78
|
+
children: /* @__PURE__ */ jsx(FitScreenIcon, { fontSize: "small" })
|
|
79
|
+
}
|
|
80
|
+
)
|
|
81
|
+
] }),
|
|
82
|
+
/* @__PURE__ */ jsx("div", { className: "toolbar-separator" }),
|
|
83
|
+
/* @__PURE__ */ jsxs("div", { className: "toolbar-section", children: [
|
|
84
|
+
/* @__PURE__ */ jsx(
|
|
85
|
+
"button",
|
|
86
|
+
{
|
|
87
|
+
className: "toolbar-button",
|
|
88
|
+
onClick: onRotateLeft,
|
|
89
|
+
title: "Rotate Left",
|
|
90
|
+
children: /* @__PURE__ */ jsx(RotateLeftIcon, { fontSize: "small" })
|
|
91
|
+
}
|
|
92
|
+
),
|
|
93
|
+
/* @__PURE__ */ jsx(
|
|
94
|
+
"button",
|
|
95
|
+
{
|
|
96
|
+
className: "toolbar-button",
|
|
97
|
+
onClick: onRotateRight,
|
|
98
|
+
title: "Rotate Right",
|
|
99
|
+
children: /* @__PURE__ */ jsx(RotateRightIcon, { fontSize: "small" })
|
|
100
|
+
}
|
|
101
|
+
),
|
|
102
|
+
/* @__PURE__ */ jsxs("span", { className: "page-info", children: [
|
|
103
|
+
"Rotation: ",
|
|
104
|
+
rotation,
|
|
105
|
+
"\xB0"
|
|
106
|
+
] })
|
|
107
|
+
] }),
|
|
108
|
+
/* @__PURE__ */ jsx("div", { className: "toolbar-separator" }),
|
|
109
|
+
/* @__PURE__ */ jsx("div", { className: "toolbar-section", children: /* @__PURE__ */ jsx(
|
|
110
|
+
"button",
|
|
111
|
+
{
|
|
112
|
+
className: "toolbar-button",
|
|
113
|
+
onClick: onToggleFullScreen,
|
|
114
|
+
title: "Fullscreen",
|
|
115
|
+
children: /* @__PURE__ */ jsx(FullscreenIcon, { fontSize: "small" })
|
|
116
|
+
}
|
|
117
|
+
) }),
|
|
118
|
+
(showDownload || showPrint || showMetadata || showProperties || showTags) && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
119
|
+
/* @__PURE__ */ jsx("div", { className: "toolbar-separator" }),
|
|
120
|
+
/* @__PURE__ */ jsxs("div", { className: "toolbar-section", children: [
|
|
121
|
+
showDownload && /* @__PURE__ */ jsx(
|
|
122
|
+
"button",
|
|
123
|
+
{
|
|
124
|
+
className: "toolbar-button",
|
|
125
|
+
onClick: onDownloadClick,
|
|
126
|
+
disabled: disabledDownload,
|
|
127
|
+
title: "Download Image",
|
|
128
|
+
children: /* @__PURE__ */ jsx(DownloadIcon, { fontSize: "small" })
|
|
129
|
+
}
|
|
130
|
+
),
|
|
131
|
+
showPrint && /* @__PURE__ */ jsx(
|
|
132
|
+
"button",
|
|
133
|
+
{
|
|
134
|
+
className: "toolbar-button",
|
|
135
|
+
onClick: onPrintClick,
|
|
136
|
+
disabled: disabledPrint,
|
|
137
|
+
title: "Print Image",
|
|
138
|
+
children: /* @__PURE__ */ jsx(PrintIcon, { fontSize: "small" })
|
|
139
|
+
}
|
|
140
|
+
),
|
|
141
|
+
showMetadata && /* @__PURE__ */ jsx(
|
|
142
|
+
"button",
|
|
143
|
+
{
|
|
144
|
+
className: "toolbar-button",
|
|
145
|
+
onClick: onMetadataClick,
|
|
146
|
+
disabled: disabledMetadata,
|
|
147
|
+
title: "Image Metadata",
|
|
148
|
+
children: /* @__PURE__ */ jsx(DescriptionIcon, { fontSize: "small" })
|
|
149
|
+
}
|
|
150
|
+
),
|
|
151
|
+
showProperties && /* @__PURE__ */ jsx(
|
|
152
|
+
"button",
|
|
153
|
+
{
|
|
154
|
+
className: "toolbar-button",
|
|
155
|
+
onClick: onPropertiesClick,
|
|
156
|
+
disabled: disabledProperties,
|
|
157
|
+
title: "Image Properties",
|
|
158
|
+
children: /* @__PURE__ */ jsx(InfoIcon, { fontSize: "small" })
|
|
159
|
+
}
|
|
160
|
+
),
|
|
161
|
+
showTags && /* @__PURE__ */ jsx(
|
|
162
|
+
"button",
|
|
163
|
+
{
|
|
164
|
+
className: "toolbar-button",
|
|
165
|
+
onClick: onTagsClick,
|
|
166
|
+
disabled: disabledTags,
|
|
167
|
+
title: "Image Tags",
|
|
168
|
+
children: /* @__PURE__ */ jsx(LocalOffer, { fontSize: "small" })
|
|
169
|
+
}
|
|
170
|
+
)
|
|
171
|
+
] })
|
|
172
|
+
] })
|
|
173
|
+
] })
|
|
174
|
+
);
|
|
175
|
+
ImageToolbar.displayName = "ImageToolbar";
|
|
176
|
+
|
|
177
|
+
// src/components/viewers/image/ImageHeader.tsx
|
|
178
|
+
import React2 from "react";
|
|
179
|
+
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
180
|
+
var ImageHeader = React2.memo(({ fileName, fileExtension }) => {
|
|
181
|
+
return /* @__PURE__ */ jsxs2("div", { className: "pdf-viewer-header", children: [
|
|
182
|
+
/* @__PURE__ */ jsx2(FileIcon_default, { ext: fileExtension, size: 26 }),
|
|
183
|
+
/* @__PURE__ */ jsx2("div", { className: "header-file-name", title: fileName, children: fileName })
|
|
184
|
+
] });
|
|
185
|
+
});
|
|
186
|
+
ImageHeader.displayName = "ImageHeader";
|
|
187
|
+
|
|
188
|
+
// src/components/viewers/ImageViewer.tsx
|
|
189
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
190
|
+
var ImageViewer = ({
|
|
191
|
+
file,
|
|
192
|
+
url,
|
|
193
|
+
fileName,
|
|
194
|
+
width = "100%",
|
|
195
|
+
height = "100%",
|
|
196
|
+
className = "",
|
|
197
|
+
style = {},
|
|
198
|
+
showDownload = true,
|
|
199
|
+
showPrint = true,
|
|
200
|
+
showMetadata = false,
|
|
201
|
+
showTags = false,
|
|
202
|
+
showProperties = false,
|
|
203
|
+
onDownloadClick,
|
|
204
|
+
onPrintClick,
|
|
205
|
+
onTagsClick,
|
|
206
|
+
onMetadataClick,
|
|
207
|
+
onPropertiesClick,
|
|
208
|
+
// Extract props that shouldn't be passed to DOM elements
|
|
209
|
+
mimeType,
|
|
210
|
+
fileSize,
|
|
211
|
+
showPageCount,
|
|
212
|
+
showPageNavigation,
|
|
213
|
+
showZoomControls,
|
|
214
|
+
showSearch,
|
|
215
|
+
customRegistry,
|
|
216
|
+
initialSearchText,
|
|
217
|
+
initialSearchPages,
|
|
218
|
+
autoOpenSearch,
|
|
219
|
+
autoExecuteSearch,
|
|
220
|
+
onSearchComplete,
|
|
221
|
+
toolbarActions,
|
|
222
|
+
...props
|
|
223
|
+
}) => {
|
|
224
|
+
const containerRef = useRef(null);
|
|
225
|
+
const imageAreaRef = useRef(null);
|
|
226
|
+
const [imageSize, setImageSize] = useState({ width: 0, height: 0 });
|
|
227
|
+
const [zoom, setZoom] = useState(100);
|
|
228
|
+
const [rotation, setRotation] = useState(0);
|
|
229
|
+
const [pendingFit, setPendingFit] = useState(null);
|
|
230
|
+
const didAutoFit = useRef(false);
|
|
231
|
+
const [isDragging, setIsDragging] = useState(false);
|
|
232
|
+
const [dragStart, setDragStart] = useState({ x: 0, y: 0 });
|
|
233
|
+
const [scrollStart, setScrollStart] = useState({ left: 0, top: 0 });
|
|
234
|
+
const [isFullScreen, setIsFullScreen] = useState(false);
|
|
235
|
+
const src = useMemo(() => {
|
|
236
|
+
if (file) {
|
|
237
|
+
const objectUrl = URL.createObjectURL(file);
|
|
238
|
+
return objectUrl;
|
|
239
|
+
}
|
|
240
|
+
return url || "";
|
|
241
|
+
}, [file, url]);
|
|
242
|
+
useEffect(() => {
|
|
243
|
+
return () => {
|
|
244
|
+
if (file && src) {
|
|
245
|
+
URL.revokeObjectURL(src);
|
|
246
|
+
}
|
|
247
|
+
};
|
|
248
|
+
}, [file, src]);
|
|
249
|
+
const handleImageLoad = (e) => {
|
|
250
|
+
const img = e.currentTarget;
|
|
251
|
+
setImageSize({ width: img.naturalWidth, height: img.naturalHeight });
|
|
252
|
+
if (!didAutoFit.current) {
|
|
253
|
+
setPendingFit("page");
|
|
254
|
+
didAutoFit.current = true;
|
|
255
|
+
}
|
|
256
|
+
};
|
|
257
|
+
useEffect(() => {
|
|
258
|
+
if (!imageAreaRef.current || !imageSize.width || !imageSize.height || !pendingFit)
|
|
259
|
+
return;
|
|
260
|
+
const containerWidth = imageAreaRef.current.offsetWidth;
|
|
261
|
+
const containerHeight = imageAreaRef.current.offsetHeight;
|
|
262
|
+
const rot2 = rotation % 360;
|
|
263
|
+
const rotated2 = rot2 === 90 || rot2 === 270;
|
|
264
|
+
const imgW = rotated2 ? imageSize.height : imageSize.width;
|
|
265
|
+
const imgH = rotated2 ? imageSize.width : imageSize.height;
|
|
266
|
+
if (pendingFit === "width") {
|
|
267
|
+
setZoom(Math.round(containerWidth / imgW * 100));
|
|
268
|
+
} else if (pendingFit === "page") {
|
|
269
|
+
const scaleW = containerWidth / imgW;
|
|
270
|
+
const scaleH = containerHeight / imgH;
|
|
271
|
+
setZoom(Math.round(Math.min(scaleW, scaleH) * 100));
|
|
272
|
+
}
|
|
273
|
+
setPendingFit(null);
|
|
274
|
+
}, [pendingFit, imageSize, rotation]);
|
|
275
|
+
const handleZoomIn = () => setZoom((z) => Math.min(z + 10, 400));
|
|
276
|
+
const handleZoomOut = () => setZoom((z) => Math.max(z - 10, 10));
|
|
277
|
+
const handleFitToWidth = () => setPendingFit("width");
|
|
278
|
+
const handleFitToPage = () => setPendingFit("page");
|
|
279
|
+
const handleRotateLeft = () => setRotation((r) => (r - 90 + 360) % 360);
|
|
280
|
+
const handleRotateRight = () => setRotation((r) => (r + 90) % 360);
|
|
281
|
+
const handleToggleFullScreen = () => {
|
|
282
|
+
if (!isFullScreen && containerRef.current?.requestFullscreen) {
|
|
283
|
+
containerRef.current.requestFullscreen();
|
|
284
|
+
setIsFullScreen(true);
|
|
285
|
+
} else if (isFullScreen && document.exitFullscreen) {
|
|
286
|
+
document.exitFullscreen();
|
|
287
|
+
setIsFullScreen(false);
|
|
288
|
+
}
|
|
289
|
+
};
|
|
290
|
+
const handleMouseDown = (e) => {
|
|
291
|
+
if (imageAreaRef.current) {
|
|
292
|
+
setIsDragging(true);
|
|
293
|
+
setDragStart({ x: e.clientX, y: e.clientY });
|
|
294
|
+
setScrollStart({
|
|
295
|
+
left: imageAreaRef.current.scrollLeft,
|
|
296
|
+
top: imageAreaRef.current.scrollTop
|
|
297
|
+
});
|
|
298
|
+
}
|
|
299
|
+
};
|
|
300
|
+
const handleMouseMove = (e) => {
|
|
301
|
+
if (!isDragging || !imageAreaRef.current) return;
|
|
302
|
+
const dx = e.clientX - dragStart.x;
|
|
303
|
+
const dy = e.clientY - dragStart.y;
|
|
304
|
+
imageAreaRef.current.scrollLeft = scrollStart.left - dx;
|
|
305
|
+
imageAreaRef.current.scrollTop = scrollStart.top - dy;
|
|
306
|
+
};
|
|
307
|
+
const handleMouseUp = () => setIsDragging(false);
|
|
308
|
+
const handleMouseLeave = () => setIsDragging(false);
|
|
309
|
+
const toolbar = mergeToolbarConfig({
|
|
310
|
+
showDownload,
|
|
311
|
+
showPrint,
|
|
312
|
+
showMetadata,
|
|
313
|
+
showTags,
|
|
314
|
+
showProperties,
|
|
315
|
+
onDownloadClick,
|
|
316
|
+
onPrintClick,
|
|
317
|
+
onTagsClick,
|
|
318
|
+
onMetadataClick,
|
|
319
|
+
onPropertiesClick,
|
|
320
|
+
toolbarActions
|
|
321
|
+
});
|
|
322
|
+
useEffect(() => {
|
|
323
|
+
const handleKeyDown = (e) => {
|
|
324
|
+
if (e.key === "+") setZoom((z) => Math.min(z + 10, 400));
|
|
325
|
+
if (e.key === "-") setZoom((z) => Math.max(z - 10, 10));
|
|
326
|
+
if (e.key === "r") setRotation((r) => (r + 90) % 360);
|
|
327
|
+
if (e.key === "R") setRotation((r) => (r - 90 + 360) % 360);
|
|
328
|
+
if (e.key === "Escape" && isFullScreen && document.exitFullscreen) {
|
|
329
|
+
document.exitFullscreen();
|
|
330
|
+
setIsFullScreen(false);
|
|
331
|
+
}
|
|
332
|
+
};
|
|
333
|
+
const handleFullscreenChange = () => {
|
|
334
|
+
setIsFullScreen(!!document.fullscreenElement);
|
|
335
|
+
};
|
|
336
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
337
|
+
document.addEventListener("fullscreenchange", handleFullscreenChange);
|
|
338
|
+
return () => {
|
|
339
|
+
window.removeEventListener("keydown", handleKeyDown);
|
|
340
|
+
document.removeEventListener("fullscreenchange", handleFullscreenChange);
|
|
341
|
+
};
|
|
342
|
+
}, [isFullScreen]);
|
|
343
|
+
if (!src) {
|
|
344
|
+
return /* @__PURE__ */ jsxs3("div", { className: "pdf-viewer-container", style: { width, height, ...style }, children: [
|
|
345
|
+
/* @__PURE__ */ jsx3("style", { children: toolbarStyles }),
|
|
346
|
+
/* @__PURE__ */ jsx3(
|
|
347
|
+
"div",
|
|
348
|
+
{
|
|
349
|
+
style: {
|
|
350
|
+
height: "100%",
|
|
351
|
+
display: "flex",
|
|
352
|
+
alignItems: "center",
|
|
353
|
+
justifyContent: "center",
|
|
354
|
+
color: "#666"
|
|
355
|
+
},
|
|
356
|
+
children: /* @__PURE__ */ jsx3("strong", { children: "No image source provided" })
|
|
357
|
+
}
|
|
358
|
+
)
|
|
359
|
+
] });
|
|
360
|
+
}
|
|
361
|
+
const displayName = fileName || file?.name || "image";
|
|
362
|
+
const ext = displayName.split(".").pop() || "";
|
|
363
|
+
const rot = rotation % 360;
|
|
364
|
+
const rotated = rot === 90 || rot === 270;
|
|
365
|
+
const displayWidth = rotated ? imageSize.height : imageSize.width;
|
|
366
|
+
const displayHeight = rotated ? imageSize.width : imageSize.height;
|
|
367
|
+
const scaledWidth = displayWidth * (zoom / 100);
|
|
368
|
+
const scaledHeight = displayHeight * (zoom / 100);
|
|
369
|
+
return /* @__PURE__ */ jsxs3(
|
|
370
|
+
"div",
|
|
371
|
+
{
|
|
372
|
+
ref: containerRef,
|
|
373
|
+
className: "pdf-viewer-container",
|
|
374
|
+
style: { width, height, ...style },
|
|
375
|
+
children: [
|
|
376
|
+
/* @__PURE__ */ jsx3("style", { children: toolbarStyles }),
|
|
377
|
+
/* @__PURE__ */ jsx3(ImageHeader, { fileName: displayName, fileExtension: ext }),
|
|
378
|
+
/* @__PURE__ */ jsx3(
|
|
379
|
+
ImageToolbar,
|
|
380
|
+
{
|
|
381
|
+
zoom,
|
|
382
|
+
rotation,
|
|
383
|
+
onZoomIn: handleZoomIn,
|
|
384
|
+
onZoomOut: handleZoomOut,
|
|
385
|
+
onFitToWidth: handleFitToWidth,
|
|
386
|
+
onFitToPage: handleFitToPage,
|
|
387
|
+
onRotateLeft: handleRotateLeft,
|
|
388
|
+
onRotateRight: handleRotateRight,
|
|
389
|
+
onToggleFullScreen: handleToggleFullScreen,
|
|
390
|
+
showDownload: !toolbar.isHidden("download"),
|
|
391
|
+
showPrint: !toolbar.isHidden("print"),
|
|
392
|
+
showMetadata: !toolbar.isHidden("metadata"),
|
|
393
|
+
showProperties: !toolbar.isHidden("properties"),
|
|
394
|
+
showTags: !toolbar.isHidden("tags"),
|
|
395
|
+
disabledDownload: toolbar.isDisabled("download"),
|
|
396
|
+
disabledPrint: toolbar.isDisabled("print"),
|
|
397
|
+
disabledMetadata: toolbar.isDisabled("metadata"),
|
|
398
|
+
disabledProperties: toolbar.isDisabled("properties"),
|
|
399
|
+
onDownloadClick: toolbar.getHandler("download", onDownloadClick),
|
|
400
|
+
onPrintClick: toolbar.getHandler("print", onPrintClick),
|
|
401
|
+
onMetadataClick: toolbar.getHandler("metadata", onMetadataClick),
|
|
402
|
+
onPropertiesClick: toolbar.getHandler("properties", onPropertiesClick),
|
|
403
|
+
onTagsClick: toolbar.getHandler("properties", onTagsClick)
|
|
404
|
+
}
|
|
405
|
+
),
|
|
406
|
+
/* @__PURE__ */ jsx3(
|
|
407
|
+
"div",
|
|
408
|
+
{
|
|
409
|
+
ref: imageAreaRef,
|
|
410
|
+
className: "pdf-viewer-content",
|
|
411
|
+
style: {
|
|
412
|
+
cursor: isDragging ? "grabbing" : "grab",
|
|
413
|
+
overflow: "auto",
|
|
414
|
+
background: "#f5f5f5"
|
|
415
|
+
},
|
|
416
|
+
onMouseDown: handleMouseDown,
|
|
417
|
+
onMouseMove: handleMouseMove,
|
|
418
|
+
onMouseUp: handleMouseUp,
|
|
419
|
+
onMouseLeave: handleMouseLeave,
|
|
420
|
+
children: /* @__PURE__ */ jsx3(
|
|
421
|
+
"div",
|
|
422
|
+
{
|
|
423
|
+
style: {
|
|
424
|
+
minWidth: `${scaledWidth}px`,
|
|
425
|
+
minHeight: `${scaledHeight}px`,
|
|
426
|
+
width: `${scaledWidth}px`,
|
|
427
|
+
height: `${scaledHeight}px`,
|
|
428
|
+
margin: "auto",
|
|
429
|
+
display: "flex",
|
|
430
|
+
alignItems: "center",
|
|
431
|
+
justifyContent: "center",
|
|
432
|
+
position: "relative"
|
|
433
|
+
},
|
|
434
|
+
children: /* @__PURE__ */ jsx3(
|
|
435
|
+
"img",
|
|
436
|
+
{
|
|
437
|
+
src,
|
|
438
|
+
alt: displayName,
|
|
439
|
+
onLoad: handleImageLoad,
|
|
440
|
+
crossOrigin: "anonymous",
|
|
441
|
+
style: {
|
|
442
|
+
transform: `rotate(${rotation}deg)`,
|
|
443
|
+
transformOrigin: "center center",
|
|
444
|
+
maxWidth: "100%",
|
|
445
|
+
maxHeight: "100%",
|
|
446
|
+
width: "100%",
|
|
447
|
+
height: "100%",
|
|
448
|
+
objectFit: "contain",
|
|
449
|
+
pointerEvents: "none",
|
|
450
|
+
userSelect: "none"
|
|
451
|
+
}
|
|
452
|
+
}
|
|
453
|
+
)
|
|
454
|
+
}
|
|
455
|
+
)
|
|
456
|
+
}
|
|
457
|
+
)
|
|
458
|
+
]
|
|
459
|
+
}
|
|
460
|
+
);
|
|
461
|
+
};
|
|
462
|
+
|
|
463
|
+
export {
|
|
464
|
+
ImageViewer
|
|
465
|
+
};
|
|
466
|
+
//# sourceMappingURL=chunk-FZVXQGA7.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/viewers/ImageViewer.tsx","../src/components/viewers/image/ImageToolbar.tsx","../src/components/viewers/image/ImageHeader.tsx"],"sourcesContent":["import React, { useRef, useState, useMemo, useEffect } from \"react\";\r\nimport { ImageToolbar } from \"./image/ImageToolbar\";\r\nimport { ImageHeader } from \"./image/ImageHeader\";\r\nimport { toolbarStyles } from \"./pdf/PDFStyles\";\r\nimport { FileViewerProps } from \"../../types\";\r\nimport { mergeToolbarConfig } from \"../../utils/toolbarUtils\";\r\n\r\nexport const ImageViewer: React.FC<FileViewerProps> = ({\r\n file,\r\n url,\r\n fileName,\r\n width = \"100%\",\r\n height = \"100%\",\r\n className = \"\",\r\n style = {},\r\n showDownload = true,\r\n showPrint = true,\r\n showMetadata = false,\r\n showTags = false,\r\n showProperties = false,\r\n onDownloadClick,\r\n onPrintClick,\r\n onTagsClick,\r\n onMetadataClick,\r\n onPropertiesClick,\r\n // Extract props that shouldn't be passed to DOM elements\r\n mimeType,\r\n fileSize,\r\n showPageCount,\r\n showPageNavigation,\r\n showZoomControls,\r\n showSearch,\r\n customRegistry,\r\n initialSearchText,\r\n initialSearchPages,\r\n autoOpenSearch,\r\n autoExecuteSearch,\r\n onSearchComplete,\r\n toolbarActions,\r\n ...props\r\n}) => {\r\n const containerRef = useRef<HTMLDivElement>(null);\r\n const imageAreaRef = useRef<HTMLDivElement>(null);\r\n const [imageSize, setImageSize] = useState({ width: 0, height: 0 });\r\n const [zoom, setZoom] = useState(100);\r\n const [rotation, setRotation] = useState(0);\r\n const [pendingFit, setPendingFit] = useState<\"width\" | \"page\" | null>(null);\r\n const didAutoFit = useRef(false);\r\n const [isDragging, setIsDragging] = useState(false);\r\n const [dragStart, setDragStart] = useState({ x: 0, y: 0 });\r\n const [scrollStart, setScrollStart] = useState({ left: 0, top: 0 });\r\n const [isFullScreen, setIsFullScreen] = useState(false);\r\n\r\n const src = useMemo(() => {\r\n if (file) {\r\n const objectUrl = URL.createObjectURL(file);\r\n return objectUrl;\r\n }\r\n return url || \"\";\r\n }, [file, url]);\r\n\r\n useEffect(() => {\r\n return () => {\r\n if (file && src) {\r\n URL.revokeObjectURL(src);\r\n }\r\n };\r\n }, [file, src]);\r\n\r\n const handleImageLoad = (e: React.SyntheticEvent<HTMLImageElement>) => {\r\n const img = e.currentTarget;\r\n setImageSize({ width: img.naturalWidth, height: img.naturalHeight });\r\n if (!didAutoFit.current) {\r\n setPendingFit(\"page\");\r\n didAutoFit.current = true;\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (\r\n !imageAreaRef.current ||\r\n !imageSize.width ||\r\n !imageSize.height ||\r\n !pendingFit\r\n )\r\n return;\r\n\r\n const containerWidth = imageAreaRef.current.offsetWidth;\r\n const containerHeight = imageAreaRef.current.offsetHeight;\r\n const rot = rotation % 360;\r\n const rotated = rot === 90 || rot === 270;\r\n const imgW = rotated ? imageSize.height : imageSize.width;\r\n const imgH = rotated ? imageSize.width : imageSize.height;\r\n\r\n if (pendingFit === \"width\") {\r\n setZoom(Math.round((containerWidth / imgW) * 100));\r\n } else if (pendingFit === \"page\") {\r\n const scaleW = containerWidth / imgW;\r\n const scaleH = containerHeight / imgH;\r\n setZoom(Math.round(Math.min(scaleW, scaleH) * 100));\r\n }\r\n setPendingFit(null);\r\n }, [pendingFit, imageSize, rotation]);\r\n\r\n const handleZoomIn = () => setZoom((z) => Math.min(z + 10, 400));\r\n const handleZoomOut = () => setZoom((z) => Math.max(z - 10, 10));\r\n const handleFitToWidth = () => setPendingFit(\"width\");\r\n const handleFitToPage = () => setPendingFit(\"page\");\r\n const handleRotateLeft = () => setRotation((r) => (r - 90 + 360) % 360);\r\n const handleRotateRight = () => setRotation((r) => (r + 90) % 360);\r\n\r\n const handleToggleFullScreen = () => {\r\n if (!isFullScreen && containerRef.current?.requestFullscreen) {\r\n containerRef.current.requestFullscreen();\r\n setIsFullScreen(true);\r\n } else if (isFullScreen && document.exitFullscreen) {\r\n document.exitFullscreen();\r\n setIsFullScreen(false);\r\n }\r\n };\r\n\r\n const handleMouseDown = (e: React.MouseEvent) => {\r\n if (imageAreaRef.current) {\r\n setIsDragging(true);\r\n setDragStart({ x: e.clientX, y: e.clientY });\r\n setScrollStart({\r\n left: imageAreaRef.current.scrollLeft,\r\n top: imageAreaRef.current.scrollTop,\r\n });\r\n }\r\n };\r\n\r\n const handleMouseMove = (e: React.MouseEvent) => {\r\n if (!isDragging || !imageAreaRef.current) return;\r\n const dx = e.clientX - dragStart.x;\r\n const dy = e.clientY - dragStart.y;\r\n imageAreaRef.current.scrollLeft = scrollStart.left - dx;\r\n imageAreaRef.current.scrollTop = scrollStart.top - dy;\r\n };\r\n\r\n const handleMouseUp = () => setIsDragging(false);\r\n const handleMouseLeave = () => setIsDragging(false);\r\n\r\n const toolbar = mergeToolbarConfig({\r\n showDownload,\r\n showPrint,\r\n showMetadata,\r\n showTags,\r\n showProperties,\r\n onDownloadClick,\r\n onPrintClick,\r\n onTagsClick,\r\n onMetadataClick,\r\n onPropertiesClick,\r\n toolbarActions,\r\n });\r\n\r\n useEffect(() => {\r\n const handleKeyDown = (e: KeyboardEvent) => {\r\n if (e.key === \"+\") setZoom((z) => Math.min(z + 10, 400));\r\n if (e.key === \"-\") setZoom((z) => Math.max(z - 10, 10));\r\n if (e.key === \"r\") setRotation((r) => (r + 90) % 360);\r\n if (e.key === \"R\") setRotation((r) => (r - 90 + 360) % 360);\r\n if (e.key === \"Escape\" && isFullScreen && document.exitFullscreen) {\r\n document.exitFullscreen();\r\n setIsFullScreen(false);\r\n }\r\n };\r\n\r\n const handleFullscreenChange = () => {\r\n setIsFullScreen(!!document.fullscreenElement);\r\n };\r\n\r\n window.addEventListener(\"keydown\", handleKeyDown);\r\n document.addEventListener(\"fullscreenchange\", handleFullscreenChange);\r\n\r\n return () => {\r\n window.removeEventListener(\"keydown\", handleKeyDown);\r\n document.removeEventListener(\"fullscreenchange\", handleFullscreenChange);\r\n };\r\n }, [isFullScreen]);\r\n\r\n if (!src) {\r\n return (\r\n <div className=\"pdf-viewer-container\" style={{ width, height, ...style }}>\r\n <style>{toolbarStyles}</style>\r\n <div\r\n style={{\r\n height: \"100%\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n color: \"#666\",\r\n }}\r\n >\r\n <strong>No image source provided</strong>\r\n </div>\r\n </div>\r\n );\r\n }\r\n\r\n const displayName = fileName || file?.name || \"image\";\r\n const ext = displayName.split(\".\").pop() || \"\";\r\n\r\n const rot = rotation % 360;\r\n const rotated = rot === 90 || rot === 270;\r\n const displayWidth = rotated ? imageSize.height : imageSize.width;\r\n const displayHeight = rotated ? imageSize.width : imageSize.height;\r\n const scaledWidth = displayWidth * (zoom / 100);\r\n const scaledHeight = displayHeight * (zoom / 100);\r\n\r\n return (\r\n <div\r\n ref={containerRef}\r\n className=\"pdf-viewer-container\"\r\n style={{ width, height, ...style }}\r\n >\r\n <style>{toolbarStyles}</style>\r\n <ImageHeader fileName={displayName} fileExtension={ext} />\r\n <ImageToolbar\r\n zoom={zoom}\r\n rotation={rotation}\r\n onZoomIn={handleZoomIn}\r\n onZoomOut={handleZoomOut}\r\n onFitToWidth={handleFitToWidth}\r\n onFitToPage={handleFitToPage}\r\n onRotateLeft={handleRotateLeft}\r\n onRotateRight={handleRotateRight}\r\n onToggleFullScreen={handleToggleFullScreen}\r\n showDownload={!toolbar.isHidden(\"download\")}\r\n showPrint={!toolbar.isHidden(\"print\")}\r\n showMetadata={!toolbar.isHidden(\"metadata\")}\r\n showProperties={!toolbar.isHidden(\"properties\")}\r\n showTags={!toolbar.isHidden(\"tags\")}\r\n disabledDownload={toolbar.isDisabled(\"download\")}\r\n disabledPrint={toolbar.isDisabled(\"print\")}\r\n disabledMetadata={toolbar.isDisabled(\"metadata\")}\r\n disabledProperties={toolbar.isDisabled(\"properties\")}\r\n onDownloadClick={toolbar.getHandler(\"download\", onDownloadClick)}\r\n onPrintClick={toolbar.getHandler(\"print\", onPrintClick)}\r\n onMetadataClick={toolbar.getHandler(\"metadata\", onMetadataClick)}\r\n onPropertiesClick={toolbar.getHandler(\"properties\", onPropertiesClick)}\r\n onTagsClick={toolbar.getHandler(\"properties\", onTagsClick)}\r\n />\r\n <div\r\n ref={imageAreaRef}\r\n className=\"pdf-viewer-content\"\r\n style={{\r\n cursor: isDragging ? \"grabbing\" : \"grab\",\r\n overflow: \"auto\",\r\n background: \"#f5f5f5\",\r\n }}\r\n onMouseDown={handleMouseDown}\r\n onMouseMove={handleMouseMove}\r\n onMouseUp={handleMouseUp}\r\n onMouseLeave={handleMouseLeave}\r\n >\r\n <div\r\n style={{\r\n minWidth: `${scaledWidth}px`,\r\n minHeight: `${scaledHeight}px`,\r\n width: `${scaledWidth}px`,\r\n height: `${scaledHeight}px`,\r\n margin: \"auto\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n position: \"relative\",\r\n }}\r\n >\r\n <img\r\n src={src}\r\n alt={displayName}\r\n onLoad={handleImageLoad}\r\n crossOrigin=\"anonymous\"\r\n style={{\r\n transform: `rotate(${rotation}deg)`,\r\n transformOrigin: \"center center\",\r\n maxWidth: \"100%\",\r\n maxHeight: \"100%\",\r\n width: \"100%\",\r\n height: \"100%\",\r\n objectFit: \"contain\",\r\n pointerEvents: \"none\",\r\n userSelect: \"none\",\r\n }}\r\n />\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n};\r\n","import React from \"react\";\r\nimport ZoomInIcon from \"@mui/icons-material/ZoomIn\";\r\nimport ZoomOutIcon from \"@mui/icons-material/ZoomOut\";\r\nimport RotateLeftIcon from \"@mui/icons-material/RotateLeft\";\r\nimport RotateRightIcon from \"@mui/icons-material/RotateRight\";\r\nimport FitScreenIcon from \"@mui/icons-material/FitScreen\";\r\nimport AspectRatioIcon from \"@mui/icons-material/AspectRatio\";\r\nimport FullscreenIcon from \"@mui/icons-material/Fullscreen\";\r\nimport DownloadIcon from \"@mui/icons-material/Download\";\r\nimport PrintIcon from \"@mui/icons-material/Print\";\r\nimport InfoIcon from \"@mui/icons-material/Info\";\r\nimport DescriptionIcon from \"@mui/icons-material/Description\";\r\nimport { LocalOffer } from \"@mui/icons-material\";\r\n\r\ninterface ImageToolbarProps {\r\n zoom: number;\r\n rotation: number;\r\n onZoomIn: () => void;\r\n onZoomOut: () => void;\r\n onFitToWidth: () => void;\r\n onFitToPage: () => void;\r\n onRotateLeft: () => void;\r\n onRotateRight: () => void;\r\n onToggleFullScreen: () => void;\r\n showDownload: boolean;\r\n showPrint: boolean;\r\n showMetadata: boolean;\r\n showTags: boolean;\r\n showProperties: boolean;\r\n disabledDownload?: boolean;\r\n disabledPrint?: boolean;\r\n disabledMetadata?: boolean;\r\n disabledTags?: boolean;\r\n disabledProperties?: boolean;\r\n onDownloadClick?: () => void;\r\n onTagsClick?: () => void;\r\n onPrintClick?: () => void;\r\n onMetadataClick?: () => void;\r\n onPropertiesClick?: () => void;\r\n}\r\n\r\nexport const ImageToolbar = React.memo<ImageToolbarProps>(\r\n ({\r\n zoom,\r\n rotation,\r\n onZoomIn,\r\n onZoomOut,\r\n onFitToWidth,\r\n onFitToPage,\r\n onRotateLeft,\r\n onRotateRight,\r\n onToggleFullScreen,\r\n showDownload,\r\n showPrint,\r\n showMetadata,\r\n showTags,\r\n showProperties,\r\n disabledDownload,\r\n disabledPrint,\r\n disabledMetadata,\r\n disabledProperties,\r\n disabledTags,\r\n onDownloadClick,\r\n onPrintClick,\r\n onTagsClick,\r\n onMetadataClick,\r\n onPropertiesClick,\r\n }) => (\r\n <div className=\"pdf-viewer-toolbar\">\r\n <div className=\"toolbar-separator\"></div>\r\n <div className=\"toolbar-section\">\r\n <button className=\"toolbar-button\" onClick={onZoomOut} title=\"Zoom Out\">\r\n <ZoomOutIcon fontSize=\"small\" />\r\n </button>\r\n <span className=\"zoom-display\">{zoom}%</span>\r\n <button className=\"toolbar-button\" onClick={onZoomIn} title=\"Zoom In\">\r\n <ZoomInIcon fontSize=\"small\" />\r\n </button>\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onFitToWidth}\r\n title=\"Fit to Width\"\r\n >\r\n <AspectRatioIcon fontSize=\"small\" />\r\n </button>\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onFitToPage}\r\n title=\"Fit to Page\"\r\n >\r\n <FitScreenIcon fontSize=\"small\" />\r\n </button>\r\n </div>\r\n <div className=\"toolbar-separator\"></div>\r\n <div className=\"toolbar-section\">\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onRotateLeft}\r\n title=\"Rotate Left\"\r\n >\r\n <RotateLeftIcon fontSize=\"small\" />\r\n </button>\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onRotateRight}\r\n title=\"Rotate Right\"\r\n >\r\n <RotateRightIcon fontSize=\"small\" />\r\n </button>\r\n <span className=\"page-info\">Rotation: {rotation}°</span>\r\n </div>\r\n <div className=\"toolbar-separator\"></div>\r\n <div className=\"toolbar-section\">\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onToggleFullScreen}\r\n title=\"Fullscreen\"\r\n >\r\n <FullscreenIcon fontSize=\"small\" />\r\n </button>\r\n </div>\r\n {(showDownload ||\r\n showPrint ||\r\n showMetadata ||\r\n showProperties ||\r\n showTags) && (\r\n <>\r\n <div className=\"toolbar-separator\"></div>\r\n <div className=\"toolbar-section\">\r\n {showDownload && (\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onDownloadClick}\r\n disabled={disabledDownload}\r\n title=\"Download Image\"\r\n >\r\n <DownloadIcon fontSize=\"small\" />\r\n </button>\r\n )}\r\n {showPrint && (\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onPrintClick}\r\n disabled={disabledPrint}\r\n title=\"Print Image\"\r\n >\r\n <PrintIcon fontSize=\"small\" />\r\n </button>\r\n )}\r\n {showMetadata && (\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onMetadataClick}\r\n disabled={disabledMetadata}\r\n title=\"Image Metadata\"\r\n >\r\n <DescriptionIcon fontSize=\"small\" />\r\n </button>\r\n )}\r\n {showProperties && (\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onPropertiesClick}\r\n disabled={disabledProperties}\r\n title=\"Image Properties\"\r\n >\r\n <InfoIcon fontSize=\"small\" />\r\n </button>\r\n )}\r\n {showTags && (\r\n <button\r\n className=\"toolbar-button\"\r\n onClick={onTagsClick}\r\n disabled={disabledTags}\r\n title=\"Image Tags\"\r\n >\r\n <LocalOffer fontSize=\"small\" />\r\n </button>\r\n )}\r\n </div>\r\n </>\r\n )}\r\n </div>\r\n )\r\n);\r\n\r\nImageToolbar.displayName = \"ImageToolbar\";\r\n","import React from 'react';\r\nimport FileIcon from '../../FileIcon';\r\n\r\ninterface ImageHeaderProps {\r\n fileName: string;\r\n fileExtension: string;\r\n}\r\n\r\nexport const ImageHeader = React.memo<ImageHeaderProps>(({ fileName, fileExtension }) => {\r\n return (\r\n <div className=\"pdf-viewer-header\">\r\n <FileIcon ext={fileExtension} size={26} />\r\n <div className=\"header-file-name\" title={fileName}>\r\n {fileName}\r\n </div>\r\n </div>\r\n );\r\n});\r\n\r\nImageHeader.displayName = 'ImageHeader';\r\n"],"mappings":"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","names":["React","jsx","jsxs","React","jsx","jsxs","rot","rotated"]}
|