Skip to content

Enable editing inline content programatically #1858

Description

@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 💖

Activity

  1. ClementEXWiki commented on Jul 28, 2025

    @ClementEXWiki
    Author

    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 :)

  2. YousefED commented on Jul 28, 2025

    @YousefED
    Collaborator
  3. ClementEXWiki commented on Jul 28, 2025

    @ClementEXWiki
    Author

    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.

  4. YousefED commented on Jul 28, 2025

    @YousefED
    Collaborator

    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:

    (Note that this is currently undocumented)

  5. ClementEXWiki commented on Jul 28, 2025

    @ClementEXWiki
    Author

    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.

  6. ClementEXWiki commented on Jul 30, 2025

    @ClementEXWiki
    Author

    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?

  7. YousefED commented on Jul 30, 2025

    @YousefED
    Collaborator

    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

  8. ClementEXWiki commented on Jul 30, 2025

    @ClementEXWiki
    Author

    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.

  9. ClementEXWiki commented on Feb 2, 2026

    @ClementEXWiki
    Author

    Hi, I see this is now closed as "not planned". Is there a reason for this?

  10. locked and limited conversation to collaborators on Feb 19, 2026
  11. converted this issue into a discussion #2480 on Feb 19, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions