Link Toolbar
The Link Toolbar appears whenever you hover a link in the editor.
TODO Image
Changing the Link Toolbar
You can change or replace the Link Toolbar with your own React component. In the demo below, a button is added to the default Link Toolbar, which opens a browser alert.
We use the LinkToolbar component to create a custom Link Toolbar. By specifying its children, we can replace the default buttons in the toolbar with our own.
This custom Link Toolbar is passed to a LinkToolbarController, which controls its position and visibility (above or below the hovered link).
Setting linkToolbar={false} on BlockNoteView tells BlockNote not to show the default Link Toolbar.
Tip: The children you pass to the LinkToolbar
component should be default buttons (e.g. TODO) or custom selects/buttons
(ToolbarSelect & ToolbarButton). To see all the components you can
use, head to the Link Toolbar's source code.