Every extension

dragHandle

Behaviour takes options 1.01 kB gzipped

A grip that appears beside the block under the pointer, and drags it.

One element, moved, rather than a widget decoration per block. A decoration per block would put a handle in the document's decoration set for every paragraph — thousands on a long document, all recomputed whenever anything changes — to show one at a time.

The handle sits outside the editable element and is `contenteditable="false"` regardless, so it can never take the caret or become part of the document.

Adding it

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

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

There is no separate package · dragHandle 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

Styles

This one needs a stylesheet to look right, and ships the minimum as a string rather than a file · nothing is loaded unless you load it.

          import { dragHandleCSS } from '@matrajs/core'

const style = document.createElement('style')
style.textContent = dragHandleCSS
document.head.append(style)
        

← All 81 extensions

Edit this page on GitHub