122 lines
5.4 KiB
JavaScript
122 lines
5.4 KiB
JavaScript
// import {RichTextPlugin} from "@lexical/react/LexicalRichTextPlugin";
|
|
// import {ContentEditable} from "@lexical/react/LexicalContentEditable";
|
|
// import {OnChangePlugin} from "@lexical/react/LexicalOnChangePlugin";
|
|
// import {HistoryPlugin} from "@lexical/react/LexicalHistoryPlugin";
|
|
// import {LinkPlugin} from "@lexical/react/LexicalLinkPlugin";
|
|
// import {MarkdownShortcutPlugin} from "@lexical/react/LexicalMarkdownShortcutPlugin";
|
|
// import {LexicalComposer} from "@lexical/react/LexicalComposer";
|
|
|
|
// import {AutoFocusPlugin} from '@lexical/react/LexicalAutoFocusPlugin';
|
|
// import {AutoScrollPlugin} from '@lexical/react/LexicalAutoScrollPlugin';
|
|
// import {CharacterLimitPlugin} from '@lexical/react/LexicalCharacterLimitPlugin';
|
|
// import {CheckListPlugin} from '@lexical/react/LexicalCheckListPlugin';
|
|
// import {ClearEditorPlugin} from '@lexical/react/LexicalClearEditorPlugin';
|
|
// import {CollaborationPlugin} from '@lexical/react/LexicalCollaborationPlugin';
|
|
// import {HashtagPlugin} from '@lexical/react/LexicalHashtagPlugin';
|
|
// import {ListPlugin} from '@lexical/react/LexicalListPlugin';
|
|
// // import {PlainTextPlugin} from '@lexical/react/LexicalPlainTextPlugin';
|
|
// import {TablePlugin} from '@lexical/react/LexicalTablePlugin';
|
|
|
|
// import {createWebsocketProvider} from './collaboration'
|
|
// import {useSettings} from './context/SettingsContext'
|
|
// import {useSharedHistoryContext} from './context/SharedHistoryContext'
|
|
// import TableCellNodes from './nodes/TableCellNodes'
|
|
// import ActionsPlugin from './plugins/ActionsPlugin'
|
|
// import AutocompletePlugin from './plugins/AutocompletePlugin'
|
|
// import AutoEmbedPlugin from './plugins/AutoEmbedPlugin'
|
|
// import AutoLinkPlugin from './plugins/AutoLinkPlugin'
|
|
// import ClickableLinkPlugin from './plugins/ClickableLinkPlugin'
|
|
// import CodeActionMenuPlugin from './plugins/CodeActionMenuPlugin';
|
|
// import CodeHighlightPlugin from './plugins/CodeHighlightPlugin'
|
|
// import CollapsiblePlugin from './plugins/CollapsiblePlugin'
|
|
// import CommentPlugin from './plugins/CommentPlugin'
|
|
// import ComponentPickerPlugin from './plugins/ComponentPickerPlugin'
|
|
// import DraggableBlockPlugin from './plugins/DraggableBlockPlugin'
|
|
// import EmojiPickerPlugin from './plugins/EmojiPickerPlugin'
|
|
// import EmojisPlugin from './plugins/EmojisPlugin'
|
|
// import EquationsPlugin from './plugins/EquationsPlugin'
|
|
// import ExcalidrawPlugin from './plugins/ExcalidrawPlugin'
|
|
// import FigmaPlugin from './plugins/FigmaPlugin'
|
|
// import FloatingLinkEditorPlugin from './plugins/FloatingLinkEditorPlugin'
|
|
// import FloatingTextFormatToolbarPlugin from './plugins/FloatingTextFormatToolbarPlugin'
|
|
// import HorizontalRulePlugin from './plugins/HorizontalRulePlugin'
|
|
// import ImagesPlugin from './plugins/ImagesPlugin'
|
|
// import KeywordsPlugin from './plugins/KeywordsPlugin'
|
|
// import ListMaxIndentLevelPlugin from './plugins/ListMaxIndentLevelPlugin'
|
|
// import MarkdownShortcutPlugin from './plugins/MarkdownShortcutPlugin'
|
|
// import {MaxLengthPlugin} from './plugins/MaxLengthPlugin'
|
|
// import MentionsPlugin from './plugins/MentionsPlugin'
|
|
// import PollPlugin from './plugins/PollPlugin'
|
|
// import SpeechToTextPlugin from './plugins/SpeechToTextPlugin'
|
|
// import TabFocusPlugin from './plugins/TabFocusPlugin'
|
|
// import TableCellActionMenuPlugin from './plugins/TableActionMenuPlugin'
|
|
// import TableCellResizer from './plugins/TableCellResizer'
|
|
// import TableOfContentsPlugin from './plugins/TableOfContentsPlugin'
|
|
// import {TablePlugin as NewTablePlugin} from './plugins/TablePlugin'
|
|
// import ToolbarPlugin from './plugins/ToolbarPlugin'
|
|
// import TreeViewPlugin from './plugins/TreeViewPlugin'
|
|
// import TwitterPlugin from './plugins/TwitterPlugin'
|
|
// import YouTubePlugin from './plugins/YouTubePlugin'
|
|
// import PlaygroundEditorTheme from './themes/PlaygroundEditorTheme'
|
|
// import ContentEditable from './ui/ContentEditable'
|
|
// import ErrorBoundary from './ui/ErrorBoundary'
|
|
// import Placeholder from './ui/Placeholder'
|
|
|
|
import * as React from 'react';
|
|
import {useRef, useState} from 'react';
|
|
import {
|
|
EditorComposer,
|
|
Editor as InternalEditor,
|
|
ToolbarPlugin,
|
|
AlignDropdown,
|
|
BackgroundColorPicker,
|
|
BoldButton,
|
|
CodeFormatButton,
|
|
FloatingLinkEditor,
|
|
FontFamilyDropdown,
|
|
FontSizeDropdown,
|
|
InsertDropdown,
|
|
InsertLinkButton,
|
|
ItalicButton,
|
|
TextColorPicker,
|
|
TextFormatDropdown,
|
|
UnderlineButton,
|
|
Divider,
|
|
} from 'verbum';
|
|
|
|
// import nodes from './Nodes'
|
|
|
|
export const Editor = (props) => {
|
|
return (
|
|
// <LexicalComposer initialConfig={{editorState: props.state, namespace: props.namespace, onError: props.onError, theme: props.theme, nodes}}>
|
|
// <ToolbarPlugin/>
|
|
// <RichTextPlugin contentEditable={<ContentEditable/>} placeholder={<div>Sample...</div>}/>
|
|
// {props.onChange && <OnChangePlugin onChange={props.onChange} ignoreSelectionChange={true}/>}
|
|
// <HistoryPlugin/>
|
|
// <LinkPlugin/>
|
|
// <MarkdownShortcutPlugin/>
|
|
// </LexicalComposer>
|
|
|
|
<EditorComposer>
|
|
<InternalEditor hashtagsEnabled={true} onChange={props.onChange} initialEditorState={props.state}>
|
|
<ToolbarPlugin defaultFontSize="20px">
|
|
<FontFamilyDropdown />
|
|
<FontSizeDropdown />
|
|
<Divider />
|
|
<BoldButton />
|
|
<ItalicButton />
|
|
<UnderlineButton />
|
|
<CodeFormatButton />
|
|
<InsertLinkButton />
|
|
<TextColorPicker />
|
|
<BackgroundColorPicker />
|
|
<TextFormatDropdown />
|
|
<Divider />
|
|
<InsertDropdown enablePoll={true} enableTable={true} />
|
|
<Divider />
|
|
<AlignDropdown />
|
|
</ToolbarPlugin>
|
|
</InternalEditor>
|
|
</EditorComposer>
|
|
)
|
|
} |