@jeremyling/react-material-ui-rich-text-editor v0.3.12

React Material UI Rich Text Editor

A WYSIWYG rich text editor built with Slate using Material UI components. This project is heavily influenced by the examples provided in the Slate documentation and this article on Smashing Magazine.

Installation

npm install --save @jeremyling/react-material-ui-rich-text-editor

The following packages are peer dependencies and must be installed in your project for this package to work.

@emotion/react
@emotion/styled
@mui/icons-material
@mui/material
lodash
react-mui-color

Usage Example

import React, { useState } from "react";
import Editor from "@jeremyling/react-material-ui-rich-text-editor";

const initialHtml = "<p>Paragraph</p>";

export default function RichTextEditor(props) {
  const [html, setHtml] = useState(initialHtml);

  return <Editor html={html} updateHtml={(html) => setHtml(html)} />;
}

Props

If html is not set, value will default to

[
  {
    "type": "Paragraph",
    "children": [{ "text": "" }]
  }
]