# Quill Editor

We have added the support for the famous Quill editor for Pages react. Please refer there documentation herehttps://github.com/zenoamaro/react-quill

# Importing

import ReactQuill from "react-quill";

# How to use

const [quil, setQuil] = useState("Hello Quil");
const [quilModules] = useState({
  toolbar: [
    [{ header: [1, 2, false] }],
    ["bold", "italic", "underline", "strike", "blockquote"],
    [
      { list: "ordered" },
      { list: "bullet" },
      { indent: "-1" },
      { indent: "+1" },
    ],
    [{ size: ["small", false, "large", "huge"] }],
    [{ header: [1, 2, 3, 4, 5, 6, false] }],
    [{ color: [] }, { background: [] }],
    [{ font: [] }],
    [{ align: [] }],
    ["link", "image"],
    ["clean"],
  ],
});
const [quilFormats] = useState([
  "header",
  "bold",
  "italic",
  "underline",
  "strike",
  "blockquote",
  "list",
  "bullet",
  "indent",
  "size",
  "heading",
  "color",
  "background",
  "font",
  "align",
  "link",
  "image",
]);

<ReactQuill
  value={quil}
  modules={quilModules}
  formats={quilFormats}
  theme="snow"
  onChange={(value) => setQuil(value)}
/>;