@hawk-ui/rich-text-editor
v4.4.4
Published
hawk-ui: Rich Text Editor Component
Downloads
321
Maintainers
Readme
Installation
To install a component run
$ npm install @hawk-ui/rich-text-editor --save
Please import CSS styles via
@import '/path__to__node_modules/@hawk-ui/rich-text-editor/dist/index.min.css
Usage
Rich Text Editor
import RichTextEditor from '@hawk-ui/rich-text-editor';
initialState = {
body: '',
};
<RichTextEditor
label="Rich Text Editor"
toolbarClass="toolbar"
editableClass="editable"
editableId="containerEditable1"
placeholder="Click here to start typing"
toolbarItems={[
'bold', 'italic', 'underline', 'link', 'unlink', 'strike through', 'ordered list'
, 'unordered list', 'formatblock', 'cut', 'copy', 'print', 'preformatted text', 'header', 'font family'
, 'font size', 'select all', 'text color picker', 'background color picker', 'remove format', 'clean', 'divider', 'left justify'
, 'center justify', 'right justify', 'outdent', 'indent', 'undo', 'redo', 'image',
]}
htmlAttributes={{
rows: '5',
}}
value={state.body}
onChange={({ html, text }) => {
setState({ body: html });
}}
isBottomOptions
description="Here rich text editor description"
/>