I'm working on open-sourcing the equation editor, which is built as a ProseMirror plugin. My goal is to make it headless, so you can fully customize the look while getting the same behaviors out of box. Stay tuned for more updates!

Interesting! Might make building a contextual caret easier. For example, to indicate the text styles that will be applied to text input in a rich text editor github.com/ocavue/prose...

In OSS, I think it’s more important to write code that’s easy for people to understand and maintain than to rush out lots of features quickly.

Here's the result:

Today, I checked Notion's editor again and found they have a new method: use real paddings with `transform: translate()` and negative margins.
`transform: translate()` can cancel padding-left and padding-top, while negative margin-right and margin-bottom remove extra space created by `transform`.

To add visual paddings to an element without shifting layout, previously I learned from Notion's editor that I could set a box-shadow with only the `<spread-radius>`, e.g. `box-shadow: 0 0 0 3px red`. The problem is that `<spread-radius>` is fixed for all sides.

Added a virtual selection background to indicate the inline equation node that is being edited.

Same for inline equation nodes

When building the equation node display, there are several states to consider: empty TeX, TeX containing only whitespace, valid non-empty TeX, and invalid TeX.

It's a fascinating idea! Infinite zoom feels magical with pictures, like vaskange.world, where you can dive deeper endlessly without losing track of the visuals. For text-based content, though, I wonder if it might be less effective—since text can look quite similar at different zoom levels.

File renaming is also handled.

When you rename a symbol in source code using VS Code's "Rename Symbol" feature, canvases that reference the symbol are updated automatically.

When you click on a symbol in a canvas, the extension opens the symbol's source code.

It's a VS Code extension designed to integrate seamlessly into your software development workflow.