TextAlign extension
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
Command | Windows/Linux | macOS |
---|---|---|
setTextAlign(left) | Ctrl + Shift + L | Cmd + Shift + L |
setTextAlign(center) | Ctrl + Shift + E | Cmd + Shift + E |
setTextAlign(right) | Ctrl + Shift + R | Cmd + Shift + R |
setTextAlign(justify) | Ctrl + Shift + J | Cmd + Shift + J |