@file-viewer/renderer-archive 2.1.30 → 2.2.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/archive.js +21 -13
- package/package.json +2 -2
package/dist/archive.js
CHANGED
|
@@ -16,9 +16,9 @@ class ArchivePasswordCancelledError extends Error {
|
|
|
16
16
|
}
|
|
17
17
|
const archiveStyle = `
|
|
18
18
|
${comicBookStyle}
|
|
19
|
-
.archive-shell,.archive-viewer{position:relative;box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;display:grid;grid-template-columns:
|
|
19
|
+
.archive-shell,.archive-viewer{position:relative;box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;display:grid;grid-template-columns:var(--archive-sidebar-track) minmax(0,1fr);grid-template-rows:minmax(0,1fr);--archive-sidebar-track:clamp(248px,30%,420px);--archive-sidebar-gap:8px;--archive-sidebar-padding:10px;--archive-head-gap:8px;--archive-eyebrow-size:10px;--archive-title-margin:2px;--archive-title-size:15px;--archive-stats-margin:4px;--archive-stats-size:11px;--archive-stats-line:1.35;--archive-toggle-size:32px;--archive-toggle-radius:9px;--archive-notice-padding:7px 9px;--archive-notice-radius:9px;--archive-notice-size:11px;--archive-search-height:36px;--archive-search-padding:0 10px;--archive-search-radius:9px;--archive-search-font-size:12px;--archive-list-gap:4px;--archive-list-padding:3px;--archive-entry-min-height:48px;--archive-entry-icon-column:34px;--archive-entry-gap:7px;--archive-entry-padding-y:5px;--archive-entry-padding-x:7px;--archive-entry-depth-step:8px;--archive-entry-depth-max:40px;--archive-entry-radius:9px;--archive-entry-ext-height:28px;--archive-entry-ext-radius:7px;--archive-entry-ext-size:9px;--archive-entry-name-size:13px;--archive-entry-name-line:1.25;--archive-entry-meta-size:11px;--archive-entry-meta-line:1.3;--archive-entry-size-width:64px;--archive-preview-toolbar-min-height:56px;--archive-preview-toolbar-gap:10px;--archive-preview-toolbar-padding:10px 12px;--archive-preview-button-height:32px;--archive-preview-button-padding:0 10px;--archive-preview-button-radius:9px;--archive-empty-padding:24px;--archive-state-gap:10px;--archive-state-padding:14px;--archive-state-radius:14px;background:#edf2f7;color:#172033;font-family:Aptos,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif}
|
|
20
20
|
.archive-shell *,.archive-viewer *{box-sizing:border-box}
|
|
21
|
-
.archive-shell[data-viewer-density='compact'],.archive-viewer[data-viewer-density='compact'],.file-viewer[data-viewer-density='compact'] .archive-shell,.file-viewer[data-viewer-density='compact'] .archive-viewer,.file-viewer-web-shell[data-viewer-density='compact'] .archive-shell,.file-viewer-web-shell[data-viewer-density='compact'] .archive-viewer{--archive-sidebar-gap:
|
|
21
|
+
.archive-shell[data-viewer-density='compact'],.archive-viewer[data-viewer-density='compact'],.file-viewer[data-viewer-density='compact'] .archive-shell,.file-viewer[data-viewer-density='compact'] .archive-viewer,.file-viewer-web-shell[data-viewer-density='compact'] .archive-shell,.file-viewer-web-shell[data-viewer-density='compact'] .archive-viewer{--archive-sidebar-track:clamp(224px,27%,360px);--archive-sidebar-gap:4px;--archive-sidebar-padding:6px;--archive-head-gap:5px;--archive-eyebrow-size:9px;--archive-title-margin:1px;--archive-title-size:14px;--archive-stats-margin:2px;--archive-stats-size:10px;--archive-toggle-size:28px;--archive-toggle-radius:7px;--archive-notice-padding:4px 6px;--archive-notice-radius:7px;--archive-notice-size:10px;--archive-search-height:30px;--archive-search-padding:0 7px;--archive-search-radius:7px;--archive-search-font-size:11px;--archive-list-gap:3px;--archive-list-padding:2px;--archive-entry-min-height:40px;--archive-entry-icon-column:28px;--archive-entry-gap:5px;--archive-entry-padding-y:3px;--archive-entry-padding-x:5px;--archive-entry-depth-step:6px;--archive-entry-depth-max:32px;--archive-entry-radius:7px;--archive-entry-ext-height:24px;--archive-entry-ext-radius:6px;--archive-entry-ext-size:8px;--archive-entry-name-size:12px;--archive-entry-meta-size:10px;--archive-entry-size-width:54px;--archive-preview-toolbar-min-height:38px;--archive-preview-toolbar-gap:5px;--archive-preview-toolbar-padding:4px 5px;--archive-preview-button-height:28px;--archive-preview-button-padding:0 5px;--archive-preview-button-radius:7px;--archive-empty-padding:18px;--archive-state-gap:5px;--archive-state-padding:5px;--archive-state-radius:10px}
|
|
22
22
|
@media (pointer:coarse){.archive-shell[data-viewer-density='compact'],.archive-viewer[data-viewer-density='compact'],.file-viewer[data-viewer-density='compact'] .archive-shell,.file-viewer[data-viewer-density='compact'] .archive-viewer,.file-viewer-web-shell[data-viewer-density='compact'] .archive-shell,.file-viewer-web-shell[data-viewer-density='compact'] .archive-viewer{--archive-toggle-size:34px;--archive-search-height:36px;--archive-entry-min-height:50px;--archive-entry-ext-height:30px;--archive-preview-toolbar-min-height:48px;--archive-preview-button-height:34px}}
|
|
23
23
|
.archive-sidebar{grid-column:1;grid-row:1;min-width:0;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:var(--archive-sidebar-gap);padding:var(--archive-sidebar-padding);border-right:1px solid rgba(23,32,51,.08);background:rgba(255,255,255,.72);transition:opacity .18s ease,padding .18s ease,border-color .18s ease}
|
|
24
24
|
.archive-shell.archive-sidebar-collapsed,.archive-viewer.archive-sidebar-collapsed{grid-template-columns:0 minmax(0,1fr)}
|
|
@@ -26,21 +26,22 @@ const archiveStyle = `
|
|
|
26
26
|
.archive-sidebar-collapsed .archive-sidebar>*{visibility:hidden}
|
|
27
27
|
.archive-head{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--archive-head-gap);align-items:start}
|
|
28
28
|
.archive-head-main{min-width:0}
|
|
29
|
-
.archive-head span,.archive-preview-toolbar span{color:#6c7c90;font-size:
|
|
29
|
+
.archive-head span,.archive-preview-toolbar span{color:#6c7c90;font-size:var(--archive-eyebrow-size);font-weight:800;letter-spacing:.02em}
|
|
30
30
|
.archive-head strong,.archive-preview-toolbar strong{display:block;margin-top:var(--archive-title-margin);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--archive-title-size);line-height:1.25}
|
|
31
|
-
.archive-head p{min-width:0;margin:var(--archive-stats-margin) 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#69798b;font-size:
|
|
31
|
+
.archive-head p{min-width:0;margin:var(--archive-stats-margin) 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#69798b;font-size:var(--archive-stats-size);line-height:var(--archive-stats-line);font-variant-numeric:tabular-nums}
|
|
32
32
|
.archive-sidebar-toggle{width:var(--archive-toggle-size);height:var(--archive-toggle-size);flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(23,32,51,.1);border-radius:var(--archive-toggle-radius);background:#fff;color:#1f7a58;font:inherit;font-size:17px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 6px 16px rgba(23,32,51,.07)}
|
|
33
33
|
.archive-sidebar-toggle:hover{border-color:rgba(31,122,88,.32);background:#f0fdf4}
|
|
34
|
-
.archive-warning,.archive-info,.archive-error{border-radius:var(--archive-notice-radius);padding:var(--archive-notice-padding);background:#fff7e8;color:#8a4b00;font-size:
|
|
34
|
+
.archive-warning,.archive-info,.archive-error{border-radius:var(--archive-notice-radius);padding:var(--archive-notice-padding);background:#fff7e8;color:#8a4b00;font-size:var(--archive-notice-size);line-height:1.4}
|
|
35
35
|
.archive-info{background:#ecfdf5;color:#166534}
|
|
36
|
-
.archive-search{width:100%;height:var(--archive-search-height);padding:var(--archive-search-padding);border-radius:var(--archive-search-radius);border:1px solid rgba(23,32,51,.1);outline:none;background:#fff;color:#172033;font:inherit}
|
|
37
|
-
.archive-list{flex:1;min-width:0;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:var(--archive-list-gap);padding-right:var(--archive-list-padding)}
|
|
38
|
-
.archive-entry{width:100%;min-width:0;min-height:var(--archive-entry-min-height);display:grid;grid-template-columns:var(--archive-entry-icon-column) minmax(0,1fr) minmax(
|
|
36
|
+
.archive-search{width:100%;height:var(--archive-search-height);padding:var(--archive-search-padding);border-radius:var(--archive-search-radius);border:1px solid rgba(23,32,51,.1);outline:none;background:#fff;color:#172033;font-family:inherit;font-size:var(--archive-search-font-size);line-height:1.2}
|
|
37
|
+
.archive-list{flex:1;min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable;display:flex;flex-direction:column;gap:var(--archive-list-gap);padding-right:var(--archive-list-padding)}
|
|
38
|
+
.archive-entry{width:100%;min-width:0;min-height:var(--archive-entry-min-height);display:grid;grid-template-columns:var(--archive-entry-icon-column) minmax(0,1fr) minmax(40px,auto);gap:var(--archive-entry-gap);align-items:center;padding:var(--archive-entry-padding-y) var(--archive-entry-padding-x) var(--archive-entry-padding-y) calc(var(--archive-entry-padding-x) + clamp(0px,calc(var(--entry-depth,0) * var(--archive-entry-depth-step)),var(--archive-entry-depth-max)));border:1px solid rgba(23,32,51,.07);border-radius:var(--archive-entry-radius);background:rgba(255,255,255,.86);color:inherit;text-align:left;cursor:pointer;font-family:inherit;font-size:var(--archive-entry-name-size);line-height:var(--archive-entry-name-line)}
|
|
39
39
|
.archive-entry:hover,.archive-entry.active{border-color:rgba(33,129,95,.28);box-shadow:0 10px 22px rgba(23,32,51,.08)}
|
|
40
|
-
.entry-ext{height:var(--archive-entry-ext-height);display:inline-flex;align-items:center;justify-content:center;border-radius:var(--archive-entry-ext-radius);background:rgba(33,129,95,.12);color:#1d7a56;font-size:
|
|
40
|
+
.entry-ext{min-width:0;height:var(--archive-entry-ext-height);display:inline-flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 3px;border-radius:var(--archive-entry-ext-radius);background:rgba(33,129,95,.12);color:#1d7a56;font-size:var(--archive-entry-ext-size);font-weight:900;line-height:1;text-transform:uppercase}
|
|
41
41
|
.entry-copy{min-width:0}
|
|
42
42
|
.entry-copy strong,.entry-copy em{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
|
|
43
|
-
.entry-copy
|
|
43
|
+
.entry-copy strong{font-size:var(--archive-entry-name-size);font-weight:650;line-height:var(--archive-entry-name-line)}
|
|
44
|
+
.entry-copy em,.archive-entry small{color:#718096;font-size:var(--archive-entry-meta-size);font-style:normal;line-height:var(--archive-entry-meta-line)}
|
|
44
45
|
.archive-entry small{min-width:0;max-width:var(--archive-entry-size-width);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
|
|
45
46
|
.archive-preview{grid-column:2;grid-row:1;width:100%;height:100%;min-width:0;min-height:0;overflow:hidden;display:flex;flex-direction:column}
|
|
46
47
|
.archive-preview-toolbar{min-width:0;min-height:var(--archive-preview-toolbar-min-height);display:flex;align-items:center;gap:var(--archive-preview-toolbar-gap);padding:var(--archive-preview-toolbar-padding);border-bottom:1px solid rgba(23,32,51,.08);background:rgba(255,255,255,.76)}
|
|
@@ -73,13 +74,14 @@ const archiveStyle = `
|
|
|
73
74
|
[data-viewer-theme='dark'] .archive-shell,[data-viewer-theme='dark'] .archive-viewer{background:#101820;color:#e6edf3}
|
|
74
75
|
[data-viewer-theme='dark'] .archive-sidebar,[data-viewer-theme='dark'] .archive-preview-toolbar{border-color:rgba(139,148,158,.2);background:rgba(21,27,35,.82)}
|
|
75
76
|
[data-viewer-theme='dark'] .archive-entry,[data-viewer-theme='dark'] .archive-search,[data-viewer-theme='dark'] .archive-state>div{background:#151b23;color:#e6edf3;border-color:rgba(139,148,158,.2)}
|
|
77
|
+
[data-viewer-theme='dark'] .archive-head span,[data-viewer-theme='dark'] .archive-preview-toolbar span,[data-viewer-theme='dark'] .archive-head p,[data-viewer-theme='dark'] .entry-copy em,[data-viewer-theme='dark'] .archive-entry small{color:#9cacc0}
|
|
76
78
|
[data-viewer-theme='dark'] .archive-password-card{background:#151b23;color:#e6edf3}
|
|
77
79
|
[data-viewer-theme='dark'] .archive-password-card input{background:#0d1117;color:#e6edf3;border-color:rgba(139,148,158,.24)}
|
|
78
80
|
[data-viewer-theme='dark'] .archive-password-cancel{background:#212a35;color:#d7dee8}
|
|
79
81
|
[data-viewer-theme='dark'] .archive-empty strong{color:#f8fafc}
|
|
80
|
-
@media (prefers-color-scheme:dark){[data-viewer-theme='system'] .archive-shell,[data-viewer-theme='system'] .archive-viewer{background:#101820;color:#e6edf3}[data-viewer-theme='system'] .archive-sidebar,[data-viewer-theme='system'] .archive-preview-toolbar{border-color:rgba(139,148,158,.2);background:rgba(21,27,35,.82)}[data-viewer-theme='system'] .archive-entry,[data-viewer-theme='system'] .archive-search,[data-viewer-theme='system'] .archive-state>div{background:#151b23;color:#e6edf3;border-color:rgba(139,148,158,.2)}[data-viewer-theme='system'] .archive-password-card{background:#151b23;color:#e6edf3}[data-viewer-theme='system'] .archive-password-card input{background:#0d1117;color:#e6edf3;border-color:rgba(139,148,158,.24)}[data-viewer-theme='system'] .archive-password-cancel{background:#212a35;color:#d7dee8}[data-viewer-theme='system'] .archive-empty strong{color:#f8fafc}}
|
|
82
|
+
@media (prefers-color-scheme:dark){[data-viewer-theme='system'] .archive-shell,[data-viewer-theme='system'] .archive-viewer{background:#101820;color:#e6edf3}[data-viewer-theme='system'] .archive-sidebar,[data-viewer-theme='system'] .archive-preview-toolbar{border-color:rgba(139,148,158,.2);background:rgba(21,27,35,.82)}[data-viewer-theme='system'] .archive-entry,[data-viewer-theme='system'] .archive-search,[data-viewer-theme='system'] .archive-state>div{background:#151b23;color:#e6edf3;border-color:rgba(139,148,158,.2)}[data-viewer-theme='system'] .archive-head span,[data-viewer-theme='system'] .archive-preview-toolbar span,[data-viewer-theme='system'] .archive-head p,[data-viewer-theme='system'] .entry-copy em,[data-viewer-theme='system'] .archive-entry small{color:#9cacc0}[data-viewer-theme='system'] .archive-password-card{background:#151b23;color:#e6edf3}[data-viewer-theme='system'] .archive-password-card input{background:#0d1117;color:#e6edf3;border-color:rgba(139,148,158,.24)}[data-viewer-theme='system'] .archive-password-cancel{background:#212a35;color:#d7dee8}[data-viewer-theme='system'] .archive-empty strong{color:#f8fafc}}
|
|
81
83
|
@keyframes archive-spin{to{transform:rotate(360deg)}}
|
|
82
|
-
@media (max-width:860px){.archive-shell,.archive-viewer{grid-template-columns:1fr;grid-template-rows:minmax(
|
|
84
|
+
@media (max-width:860px){.archive-shell,.archive-viewer{grid-template-columns:1fr;grid-template-rows:minmax(200px,34%) minmax(0,1fr);--archive-sidebar-gap:6px;--archive-sidebar-padding:8px;--archive-title-size:14px;--archive-stats-size:10px;--archive-search-height:38px;--archive-search-font-size:16px;--archive-list-gap:3px;--archive-entry-min-height:44px;--archive-entry-icon-column:30px;--archive-entry-gap:6px;--archive-entry-padding-y:4px;--archive-entry-padding-x:6px;--archive-entry-depth-step:6px;--archive-entry-depth-max:24px;--archive-entry-ext-height:26px;--archive-entry-name-size:12px;--archive-entry-meta-size:10px;--archive-entry-size-width:52px}.archive-shell.archive-sidebar-collapsed,.archive-viewer.archive-sidebar-collapsed{grid-template-columns:1fr;grid-template-rows:0 minmax(0,1fr)}.archive-sidebar{grid-column:1;grid-row:1;border-right:0;border-bottom:1px solid rgba(23,32,51,.08)}.archive-preview{grid-column:1;grid-row:2}.archive-preview-toolbar{min-height:52px;padding:8px 10px}.archive-preview-toolbar strong{font-size:15px}.archive-entry{grid-template-columns:var(--archive-entry-icon-column) minmax(0,1fr) minmax(40px,auto)}}
|
|
83
85
|
`;
|
|
84
86
|
const createStyle = (documentRef) => {
|
|
85
87
|
const style = documentRef.createElement('style');
|
|
@@ -354,6 +356,8 @@ export default async function renderArchive(buffer, target, _type, context) {
|
|
|
354
356
|
const title = createElement(documentRef, 'strong', undefined, filename);
|
|
355
357
|
title.title = filename;
|
|
356
358
|
const stats = createElement(documentRef, 'p');
|
|
359
|
+
stats.setAttribute('role', 'status');
|
|
360
|
+
stats.setAttribute('aria-live', 'polite');
|
|
357
361
|
const sidebarHideButton = createElement(documentRef, 'button', 'archive-sidebar-toggle');
|
|
358
362
|
sidebarHideButton.type = 'button';
|
|
359
363
|
headMain.append(badge, title, stats);
|
|
@@ -559,11 +563,14 @@ export default async function renderArchive(buffer, target, _type, context) {
|
|
|
559
563
|
};
|
|
560
564
|
const syncState = () => {
|
|
561
565
|
const archiveStats = getArchiveStats();
|
|
562
|
-
|
|
566
|
+
const statsText = t('archive.stats.summary', {
|
|
563
567
|
count: archiveStats.count,
|
|
564
568
|
size: formatArchiveBytes(archiveStats.totalSize),
|
|
565
569
|
previewable: archiveStats.previewableCount,
|
|
566
570
|
});
|
|
571
|
+
stats.textContent = statsText;
|
|
572
|
+
stats.title = statsText;
|
|
573
|
+
stats.setAttribute('aria-label', statsText);
|
|
567
574
|
warning.textContent = t('archive.warning.encrypted');
|
|
568
575
|
warning.classList.toggle('archive-hidden', !encrypted);
|
|
569
576
|
info.textContent = archiveNotice;
|
|
@@ -602,6 +609,7 @@ export default async function renderArchive(buffer, target, _type, context) {
|
|
|
602
609
|
button.style.setProperty('--entry-depth', String(entry.depth));
|
|
603
610
|
button.classList.toggle('active', (selectedEntry === null || selectedEntry === void 0 ? void 0 : selectedEntry.id) === entry.id);
|
|
604
611
|
const icon = createElement(documentRef, 'span', 'entry-ext', entry.extension || 'file');
|
|
612
|
+
icon.title = entry.extension || 'file';
|
|
605
613
|
const copy = createElement(documentRef, 'span', 'entry-copy');
|
|
606
614
|
const nameNode = createElement(documentRef, 'strong', undefined, entry.name);
|
|
607
615
|
const pathNode = createElement(documentRef, 'em', undefined, entry.path);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@file-viewer/renderer-archive",
|
|
3
|
-
"version": "2.1
|
|
3
|
+
"version": "2.2.1",
|
|
4
4
|
"private": false,
|
|
5
5
|
"type": "module",
|
|
6
6
|
"description": "Standalone archive renderer plugin for Flyfish File Viewer with libarchive worker, ZIP/TAR fallback, IndexedDB cache, and nested previews.",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"LICENSE"
|
|
57
57
|
],
|
|
58
58
|
"dependencies": {
|
|
59
|
-
"@file-viewer/core": "2.1
|
|
59
|
+
"@file-viewer/core": "2.2.1",
|
|
60
60
|
"jszip": "^3.10.1",
|
|
61
61
|
"libarchive.js": "^2.0.2"
|
|
62
62
|
},
|