app-core: add excalidraw drawing embeds#360
Closed
junereycasuga wants to merge 1 commit into
Closed
Conversation
junereycasuga
force-pushed
the
feat/embed-excalidraw-on-notes
branch
from
July 10, 2026 06:46
594acdb to
1b4c6c5
Compare
adibhanna
added a commit
that referenced
this pull request
Jul 10, 2026
…w]] (#276, #278) Render .excalidraw and Obsidian .excalidraw.md drawings inline in notes via the wikilink embed syntax (![[d.excalidraw]], |600, |600x400) in both the editor live-preview and the rendered reading view. Adds New Drawing / Embed Existing Drawing / Embed New Drawing commands with a searchable picker, an exportToBlob-based PNG preview (lazy-loaded, cached by path+mtime, refreshed by the vault watcher), and a transclusion guard so drawings never inline as raw JSON. Based on @junereycasuga's PR #360. Polished on merge: - Bounded the preview cache with a 24-entry LRU (it was unbounded; each entry is a full @2x base64 PNG) and removed the dead invalidateAllExcalidrawPreviews. - Fixed a reading-view re-mount flash: the preview pane rebuilds its DOM on every render, tearing down each embed's React root, so cache hits still flashed the loading pulse. ExcalidrawPreview now seeds from a synchronous cache peek and holds the last image while it re-resolves. Verified end to end in-app over CDP: an embedded drawing renders as an inline PNG (full size and |240) with no stuck loaders. 28 tests pass; typecheck + build green. Co-authored-by: junereycasuga <junerey.casuga@gmail.com>
Contributor
|
Thanks @junereycasuga, this is a really nice, well-tested feature and it slotted into the existing embed pipeline cleanly. Merged into I gave it a thorough review (no regressions to
Verified end to end in-app: an embedded drawing renders as an inline PNG at full size and with a A few non-blocking notes for later: bare Closing since it has landed on the release branch (it reaches |
This was referenced Jul 10, 2026
adibhanna
added a commit
that referenced
this pull request
Jul 10, 2026
… mode (#360) The drawing editor themes itself to match the app (#363), but the inline embed preview exported via exportToBlob in its default light mode, so a dark note showed a stark white drawing box. Pass exportWithDarkMode based on the resolved theme (the data-theme-mode <html> attribute), key the preview cache by mode as well as mtime, and bump excalidrawPreviewVersion when the resolved mode flips so open embeds re-render. Verified in-app over CDP: the exported PNG background samples rgb(17,17,17) in dark mode and rgb(255,255,255) in light mode, and embeds refresh on theme flip.
adibhanna
added a commit
that referenced
this pull request
Jul 10, 2026
…wnload (#360) Clicking an embedded drawing opened it via assetTabPath (zen://asset/…), which EditorPane routes to the generic asset viewer since isAssetTabPath is checked before isExcalidrawPath — and for a .excalidraw (not an image/pdf) that viewer offers to download the file. Open the plain drawing path instead so it routes through isExcalidrawPath to the Excalidraw editor, the same as opening the drawing from the sidebar. Fixes both the reading-view embed and the editor live-preview widget. Verified in-app over CDP: clicking the embed opens the Excalidraw editor (canvas mounted, no cm-content), and no download is triggered.
adibhanna
added a commit
that referenced
this pull request
Jul 10, 2026
…#360) Right-clicking an embedded drawing fell through to the editor's generic text context menu (Cut/Copy/Paste/Select All/…), which is meaningless over a rendered image. Add a focused menu with "Open drawing" and "Copy image", shared by the reading view and the editor live-preview widget: both dispatch a zen:excalidraw-embed-menu event (suppressing the text menu) that a small ContextMenu host renders. Verified in-app over CDP: right-clicking the embed shows Open drawing / Copy image (not Paste/Select All).
adibhanna
added a commit
that referenced
this pull request
Jul 10, 2026
…nu (#360) Round out the embedded-drawing right-click menu beyond Open drawing / Copy image: - Open in split — open the drawing in a pane beside the note (splitPaneWithTab) - Copy embed — copy the ![[name.excalidraw]] syntax to paste into another note - Reveal in File Manager — reveal the .excalidraw file on disk (revealNote) Verified in-app over CDP: the menu shows all five items; Copy embed writes ![[demo.excalidraw]] to the clipboard; Open in split opens the drawing in a second pane (two panes, drawing canvas rendered).
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
2 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
Adds first-class Excalidraw drawing support in notes.
Drawings can now be created, opened, embedded, and previewed inline from markdown using the same wikilink embed syntax as images:
Would close #276 and #278
Changes
.excalidrawand Obsidian.excalidraw.mdembeds as PNG previews in:Demo
Cap.2026-07-10.at.13.31.06.mp4
Testing