1import React, { useState, useRef } from "react";
2import JoditEditor from "jodit-react";
3import "./styles.css";
4
5export default function App() {
6  const editor = useRef(null);
7  const [content, setContent] = useState("Start writing");
8  const config = {
9    readonly: false,
10    height: 400
11  };
12  const handleUpdate = (event) => {
13    const editorContent = event.target.innerHTML;
14    setContent(editorContent);
15  };
16
17  return (
18    <div className="App">
19      <h1>React Editors</h1>
20      <h2>Start editing to see some magic happen!</h2>
21      <JoditEditor
22        ref={editor}
23        value={content}
24        config={config}
25        onBlur={handleUpdate}
26        onChange={(newContent) => {}}
27      />
28      <div dangerouslySetInnerHTML={{ __html: content }} />
29    </div>
30  );
31}