Skip to content

Conversation

Excellencedev
Copy link

/claim #741
/fixes #741

Description:

Custom Block for KaTeX Equations (#741)

This PR adds a new custom block for rendering LaTeX equations using KaTeX, addressing the feature request in #741. The block provides a user-friendly interface for inputting and editing mathematical expressions directly in the editor, similar to Notion's equation feature.

Changes

  • New Block Implementation: Added packages/core/src/blocks/Equation/block.ts defining the equation block spec.

    • Config: Stores LaTeX code in props.latex.
    • Content: "none" (no inline content, as LaTeX is prop-based).
    • Parse: Detects <div class="equation" data-latex="..."> from HTML.
    • Render: Editable div for LaTeX input with live KaTeX preview below. Updates on input.
    • toExternalHTML: Renders KaTeX HTML with data-latex attribute for serialization.
  • Integration:

    • Exported from packages/core/src/blocks/index.ts.
    • Added to defaultBlockSpecs in packages/core/src/blocks/defaultBlocks.ts for default schema inclusion.
    • Imported in defaultBlocks.ts from the Equation block file.
  • Dependencies: Added katex to @blocknote/core dependencies for rendering.

  • Keyboard Shortcut: Cmd/Ctrl + Alt + E to insert a new equation block at the cursor position.

  • TypeScript Fixes: Adjusted spec structure using createBlockSpec with proper overloads to resolve type errors.

Usage

  • Insert via shortcut or slash menu (if extended).
  • Edit the LaTeX code in the input field; the preview updates live.
  • Invalid LaTeX shows "Invalid LaTeX" in red.
  • Exports to HTML with rendered KaTeX for static documents.

Copy link

vercel bot commented Sep 19, 2025

@Excellencedev is attempting to deploy a commit to the TypeCell Team on Vercel.

A member of the Team first needs to authorize it.

@Excellencedev
Copy link
Author

Please review this PR and drop a comment so that I know what I need to do

@Excellencedev
Copy link
Author

Please approve the workflow and try to review this PR (it fixes #741) @nperez0111 @YousefED
And please drop a comment so I know what you think. Thank you

@nperez0111
Copy link
Contributor

I don't think we are going to accept this PR @Excellencedev, there were other attempts before you, and none were satisfactory. I made my own version a few weeks ago & even it was not satisfactory: #1987

We are likely going to move in a different direction with this. I'm unsure how this works, maybe you should take down the bounty @YousefED ?

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

Successfully merging this pull request may close these issues.

Custom Block for Katex
2 participants