feat: quick file preview for images, PDF, docx, and more - #2
Closed
beihai23 wants to merge 24 commits into
Closed
Conversation
Reuse the existing DiagramViewerOverlay (already shared by Mermaid and PlantUML) for inline preview images, via a new decorateImages step that mirrors decorateMermaidBlocks / decoratePlantUmlBlocks. - single-click any preview image to open the fullscreen viewer - cursor: zoom-in + draggable=false suppress native image drag - excludes images inside .mdv-plantuml and pre.mdv-mermaid (own affordance) - svg images (*.svg, data:image/svg+xml) work via native <img> support; naturalWidth falls back to the rendered box when svg reports 0 - no change to the overlay component, Mermaid/PlantUML wiring, i18n, or Rust Co-Authored-By: Claude <noreply@anthropic.com>
* feat(preview): unified reading width + outline (TOC) panel
Two reading-mode enhancements:
1. Unify preview width into the reading-width control
- Remove the standalone "fill width" toggle; its behavior (fill
viewport + 100% tables + tighter padding) moves into the "full"
step of the existing reading-width slider.
- Split preview now follows reading-width too — .mdv-prose uses the
--mdv-reading-prose-width variable instead of a hardcoded 720px.
- One width control (narrow / comfort / wide / full), effective in
both split and reading modes, persisted.
2. Add a docked table-of-contents (outline) panel for reading mode
- Toggle from the reading-mode title bar or the command palette.
- Reads the rendered headings (each already carries a GitHub-style
slug id from the markdown renderer) and scrolls to the chosen
heading on click. State persisted.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(preview): refine outline behavior
* fix(editor): tighten gutter inset
* style(editor): define line number gutter
* polish editor gutter
---------
Co-authored-by: wangzhigang <wangzhigang@ont.io>
Co-authored-by: Claude <noreply@anthropic.com>
* Add zh-TW * Add Traditional Chinese language support
Bumps [typescript](https://github.com/microsoft/TypeScript) from 5.9.3 to 7.0.2. - [Release notes](https://github.com/microsoft/TypeScript/releases) - [Commits](https://github.com/microsoft/TypeScript/commits) --- updated-dependencies: - dependency-name: typescript dependency-version: 7.0.2 dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com>
Bumps [serde_with](https://github.com/jonasbb/serde_with) from 3.20.0 to 3.21.0. - [Release notes](https://github.com/jonasbb/serde_with/releases) - [Commits](jonasbb/serde_with@v3.20.0...v3.21.0) --- updated-dependencies: - dependency-name: serde_with dependency-version: 3.21.0 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>
…le10#112) * feat(files): refresh open folders automatically * refactor(files): use native tauri folder watching * perf: lazy-load markdown rendering and native file watching
…rle10#113) Bumps [tauri-plugin-single-instance](https://github.com/tauri-apps/plugins-workspace) from 2.4.2 to 2.4.3. - [Release notes](https://github.com/tauri-apps/plugins-workspace/releases) - [Commits](tauri-apps/plugins-workspace@fs-v2.4.2...fs-v2.4.3) --- updated-dependencies: - dependency-name: tauri-plugin-single-instance dependency-version: 2.4.3 dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
…attenarle10#114) Bumps [serde_json](https://github.com/serde-rs/json) from 1.0.150 to 1.0.151. - [Release notes](https://github.com/serde-rs/json/releases) - [Commits](serde-rs/json@v1.0.150...v1.0.151) --- updated-dependencies: - dependency-name: serde_json dependency-version: 1.0.151 dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
…attenarle10#115) Bumps [window-vibrancy](https://github.com/tauri-apps/tauri-plugin-vibrancy) from 0.7.1 to 0.8.0. - [Release notes](https://github.com/tauri-apps/tauri-plugin-vibrancy/releases) - [Changelog](https://github.com/tauri-apps/window-vibrancy/blob/dev/CHANGELOG.md) - [Commits](tauri-apps/window-vibrancy@window-vibrancy-v0.7.1...window-vibrancy-v0.8.0) --- updated-dependencies: - dependency-name: window-vibrancy dependency-version: 0.8.0 dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
…ri (mattenarle10#116) Bumps [tauri-plugin-dialog](https://github.com/tauri-apps/plugins-workspace) from 2.7.1 to 2.7.2. - [Release notes](https://github.com/tauri-apps/plugins-workspace/releases) - [Commits](tauri-apps/plugins-workspace@log-v2.7.1...dialog-v2.7.2) --- updated-dependencies: - dependency-name: tauri-plugin-dialog dependency-version: 2.7.2 dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
…arle10#117) Bumps [serde](https://github.com/serde-rs/serde) from 1.0.228 to 1.0.229. - [Release notes](https://github.com/serde-rs/serde/releases) - [Commits](serde-rs/serde@v1.0.228...v1.0.229) --- updated-dependencies: - dependency-name: serde dependency-version: 1.0.229 dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Clicking a non-markdown file in the sidebar now opens an in-app preview instead of the "open in default app" toast. Zero new dependencies. - images/video/audio: native renderers via blob url - pdf: webview-native iframe via data url - text/code: read-only <pre> with "open as text" to edit - office/unknown formats: info card + "open in default app" Triggers: click, context menu "quick preview", and Space (Finder Quick Look) on a focused sidebar row. .md/.csv keep opening in the editor. macOS toolbar left-padding clears the native traffic-light buttons. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
beihai23
force-pushed
the
worktree-feature-file-preview
branch
from
July 24, 2026 09:58
321bdb8 to
9989ac0
Compare
Author
|
Closing in favor of the upstream PR: mattenarle10#120 (this one was opened against the fork's own |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
marka.md only opens
.md/.markdown/.mdx/.csv. Clicking any other file (image, PDF, docx, video,config.json, …) hits the binary-signature guard and shows a bare "open in default app" toast — there's no way to glance at a file inside the app. This adds an in-app quick preview overlay, with zero new dependencies.What it does
A new fullscreen overlay (
FilePreviewOverlay) mirrors the existingDiagramViewerOverlaychrome and renders each file type natively:<img>with zoom / fit / drag-pan / ctrl-wheel<video controls><audio controls><iframe>via webview-native rendering<pre>+ "open as text" to editBinary files are read once via
@tauri-apps/plugin-fsreadFile→ blob/data URL (PDF uses a data URL for webview-iframe compatibility; blob URLs are revoked on close). No new Tauri permissions are required —fs:allow-read-fileandopener:allow-open-pathare already granted.Triggers
.md/.csvkeep opening in the editor as before. The toolbar shows aquick previewbadge +esc to closehint so it's clearly read-only; on macOS the toolbar left-padding clears the native traffic-light buttons.Behavior change
Clicking a non-markdown file now opens the preview overlay instead of the load-error toast. Text/code files preview read-only with an "open as text" button, so editability is preserved (one click into the editor).
Key files
src/lib/preview.ts— extension → kind/mime classification (pure, tested)src/components/overlays/file-preview-overlay.tsx— the overlay + per-kind rendererssrc/styles/overlays/file-preview.css— overlay stylessrc/app.tsx— routing (handleSelectFile), context-menu item, Space shortcut, overlay wiringsrc/components/files/folder-node.tsx—data-mdv-tree-pathon file rows (Space target)menu.quickPreview+preview.*keysVerification
bun test— 31 pass (includes newtests/preview.test.tsfor kind/mime classification)bun run build(tsc + vite) ✅cargo check --release✅ (no Rust changes)Manual QA still recommended across formats.
Out of scope / future
convertFileSrc) for streaming large media — current path reads the whole file, fine for typical preview sizes🤖 Generated with Claude Code