@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/vue.cjs
CHANGED
|
@@ -465,7 +465,8 @@ function createElement(tag, attrs, ...children) {
|
|
|
465
465
|
}
|
|
466
466
|
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>`;
|
|
467
467
|
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>`;
|
|
468
|
-
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"><
|
|
468
|
+
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>`;
|
|
469
|
+
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>`;
|
|
469
470
|
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>`;
|
|
470
471
|
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>`;
|
|
471
472
|
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>`;
|
|
@@ -485,6 +486,7 @@ var ICON_MAP = {
|
|
|
485
486
|
"zoom-in": ICON_ZOOM_IN,
|
|
486
487
|
"zoom-out": ICON_ZOOM_OUT,
|
|
487
488
|
"fit-page": ICON_FIT_PAGE,
|
|
489
|
+
"fit-width": ICON_FIT_WIDTH,
|
|
488
490
|
"fit-slide": ICON_FIT_PAGE,
|
|
489
491
|
"rotate-cw": ICON_ROTATE_CW,
|
|
490
492
|
"rotate-ccw": ICON_ROTATE_CCW,
|
|
@@ -1431,6 +1433,7 @@ var PdfPlugin = class {
|
|
|
1431
1433
|
let currentPage = 1;
|
|
1432
1434
|
let zoomScale = 1;
|
|
1433
1435
|
let rotation = 0;
|
|
1436
|
+
let fitMode = "width";
|
|
1434
1437
|
let currentRenderTask = null;
|
|
1435
1438
|
const renderPage = async (pageNum) => {
|
|
1436
1439
|
if (currentRenderTask) {
|
|
@@ -1450,11 +1453,16 @@ var PdfPlugin = class {
|
|
|
1450
1453
|
const containerWidth = container.clientWidth || 900;
|
|
1451
1454
|
const containerHeight = container.clientHeight || 700;
|
|
1452
1455
|
const unscaledVp = page.getViewport({ scale: 1, rotation });
|
|
1453
|
-
const availWidth = Math.max(
|
|
1454
|
-
const availHeight = Math.max(
|
|
1456
|
+
const availWidth = Math.max(280, containerWidth - 48);
|
|
1457
|
+
const availHeight = Math.max(280, containerHeight - 88);
|
|
1455
1458
|
const scaleW = availWidth / unscaledVp.width;
|
|
1456
1459
|
const scaleH = availHeight / unscaledVp.height;
|
|
1457
|
-
|
|
1460
|
+
let fitScale;
|
|
1461
|
+
if (fitMode === "page") {
|
|
1462
|
+
fitScale = Math.max(0.5, Math.min(scaleW, scaleH));
|
|
1463
|
+
} else {
|
|
1464
|
+
fitScale = Math.max(0.65, Math.min(1.15, scaleW));
|
|
1465
|
+
}
|
|
1458
1466
|
const effectiveScale = (fitScale > 0 ? fitScale : 1) * zoomScale;
|
|
1459
1467
|
const pixelRatio = window.devicePixelRatio || 1;
|
|
1460
1468
|
const viewport = page.getViewport({ scale: effectiveScale, rotation });
|
|
@@ -1523,6 +1531,7 @@ var PdfPlugin = class {
|
|
|
1523
1531
|
renderPage(currentPage);
|
|
1524
1532
|
},
|
|
1525
1533
|
fitToPage: () => {
|
|
1534
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
1526
1535
|
zoomScale = 1;
|
|
1527
1536
|
rotation = 0;
|
|
1528
1537
|
renderPage(currentPage);
|
|
@@ -2076,8 +2085,53 @@ var DocxPlugin = class {
|
|
|
2076
2085
|
}
|
|
2077
2086
|
}
|
|
2078
2087
|
}
|
|
2079
|
-
|
|
2080
|
-
const cards = wrapper.querySelectorAll(".fp-docx-page-card");
|
|
2088
|
+
let sections = Array.from(wrapper.querySelectorAll("section.docx"));
|
|
2089
|
+
const cards = Array.from(wrapper.querySelectorAll(".fp-docx-page-card"));
|
|
2090
|
+
if (sections.length === 1 && cards.length === 0) {
|
|
2091
|
+
const singleSec = sections[0];
|
|
2092
|
+
const pageH = 1056;
|
|
2093
|
+
const secH = singleSec.offsetHeight || singleSec.scrollHeight;
|
|
2094
|
+
if (secH > pageH * 1.25) {
|
|
2095
|
+
const children = Array.from(singleSec.children);
|
|
2096
|
+
if (children.length > 1) {
|
|
2097
|
+
const parent = singleSec.parentElement || wrapper;
|
|
2098
|
+
const newSections = [singleSec];
|
|
2099
|
+
singleSec.innerHTML = "";
|
|
2100
|
+
singleSec.style.minHeight = `${pageH}px`;
|
|
2101
|
+
singleSec.style.maxHeight = `${pageH}px`;
|
|
2102
|
+
singleSec.style.overflow = "hidden";
|
|
2103
|
+
singleSec.style.boxSizing = "border-box";
|
|
2104
|
+
let curSec = singleSec;
|
|
2105
|
+
let curH = 0;
|
|
2106
|
+
const maxH = pageH - 96;
|
|
2107
|
+
for (let i = 0; i < children.length; i++) {
|
|
2108
|
+
const child = children[i];
|
|
2109
|
+
curSec.appendChild(child);
|
|
2110
|
+
const chH = child.offsetHeight || 28;
|
|
2111
|
+
curH += chH;
|
|
2112
|
+
if (curH >= maxH && i < children.length - 1) {
|
|
2113
|
+
const nextSec = document.createElement("section");
|
|
2114
|
+
nextSec.className = singleSec.className;
|
|
2115
|
+
nextSec.style.cssText = singleSec.style.cssText;
|
|
2116
|
+
nextSec.style.width = singleSec.style.width || "816px";
|
|
2117
|
+
nextSec.style.minHeight = `${pageH}px`;
|
|
2118
|
+
nextSec.style.maxHeight = `${pageH}px`;
|
|
2119
|
+
nextSec.style.overflow = "hidden";
|
|
2120
|
+
nextSec.style.boxSizing = "border-box";
|
|
2121
|
+
nextSec.style.backgroundColor = "#ffffff";
|
|
2122
|
+
nextSec.style.boxShadow = "0 4px 24px rgba(0, 0, 0, 0.08)";
|
|
2123
|
+
nextSec.style.borderRadius = "4px";
|
|
2124
|
+
nextSec.style.marginBottom = "24px";
|
|
2125
|
+
parent.appendChild(nextSec);
|
|
2126
|
+
newSections.push(nextSec);
|
|
2127
|
+
curSec = nextSec;
|
|
2128
|
+
curH = 0;
|
|
2129
|
+
}
|
|
2130
|
+
}
|
|
2131
|
+
sections = newSections;
|
|
2132
|
+
}
|
|
2133
|
+
}
|
|
2134
|
+
}
|
|
2081
2135
|
const pageElements = sections.length > 0 ? sections : cards;
|
|
2082
2136
|
const totalPages = Math.max(1, pageElements.length);
|
|
2083
2137
|
let currentPage = 1;
|
|
@@ -2121,22 +2175,27 @@ var DocxPlugin = class {
|
|
|
2121
2175
|
}
|
|
2122
2176
|
scale = 1;
|
|
2123
2177
|
let rotation = 0;
|
|
2124
|
-
|
|
2178
|
+
let fitMode = "width";
|
|
2179
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
2125
2180
|
const activeEl = pageElements[currentPage - 1] || wrapper.firstElementChild || wrapper;
|
|
2126
2181
|
const elW = activeEl.offsetWidth || 816;
|
|
2127
|
-
const
|
|
2128
|
-
const availW = Math.max(
|
|
2129
|
-
const availH = Math.max(
|
|
2182
|
+
const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
2183
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
2184
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
2130
2185
|
const sW = availW / elW;
|
|
2131
|
-
const sH = availH /
|
|
2132
|
-
|
|
2186
|
+
const sH = availH / singlePageH;
|
|
2187
|
+
if (mode === "page") {
|
|
2188
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
2189
|
+
}
|
|
2190
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
2133
2191
|
};
|
|
2134
2192
|
const applyTransform = () => {
|
|
2135
2193
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
2136
2194
|
wrapper.style.transformOrigin = "top center";
|
|
2137
2195
|
};
|
|
2138
2196
|
setTimeout(() => {
|
|
2139
|
-
|
|
2197
|
+
fitMode = "width";
|
|
2198
|
+
scale = calculateFitScale("width");
|
|
2140
2199
|
applyTransform();
|
|
2141
2200
|
}, 60);
|
|
2142
2201
|
const cleanup = () => {
|
|
@@ -2170,7 +2229,8 @@ var DocxPlugin = class {
|
|
|
2170
2229
|
applyTransform();
|
|
2171
2230
|
},
|
|
2172
2231
|
fitToPage: () => {
|
|
2173
|
-
|
|
2232
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
2233
|
+
scale = calculateFitScale(fitMode);
|
|
2174
2234
|
rotation = 0;
|
|
2175
2235
|
applyTransform();
|
|
2176
2236
|
},
|
|
@@ -2614,11 +2674,9 @@ var ExcelPlugin = class {
|
|
|
2614
2674
|
const calculateFitScale = () => {
|
|
2615
2675
|
const table = contentArea.querySelector("table");
|
|
2616
2676
|
if (!table) return 1;
|
|
2617
|
-
const availW = Math.max(
|
|
2618
|
-
const availH = Math.max(200, container.clientHeight - 80);
|
|
2677
|
+
const availW = Math.max(280, container.clientWidth - 48);
|
|
2619
2678
|
const tW = table.offsetWidth || 800;
|
|
2620
|
-
|
|
2621
|
-
return Math.min(1, Math.min(availW / tW, availH / tH));
|
|
2679
|
+
return Math.max(0.65, Math.min(1, availW / tW));
|
|
2622
2680
|
};
|
|
2623
2681
|
try {
|
|
2624
2682
|
wb = XLSX__namespace.read(new Uint8Array(ctx.buffer), { type: "array", cellDates: true });
|
|
@@ -3215,7 +3273,7 @@ var CodePlugin = class {
|
|
|
3215
3273
|
fitToPage: () => {
|
|
3216
3274
|
fontSize = 13;
|
|
3217
3275
|
rotation = 0;
|
|
3218
|
-
zoomLevel = 1;
|
|
3276
|
+
zoomLevel = isTxt ? Math.max(0.65, Math.min(1.05, (container.clientWidth - 48) / 816)) : 1;
|
|
3219
3277
|
updateTransform();
|
|
3220
3278
|
},
|
|
3221
3279
|
rotateCW: () => {
|
|
@@ -4197,20 +4255,27 @@ var RtfPlugin = class {
|
|
|
4197
4255
|
let scale = 1;
|
|
4198
4256
|
let rotation = 0;
|
|
4199
4257
|
let pageElements = [];
|
|
4200
|
-
|
|
4258
|
+
let fitMode = "width";
|
|
4259
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
4201
4260
|
const activeEl = pageElements[currentPage - 1] || wrapper;
|
|
4202
4261
|
const elW = activeEl.offsetWidth || 850;
|
|
4203
|
-
const
|
|
4204
|
-
const availW = Math.max(
|
|
4205
|
-
const availH = Math.max(
|
|
4206
|
-
|
|
4262
|
+
const singlePageH = Math.min(activeEl.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
4263
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
4264
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
4265
|
+
const sW = availW / elW;
|
|
4266
|
+
const sH = availH / singlePageH;
|
|
4267
|
+
if (mode === "page") {
|
|
4268
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
4269
|
+
}
|
|
4270
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
4207
4271
|
};
|
|
4208
4272
|
const applyTransform = () => {
|
|
4209
4273
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
4210
4274
|
wrapper.style.transformOrigin = "top center";
|
|
4211
4275
|
};
|
|
4212
4276
|
setTimeout(() => {
|
|
4213
|
-
|
|
4277
|
+
fitMode = "width";
|
|
4278
|
+
scale = calculateFitScale("width");
|
|
4214
4279
|
applyTransform();
|
|
4215
4280
|
}, 60);
|
|
4216
4281
|
try {
|
|
@@ -4319,7 +4384,8 @@ var RtfPlugin = class {
|
|
|
4319
4384
|
applyTransform();
|
|
4320
4385
|
},
|
|
4321
4386
|
fitToPage: () => {
|
|
4322
|
-
|
|
4387
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
4388
|
+
scale = calculateFitScale(fitMode);
|
|
4323
4389
|
rotation = 0;
|
|
4324
4390
|
applyTransform();
|
|
4325
4391
|
},
|
|
@@ -4638,19 +4704,29 @@ var OpenDocumentPlugin = class {
|
|
|
4638
4704
|
ctx.container.appendChild(container);
|
|
4639
4705
|
let scale = 1;
|
|
4640
4706
|
let rotation = 0;
|
|
4641
|
-
|
|
4707
|
+
let fitMode = "width";
|
|
4708
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
4642
4709
|
const elW = wrapper.offsetWidth || 850;
|
|
4643
|
-
const
|
|
4644
|
-
const availW = Math.max(
|
|
4645
|
-
const availH = Math.max(
|
|
4646
|
-
|
|
4710
|
+
const singlePageH = Math.min(wrapper.offsetHeight || 1056, Math.round(elW * 1.32));
|
|
4711
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
4712
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
4713
|
+
const sW = availW / elW;
|
|
4714
|
+
const sH = availH / (isPresentation ? 540 : singlePageH);
|
|
4715
|
+
if (isPresentation) {
|
|
4716
|
+
return Math.min(1, Math.min(sW, sH));
|
|
4717
|
+
}
|
|
4718
|
+
if (mode === "page") {
|
|
4719
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
4720
|
+
}
|
|
4721
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
4647
4722
|
};
|
|
4648
4723
|
const applyTransform = () => {
|
|
4649
4724
|
wrapper.style.transform = `scale(${scale}) rotate(${rotation}deg)`;
|
|
4650
4725
|
wrapper.style.transformOrigin = "top center";
|
|
4651
4726
|
};
|
|
4652
4727
|
setTimeout(() => {
|
|
4653
|
-
|
|
4728
|
+
fitMode = "width";
|
|
4729
|
+
scale = calculateFitScale("width");
|
|
4654
4730
|
applyTransform();
|
|
4655
4731
|
}, 60);
|
|
4656
4732
|
let currentPage = 1;
|
|
@@ -4811,7 +4887,8 @@ var OpenDocumentPlugin = class {
|
|
|
4811
4887
|
applyTransform();
|
|
4812
4888
|
},
|
|
4813
4889
|
fitToPage: () => {
|
|
4814
|
-
|
|
4890
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
4891
|
+
scale = calculateFitScale(fitMode);
|
|
4815
4892
|
rotation = 0;
|
|
4816
4893
|
applyTransform();
|
|
4817
4894
|
},
|
|
@@ -5288,15 +5365,22 @@ var DocPlugin = class {
|
|
|
5288
5365
|
if (totalPages > 1) {
|
|
5289
5366
|
showPage(1);
|
|
5290
5367
|
}
|
|
5291
|
-
|
|
5368
|
+
let fitMode = "width";
|
|
5369
|
+
const calculateFitScale = (mode = fitMode) => {
|
|
5292
5370
|
const elW = 816;
|
|
5293
5371
|
const elH = 1056;
|
|
5294
|
-
const availW = Math.max(
|
|
5295
|
-
const availH = Math.max(
|
|
5296
|
-
|
|
5372
|
+
const availW = Math.max(280, ctx.container.clientWidth - 48);
|
|
5373
|
+
const availH = Math.max(280, ctx.container.clientHeight - 80);
|
|
5374
|
+
const sW = availW / elW;
|
|
5375
|
+
const sH = availH / elH;
|
|
5376
|
+
if (mode === "page") {
|
|
5377
|
+
return Math.max(0.55, Math.min(1.15, Math.min(sW, sH)));
|
|
5378
|
+
}
|
|
5379
|
+
return Math.max(0.65, Math.min(1.05, sW));
|
|
5297
5380
|
};
|
|
5298
5381
|
setTimeout(() => {
|
|
5299
|
-
|
|
5382
|
+
fitMode = "width";
|
|
5383
|
+
scale = calculateFitScale("width");
|
|
5300
5384
|
applyTransform();
|
|
5301
5385
|
}, 60);
|
|
5302
5386
|
const cleanup = () => {
|
|
@@ -5324,7 +5408,8 @@ var DocPlugin = class {
|
|
|
5324
5408
|
applyTransform();
|
|
5325
5409
|
},
|
|
5326
5410
|
fitToPage: () => {
|
|
5327
|
-
|
|
5411
|
+
fitMode = fitMode === "width" ? "page" : "width";
|
|
5412
|
+
scale = calculateFitScale(fitMode);
|
|
5328
5413
|
rotation = 0;
|
|
5329
5414
|
applyTransform();
|
|
5330
5415
|
},
|