Enable editing inline content programatically

[ClementEXWiki]

Is your feature request related to a problem? Please describe.
We need to change existing inline contents' properties programatically inside the editor.

For instance, changing a property of that inline content to change how it's rendered.

Describe the solution you'd like
Adding an updateInlineContent function/method akin to updateBlock.

This may require adding a unique identifier to all inline contents, just like for blocks.

Describe alternatives you've considered
I don't see an alternative.

Additional context
N/A

Bonus
[ ] I'm a sponsor and would appreciate if you could look into this sooner than later 💖

[ClementEXWiki]

Re-reading this issue, I see that I forgot to mention this is very high priority for us (just like #1861).
Do you think this would be something complex to implement on your side? And if so, would there be any more simple alternative for us to do what we need while waiting for an implementation?

Thanks :)

[YousefED]

Thanks Clement, To advice on the best short term solution, can you give a bit more info about the use case? What kind of online content are you creating, and what's the trigger (user interaction / other event?) Op ma 28 jul 2025 09:29 schreef ClementEXWiki ***@***.***>:

…

*ClementEXWiki* left a comment (TypeCellOS/BlockNote#1858) <#1858 (comment)> Re-reading this issue, I see that I forgot to mention this is very high priority for us (just like #1861 <#1861>). Do you think this would be something complex to implement on your side? And if so, would there be any more simple alternative for us to do what we need while waiting for an implementation? Thanks :) — Reply to this email directly, view it on GitHub <#1858 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAC2BWJCO4FZIVBK2O5JI4T3KXGM7AVCNFSM6AAAAACB2ZSNCKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTCMRVHA4TQOJWGM> . You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[ClementEXWiki]

The modifications can happen in many ways: it can be from an interaction with a button on the toolbar for instance, or it could be in a completely asynchronous way through an event.

One such case is: when you double-click on some specific inline contents, we open a modal to edit some parameters that define how that content is displayed. When closing the modal, the inline content is updated.

[YousefED]

What might be helpful is that we pass a function updateInlineContent to the IC render function. This is a bit limited but it should be able to cover your scenario, let me know if not.

See:

BlockNote/packages/core/src/schema/inlineContent/createSpec.ts

Line 35 in 64eb00c

updateInlineContent: (

(Note that this is currently undocumented)

[ClementEXWiki]

This should do the trick! All the modification functions are created inside our renderer.

I'll try that and tell you if it works. Thanks :)

EDIT: Actually I'm wrong, we sometimes to need to act based on an external event, not from inside the renderer. So we could hack a way to e.g. put a unique ID inside every inline content we use and register every single element inside some big hashmap, but it would be very hacky.

So if possible we would actually need a way to edit any inline content from the editor instance itself - which also means a way to identify uniquely inline contents in the document.

[ClementEXWiki]

I implemented a register that puts all the update functions in a big map, but it's indeed very hacky, not ideal in terms of performance, and problematic in the way that it moves a function provided to a React function outside of React. So it may cause problems in the future.

So we indeed need to have a function to replace inline contents from the editor instance itself. Would that be possible?

[YousefED]

Glad to hear the function in render already addresses some cases.

Can you explain the steps the user takes in the other scenarios? I want to learn the use-case on how you as developer and the user would know which IC needs to be updated

[ClementEXWiki]

Of course, so basically we have a concept of "macros". These are custom blocks / inline contents that are added dynamically to the editor's schema before its initialization.

Each macro is an object with a name, a description, a set of parameters, etc. They also have a customized React render function to show the block / inline content inside the editor.

To edit a macro, you double-click on it. This calls a function that's provided to our library, we don't know what that function does. Usually it will open a custom modal, show informations about the macro itself, and when it's edited and submitted, the modal is closed and an event is sent back to our library, along with the changes.

We then need to reflect those changes on the selected macro instance. Obviously, the same macro can appear multiple times in the document, so we need to uniquely identify each and every one of them.

For blocks, it's easy: each BlockNote block has a unique ID and we have an update method to modify a block based on its ID.

But for inline contents we don't have any of these features, and that's what we need now.

The hack I currently do is when rendering the element, the double-click element handler will register the updateInlineContent parameter in a global map, and when the edit event is fired back to the library, this map is used to find the update function. But this is both hacky, kind of slow, and not ideal as we are using a React parameter outside of React, which may break in future releases on BlockNote depending on how that function works under-the-hood. Plus, it requires to manually generate and store a unique ID in every macro inline content we use.

So adding a unique id property to inline contents (just like blocks have) and an editor.updateInlineContent method (or something similar) would be very useful.