It's been over 4 years...
Now react-editor is BACK with fully TS & REACT-HOOKS integrated
import { Editor } from 'react-editor'
let [value, setValue] = useState('')
let ref = useRef()
ref.focus()
ref.insertText('foo')
ref.insertHTML('<img src="https://foo.bar/baz.png">')
value = 'set content'
<Editor
ref={ref}
placeholder="Type message to send..."
className={styles.editor}
value={value}
onChange={setValue}
/>
export interface EditorProps {
value?: string;
defaultValue?: string;
className?: string;
placeholder?: string;
allowInWebDrop?: boolean;
processHTML?: (html: string) => string;
processText?: (text: string) => string;
onFocus?: (e: React.FocusEvent<HTMLDivElement>) => void;
onBlur?: (e: React.FocusEvent<HTMLDivElement>) => void;
onDrop?: (e: React.DragEvent<HTMLDivElement>) => void;
onPaste?: (e: React.ClipboardEvent<HTMLDivElement>) => void;
onChange?: (value: string) => void;
[restProp: string]: any; // onto <div>
}
export interface EditorRefAttrs {
focus: () => void;
insertHTML: (html: string) => void;
insertText: (text: string) => void;
}
for umd / <script> usage
<script src="https://unpkg.com/react"></script> <script src="https://unpkg.com/react-dom"></script> <script src="https://unpkg.com/react-editor"></script> <script src="myapp.js"></script>
// myapp.js
let React = window.React;
let ReactDOM = window.ReactDOM;
let { Editor } = window.ReactEditor;
ReactDOM.render(<Editor />, mountNode);
for react < 16.8 we need hooks polyfill workaround
for react-editor legacy version
npm i -S react-editor@1.x
This project was bootstrapped with create-react-library & react-ts-demo.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4