A RichText Editor component for Vaadin Flow using the open source Quill Editor library

Basic Usage

Create a QuillEditor and configure the toolbar. Define which toolbar commands should be removed. The default behaviour is that the toolbar will contain all available commands.

QuillEditor quillEditor = new QuillEditor();
quillEditor.getToolbarConfigurator()
    .noFontDecorators()
    .noColors()
    .initEditor();

quillEditor.setSizeFull();
layout.add(quillEditor);

Binding the QuillEditor to a Binder instance. QuillEditor extends the com.vaadin.flow.component.AbstractCompositeField class so it is possible to bind it to a Binder as with all the other Vaadin components which extend the HasValue interface.

QuillEditor quillEditor = new QuillEditor();
Binder<Bean> beanBinder = new Binder<>();

beanBinder
    .forField(quillEditor)
    .asRequired("Content is mandatory")
    .bind(Bean::getContent, Bean::setContent);

Install

Link to this version
ExperimentalReleased 18 December 2020Apache License 2.0
Framework Support
Vaadin platform 14
Browser Compatibility
Install with
Release notes - Version 1.0.0

A RichText Editor component for Vaadin Flow using the open source Quill Editor library