feat: allow customizing the rendering of video and audio elements #2203

[nperez0111]

Summary

An attempt to supercede #2229

Rationale

Changes

Impact

Testing

Screenshots/Video

Checklist

• Code follows the project's coding standards.
• Unit tests covering the new feature have been added.
• All existing tests pass.
• The documentation has been updated to reflect the new feature

Additional Notes

Resolves #2203

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Updated (UTC)
blocknote	Ready	Preview	Dec 9, 2025 4:08pm
blocknote-agent-demo	Error		Dec 9, 2025 4:08pm
blocknote-website	Ready	Preview	Dec 9, 2025 4:08pm

[pkg-pr-new]

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/ariakit@2250

@blocknote/code-block

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/code-block@2250

@blocknote/core

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/core@2250

@blocknote/mantine

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/mantine@2250

@blocknote/react

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/react@2250

@blocknote/server-util

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/server-util@2250

@blocknote/shadcn

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/shadcn@2250

@blocknote/xl-ai

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-ai@2250

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-docx-exporter@2250

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-email-exporter@2250

@blocknote/xl-multi-column

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-multi-column@2250

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-odt-exporter@2250

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/TypeCellOS/BlockNote/@blocknote/xl-pdf-exporter@2250

commit: 2a946db

[YousefED]

Makes sense, couple of questions to nail this:

• should we use the name render? (it's a term we use in other places as well, so might get confusing? Or good for consistency?)
• Can we add a simple test for this?
• Do we want to implement this at the React layer (React File blocks) as well? Or rather first determine what our strategy is in the react vs native file blocks?

[nperez0111]

Makes sense, couple of questions to nail this:

* should we use the name `render`? (it's a term we use in other places as well, so might get confusing? Or good for consistency?)

🤷 I haven't got a better name at the moment.

* Can we add a simple test for this?

Of course.

* Do we want to implement this at the React layer (React File blocks) as well? Or rather first determine what our strategy is in the react vs native file blocks?

Now that you mention this, I think this might go a bit deeper, whether this is working towards or against the idea of separating the schema config from it's rendering. Like maybe a user could choose to override the rendering to put whatever they want instead.