@files-preview-app/preview-file 1.2.7 → 1.2.8
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/angular.cjs +124 -39
- package/dist/angular.cjs.map +1 -1
- package/dist/angular.js +124 -39
- package/dist/angular.js.map +1 -1
- package/dist/index.cjs +124 -39
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +124 -39
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +124 -39
- package/dist/react.cjs.map +1 -1
- package/dist/react.js +124 -39
- package/dist/react.js.map +1 -1
- package/dist/vue.cjs +124 -39
- package/dist/vue.cjs.map +1 -1
- package/dist/vue.js +124 -39
- package/dist/vue.js.map +1 -1
- package/package.json +7 -7
package/dist/angular.cjs
CHANGED
|
@@ -513,7 +513,8 @@ function createElement(tag, attrs, ...children) {
|
|
|
513
513
|
}
|
|
514
514
|
var ICON_ZOOM_IN = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="11" y1="8" x2="11" y2="14"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>`;
|
|
515
515
|
var ICON_ZOOM_OUT = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line><line x1="8" y1="11" x2="14" y2="11"></line></svg>`;
|
|
516
|
-
var ICON_FIT_PAGE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><
|
|
516
|
+
var ICON_FIT_PAGE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"></rect><line x1="8" y1="12" x2="16" y2="12"></line><polyline points="11 9 8 12 11 15"></polyline><polyline points="13 9 16 12 13 15"></polyline></svg>`;
|
|
517
|
+
var ICON_FIT_WIDTH = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="2" y1="12" x2="22" y2="12"></line><polyline points="5 9 2 12 5 15"></polyline><polyline points="19 9 22 12 19 15"></polyline><line x1="2" y1="5" x2="2" y2="19"></line><line x1="22" y1="5" x2="22" y2="19"></line></svg>`;
|
|
517
518
|
var ICON_ROTATE_CW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"></path></svg>`;
|
|
518
519
|
var ICON_ROTATE_CCW = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg>`;
|
|
519
520
|
var ICON_DOWNLOAD = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg>`;
|
|
@@ -533,6 +534,7 @@ var ICON_MAP = {
|
|
|
533
534
|
"zoom-in": ICON_ZOOM_IN,
|
|
534
535
|
"zoom-out": ICON_ZOOM_OUT,
|
|
535
536
|
"fit-page": ICON_FIT_PAGE,
|
|
537
|
+
"fit-width": ICON_FIT_WIDTH,
|
|
536
538
|
"fit-slide": ICON_FIT_PAGE,
|
|
537
539
|
"rotate-cw": ICON_ROTATE_CW,
|
|
538
540
|
"rotate-ccw": ICON_ROTATE_CCW,
|
|
@@ -1479,6 +1481,7 @@ var PdfPlugin = class {
|
|
|
1479
1481
|
let currentPage = 1;
|
|
1480
1482
|
let zoomScale = 1;
|
|
1481
1483
|
let rotation = 0;
|
|
1484
|
+
let fitMode = "width";
|
|
1482
1485
|
let currentRenderTask = null;
|
|
1483
1486
|
const renderPage = async (pageNum) => {
|
|
1484
1487
|
if (currentRenderTask) {
|
|
@@ -1498,11 +1501,16 @@ var PdfPlugin = class {
|
|
|
1498
1501
|
const containerWidth = container.clientWidth || 900;
|
|
1499
1502
|
const containerHeight = container.clientHeight || 700;
|
|
1500
1503
|
const unscaledVp = page.getViewport({ scale: 1, rotation });
|
|
1501
|
-
const availWidth = Math.max(
|
|
1502
|
-
const availHeight = Math.max(
|
|
1504
|
+
const availWidth = Math.max(280, containerWidth - 48);
|
|
1505
|
+
const availHeight = Math.max(280, containerHeight - 88);
|
|
1503
1506
|
const scaleW = availWidth / unscaledVp.width;
|
|
1504
1507
|
const scaleH = availHeight / unscaledVp.height;
|
|
1505
|
-
|
|
1508
|
+
let fitScale;
|
|
1509
|
+
if (fitMode === "page") {
|
|
1510
|
+
fitScale = Math.max(0.5, Math.min(scaleW, scaleH));
|
|
1511
|
+
} else {
|
|
1512
|
+
fitScale = Math.max(0.65, Math.min(1.15, scaleW));
|
|
1513
|
+
}
|
|
1506
1514
|
const effectiveScale = (fitScale > 0 ? fitScale : 1) * zoomScale;
|
|
1507
1515
|
const pixelRatio = window.devicePixelRatio || 1;
|
|
1508
1516
|
const viewport = page.getViewport({ scale: effectiveScale, rotation });
|
|
@@ -1571,6 +1579,7 @@ var PdfPlugin = class {
|
|
|
1571
1579
|
renderPage(currentPage);
|
|
1572
1580
|
},
|
|
1573
1581
|
fitToPage: () => {
|
|
1582
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
1574
1583
|
zoomScale = 1;
|
|
1575
1584
|
rotation = 0;
|
|
1576
1585
|
renderPage(currentPage);
|
|
@@ -2124,8 +2133,53 @@ var DocxPlugin = class {
|
|
|
2124
2133
|
}
|
|
2125
2134
|
}
|
|
2126
2135
|
}
|
|
2127
|
-
|
|
2128
|
-
const cards = wrapper.querySelectorAll(".fp-docx-page-card");
|
|
2136
|
+
let sections = Array.from(wrapper.querySelectorAll("section.docx"));
|
|
2137
|
+
const cards = Array.from(wrapper.querySelectorAll(".fp-docx-page-card"));
|
|
2138
|
+
if (sections.length === 1 && cards.length === 0) {
|
|
2139
|
+
const singleSec = sections[0];
|
|
2140
|
+
const pageH = 1056;
|
|
2141
|
+
const secH = singleSec.offsetHeight || singleSec.scrollHeight;
|
|
2142
|
+
if (secH > pageH * 1.25) {
|
|
2143
|
+
const children = Array.from(singleSec.children);
|
|
2144
|
+
if (children.length > 1) {
|
|
2145
|
+
const parent = singleSec.parentElement || wrapper;
|
|
2146
|
+
const newSections = [singleSec];
|
|
2147
|
+
singleSec.innerHTML = "";
|
|
2148
|
+
singleSec.style.minHeight = `${pageH}px`;
|
|
2149
|
+
singleSec.style.maxHeight = `${pageH}px`;
|
|
2150
|
+
singleSec.style.overflow = "hidden";
|
|
2151
|
+
singleSec.style.boxSizing = "border-box";
|
|
2152
|
+
let curSec = singleSec;
|
|
2153
|
+
let curH = 0;
|
|
2154
|
+
const maxH = pageH - 96;
|
|
2155
|
+
for (let i = 0; i < children.length; i++) {
|
|
2156
|
+
const child = children[i];
|
|
2157
|
+
curSec.appendChild(child);
|
|
2158
|
+
const chH = child.offsetHeight || 28;
|
|
2159
|
+
curH += chH;
|
|
2160
|
+
if (curH >= maxH && i < children.length - 1) {
|
|
2161
|
+
const nextSec = document.createElement("section");
|
|
2162
|
+
nextSec.className = singleSec.className;
|
|
2163
|
+
nextSec.style.cssText = singleSec.style.cssText;
|
|
2164
|
+
nextSec.style.width = singleSec.style.width || "816px";
|
|
2165
|
+
nextSec.style.minHeight = `${pageH}px`;
|
|
2166
|
+
nextSec.style.maxHeight = `${pageH}px`;
|
|
2167
|
+
nextSec.style.overflow = "hidden";
|
|
2168
|
+
nextSec.style.boxSizing = "border-box";
|
|
2169
|
+
nextSec.style.backgroundColor = "#ffffff";
|
|
2170
|
+
nextSec.style.boxShadow = "0 4px 24px rgba(0, 0, 0, 0.08)";
|
|
2171
|
+
nextSec.style.borderRadius = "4px";
|
|
2172
|
+
nextSec.style.marginBottom = "24px";
|
|
2173
|
+
parent.appendChild(nextSec);
|
|
2174
|
+
newSections.push(nextSec);
|
|
2175
|
+
curSec = nextSec;
|
|
2176
|
+
curH = 0;
|
|
2177
|
+
}
|
|
2178
|
+
}
|
|
2179
|
+
sections = newSections;
|
|
2180
|
+
}
|
|
2181
|
+
}
|
|
2182
|
+
}
|
|
2129
2183
|
const pageElements = sections.length > 0 ? sections : cards;
|
|
2130
2184
|
const totalPages = Math.max(1, pageElements.length);
|
|
2131
2185
|
let currentPage = 1;
|
|
@@ -2169,22 +2223,27 @@ var DocxPlugin = class {
|
|
|
2169
2223
|
}
|
|
2170
2224
|
scale = 1;
|
|
2171
2225
|
let rotation = 0;
|
|
2172
|
-
|
|
2226
|
+
let fitMode = "width";
|
|
2227
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
2173
2228
|
const activeEl = pageElements[currentPage - 1] || wrapper.firstElementChild || wrapper;
|
|
2174
2229
|
const elW = activeEl.offsetWidth || 816;
|
|
2175
|
-
const
|
|
2176
|
-
const availW = Math.max(
|
|
2177
|
-
const availH = Math.max(
|
|
2230
|
+
const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
2231
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
2232
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
2178
2233
|
const sW = availW / elW;
|
|
2179
|
-
const sH = availH /
|
|
2180
|
-
|
|
2234
|
+
const sH = availH / singlePageH;
|
|
2235
|
+
if (mode === "page") {
|
|
2236
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
2237
|
+
}
|
|
2238
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
2181
2239
|
};
|
|
2182
2240
|
const applyTransform = () => {
|
|
2183
2241
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
2184
2242
|
wrapper.style.transformOrigin = "top center";
|
|
2185
2243
|
};
|
|
2186
2244
|
setTimeout(() => {
|
|
2187
|
-
|
|
2245
|
+
fitMode = "width";
|
|
2246
|
+
scale = calculateFitScale("width");
|
|
2188
2247
|
applyTransform();
|
|
2189
2248
|
}, 60);
|
|
2190
2249
|
const cleanup = () => {
|
|
@@ -2218,7 +2277,8 @@ var DocxPlugin = class {
|
|
|
2218
2277
|
applyTransform();
|
|
2219
2278
|
},
|
|
2220
2279
|
fitToPage: () => {
|
|
2221
|
-
|
|
2280
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
2281
|
+
scale = calculateFitScale(fitMode);
|
|
2222
2282
|
rotation = 0;
|
|
2223
2283
|
applyTransform();
|
|
2224
2284
|
},
|
|
@@ -2662,11 +2722,9 @@ var ExcelPlugin = class {
|
|
|
2662
2722
|
const calculateFitScale = () => {
|
|
2663
2723
|
const table = contentArea.querySelector("table");
|
|
2664
2724
|
if (!table) return 1;
|
|
2665
|
-
const availW = Math.max(
|
|
2666
|
-
const availH = Math.max(200, container.clientHeight - 80);
|
|
2725
|
+
const availW = Math.max(280, container.clientWidth - 48);
|
|
2667
2726
|
const tW = table.offsetWidth || 800;
|
|
2668
|
-
|
|
2669
|
-
return Math.min(1, Math.min(availW / tW, availH / tH));
|
|
2727
|
+
return Math.max(0.65, Math.min(1, availW / tW));
|
|
2670
2728
|
};
|
|
2671
2729
|
try {
|
|
2672
2730
|
wb = XLSX__namespace.read(new Uint8Array(ctx.buffer), { type: "array", cellDates: true });
|
|
@@ -3263,7 +3321,7 @@ var CodePlugin = class {
|
|
|
3263
3321
|
fitToPage: () => {
|
|
3264
3322
|
fontSize = 13;
|
|
3265
3323
|
rotation = 0;
|
|
3266
|
-
zoomLevel = 1;
|
|
3324
|
+
zoomLevel = isTxt ? Math.max(0.65, Math.min(1.05, (container.clientWidth - 48) / 816)) : 1;
|
|
3267
3325
|
updateTransform();
|
|
3268
3326
|
},
|
|
3269
3327
|
rotateCW: () => {
|
|
@@ -4245,20 +4303,27 @@ var RtfPlugin = class {
|
|
|
4245
4303
|
let scale = 1;
|
|
4246
4304
|
let rotation = 0;
|
|
4247
4305
|
let pageElements = [];
|
|
4248
|
-
|
|
4306
|
+
let fitMode = "width";
|
|
4307
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
4249
4308
|
const activeEl = pageElements[currentPage - 1] || wrapper;
|
|
4250
4309
|
const elW = activeEl.offsetWidth || 850;
|
|
4251
|
-
const
|
|
4252
|
-
const availW = Math.max(
|
|
4253
|
-
const availH = Math.max(
|
|
4254
|
-
|
|
4310
|
+
const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
4311
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
4312
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
4313
|
+
const sW = availW / elW;
|
|
4314
|
+
const sH = availH / singlePageH;
|
|
4315
|
+
if (mode === "page") {
|
|
4316
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
4317
|
+
}
|
|
4318
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
4255
4319
|
};
|
|
4256
4320
|
const applyTransform = () => {
|
|
4257
4321
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
4258
4322
|
wrapper.style.transformOrigin = "top center";
|
|
4259
4323
|
};
|
|
4260
4324
|
setTimeout(() => {
|
|
4261
|
-
|
|
4325
|
+
fitMode = "width";
|
|
4326
|
+
scale = calculateFitScale("width");
|
|
4262
4327
|
applyTransform();
|
|
4263
4328
|
}, 60);
|
|
4264
4329
|
try {
|
|
@@ -4367,7 +4432,8 @@ var RtfPlugin = class {
|
|
|
4367
4432
|
applyTransform();
|
|
4368
4433
|
},
|
|
4369
4434
|
fitToPage: () => {
|
|
4370
|
-
|
|
4435
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
4436
|
+
scale = calculateFitScale(fitMode);
|
|
4371
4437
|
rotation = 0;
|
|
4372
4438
|
applyTransform();
|
|
4373
4439
|
},
|
|
@@ -4686,19 +4752,29 @@ var OpenDocumentPlugin = class {
|
|
|
4686
4752
|
ctx.container.appendChild(container);
|
|
4687
4753
|
let scale = 1;
|
|
4688
4754
|
let rotation = 0;
|
|
4689
|
-
|
|
4755
|
+
let fitMode = "width";
|
|
4756
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
4690
4757
|
const elW = wrapper.offsetWidth || 850;
|
|
4691
|
-
const
|
|
4692
|
-
const availW = Math.max(
|
|
4693
|
-
const availH = Math.max(
|
|
4694
|
-
|
|
4758
|
+
const singlePageH = Math.min(wrapper.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
4759
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
4760
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
4761
|
+
const sW = availW / elW;
|
|
4762
|
+
const sH = availH / (isPresentation ? 540 : singlePageH);
|
|
4763
|
+
if (isPresentation) {
|
|
4764
|
+
return Math.min(1, Math.min(sW, sH));
|
|
4765
|
+
}
|
|
4766
|
+
if (mode === "page") {
|
|
4767
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
4768
|
+
}
|
|
4769
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
4695
4770
|
};
|
|
4696
4771
|
const applyTransform = () => {
|
|
4697
4772
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
4698
4773
|
wrapper.style.transformOrigin = "top center";
|
|
4699
4774
|
};
|
|
4700
4775
|
setTimeout(() => {
|
|
4701
|
-
|
|
4776
|
+
fitMode = "width";
|
|
4777
|
+
scale = calculateFitScale("width");
|
|
4702
4778
|
applyTransform();
|
|
4703
4779
|
}, 60);
|
|
4704
4780
|
let currentPage = 1;
|
|
@@ -4859,7 +4935,8 @@ var OpenDocumentPlugin = class {
|
|
|
4859
4935
|
applyTransform();
|
|
4860
4936
|
},
|
|
4861
4937
|
fitToPage: () => {
|
|
4862
|
-
|
|
4938
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
4939
|
+
scale = calculateFitScale(fitMode);
|
|
4863
4940
|
rotation = 0;
|
|
4864
4941
|
applyTransform();
|
|
4865
4942
|
},
|
|
@@ -5336,15 +5413,22 @@ var DocPlugin = class {
|
|
|
5336
5413
|
if (totalPages > 1) {
|
|
5337
5414
|
showPage(1);
|
|
5338
5415
|
}
|
|
5339
|
-
|
|
5416
|
+
let fitMode = "width";
|
|
5417
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
5340
5418
|
const elW = 816;
|
|
5341
5419
|
const elH = 1056;
|
|
5342
|
-
const availW = Math.max(
|
|
5343
|
-
const availH = Math.max(
|
|
5344
|
-
|
|
5420
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
5421
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
5422
|
+
const sW = availW / elW;
|
|
5423
|
+
const sH = availH / elH;
|
|
5424
|
+
if (mode === "page") {
|
|
5425
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
5426
|
+
}
|
|
5427
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
5345
5428
|
};
|
|
5346
5429
|
setTimeout(() => {
|
|
5347
|
-
|
|
5430
|
+
fitMode = "width";
|
|
5431
|
+
scale = calculateFitScale("width");
|
|
5348
5432
|
applyTransform();
|
|
5349
5433
|
}, 60);
|
|
5350
5434
|
const cleanup = () => {
|
|
@@ -5372,7 +5456,8 @@ var DocPlugin = class {
|
|
|
5372
5456
|
applyTransform();
|
|
5373
5457
|
},
|
|
5374
5458
|
fitToPage: () => {
|
|
5375
|
-
|
|
5459
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
5460
|
+
scale = calculateFitScale(fitMode);
|
|
5376
5461
|
rotation = 0;
|
|
5377
5462
|
applyTransform();
|
|
5378
5463
|
},
|