ozanyurtsever/verbum

Editor instance

DiggesT opened this issue · 3 comments

Is your feature request related to a problem? Please describe.
No way to use editor instance.

Describe the solution you'd like
Maybe should use context to get the instance of editor.

Additional context
Example how i can do this with lexical editor:

import { $convertToMarkdownString, TRANSFORMERS } from '@lexical/markdown'

const MyComponent = () => {
  const [editor] = useLexicalComposerContext()

  const onClick = () => {
    editor.getEditorState().read(() => {
    const a = $convertToMarkdownString(TRANSFORMERS)
  }

  return <div onClick={onClick}>Foobar</div>
}

const Editor = (props: { taskId: number }) => {

  return (
    <LexicalComposer initialConfig={initialConfig}>
      <RichTextPlugin />
      <MyComponent />
    </LexicalComposer>
  )
}

74ceff6

Now, you can use the onChange property to access to the editor instance as well.
Example;

const NoteViewer = () => {
 const [editorState, setEditorState] = useState();
 const [editorInstance, setEditorInstance] = useState();

  return (
    <EditorComposer>
      <Editor onChange{(state, instance) => {setEditorState(state); setEditorInstance(instance);}}>
        <ToolbarPlugin>
          <FontFamilyDropdown />
          <FontSizeDropdown />
          <Divider />
          <BoldButton />
          <ItalicButton />
          <UnderlineButton />
          <CodeFormatButton />
          <InsertLinkButton />
          <TextColorPicker />
          <BackgroundColorPicker />
          <TextFormatDropdown />
          <Divider />
          <InsertDropdown enablePoll={true} />
          <Divider />
          <AlignDropdown />
        </ToolbarPlugin>
      </Editor>
    </EditorComposer>
  );
};

Does that provide the required functionality for you?

Yes, it does, thx.

Can you please update the npm version with that?

You can use this feature with v0.3.4 now.