How to insert text in Toast UI Editor [React] for button click

Question

How to insert the text in editor for the button click on toast ui react editor We have created a separate button in toastui editor tab, In below code we have inserted the text in console for the button click, we want to insert the same in Editor

import React from "react";
import "@toast-ui/editor/dist/toastui-editor.css";
import { Editor } from "@toast-ui/react-editor";

function Editor4() {
  let editorRef = React.createRef();

  //Adding item based on button click
  const handleClick = () => {
    editorRef.current
      .getInstance()
      .addCommand("markdown", "additem", function additem() {
        console.log("ButtonClicked");
      });
  };
  return (
    <div>
      <div>
        <Editor
          initialValue="Hello"
          previewStyle="vertical"
          height="400px"
          initialEditType="markdown"
          ref={editorRef}
          toolbarItems={[
            [
              "heading",
              "bold",
              {
                name: "Button",
                tooltip: "myItem",
                command: "additem",
                className: "toastui-editor-toolbar-icons",
                text: "V",
              }]
          ]}
        />
        <button onClick={handleClick}>makeBold</button>
      </div>
    </div>
  );
}

Answer 1

You can use the porpertie insertText(YourText: string)

Example:

 editorRef.current.getInstance().insertText('ButtonClicked')