[NEW PLUGIN] BlockNote (Markdown Editor)

Hey @tomo.hitoma.bubble , I’m looking into integrating the toggle feature in BlockNote (outside of Bubble) but ran into a blocker where I cannot nest blocks inside a custom toggle block. I noticed your plugin includes this functionality, and I’m curious how you managed it?

Did you manage to do this purely with BlockNote or did it require some workarounds? If you’re open to chatting about it, I’d really appreciate any insights!

@kazuma
Hi! Thank you for your question about the toggle feature.

To be honest, it wasn’t possible to implement it with pure BlockNote alone. I had to come up with a few workarounds and custom solutions:

Main ideas and customizations:

  1. Custom state management system (ToggleStore)
  • Persisting the open/closed state of toggles
  • Temporarily storing and restoring child blocks when a toggle is closed
  1. Dynamic child block handling
  • Manually adding and removing child blocks with editor.updateBlock()
  • The default BlockNote child block management had some limitations
  1. Custom event handling
  • Monitoring state changes with editor.onChange() callbacks
  • Avoiding conflicts with BlockNote’s default behaviors

I used BlockNote’s core features as a base, but added my own custom logic to fill in the gaps where needed.

I hope this helps! If you have any further questions or want details about the implementation, feel free to ask!

hey any updates about your feature of accept and decline?

there is even a full tool just doing and offering this. (launched this week) The businesscase is real

Hi there, and thank you so much for your interest!

The feature has already been tested locally, and I’m currently working on the integration with Bubble.
Here’s a demo video of the plugin running in a local environment:

Note: The chat panel on the right is for local testing only and is not included in the plugin.

Using Bubble.io’s API streaming functionality, users will be able to freely use their preferred AI models and prompts.
By including tags like [streaming], [insert], and [replace] in the AI response, and passing properties such as isStreaming and isDone from Bubble, streaming responses become possible.

In addition to options like dialog width, color, and accept/reject buttons, I’ve also added support for specifying the left value of the sidemenu, which was previously requested.

Final testing is underway, and I’m planning to release it next week.
Please stay tuned!

wooooowwww - that looks stunning - believe me people will love this - you should rebrand it and publish it again awwwesome!!!

let me know when it is ready i will be the first to test it

Hi Bubblers!
:sparkles: I’m excited to introduce BlockNote (Markdown Editor) with new AI features (Beta)!
This update brings real-time AI-powered editing capabilities to the BlockNote Editor.

:test_tube: Demo app: BlockNote (Markdown Editor)
:pencil: Editor here: tomo-plugins | Bubble Editor
:package: Plugin page: BlockNote (Markdown Editor) Plugin | Bubble

:white_check_mark: Key Features

  • AI streaming support – See AI responses appear directly in the editor in real time
  • Simple command format – Just include [insert], [replace], or [delete] inside [streaming][/streaming] tags
  • Flexible AI integration – Connect to OpenAI, Anthropic, or any other AI provider via Bubble’s API Connector
  • Full BlockNote block support – Compatible with all block types including headings, lists, toggles, tables, and more

:white_check_mark: How It Works

  1. Design a workflow that sends user instructions to your AI of choice
  2. The AI returns a response with commands inside [streaming] tags
  3. The plugin parses the commands and applies insertions, replacements, or deletions
  4. The editor updates live with the AI’s actions

:white_check_mark: Supported Commands

  • Insert: [insert, line_number, line_number] → Add new content
  • Replace: [replace, start_line, end_line] → Replace selected content
  • Delete: [delete, start_line, end_line] → Delete content from selected lines

:page_facing_up: For setup instructions, please refer to the documentation:
https://tomo-plugins.notion.site/BlockNote-Markdown-Editor-1b16a2d7a73f804eadbfe69b971673a4

:artist_palette: You can freely customize the AI dialog, diff highlights, and button styles to match your app.

:wrench: The plugin is still in active development, so feel free to share any bugs or suggestions!

@buero @joaquintorroba
Thanks again for your support — it’s finally live, and I’d love for you to try it out! :raising_hands:

This is so needed and thanks for the great work - i will check it out soon!

heyy! How about custom blocks? Can we be able to customize block names, add/delete blocks…? It will be awesome to customize it and adapt it more to each use case

@produccion1
Thanks for your message!

Custom blocks like Toggle, Callout, and Divider already support renaming and showing/hiding in the current plugin.
The same also applies to standard blocks like headings, paragraphs, bullet lists, and more — you can customize their labels or disable them entirely.

However, creating entirely new types of blocks from the Bubble editor isn’t possible — this would require writing custom code.

Hope this helps!

Nice! can i be able to try before buying so i can test for a few days if this customization can fit my project? thank you!

Yes, a trial is available!
If you share your app ID, I can set up free access for two weeks.
You can find the app ID in the URL of your Bubble editor — it appears after id= (e.g., bubble.io/page?id=your-app-id).

If you have any questions, feel free to reach out!