Every extension

bubbleMenu

Behaviour takes options 0.65 kB gzipped

A menu that appears over the selection.

You bring the element; this shows it when something is selected, places it above the selection, and hides it when the selection collapses or focus leaves both the editor and the menu. Buttons inside it should prevent the default on `mousedown`, so pressing one does not take the selection away from the text it is about to format.

Adding it

import { createEditor, document, paragraph, text, bubbleMenu } from '@matrajs/core'

const editor = createEditor({
  extensions: [document, paragraph, text, bubbleMenu({ … })],
  element: document.querySelector('#editor'),
})

There is no separate package · bubbleMenu is already in @matrajs/core, and an extension you do not import is not in your bundle. document, paragraph and text are the floor every document needs.

Options

Field Type
element required HTMLElement The element to show. Positioned absolutely by this extension, hidden when not needed.
shouldShow (editor: Editor) => boolean When to show it. Default: the selection is not empty and the editor, or the menu, has focus.
placement 'top' | 'bottom' Above or below the selection. Default `top`.
offset number Pixels between the selection and the menu. Default 8.

← All 81 extensions

Edit this page on GitHub