This is a forked version of react-rte#image-support(by sstur). There is an image button which can upload images by url. I'll remove this package if original package adopts image-support feature. Original Package
$ npm install --save react-rte-image
render() { // The toolbarConfig object allows you to specify custom buttons, reorder buttons and to add custom css classes. // Supported inline styles: https://github.com/facebook/draft-js/blob/master/docs/Advanced-Topics-Inline-Styles.md // Supported block types: https://github.com/facebook/draft-js/blob/master/docs/Advanced-Topics-Custom-Block-Render.md#draft-default-block-render-map const toolbarConfig = { // Optionally specify the groups to display (displayed in the order listed). display: ['INLINE_STYLE_BUTTONS', 'BLOCK_TYPE_BUTTONS', 'LINK_BUTTONS', 'IMAGE_BUTTON', 'BLOCK_TYPE_DROPDOWN', 'HISTORY_BUTTONS'], INLINE_STYLE_BUTTONS: [ {label: 'Bold', style: 'BOLD', className: 'custom-css-class'}, {label: 'Italic', style: 'ITALIC'}, {label: 'Underline', style: 'UNDERLINE'} ], BLOCK_TYPE_DROPDOWN: [ {label: 'Normal', style: 'unstyled'}, {label: 'Heading Large', style: 'header-one'}, {label: 'Heading Medium', style: 'header-two'}, {label: 'Heading Small', style: 'header-three'} ], BLOCK_TYPE_BUTTONS: [ {label: 'UL', style: 'unordered-list-item'}, {label: 'OL', style: 'ordered-list-item'} ] }; return ( <RichTextEditor toolbarConfig={toolbarConfig} /> ); }
Clone this project. Run npm install. Run npm run build-dist then point the server of your choice (like serv) to /demo.html.
This software is ISC Licensed.