High quality plugins with great UX on top of DraftJS.
Checkout the website!
First, install the editor with npm:
$ npm install draft-js-plugins-editor --save and then import it somewhere in your code and you're ready to go!
importEditorfrom'draft-js-plugins-editor';An editor component accepting plugins.
| Props | Description | Required |
|---|---|---|
| editorState | see here | * |
| onChange | see here | * |
| plugins | an array of plugins | |
| all other props accepted by the DraftJS Editor | see here |
Usage:
importReact,{Component}from'react';importEditorfrom'draft-js-plugins-editor';importcreateHashtagPluginfrom'draft-js-hashtag-plugin';importcreateLinkifyPluginfrom'draft-js-linkify-plugin';import{EditorState}from'draft-js';consthashtagPlugin=createHashtagPlugin();constlinkifyPlugin=createLinkifyPlugin();constplugins=[hashtagPlugin,linkifyPlugin,];exportdefaultclassUnicornEditorextendsComponent{state={editorState: EditorState.createEmpty(),};onChange=(editorState)=>{this.setState({ editorState,});};render(){return(<EditoreditorState={this.state.editorState}onChange={this.onChange}plugins={plugins}ref="editor"/>);}}Feel free to copy any of the existing plugins as a starting point. Feel free to directly contact @nikgraf in case you need help or open a Github Issue!
More documentation is coming soon…
Join the channel #draft-js-plugins after signing into the DraftJS Slack organization or check out or collection of frequently asked questions here: FAQ.
Check out our Contribution Guide.
MIT