To create an indent in tiptap 2, you can use the built-in indent extension. Here's an example of how to use it:
import Indent from '@tiptap/extension-indent'
const editor = new Editor({
extensions: [
// other extensions...
Indent,
],
})
const IndentButton = ({ editor }) => {
const indent = () => editor.chain().focus().indent().run()
return (
<button onClick={indent}>Indent</button>
)
}
// add the button to your toolbar
const editor = new Editor({
// other config...
content: '<p>Sample text</p>',
editorProps: {
// add a toolbar with the indent button
renderToolbar: (props, editor) => {
return (
<Toolbar>
<IndentButton editor={editor} />
</Toolbar>
)
},
},
})
Now when you click the "Indent" button in the editor's toolbar, the selected text will be indented by one level.
Please start posting anonymously - your entry will be published after you log in or create a new account. This space is reserved only for answers. If you would like to engage in a discussion, please instead post a comment under the question or an answer that you would like to discuss
Asked: 2023-07-02 07:29:16 +0000
Seen: 7 times
Last updated: Jul 02 '23
How can I open a csv file with an unspecified encoding format?
How can I modify the double-click action in vscode editor in order to expand the selected text area?
What is the method to turn off automatic backspacing in Excel VBA editor?
How can I get my script to run successfully every 5 minutes using crontab?
How can padding be added to an HTML email signature in Outlook?
How can a guideline be included in the Visual Studio editor?
Why does the code completion list fail to appear even after typing?
What is the method of personalizing the color of the editor gutter in VS Code?