A Quill component for React.
react-quill is a plugin that creates components for the quill text editor for use with Facebook's reactjs library.
Resources
Github repository
QuillJS
Questions tagged [react-quill]
239 questions
2
votes
1 answer
How can I change the border style of React Quill container when there is an error?
I am building an editor with React Quill. Could you give some advice on how I can change the border style of the editor dynamically? The border color should be changed to red if there is an error in ReactQuill.
The following code is what I tried,…
Che.P
- 59
- 1
- 9
2
votes
0 answers
CSS to make two react-quill components have different widths
I have two react-quill components appearing on a page and I would like them to have different widths.
Right now I have the CSS:
.ql-toolbar {
width: 600px !important
}
.ql-container {
width: 600px !important;
height: auto…
hexalgo
- 21
- 2
2
votes
0 answers
React-Quill: Open a custom popup before firing custom toolbar button handler
I am using react-quill in my react application. I have the editor all set up and ready to use. I have added a custom-button in the toolbar. That custom-button basically allows to the user to insert "button" in the editor area. There is a popup…
Harry
- 754
- 2
- 16
2
votes
1 answer
Exclude react-quill from vendor and bundle size
import React from 'react';
import clsx from 'clsx';
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';
import styles from './styles.scss';
interface Props {
label: string;
value: any;
className?: string;
…
Andrey Radkevich
- 3,012
- 5
- 25
- 57
2
votes
2 answers
React-Quill can't highlight syntax with highlightJS in NextJs
I have a NextJs app (blog) and I'm using react-quill as a rich text-editor in it. I'm using a Next custom 'app' feature where my UserProvider comp is wrapping the everything so i can have global access to certain things. My next/head comp is also…
LuckyA
- 35
- 6
2
votes
0 answers
I need the function to focus on a certain part of text in react-quill
I have a problem with react-quill which is a rich text editor.
I need to let the quill editor focus on a specific part of a long text, e.g. a specific line or a specific sentence. There is the "focus()" method and I assume but it's not working for…
farasatRehmat
- 39
- 2
2
votes
2 answers
React Quill + NextJs : Add custom text on button click
I am using next@11.1.3, react@17.0.2 and react-quill@1.3.5.
I am trying to add custom text on button click but I didn't get editor ref. Can you please help me.
import dynamic from 'next/dynamic'
const ReactQuill = dynamic(() =>…
Ashish Mehta
- 7,226
- 4
- 25
- 52
2
votes
1 answer
How to insert link for hashtags and mentions in react quill?
I am using react quill as rich text editor and I have used quill mention for adding hashtags and people mention in editor. I have went through the docs of quill mention but there is no example for adding links to inserted "hashtag" or…
Suraj Pawar
- 227
- 1
- 4
- 15
2
votes
1 answer
how to style mentions-list in React Quill
I am using react-quill for mentioning users however I am not able to style mention list ,actually when I mention user, long list of user gets displayed on the screen which needs scrollbar to make it more presentable.how to achieve scrollbar in…
Arti Pandey
- 21
- 2
2
votes
0 answers
React - Electron, using React-Quill package with styles not applying to component
I have this very weird problem with the React-Quill library component.
I am importing the component as per the NPM instructions, and the editor does load but without any actual CSS applied
The only when the styles are applied are when I link the…
Georgi
- 65
- 5
2
votes
1 answer
QuillJS - remove formatting when pasting into the editor
I previously used https://github.com/quilljs/quill/issues/1184#issuecomment-403657128 to make sure that no one can paste formatted text in the QuillJS editor, because I would like people to only use the few editing buttons that I enabled from…
yldm
- 144
- 3
- 14
2
votes
1 answer
Quill-blot-formatter is not registering with react-quill on import through next/dynamic and keeps showing loading
I made a function component where I have registered quill-blot-formatter with react-quill and added the blotFormatter in the modules list. Then I imported this module with next/dynamic on the page I want.
The custom function:
import ReactQuill, {…
forest
- 1,312
- 3
- 20
- 47
2
votes
1 answer
TypeError: Cannot read property 'imports' of undefined (react-quill)
Error:
TypeError: Cannot read property 'imports' of undefined
(anonymous function)
C:/Users/abc/finaltest/node_modules/quill-image-resize-module/image-resize.min.js:1
I installed quill-image-resize using:
npm i --save…
curious
- 21
- 1
- 3
2
votes
0 answers
Quill editor - HTML controls on Quill text area
I am trying to build a text editor for my application using react quill. My requirement is to build a sentence template and in that template, there will be some HTML controls like some free texts and some dropdown options. Is it possible to build an…
AjItH V S
- 99
- 6
2
votes
1 answer
How should I store HTML Content to DB using react-quill
I'm working on a blog project with React.js & Node.js (express & mongoose) & react-quill library for editing my contents.
Right now I'm saving the contents from react-quill as string HTML to my react state.
...
const [content, setContent] =…
Netanel Vaknin
- 856
- 2
- 8
- 21