Stack Overflow
Stack Overflow

Questions tagged [draftjs]

Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.

Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.

Draft.js makes it easy to build any type of rich text input, whether you're just looking to support a few inline text styles or building a complex text editor for composing long-form articles.

In Draft.js, everything is customizable – it provides the building blocks so that you have full control over the user interface.

You can learn more about Draft.js here.

746 questions
7
votes
1 answer

How to remove default option in toolbar of react-draft-wysiwyg?

According my question, I want to remove some default toolbar option like a font family or emoji and remain only text style options. How to do that ? For my editor.
Nawin P.
  • 223
  • 1
  • 4
  • 11
7
votes
3 answers

Render html saved from draft-js

I'm learning React: totally newbie. If I save in DB the HTML directly from draft.js (or it's variants always based on it) and then in a view page of my React SPA I retrieve HTML from DB through my API: QUESTIONS: how can I render that HTML?…
user4412054
7
votes
2 answers

Implementing table support in draft js

I’m working on a hack for table support (one level deep) using draft.js I have one requirement: All existing editor functionality needs to also work inside this table I present three choices to you, please pick one and explain why you did…
Julian Krispel-Samsel
  • 7,512
  • 3
  • 33
  • 40
7
votes
2 answers

Draft JS recognize img from HTML

I'm using Facebook's draft-js to create a WYSIWYG. I'm trying to convert HTML to editorState using the native convertFromHtml. But it's not recognizing the img tag. import draftJs from 'draft-js' const blocksFromHTML = convertFromHTML("
denislexic
  • 10,786
  • 23
  • 84
  • 128
7
votes
2 answers

Making bullet points in Draft.js

I am using Draft.js to introduce a text editor to my React application. I have made it work for bold, italic and underline but I can't figure out how to change the text to bullet points. I have read the documentation but I couldn't find anything…
Arslan Tariq
  • 2,478
  • 2
  • 22
  • 45
7
votes
1 answer

Draft.js and React Native

Has anyone tried to port DraftJs with React Native. Any ideas how to do it? https://github.com/facebook/draft-js/issues/138
John Paul Manoza
  • 1,735
  • 25
  • 22
7
votes
1 answer

Detect blur aka losing focus of a Draft.js editor

Is there a "correct way" to detect if I lose focus of a Draft.js editor? The use case is, that I want "quit editor mode" if the user clicks elsewhere which means that I toggle the readOnly prop of the editor. How can I do this ideally and is it a…
Philip Claren
  • 2,705
  • 3
  • 24
  • 33
6
votes
4 answers

React Draft Wysiwyg dropdown options not working

I am facing issue when implementing React Draft Wysiwyg, font, size, bold and other dropdown options not working this is my code import React, { useState } from 'react' import { Editor } from 'react-draft-wysiwyg' import { EditorState } from…
Jasmeen Maradeeya
  • 150
  • 2
  • 11
6
votes
1 answer

React and Electron with Draft.js: "Global is not defined"

There is a similar question raised here: Uncaught ReferenceError: global is not defined at Object../node_modules/fbjs/lib/setImmediate.js And there are two answers on that question that both seem confident they can solve it. The problem for me…
BrianMagus
  • 97
  • 1
  • 6
6
votes
3 answers

Input text in draft.js

I'm doing automation test and I need to input text in a text field, but the problem is there is no 'input' to do this. This one won't work: document.querySelector([class*=modal-dialog] [class*=AddCitation_]…
JohnPix
  • 1,595
  • 21
  • 44
6
votes
2 answers

How to implement a rich text editor such as Quill or Draft.js with Next.js?

I have a big application that I'm building with Next.js for SEO and performance purposes, and there's a super interactive part of this application that needs a Text Editor (such as Quill.js or Draft.js) where data in it is synced between two users…
Herbot Sikaro
  • 189
  • 2
  • 3
  • 9
6
votes
0 answers

How to create a table with DraftJS

Is there any way to create a table with DraftJS or any plugins? A plugin which allows the user to enter custom HTML (with table support) would be sufficient. As I understand it, a plugin can render as a table but I need to be able to edit the table,…
pythonjsgeo
  • 5,122
  • 2
  • 34
  • 47
6
votes
2 answers

Draft.js - add link without text selected

How to add a link? I know how to add link to selection const contentState = editorState.getCurrentContent(); const contentStateWithEntity = contentState.createEntity( 'LINK', 'MUTABLE', …
Nick
  • 113
  • 1
  • 2
  • 5
6
votes
6 answers

Draft.js. How to get all entities data from the ContentState

From official docs I know about 2 methods: get entity by its key and get last created entity. In my case, I also need a method to access all entities from current ContentState. Is there any method that could perform this? If not, is there a one that…
Pavel Poberezhnyi
  • 733
  • 13
  • 28
6
votes
2 answers

Does convertFromHTML support custom block types in Draft.js?

Here's a codepen example of the issue. I have added a custom block type called section, which wraps up selected text in red. It works fine when you click on the section in the edit toolbar. However, when used with convertFromHTML to render initial…
RedGiant
  • 4,444
  • 11
  • 59
  • 146
1 2
3
…
49 50