@files-preview-app/preview-file 1.0.0 → 1.1.1

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/vue.cjs CHANGED
@@ -7,6 +7,13 @@ var DOMPurify = require('dompurify');
7
7
  var docx = require('docx-preview');
8
8
  var ExcelJS = require('exceljs');
9
9
  var hljs = require('highlight.js');
10
+ var fflate = require('fflate');
11
+ var marked = require('marked');
12
+ var pptxBrowser = require('pptx-browser');
13
+ var THREE = require('three');
14
+ var STLLoader_js = require('three/examples/jsm/loaders/STLLoader.js');
15
+ var OBJLoader_js = require('three/examples/jsm/loaders/OBJLoader.js');
16
+ var OrbitControls_js = require('three/examples/jsm/controls/OrbitControls.js');
10
17
 
11
18
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
12
19
 
@@ -32,6 +39,7 @@ var DOMPurify__default = /*#__PURE__*/_interopDefault(DOMPurify);
32
39
  var docx__namespace = /*#__PURE__*/_interopNamespace(docx);
33
40
  var ExcelJS__default = /*#__PURE__*/_interopDefault(ExcelJS);
34
41
  var hljs__default = /*#__PURE__*/_interopDefault(hljs);
42
+ var THREE__namespace = /*#__PURE__*/_interopNamespace(THREE);
35
43
 
36
44
  // src/vue.ts
37
45
  var EventEmitter = class {
@@ -322,6 +330,27 @@ function sanitizeSVG(svg) {
322
330
  USE_PROFILES: { svg: true, svgFilters: true }
323
331
  });
324
332
  }
333
+ function downloadFile(buffer, filename, mimeType) {
334
+ const blob = new Blob([buffer], { type: mimeType ?? "application/octet-stream" });
335
+ const url = URL.createObjectURL(blob);
336
+ const link = document.createElement("a");
337
+ link.href = url;
338
+ link.download = filename;
339
+ link.style.display = "none";
340
+ document.body.appendChild(link);
341
+ link.click();
342
+ setTimeout(() => {
343
+ document.body.removeChild(link);
344
+ URL.revokeObjectURL(url);
345
+ }, 100);
346
+ }
347
+ function formatFileSize(bytes) {
348
+ if (bytes === 0) return "0 B";
349
+ const units = ["B", "KB", "MB", "GB", "TB"];
350
+ const i = Math.floor(Math.log(bytes) / Math.log(1024));
351
+ const size = bytes / Math.pow(1024, i);
352
+ return `${size.toFixed(i > 0 ? 1 : 0)} ${units[i]}`;
353
+ }
325
354
  function createElement(tag, attrs, ...children) {
326
355
  const el = document.createElement(tag);
327
356
  if (attrs) {
@@ -1740,6 +1769,798 @@ var CodePlugin = class {
1740
1769
  function codePlugin() {
1741
1770
  return new CodePlugin();
1742
1771
  }
1772
+ var ArchivePlugin = class {
1773
+ id = "archive";
1774
+ name = "Archive Explorer";
1775
+ extensions = [".zip"];
1776
+ mimeTypes = ["application/zip", "application/x-zip-compressed"];
1777
+ weight = 70;
1778
+ supports(file) {
1779
+ const ext = file.metadata.extension?.toLowerCase();
1780
+ const mime = file.metadata.mimeType?.toLowerCase();
1781
+ return ext === ".zip" || this.mimeTypes.includes(mime || "");
1782
+ }
1783
+ getToolbarActions(instance) {
1784
+ return [
1785
+ {
1786
+ id: "zoom-out",
1787
+ icon: "zoom-out",
1788
+ label: "Zoom Out",
1789
+ type: "button",
1790
+ group: "zoom",
1791
+ execute: () => instance.zoomOut?.()
1792
+ },
1793
+ {
1794
+ id: "zoom-in",
1795
+ icon: "zoom-in",
1796
+ label: "Zoom In",
1797
+ type: "button",
1798
+ group: "zoom",
1799
+ execute: () => instance.zoomIn?.()
1800
+ },
1801
+ {
1802
+ id: "fit-page",
1803
+ icon: "fit-page",
1804
+ label: "Reset Zoom",
1805
+ type: "button",
1806
+ group: "zoom",
1807
+ execute: () => instance.fitToPage?.()
1808
+ },
1809
+ {
1810
+ id: "download",
1811
+ icon: "download",
1812
+ label: "Download Archive",
1813
+ type: "button",
1814
+ group: "actions",
1815
+ execute: () => instance.download?.()
1816
+ },
1817
+ {
1818
+ id: "print",
1819
+ icon: "print",
1820
+ label: "Print File List",
1821
+ type: "button",
1822
+ group: "actions",
1823
+ execute: () => instance.print?.()
1824
+ }
1825
+ ];
1826
+ }
1827
+ async render(ctx) {
1828
+ const wrapper = document.createElement("div");
1829
+ wrapper.className = "fp-archive-wrapper";
1830
+ wrapper.style.cssText = `
1831
+ width: 100%;
1832
+ height: 100%;
1833
+ overflow: auto;
1834
+ padding: 24px;
1835
+ box-sizing: border-box;
1836
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
1837
+ transform-origin: top left;
1838
+ transition: transform 0.2s ease;
1839
+ `;
1840
+ ctx.container.innerHTML = "";
1841
+ ctx.container.style.overflow = "auto";
1842
+ ctx.container.appendChild(wrapper);
1843
+ let scale = 1;
1844
+ const entries = await new Promise((resolve, reject) => {
1845
+ fflate.unzip(new Uint8Array(ctx.buffer), (err, unzipped) => {
1846
+ if (err) {
1847
+ reject(err);
1848
+ return;
1849
+ }
1850
+ const list = Object.entries(unzipped).map(([path, data]) => {
1851
+ const isDir = path.endsWith("/");
1852
+ const parts = path.split("/").filter(Boolean);
1853
+ const name = parts[parts.length - 1] || path;
1854
+ return {
1855
+ path,
1856
+ name,
1857
+ isDir,
1858
+ size: data.length,
1859
+ data
1860
+ };
1861
+ });
1862
+ resolve(list);
1863
+ });
1864
+ });
1865
+ const totalUncompressedSize = entries.reduce((acc, e) => acc + e.size, 0);
1866
+ const renderUI = (filteredEntries) => {
1867
+ wrapper.innerHTML = `
1868
+ <div style="max-width: 900px; margin: 0 auto; background: var(--fp-bg, #ffffff); border: 1px solid var(--fp-border, #e5e7eb); border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); overflow: hidden;">
1869
+ <div style="padding: 16px 20px; background: var(--fp-toolbar-bg, #f9fafb); border-bottom: 1px solid var(--fp-border, #e5e7eb); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;">
1870
+ <div>
1871
+ <h3 style="margin: 0 0 4px 0; font-size: 16px; font-weight: 600; color: var(--fp-text, #111827);">
1872
+ \u{1F4E6} ${ctx.metadata.name || "Archive.zip"}
1873
+ </h3>
1874
+ <div style="font-size: 13px; color: var(--fp-text-muted, #6b7280);">
1875
+ ${entries.length} items \xB7 Total size: ${formatFileSize(totalUncompressedSize)} (Compressed: ${formatFileSize(ctx.buffer.byteLength)})
1876
+ </div>
1877
+ </div>
1878
+ <div>
1879
+ <input type="text" id="fp-archive-search" placeholder="Search files in archive..." style="padding: 6px 12px; font-size: 13px; border: 1px solid var(--fp-border, #d1d5db); border-radius: 6px; outline: none; width: 220px;" />
1880
+ </div>
1881
+ </div>
1882
+ <div style="max-height: 550px; overflow-y: auto;">
1883
+ <table style="width: 100%; border-collapse: collapse; font-size: 13px; text-align: left;">
1884
+ <thead>
1885
+ <tr style="background: var(--fp-toolbar-bg, #f3f4f6); color: var(--fp-text-muted, #4b5563); border-bottom: 1px solid var(--fp-border, #e5e7eb);">
1886
+ <th style="padding: 10px 16px; font-weight: 600;">Name / Path</th>
1887
+ <th style="padding: 10px 16px; font-weight: 600; width: 120px;">Size</th>
1888
+ <th style="padding: 10px 16px; font-weight: 600; width: 100px; text-align: right;">Action</th>
1889
+ </tr>
1890
+ </thead>
1891
+ <tbody id="fp-archive-body">
1892
+ </tbody>
1893
+ </table>
1894
+ </div>
1895
+ </div>
1896
+ `;
1897
+ const tbody = wrapper.querySelector("#fp-archive-body");
1898
+ if (filteredEntries.length === 0) {
1899
+ tbody.innerHTML = `<tr><td colspan="3" style="padding: 24px; text-align: center; color: #9ca3af;">No matching files found</td></tr>`;
1900
+ } else {
1901
+ tbody.innerHTML = filteredEntries.map((e, idx) => `
1902
+ <tr style="border-bottom: 1px solid var(--fp-border, #f3f4f6); transition: background 0.15s ease;" onmouseover="this.style.background='var(--fp-hover, #f9fafb)'" onmouseout="this.style.background='transparent'">
1903
+ <td style="padding: 10px 16px; color: var(--fp-text, #1f2937); word-break: break-all;">
1904
+ <span style="margin-right: 8px;">${e.isDir ? "\u{1F4C1}" : "\u{1F4C4}"}</span>
1905
+ ${e.path}
1906
+ </td>
1907
+ <td style="padding: 10px 16px; color: var(--fp-text-muted, #6b7280);">
1908
+ ${e.isDir ? "-" : formatFileSize(e.size)}
1909
+ </td>
1910
+ <td style="padding: 10px 16px; text-align: right;">
1911
+ ${!e.isDir ? `<button data-idx="${idx}" class="fp-entry-dl" style="padding: 4px 8px; font-size: 12px; background: transparent; border: 1px solid var(--fp-border, #d1d5db); border-radius: 4px; cursor: pointer; color: var(--fp-text, #374151);">\u2B07\uFE0F Save</button>` : ""}
1912
+ </td>
1913
+ </tr>
1914
+ `).join("");
1915
+ }
1916
+ tbody.querySelectorAll(".fp-entry-dl").forEach((btn) => {
1917
+ btn.addEventListener("click", (ev) => {
1918
+ const target = ev.currentTarget;
1919
+ const idx = Number(target.getAttribute("data-idx"));
1920
+ const entry = filteredEntries[idx];
1921
+ if (entry && entry.data) {
1922
+ downloadFile(entry.data.buffer, entry.name);
1923
+ }
1924
+ });
1925
+ });
1926
+ const searchInput = wrapper.querySelector("#fp-archive-search");
1927
+ if (searchInput) {
1928
+ searchInput.addEventListener("input", () => {
1929
+ const q = searchInput.value.toLowerCase().trim();
1930
+ const filtered = q ? entries.filter((e) => e.path.toLowerCase().includes(q)) : entries;
1931
+ renderUI(filtered);
1932
+ const newSearch = wrapper.querySelector("#fp-archive-search");
1933
+ if (newSearch) {
1934
+ newSearch.value = q;
1935
+ newSearch.focus();
1936
+ }
1937
+ });
1938
+ }
1939
+ };
1940
+ renderUI(entries);
1941
+ const cleanup = () => {
1942
+ wrapper.remove();
1943
+ ctx.container.innerHTML = "";
1944
+ };
1945
+ ctx.signal.addEventListener("abort", cleanup);
1946
+ return {
1947
+ destroy: cleanup,
1948
+ zoomIn: () => {
1949
+ scale += 0.1;
1950
+ wrapper.style.transform = `scale(${scale})`;
1951
+ },
1952
+ zoomOut: () => {
1953
+ scale = Math.max(0.3, scale - 0.1);
1954
+ wrapper.style.transform = `scale(${scale})`;
1955
+ },
1956
+ getZoom: () => scale,
1957
+ setZoom: (level) => {
1958
+ scale = level;
1959
+ wrapper.style.transform = `scale(${scale})`;
1960
+ },
1961
+ fitToPage: () => {
1962
+ scale = 1;
1963
+ wrapper.style.transform = `scale(1)`;
1964
+ },
1965
+ download: () => {
1966
+ downloadFile(ctx.buffer, ctx.metadata.name || "archive.zip", "application/zip");
1967
+ },
1968
+ print: () => {
1969
+ window.print();
1970
+ }
1971
+ };
1972
+ }
1973
+ };
1974
+ function archivePlugin() {
1975
+ return new ArchivePlugin();
1976
+ }
1977
+ var MarkdownPlugin = class {
1978
+ id = "markdown";
1979
+ name = "Markdown Preview";
1980
+ extensions = [".md", ".markdown", ".mdown", ".mkd"];
1981
+ mimeTypes = ["text/markdown", "text/x-markdown"];
1982
+ weight = 90;
1983
+ // Higher than generic text/code plugin
1984
+ supports(file) {
1985
+ const ext = file.metadata.extension?.toLowerCase();
1986
+ const mime = file.metadata.mimeType?.toLowerCase();
1987
+ return this.extensions.includes(ext || "") || this.mimeTypes.includes(mime || "");
1988
+ }
1989
+ getToolbarActions(instance) {
1990
+ return [
1991
+ {
1992
+ id: "zoom-out",
1993
+ icon: "zoom-out",
1994
+ label: "Decrease Font",
1995
+ type: "button",
1996
+ group: "zoom",
1997
+ execute: () => instance.zoomOut?.()
1998
+ },
1999
+ {
2000
+ id: "zoom-in",
2001
+ icon: "zoom-in",
2002
+ label: "Increase Font",
2003
+ type: "button",
2004
+ group: "zoom",
2005
+ execute: () => instance.zoomIn?.()
2006
+ },
2007
+ {
2008
+ id: "fit-page",
2009
+ icon: "fit-page",
2010
+ label: "Default Size",
2011
+ type: "button",
2012
+ group: "zoom",
2013
+ execute: () => instance.fitToPage?.()
2014
+ },
2015
+ {
2016
+ id: "download",
2017
+ icon: "download",
2018
+ label: "Download Markdown",
2019
+ type: "button",
2020
+ group: "actions",
2021
+ execute: () => instance.download?.()
2022
+ },
2023
+ {
2024
+ id: "print",
2025
+ icon: "print",
2026
+ label: "Print Document",
2027
+ type: "button",
2028
+ group: "actions",
2029
+ execute: () => instance.print?.()
2030
+ }
2031
+ ];
2032
+ }
2033
+ async render(ctx) {
2034
+ const text = new TextDecoder("utf-8", { fatal: false }).decode(ctx.buffer);
2035
+ const rawHtml = await marked.marked.parse(text, {
2036
+ gfm: true,
2037
+ breaks: true
2038
+ });
2039
+ const cleanHtml = DOMPurify__default.default.sanitize(rawHtml, {
2040
+ USE_PROFILES: { html: true }
2041
+ });
2042
+ const wrapper = document.createElement("div");
2043
+ wrapper.className = "fp-markdown-wrapper";
2044
+ wrapper.style.cssText = `
2045
+ width: 100%;
2046
+ height: 100%;
2047
+ overflow: auto;
2048
+ padding: 32px 40px;
2049
+ box-sizing: border-box;
2050
+ line-height: 1.6;
2051
+ font-size: 15px;
2052
+ color: var(--fp-text, #24292f);
2053
+ background: var(--fp-bg, #ffffff);
2054
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
2055
+ `;
2056
+ wrapper.innerHTML = `
2057
+ <style>
2058
+ .fp-markdown-wrapper h1, .fp-markdown-wrapper h2, .fp-markdown-wrapper h3,
2059
+ .fp-markdown-wrapper h4, .fp-markdown-wrapper h5, .fp-markdown-wrapper h6 {
2060
+ margin-top: 24px;
2061
+ margin-bottom: 16px;
2062
+ font-weight: 600;
2063
+ line-height: 1.25;
2064
+ color: var(--fp-text, #1f2328);
2065
+ }
2066
+ .fp-markdown-wrapper h1 { font-size: 2em; padding-bottom: 0.3em; border-bottom: 1px solid var(--fp-border, #d0d7de); }
2067
+ .fp-markdown-wrapper h2 { font-size: 1.5em; padding-bottom: 0.3em; border-bottom: 1px solid var(--fp-border, #d0d7de); }
2068
+ .fp-markdown-wrapper h3 { font-size: 1.25em; }
2069
+ .fp-markdown-wrapper p { margin-top: 0; margin-bottom: 16px; }
2070
+ .fp-markdown-wrapper table {
2071
+ border-spacing: 0;
2072
+ border-collapse: collapse;
2073
+ margin-top: 0;
2074
+ margin-bottom: 16px;
2075
+ width: 100%;
2076
+ overflow: auto;
2077
+ }
2078
+ .fp-markdown-wrapper table th, .fp-markdown-wrapper table td {
2079
+ padding: 6px 13px;
2080
+ border: 1px solid var(--fp-border, #d0d7de);
2081
+ }
2082
+ .fp-markdown-wrapper table tr:nth-child(2n) {
2083
+ background-color: var(--fp-toolbar-bg, #f6f8fa);
2084
+ }
2085
+ .fp-markdown-wrapper blockquote {
2086
+ margin: 0 0 16px 0;
2087
+ padding: 0 1em;
2088
+ color: var(--fp-text-muted, #59636e);
2089
+ border-left: 0.25em solid var(--fp-border, #d0d7de);
2090
+ }
2091
+ .fp-markdown-wrapper pre {
2092
+ padding: 16px;
2093
+ overflow: auto;
2094
+ font-size: 85%;
2095
+ line-height: 1.45;
2096
+ background-color: var(--fp-toolbar-bg, #f6f8fa);
2097
+ border-radius: 6px;
2098
+ border: 1px solid var(--fp-border, #d0d7de);
2099
+ }
2100
+ .fp-markdown-wrapper code {
2101
+ padding: 0.2em 0.4em;
2102
+ margin: 0;
2103
+ font-size: 85%;
2104
+ background-color: rgba(175, 184, 193, 0.2);
2105
+ border-radius: 4px;
2106
+ font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
2107
+ }
2108
+ .fp-markdown-wrapper pre code {
2109
+ padding: 0;
2110
+ background: transparent;
2111
+ }
2112
+ .fp-markdown-wrapper ul, .fp-markdown-wrapper ol {
2113
+ padding-left: 2em;
2114
+ margin-top: 0;
2115
+ margin-bottom: 16px;
2116
+ }
2117
+ .fp-markdown-wrapper hr {
2118
+ height: 0.25em;
2119
+ padding: 0;
2120
+ margin: 24px 0;
2121
+ background-color: var(--fp-border, #d0d7de);
2122
+ border: 0;
2123
+ }
2124
+ </style>
2125
+ <div class="fp-markdown-content" style="max-width: 860px; margin: 0 auto;">
2126
+ ${cleanHtml}
2127
+ </div>
2128
+ `;
2129
+ wrapper.querySelectorAll("pre code").forEach((block) => {
2130
+ hljs__default.default.highlightElement(block);
2131
+ });
2132
+ ctx.container.innerHTML = "";
2133
+ ctx.container.style.overflow = "auto";
2134
+ ctx.container.appendChild(wrapper);
2135
+ let fontSize = 15;
2136
+ const cleanup = () => {
2137
+ wrapper.remove();
2138
+ ctx.container.innerHTML = "";
2139
+ };
2140
+ ctx.signal.addEventListener("abort", cleanup);
2141
+ return {
2142
+ destroy: cleanup,
2143
+ zoomIn: () => {
2144
+ fontSize = Math.min(28, fontSize + 2);
2145
+ wrapper.style.fontSize = `${fontSize}px`;
2146
+ },
2147
+ zoomOut: () => {
2148
+ fontSize = Math.max(10, fontSize - 2);
2149
+ wrapper.style.fontSize = `${fontSize}px`;
2150
+ },
2151
+ getZoom: () => fontSize / 15,
2152
+ setZoom: (level) => {
2153
+ fontSize = Math.round(15 * level);
2154
+ wrapper.style.fontSize = `${fontSize}px`;
2155
+ },
2156
+ fitToPage: () => {
2157
+ fontSize = 15;
2158
+ wrapper.style.fontSize = "15px";
2159
+ },
2160
+ download: () => {
2161
+ downloadFile(ctx.buffer, ctx.metadata.name || "document.md", "text/markdown");
2162
+ },
2163
+ print: () => {
2164
+ window.print();
2165
+ }
2166
+ };
2167
+ }
2168
+ };
2169
+ function markdownPlugin() {
2170
+ return new MarkdownPlugin();
2171
+ }
2172
+ var PptxPlugin = class {
2173
+ id = "pptx";
2174
+ name = "PowerPoint Presentation";
2175
+ extensions = [".pptx", ".ppsx"];
2176
+ mimeTypes = [
2177
+ "application/vnd.openxmlformats-officedocument.presentationml.presentation",
2178
+ "application/vnd.openxmlformats-officedocument.presentationml.slideshow"
2179
+ ];
2180
+ weight = 80;
2181
+ supports(file) {
2182
+ const ext = file.metadata.extension?.toLowerCase();
2183
+ const mime = file.metadata.mimeType?.toLowerCase();
2184
+ return this.extensions.includes(ext || "") || this.mimeTypes.includes(mime || "");
2185
+ }
2186
+ getToolbarActions(instance) {
2187
+ return [
2188
+ {
2189
+ id: "thumbnails",
2190
+ icon: "thumbnails",
2191
+ label: "Slide Thumbnails",
2192
+ type: "button",
2193
+ group: "navigation",
2194
+ execute: () => instance.toggleThumbnails?.()
2195
+ },
2196
+ {
2197
+ id: "page-prev",
2198
+ icon: "page-prev",
2199
+ label: "Previous Slide",
2200
+ type: "button",
2201
+ group: "navigation",
2202
+ execute: () => {
2203
+ const cur = instance.getCurrentPage?.() ?? 1;
2204
+ if (cur > 1) instance.goToPage?.(cur - 1);
2205
+ }
2206
+ },
2207
+ {
2208
+ id: "page-nav",
2209
+ icon: "",
2210
+ label: "Slide Number",
2211
+ type: "page-nav",
2212
+ group: "navigation",
2213
+ execute: (page) => instance.goToPage?.(Number(page))
2214
+ },
2215
+ {
2216
+ id: "page-next",
2217
+ icon: "page-next",
2218
+ label: "Next Slide",
2219
+ type: "button",
2220
+ group: "navigation",
2221
+ execute: () => {
2222
+ const cur = instance.getCurrentPage?.() ?? 1;
2223
+ const total = instance.getPageCount?.() ?? 1;
2224
+ if (cur < total) instance.goToPage?.(cur + 1);
2225
+ }
2226
+ },
2227
+ {
2228
+ id: "zoom-out",
2229
+ icon: "zoom-out",
2230
+ label: "Zoom Out",
2231
+ type: "button",
2232
+ group: "zoom",
2233
+ execute: () => instance.zoomOut?.()
2234
+ },
2235
+ {
2236
+ id: "zoom-in",
2237
+ icon: "zoom-in",
2238
+ label: "Zoom In",
2239
+ type: "button",
2240
+ group: "zoom",
2241
+ execute: () => instance.zoomIn?.()
2242
+ },
2243
+ {
2244
+ id: "fit-page",
2245
+ icon: "fit-page",
2246
+ label: "Fit to Slide",
2247
+ type: "button",
2248
+ group: "zoom",
2249
+ execute: () => instance.fitToPage?.()
2250
+ },
2251
+ {
2252
+ id: "download",
2253
+ icon: "download",
2254
+ label: "Download PPTX",
2255
+ type: "button",
2256
+ group: "actions",
2257
+ execute: () => instance.download?.()
2258
+ },
2259
+ {
2260
+ id: "print",
2261
+ icon: "print",
2262
+ label: "Print Presentation",
2263
+ type: "button",
2264
+ group: "actions",
2265
+ execute: () => instance.print?.()
2266
+ }
2267
+ ];
2268
+ }
2269
+ async render(ctx) {
2270
+ const renderer = new pptxBrowser.PptxRenderer();
2271
+ await renderer.load(ctx.buffer);
2272
+ const slideCount = renderer.slidePaths?.length || 1;
2273
+ let currentSlide = 1;
2274
+ let scale = 1;
2275
+ const wrapper = document.createElement("div");
2276
+ wrapper.className = "fp-pptx-wrapper";
2277
+ wrapper.style.cssText = `
2278
+ width: 100%;
2279
+ height: 100%;
2280
+ overflow: auto;
2281
+ display: flex;
2282
+ justify-content: center;
2283
+ align-items: flex-start;
2284
+ padding: 24px;
2285
+ box-sizing: border-box;
2286
+ background: var(--fp-bg-canvas, #525659);
2287
+ `;
2288
+ const slideContainer = document.createElement("div");
2289
+ slideContainer.className = "fp-slide-container";
2290
+ slideContainer.style.cssText = `
2291
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
2292
+ border-radius: 4px;
2293
+ overflow: hidden;
2294
+ background: #ffffff;
2295
+ transform-origin: top center;
2296
+ transition: transform 0.2s ease;
2297
+ `;
2298
+ const canvas = document.createElement("canvas");
2299
+ slideContainer.appendChild(canvas);
2300
+ wrapper.appendChild(slideContainer);
2301
+ ctx.container.innerHTML = "";
2302
+ ctx.container.style.overflow = "auto";
2303
+ ctx.container.appendChild(wrapper);
2304
+ const renderCurrentSlide = async () => {
2305
+ try {
2306
+ await renderer.renderSlide(currentSlide - 1, canvas, 1280);
2307
+ ctx.emit("page-change", { page: currentSlide, totalPages: slideCount });
2308
+ } catch (err) {
2309
+ console.error("[PptxPlugin] Failed to render slide:", err);
2310
+ }
2311
+ };
2312
+ await renderCurrentSlide();
2313
+ const cleanup = () => {
2314
+ renderer.destroy();
2315
+ wrapper.remove();
2316
+ ctx.container.innerHTML = "";
2317
+ };
2318
+ ctx.signal.addEventListener("abort", cleanup);
2319
+ const instance = {
2320
+ destroy: cleanup,
2321
+ goToPage: (page) => {
2322
+ if (page >= 1 && page <= slideCount) {
2323
+ currentSlide = page;
2324
+ renderCurrentSlide();
2325
+ }
2326
+ },
2327
+ getPageCount: () => slideCount,
2328
+ getCurrentPage: () => currentSlide,
2329
+ zoomIn: () => {
2330
+ scale += 0.1;
2331
+ slideContainer.style.transform = `scale(${scale})`;
2332
+ },
2333
+ zoomOut: () => {
2334
+ scale = Math.max(0.2, scale - 0.1);
2335
+ slideContainer.style.transform = `scale(${scale})`;
2336
+ },
2337
+ getZoom: () => scale,
2338
+ setZoom: (level) => {
2339
+ scale = level;
2340
+ slideContainer.style.transform = `scale(${scale})`;
2341
+ },
2342
+ fitToPage: () => {
2343
+ scale = 1;
2344
+ slideContainer.style.transform = "scale(1)";
2345
+ },
2346
+ getThumbnails: () => {
2347
+ const list = [];
2348
+ for (let i = 0; i < slideCount; i++) {
2349
+ const slideIdx = i;
2350
+ list.push({
2351
+ index: slideIdx,
2352
+ label: `Slide ${slideIdx + 1}`,
2353
+ render: async (thumbCanvas) => {
2354
+ await renderer.renderSlide(slideIdx, thumbCanvas, 240);
2355
+ }
2356
+ });
2357
+ }
2358
+ return list;
2359
+ },
2360
+ download: () => {
2361
+ downloadFile(
2362
+ ctx.buffer,
2363
+ ctx.metadata.name || "presentation.pptx",
2364
+ this.mimeTypes[0]
2365
+ );
2366
+ },
2367
+ print: () => {
2368
+ window.print();
2369
+ }
2370
+ };
2371
+ return instance;
2372
+ }
2373
+ };
2374
+ function pptxPlugin() {
2375
+ return new PptxPlugin();
2376
+ }
2377
+ var ThreeDPlugin = class {
2378
+ id = "3d";
2379
+ name = "3D Model Preview";
2380
+ extensions = [".stl", ".obj"];
2381
+ mimeTypes = ["model/stl", "model/obj", "application/sla", "text/plain"];
2382
+ weight = 75;
2383
+ supports(file) {
2384
+ const ext = file.metadata.extension?.toLowerCase();
2385
+ return ext === ".stl" || ext === ".obj";
2386
+ }
2387
+ getToolbarActions(instance) {
2388
+ return [
2389
+ {
2390
+ id: "zoom-out",
2391
+ icon: "zoom-out",
2392
+ label: "Zoom Out",
2393
+ type: "button",
2394
+ group: "zoom",
2395
+ execute: () => instance.zoomOut?.()
2396
+ },
2397
+ {
2398
+ id: "zoom-in",
2399
+ icon: "zoom-in",
2400
+ label: "Zoom In",
2401
+ type: "button",
2402
+ group: "zoom",
2403
+ execute: () => instance.zoomIn?.()
2404
+ },
2405
+ {
2406
+ id: "fit-page",
2407
+ icon: "fit-page",
2408
+ label: "Reset Camera View",
2409
+ type: "button",
2410
+ group: "zoom",
2411
+ execute: () => instance.fitToPage?.()
2412
+ },
2413
+ {
2414
+ id: "rotate-cw",
2415
+ icon: "rotate-cw",
2416
+ label: "Toggle Wireframe",
2417
+ type: "button",
2418
+ group: "view",
2419
+ execute: () => instance.rotateCW?.()
2420
+ },
2421
+ {
2422
+ id: "download",
2423
+ icon: "download",
2424
+ label: "Download 3D Model",
2425
+ type: "button",
2426
+ group: "actions",
2427
+ execute: () => instance.download?.()
2428
+ }
2429
+ ];
2430
+ }
2431
+ async render(ctx) {
2432
+ const container = ctx.container;
2433
+ container.innerHTML = "";
2434
+ container.style.overflow = "hidden";
2435
+ container.style.position = "relative";
2436
+ container.style.width = "100%";
2437
+ container.style.height = "100%";
2438
+ container.style.background = "#1a1a1a";
2439
+ const width = container.clientWidth || 800;
2440
+ const height = container.clientHeight || 600;
2441
+ const scene = new THREE__namespace.Scene();
2442
+ scene.background = new THREE__namespace.Color(1973796);
2443
+ const camera = new THREE__namespace.PerspectiveCamera(45, width / height, 0.1, 2e3);
2444
+ const renderer = new THREE__namespace.WebGLRenderer({ antialias: true });
2445
+ renderer.setSize(width, height);
2446
+ renderer.setPixelRatio(window.devicePixelRatio);
2447
+ renderer.shadowMap.enabled = true;
2448
+ container.appendChild(renderer.domElement);
2449
+ const controls = new OrbitControls_js.OrbitControls(camera, renderer.domElement);
2450
+ controls.enableDamping = true;
2451
+ controls.dampingFactor = 0.05;
2452
+ const ambientLight = new THREE__namespace.AmbientLight(16777215, 0.8);
2453
+ scene.add(ambientLight);
2454
+ const dirLight1 = new THREE__namespace.DirectionalLight(16777215, 1.2);
2455
+ dirLight1.position.set(100, 200, 100);
2456
+ scene.add(dirLight1);
2457
+ const dirLight2 = new THREE__namespace.DirectionalLight(16777215, 0.6);
2458
+ dirLight2.position.set(-100, -100, -100);
2459
+ scene.add(dirLight2);
2460
+ const grid = new THREE__namespace.GridHelper(200, 20, 4473924, 2236962);
2461
+ scene.add(grid);
2462
+ let meshGroup = new THREE__namespace.Group();
2463
+ let isWireframe = false;
2464
+ const ext = ctx.metadata.extension?.toLowerCase();
2465
+ const materials = [];
2466
+ if (ext === ".stl") {
2467
+ const loader = new STLLoader_js.STLLoader();
2468
+ const geometry = loader.parse(ctx.buffer);
2469
+ geometry.computeVertexNormals();
2470
+ geometry.center();
2471
+ const material = new THREE__namespace.MeshStandardMaterial({
2472
+ color: 3900150,
2473
+ roughness: 0.4,
2474
+ metalness: 0.2
2475
+ });
2476
+ materials.push(material);
2477
+ const mesh = new THREE__namespace.Mesh(geometry, material);
2478
+ meshGroup.add(mesh);
2479
+ } else if (ext === ".obj") {
2480
+ const loader = new OBJLoader_js.OBJLoader();
2481
+ const text = new TextDecoder().decode(ctx.buffer);
2482
+ const obj = loader.parse(text);
2483
+ obj.traverse((child) => {
2484
+ if (child.isMesh) {
2485
+ const m = child;
2486
+ m.geometry.computeVertexNormals();
2487
+ const mat = new THREE__namespace.MeshStandardMaterial({
2488
+ color: 1096065,
2489
+ roughness: 0.5,
2490
+ metalness: 0.1
2491
+ });
2492
+ materials.push(mat);
2493
+ m.material = mat;
2494
+ }
2495
+ });
2496
+ meshGroup.add(obj);
2497
+ }
2498
+ scene.add(meshGroup);
2499
+ const box = new THREE__namespace.Box3().setFromObject(meshGroup);
2500
+ const sphere = box.getBoundingSphere(new THREE__namespace.Sphere());
2501
+ const radius = Math.max(sphere.radius, 10);
2502
+ const fitCamera = () => {
2503
+ camera.position.set(radius * 1.5, radius * 1.2, radius * 2);
2504
+ camera.lookAt(0, 0, 0);
2505
+ controls.target.set(0, 0, 0);
2506
+ controls.update();
2507
+ };
2508
+ fitCamera();
2509
+ let animId;
2510
+ const animate = () => {
2511
+ animId = requestAnimationFrame(animate);
2512
+ controls.update();
2513
+ renderer.render(scene, camera);
2514
+ };
2515
+ animate();
2516
+ const resizeObserver = new ResizeObserver(() => {
2517
+ const newWidth = container.clientWidth || 800;
2518
+ const newHeight = container.clientHeight || 600;
2519
+ camera.aspect = newWidth / newHeight;
2520
+ camera.updateProjectionMatrix();
2521
+ renderer.setSize(newWidth, newHeight);
2522
+ });
2523
+ resizeObserver.observe(container);
2524
+ const cleanup = () => {
2525
+ cancelAnimationFrame(animId);
2526
+ resizeObserver.disconnect();
2527
+ controls.dispose();
2528
+ renderer.dispose();
2529
+ materials.forEach((m) => m.dispose());
2530
+ meshGroup.traverse((child) => {
2531
+ if (child.geometry) {
2532
+ child.geometry.dispose();
2533
+ }
2534
+ });
2535
+ container.innerHTML = "";
2536
+ };
2537
+ ctx.signal.addEventListener("abort", cleanup);
2538
+ return {
2539
+ destroy: cleanup,
2540
+ zoomIn: () => {
2541
+ camera.position.multiplyScalar(0.85);
2542
+ controls.update();
2543
+ },
2544
+ zoomOut: () => {
2545
+ camera.position.multiplyScalar(1.15);
2546
+ controls.update();
2547
+ },
2548
+ fitToPage: fitCamera,
2549
+ rotateCW: () => {
2550
+ isWireframe = !isWireframe;
2551
+ materials.forEach((m) => {
2552
+ m.wireframe = isWireframe;
2553
+ });
2554
+ },
2555
+ download: () => {
2556
+ downloadFile(ctx.buffer, ctx.metadata.name || `model${ext || ".stl"}`);
2557
+ }
2558
+ };
2559
+ }
2560
+ };
2561
+ function threeDPlugin() {
2562
+ return new ThreeDPlugin();
2563
+ }
1743
2564
 
1744
2565
  // src/index.ts
1745
2566
  function getDefaultPlugins() {
@@ -1748,7 +2569,11 @@ function getDefaultPlugins() {
1748
2569
  mediaPlugin(),
1749
2570
  docxPlugin(),
1750
2571
  excelPlugin(),
2572
+ pptxPlugin(),
1751
2573
  csvPlugin(),
2574
+ archivePlugin(),
2575
+ markdownPlugin(),
2576
+ threeDPlugin(),
1752
2577
  codePlugin()
1753
2578
  ];
1754
2579
  }