Extensions

indent

Behaviour takes options 0.45 kB gzipped

Block indentation, the way a word processor does it.

An attribute on the block rather than a wrapper node: Tab on a paragraph moves the paragraph in, Shift-Tab moves it back out, and the document says `indent: 2` rather than nesting the paragraph inside something invented to hold it. Inside a list the keys belong to the list, so this stands down there.

1 · Install

One package for every extension · there is no @matrajs/indent to install.

npm i @matrajs/core

2 · Add it to the editor

Import it and put it in the extensions array. That array is the whole feature list: what is not in it is not in your bundle and not in the document's schema.

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

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

3 · Use it

Run a command, and give focus back · a click on a button takes it away.

editor.commands.setIndent(1)
editor.focus()

From the keyboard: Tab , Shift-Tab .

Wired to a button:

const button = document.querySelector('#setIndent')

button.addEventListener('click', () => {
  editor.commands.setIndent(1)
  editor.focus()
})

Options

indent is a function · call it with an options object.

Commands

Every one returns true if it changed the document and false if it could not · a command that does not apply where the caret is says so rather than throwing.

Keyboard shortcuts

• Tab · indent
• Shift-Tab · outdent

Mod is Command on a Mac and Control everywhere else. To rebind one, put your own extension after this in the array · later keys win.

← All 83 extensions

Edit this page on GitHub