How to use the react-quill.Quill function in react-quill
To help you get started, we’ve selected a few react-quill examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
jehunter5811 / graphite-blockstack / src / components / messages / SingleConversation.js View on Github 
isSignInPending,
loadUserData,
Person,
getFile,
putFile,
lookupProfile,
signUserOut
} from 'blockstack';
import update from 'immutability-helper';
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
const blockstack = require("blockstack");
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
export default class SingleConversation extends Component {
constructor(props) {
super(props);
this.state = {
person: {
name() {
return 'Anonymous';
},
avatarUrl() {
return avatarFallbackImage;
},
},import Header from "../Header";
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.bubble.css';
import {
isSignInPending,
loadUserData,
Person,
getFile,
putFile,
lookupProfile,
signUserOut
} from "blockstack";
import update from 'immutability-helper';
const iconNew = 'http://www.iconj.com/ico/0/o/0o93qd5dr7.ico';
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
import SingleConversation from './SingleConversation';
import axios from 'axios';
const blockstack = require("blockstack");
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
export default class Conversations extends Component {
constructor(props) {
super(props);
this.state = {
person: {
name() {
return 'Anonymous';putFile,
lookupProfile
} from 'blockstack';
import HotTable from 'react-handsontable';
import update from 'immutability-helper';
import {CSVLink, CSVDownload} from 'react-csv';
const formula = require('excel-formula');
const wordcount = require("wordcount");
const blockstack = require("blockstack");
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
export default class SingleSharedSheet extends Component {
constructor(props) {
super(props);
this.state = {
sheets: [],
sharedFile: [],
grid: [[]],
title : "",
user: "",
content:"",
updated: "",
words: "",
index: "",
save: "",
loading: "hide",Person,
getFile,
putFile,
lookupProfile
} from 'blockstack';
import HotTable from 'react-handsontable';
import update from 'immutability-helper';
import {CSVLink, CSVDownload} from 'react-csv';
const formula = require('excel-formula');
const wordcount = require("wordcount");
const blockstack = require("blockstack");
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
export default class SingleSharedSheet extends Component {
constructor(props) {
super(props);
this.state = {
sheets: [],
sharedFile: [],
grid: [[]],
title : "",
user: "",
content:"",
updated: "",
words: "",
index: "",import Profile from "../Profile";
import Signin from "../Signin";
import Header from "../Header";
import {
isSignInPending,
loadUserData,
Person,
getFile,
putFile,
lookupProfile
} from 'blockstack';
import update from 'immutability-helper';
const wordcount = require("wordcount");
const blockstack = require("blockstack");
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const timeout = null;
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
export default class SingleDoc extends Component {
constructor(props) {
super(props);
this.state = {
value: [],
contacts: [],
title : "",
content:"",
updated: "",
words: "",import Header from "../Header";
import {
isSignInPending,
loadUserData,
Person,
getFile,
putFile,
lookupProfile,
signUserOut
} from 'blockstack';
import update from 'immutability-helper';
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
const blockstack = require("blockstack");
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
export default class SingleConversation extends Component {
constructor(props) {
super(props);
this.state = {
person: {
name() {
return 'Anonymous';
},
avatarUrl() {
return avatarFallbackImage;loadUserData,
Person,
getFile,
putFile,
lookupProfile
} from 'blockstack';
import HotTable from 'react-handsontable';
import update from 'immutability-helper';
import {CSVLink, CSVDownload} from 'react-csv';
const formula = require('excel-formula');
const wordcount = require("wordcount");
const blockstack = require("blockstack");
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
export default class SingleSharedSheet extends Component {
constructor(props) {
super(props);
this.state = {
sheets: [],
sharedFile: [],
grid: [[]],
title : "",
user: "",
content:"",
updated: "",
words: "",import Signin from "../Signin";
import Header from "../Header";
import {
isSignInPending,
loadUserData,
Person,
getFile,
putFile,
lookupProfile,
signUserOut
} from 'blockstack';
import update from 'immutability-helper';
const { encryptECIES, decryptECIES } = require('blockstack/lib/encryption');
const { getPublicKeyFromPrivate } = require('blockstack');
const Quill = ReactQuill.Quill;
const Font = ReactQuill.Quill.import('formats/font');
Font.whitelist = ['Ubuntu', 'Raleway', 'Roboto', 'Lato', 'Open Sans', 'Montserrat'] ; // allow ONLY these fonts and the default
ReactQuill.Quill.register(Font, true);
const blockstack = require("blockstack");
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
export default class SingleConversation extends Component {
constructor(props) {
super(props);
this.state = {
person: {
name() {
return 'Anonymous';
},
avatarUrl() {import React from "react";
import { connect } from "react-redux";
import { deleteNote, updateNote } from "./../../../actions/note_actions";
import TaggingBar from "./../tags/tagging_bar";
import ReactQuill from "react-quill";
const Font = ReactQuill.Quill.import("formats/font");
Font.whitelist = ["roboto", "jean", "comic", "tyler", "elvish"];
ReactQuill.Quill.register(Font, true);
class Quill extends React.Component {
constructor(props) {
super(props);
this.state = {
title: this.props.note.title,
body: this.props.note.body,
id: this.props.note.id,
openMenu: false,
expand: false,
interval: null,
};isSignInPending,
loadUserData,
Person,
getFile,
putFile,
lookupProfile,
signUserOut,
} from 'blockstack';
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';
import { Link } from 'react-router-dom';
import Dropzone from 'react-dropzone'
import PDF from 'react-pdf-js';
import { Player } from 'video-react';
import XLSX from 'xlsx';
const Quill = ReactQuill.Quill;
const avatarFallbackImage = 'https://s3.amazonaws.com/onename/avatar-placeholder.png';
const mammoth = require("mammoth");
const str2ab = require('string-to-arraybuffer')
export default class SingleVaultFile extends Component {
constructor(props) {
super(props);
this.state = {
person: {
name() {
return 'Anonymous';
},
avatarUrl() {
return avatarFallbackImage;
},react-quill
The Quill rich-text editor as a React component.
