Sha256: e4903f2d01684ccae7952aa697b6d477dde0d26204088379fd3c3a24dbf51e3b
Contents?: true
Size: 1.39 KB
Versions: 948
Compression:
Stored size: 1.39 KB
Contents
import React from 'react'
import { RichTextEditor } from 'playbook-ui'
import { useEditor, EditorContent } from "@tiptap/react"
import StarterKit from "@tiptap/starter-kit"
import Link from '@tiptap/extension-link'
import HorizontalRule from "@tiptap/extension-horizontal-rule"
import Highlight from '@tiptap/extension-highlight'
const RichTextEditorMoreExtensions = (props) => {
const editor = useEditor({
extensions: [
StarterKit,
Link,
HorizontalRule,
Highlight.configure({ multicolor: true })
],
content:"Add your text here. You can format your text, add links, quotes, and bullets."
})
if (!editor) {
return null
}
const ExtensionsList = [
{
icon: "horizontal-rule",
isActive: editor.isActive("horizontalRule"),
text: "Horizontal Rule",
onclick: () => editor.chain().focus().setHorizontalRule().run(),
},
{
icon: "highlighter",
isActive: editor.isActive("highlight"),
text: "Highlighter",
onclick: () => editor.chain().focus().toggleHighlight().run(),
}
]
return (
<div>
<RichTextEditor
advancedEditor={editor}
extensions={ExtensionsList}
{...props}
>
<EditorContent editor={editor}/>
</RichTextEditor>
</div>
)
}
export default RichTextEditorMoreExtensions
Version data entries
948 entries across 948 versions & 2 rubygems