Skip to content

feat: add Excalidraw drawing canvas support for .excalidraw and .canvas files - #703

Open
Adityakk9031 wants to merge 1 commit into
inkeep:mainfrom
Adityakk9031:feat-tldraw-canvas
Open

feat: add Excalidraw drawing canvas support for .excalidraw and .canvas files#703
Adityakk9031 wants to merge 1 commit into
inkeep:mainfrom
Adityakk9031:feat-tldraw-canvas

Conversation

@Adityakk9031

@Adityakk9031 Adityakk9031 commented Jul 20, 2026

Copy link
Copy Markdown
Contributor

Resolves #696

Description

This PR introduces native support for drawing canvases within the OpenKnowledge editor using the Excalidraw library (@excalidraw/excalidraw). Users can now create, open, and edit infinite canvas drawing boards by opening files with .excalidraw, .canvas, or .okdraw extensions.

What Changed

  • Core Extension Support: Added .excalidraw, .canvas, and .okdraw file extensions to LINKABLE_ASSET_EXTENSIONS and implemented the isExcalidrawDocFile helper.
  • Excalidraw Editor Component: Implemented ExcalidrawDocEditor.tsx in packages/app. It renders the <Excalidraw> canvas and serializes/deserializes canvas JSON snapshots directly to the underlying Y.Text('source') doc string with live CRDT synchronization.
  • Activity Pool Integration: Configured EditorActivityPool.tsx to mount the ExcalidrawDocEditor component when an .excalidraw, .canvas, or .okdraw document is active.
  • Dependencies & Changeset: Added @excalidraw/excalidraw dependency to packages/app and included .changeset/add-excalidraw-canvas-support.md.

Testing

  • Created files named canvas.excalidraw, canvas.canvas, and canvas.okdraw and verified that the Excalidraw editor loaded correctly.
  • Added shapes and drawings to the canvas, refreshed, and verified that all progress persisted into Y.Text('source').
  • Verified that @inkeep/open-knowledge-core and @inkeep/open-knowledge-app compile and pass TypeScript typechecking cleanly.

@Adityakk9031

Copy link
Copy Markdown
Contributor Author

@tim-inkeep have a look

@amikofalvy

Copy link
Copy Markdown
Contributor

We are investigating how to add tldraw, but given it's more strict licensing we are preferring other options like Excalidraw and JSONCanvas.

@nexeck

nexeck commented Aug 4, 2026

Copy link
Copy Markdown

Excalidraw would be cool :-)

@Adityakk9031 Adityakk9031 changed the title feat: add tldraw drawing canvas support for .tldr files feat: add Excalidraw drawing canvas support for .excalidraw and .canvas files Aug 12, 2026
@Adityakk9031

Copy link
Copy Markdown
Contributor Author

Thanks for the feedback @amikofalvy! That makes total sense regarding tldraw's licensing constraints.

I have updated this PR to switch from tldraw to Excalidraw (@excalidraw/excalidraw, MIT License).

Summary of updates in the latest commit (0b1581a6):

  • Excalidraw Integration: Replaced tldraw with @excalidraw/excalidraw. Added drawing canvas support for .excalidraw, .canvas, and .okdraw files.
  • CRDT Persistence: Added ExcalidrawDocEditor.tsx to serialize canvas JSON snapshots directly to Y.Text('source') with live bi-directional sync.
  • Activity Pool & Core: Added isExcalidrawDocFile(), updated DocumentListEntrySchema, upload.ts, sidebar-drag.ts, and EditorActivityPool.tsx for lazy mounting.
  • Conflicts & Changeset: Resolved all merge conflicts with main, passed typechecking, and updated the changeset file (.changeset/add-excalidraw-canvas-support.md).

Ready for another look when you have a chance!

@Adityakk9031

Copy link
Copy Markdown
Contributor Author

@anubra266 please review all the changes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature]: Request for excalidraw/tldraw plugin.

4 participants