draft-wysiwyg - Draft-JS experiments with drag&drop, resizing, tooltips, WIP

  •        229

A wysiwyg editor that mimics medium, build on top of https://github.com/facebook/draft-js and https://github.com/draft-js-plugins/draft-js-plugins. All the relevant behaviour comes from plugins, so this may serve as an example of using the plugin architecture and the different plugins. You can also install and use draft-wysiwyg right away.

https://draft-wysiwyg.herokuapp.com/
https://github.com/bkniffler/draft-wysiwyg

Dependencies:

draft-js : ^0.7.0
draft-js-alignment-plugin : ^1.0.3
draft-js-cleanup-empty-plugin : ^1.0.2
draft-js-dnd-plugin : ^1.0.7
draft-js-entity-props-plugin : ^1.0.2
draft-js-focus-plugin : ^1.0.12
draft-js-image-plugin : ^1.0.3
draft-js-plugins-editor-wysiwyg : ^1.0.3
draft-js-resizeable-plugin : ^1.0.8
draft-js-table-plugin : ^1.0.4
draft-js-toolbar-plugin : ^1.0.5
immutable : ^3.7.4

Tags
Implementation
License
Platform

   




Related Projects

draft-js-plugins - React Plugin Architecture for Draft

  •    Javascript

High quality plugins with great UX on top of DraftJS. Join the channel #draft-js-plugins after signing into the DraftJS Slack organization or check out our collection of frequently asked questions here: FAQ.

react-rte - Pure React rich text "WYSISYG" editor based on draft-js.

  •    Javascript

This is a UI component built completely in React that is meant to be a full-featured textarea replacement similar to CKEditor, TinyMCE and other rich text "WYSIWYG" editors. It's based on the excellent, open source Draft.js from Facebook which is performant and production-tested. RichTextEditor is the main editor component. It is comprised of the Draft.js <Editor>, some UI components (e.g. toolbar) and some helpful abstractions around getting and setting content with HTML/Markdown.

react-lz-editor - A multilingual react rich-text editor component includes media support such as texts, images, videos, audios, links etc

  •    Javascript

An open source react rich-text editor ( mordern react editor includes media support such as texts, images, videos, audios, links etc. ), development based on Draft-Js and Ant-design, good support html, markdown, draft-raw mode. It's supports multiple languages well and welcome you add your language supports. Disabled media insert feature on demo page, because of there was no online API support for the time being, here is The server side API demo in java you may want.


Draft-js - A React framework for building text editors

  •    Javascript

Draft.js is a JavaScript rich text editor framework, built for React and backed by an immutable model. 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.

dante2 - A complete rewrite of dante editor in draft-js, demo:

  •    Javascript

Dante II is a complete rewrite of DanteEditor. This version is built on top of Facebook's Draft-Js and reaches all Dante's features with a shiny ultra mega super uber maintainable architecture. Draft-Js handles selection, ranges and markup blocks as a data layer contained in a structure known as editorState, with a clear separation on how rendering, styling and interaction works. So you save content data, not html. That's awesome because you can change the appearance of articles (styles & markup) without database changes.

medium-draft - 📝 A medium like Rich Text Editor built on draft-js with a focus on keyboard shortcuts

  •    Javascript

A medium like rich text editor built upon draft-js with an emphasis on eliminating mouse usage by adding relevant keyboard shortcuts. Documentation in progress.

Alloy Editor - WYSIWYG editor based on CKEditor with completely rewritten UI

  •    Javascript

Alloy Editor is a modern WYSIWYG editor built on top of CKEditor, designed to create modern and gorgeous web content. It provides smart toolbars appear right near the selected text and offer different functionality based on context, Paste rich text from any web page and preserve its formatting, The full styling power of CKEditor and lot more.

ckeditor4-releases - Official distribution releases of CKEditor 4.

  •    Javascript

This repository contains the official release versions of CKEditor. There are four versions for each release — standard-all, basic, standard, and full. They differ in the number of plugins that are compiled into the main ckeditor.js file as well as the toolbar configuration.

ckeditor4 - The best enterprise-grade WYSIWYG editor

  •    Rich

This repository contains the development version of CKEditor 4. Attention: The code in this repository should be used locally and for development purposes only. We do not recommend using it in production environment because the user experience will be very limited. For that purpose, you should either build the editor (see below) or use an official release available on the CKEditor website.

rich-markdown-editor - The open source React and Slate based markdown editor that powers Outline wiki

  •    Javascript

A React and Slate based editor that powers the Outline wiki and can also be used for displaying content in a read-only fashion. The editor is WYSIWYG and includes many formatting tools whilst retaining the ability to write markdown shortcuts inline and output Markdown. See a working example in the example directory.

tiptap - A headless, framework-agnostic and extendable rich text editor, based on ProseMirror

  •    Typescript

tiptap is a headless, framework-agnostic and extendable rich text editor, based on ProseMirror. It gives you full control about every single aspect of your text editor experience. It’s headless and comes without any CSS. You are in full control over markup, styling and behaviour. tiptap works with Vanilla JavaScript and Vue.js, but it’s also possible to use it in React, Svelte and others. Real-time collaboration, syncing between different devices and working offline is supported.

editor - Next-gen, highly customizable content editor for the browser - based on React and Redux

  •    Javascript

ORY is a company building and maintaining developer tools for a safer, more accessible web. You might also like our other Open Source projects! The ORY Editor is a smart, extensible and modern editor ("WYSIWYG") for the web written in React. If you are fed up with the limitations of contenteditable, you are in the right place.The ORY Editor is used at Germany's largest (~800k uniques per month) E-Learning Website www.serlo.org to improve the wiki experience.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.