Richer than rich is a lightweight, modern, accessible, responsive, and customizable rich text editor for Vue 3.
How to use it:
1. Import and register the Richer than rich editor.
import Richer from 'richer-than-rich' import 'richer-than-rich/dist/style.css'
2. Add the <richer> component to your template.
<richer></richer>
3. Enable/disable editor buttons.
<richer :buttons="['bold', 'underline', 'subscript', 'superscript']" > </richer>
// OR <richer :buttons="[ { name: 'dark', label: 'Dark theme', icon: 'i-moon', action: log }, { name: 'light', label: 'Light theme', icon: 'i-sun', action: log } ]" > </richer>
4. Enable the dark mode.
<richer :dark="darkMode"> </richer>
5. Event handlers.
<richer @button-click="log('button-click', $event)" @click="log('click', $event)" @keyup="log('keyup', $event)" @focus="log('focus', $event)" @blur="log('blur', $event)" @paste="log('paste', $event)"> </richer>
Preview:
Download Details:
Author: antoniandre
Live Demo: https://antoniandre.github.io/richer-than-rich/
Download Link: https://github.com/antoniandre/richer-than-rich/archive/refs/heads/main.zip
Official Website: https://github.com/antoniandre/richer-than-rich
Install & Download:
# Yarn
$ yarn add richer-than-rich
# NPM
$ npm i richer-than-rich