preact-richtextarea

A <textarea> that supports HTML editing, powered by Preact & contentEditable.

---

Usage Example

Use <RichTextArea /> like a normal <input>. It supports the same props/attributes, including value, onInput() and onChange().

import RichTextArea from 'preact-richtextarea';
 
const HtmlEditor = ({ html, ...props }) => (
    <label class="html">
        Body HTML:
        <RichTextArea value={html} {...props} />
    </form>
);
 
let html = `<h1>hello</h1><p>Testing 1 2 3...</p>`;
render(<HtmlEditor html={html} />, document.body);

Usage with Linked State

<RichTextArea /> works with Linked State exactly the same way as any other input field:

import RichTextArea from 'preact-richtextarea';
 
class Form extends Component {
    render({ }, { html }) {
        return (
            <form>
                <RichTextArea value={html} onChange={ this.linkState('html') } />
            </form>
        );
    }
}
 
render(<Form />, document.body);

---

License

MIT