TextAlign extension

VersionDownloads

This extension adds a text align attribute to a specified list of nodes. The attribute is used to align the text.

Firefox bug

text-align: justify doesn’t work together with white-space: pre-wrap in Firefox, that’s a known issue.

Install

npm install @tiptap/extension-text-align

Settings

types

A list of nodes where the text align attribute should be applied to. Usually something like ['heading', 'paragraph'].

Default: []

TextAlign.configure({
  types: ['heading', 'paragraph'],
})

alignments

A list of available options for the text align attribute.

Default: ['left', 'center', 'right', 'justify']

TextAlign.configure({
  alignments: ['left', 'right'],
})

defaultAlignment

The default text align.

Default: 'left'

TextAlign.configure({
  defaultAlignment: 'right',
})

Commands

setTextAlign()

Set the text align to the specified value.

editor.commands.setTextAlign('right')

unsetTextAlign()

Remove the text align value.

editor.commands.unsetTextAlign()

Keyboard shortcuts

CommandWindows/LinuxmacOS
setTextAlign(left)Ctrl + Shift + LCmd + Shift + L
setTextAlign(center)Ctrl + Shift + ECmd + Shift + E
setTextAlign(right)Ctrl + Shift + RCmd + Shift + R
setTextAlign(justify)Ctrl + Shift + JCmd + Shift + J

Source code

packages/extension-text-align/