com.vaadin.flow.component.richtexteditor.

Class RichTextEditor

All Implemented Interfaces:

AttachNotifier, CompositionNotifier, DetachNotifier, HasElement, HasEnabled, HasSize, HasStyle, HasTheme, HasValue<AbstractField.ComponentValueChangeEvent<RichTextEditor,String>,String>, HasValueAndElement<AbstractField.ComponentValueChangeEvent<RichTextEditor,String>,String>, InputNotifier, KeyNotifier, HasThemeVariant<RichTextEditorVariant>, HasValueChangeMode, Serializable

@Tag("vaadin-rich-text-editor") @NpmPackage(value="@vaadin/polymer-legacy-adapter",version="24.7.0-alpha7") @NpmPackage(value="@vaadin/rich-text-editor",version="24.7.0-alpha7") @JsModule("@vaadin/polymer-legacy-adapter/style-modules.js") @JsModule("@vaadin/rich-text-editor/src/vaadin-rich-text-editor.js") public class RichTextEditor extends AbstractSinglePropertyField<RichTextEditor,String> implements CompositionNotifier, InputNotifier, KeyNotifier, HasSize, HasStyle, HasValueChangeMode, HasThemeVariant<RichTextEditorVariant>

Rich Text Editor is an input field for entering rich text. It allows you to format and style your text using boldface, italics, headings, lists, images, links etc.

The value of the rich text editor is in the HTML format. The setValue and getValue methods use the HTML format by default.

To get and set the value in the Quill Delta format, use asDelta(), HasValue.getValue() and HasValue.setValue(String).

Author:

Vaadin Ltd

See Also:

  • Constructor Details

  • Method Details

    • getI18n

      Gets the internationalization object previously set for this component.

      NOTE: Updating the instance that is returned from this method will not update the component if not set again using setI18n(RichTextEditorI18n)

      Returns:

      the i18n object or null if no i18n object has been set

    • setI18n

      public void setI18n(RichTextEditor.RichTextEditorI18n i18n)

      Sets the internationalization object for this component.

      Parameters:

      i18n - the i18n object, not null

    • onAttach

      protected void onAttach(AttachEvent attachEvent)

      Description copied from class: Component

      Called when the component is attached to a UI.

      This method is invoked before the AttachEvent is fired for the component.

      Make sure to call super.onAttach when overriding this method.

      Overrides:

      onAttach in class Component

      Parameters:

      attachEvent - the attach event

    • getValueChangeMode

      public ValueChangeMode getValueChangeMode()

      Gets current value change mode of the component.

      The default value is ValueChangeMode.ON_CHANGE.

      Specified by:

      getValueChangeMode in interface HasValueChangeMode

      Returns:

      current value change mode of the component, or null if the value is not synchronized

    • setValueChangeMode

      public void setValueChangeMode(ValueChangeMode valueChangeMode)

      Description copied from interface: HasValueChangeMode

      Sets new value change mode for the component.

      Specified by:

      setValueChangeMode in interface HasValueChangeMode

      Parameters:

      valueChangeMode - new value change mode, or null to disable the value synchronization

    • setValue

      public void setValue(String value)

      Sets the value of this editor in HTML format. If the new value is not equal to getValue(), fires a value change event. Throws NullPointerException, if the value is null.

      Note: Binder will take care of the null conversion when integrates with the editor, as long as no new converter is defined.

      Since v24, this method only accepts values in the HTML format, whereas in v23 and earlier this method would accept values in the Delta format. In order to prevent data corruption, passing a value that starts with either [ or { will now throw an IllegalArgumentException, as it might indicate that the value is in the Delta format. In order to keep using the Delta format, use asDelta(), which allows setting, retrieving, and binding the value using Binder, in the Delta format. In order to pass an HTML value starting with either characters, either wrap the value in a valid HTML tag, such as <p>, or use asHtml() which does not include this check.

      Specified by:

      setValue in interface HasValue<AbstractField.ComponentValueChangeEvent<RichTextEditor,String>,String>

      Overrides:

      setValue in class AbstractField<RichTextEditor,String>

      Parameters:

      value - the new value in HTML format, not null

      See Also:

    • setPresentationValue

      protected void setPresentationValue(String newPresentationValue)

      Description copied from class: AbstractField

      Updates the presentation of this field to display the provided value. Subclasses should override this method to show the value to the user. This is typically done by setting an element property or by applying changes to child components.

      If AbstractField.setModelValue(Object, boolean) is called from within this method, the value of the last invocation will be used as the model value instead of the value passed to this method. In this case AbstractField.setPresentationValue(Object) will not be called again. Changing the provided value might be useful if the provided value is sanitized.

      See AbstractField for an overall description on the difference between model values and presentation values.

      Overrides:

      setPresentationValue in class AbstractSinglePropertyField<RichTextEditor,String>

      Parameters:

      newPresentationValue - the new value to show

    • getValue

      public String getValue()

      Returns the current value of the text editor in HTML format. By default, the empty editor will return an empty string.

      Specified by:

      getValue in interface HasValue<AbstractField.ComponentValueChangeEvent<RichTextEditor,String>,String>

      Overrides:

      getValue in class AbstractField<RichTextEditor,String>

      Returns:

      the current value.

      See Also:

    • getHtmlValue

      @Deprecated public String getHtmlValue()
      Deprecated.
      since v24 the RichTextEditor uses the HTML value by default. Use getValue() instead.

      The value of the editor in HTML format.

      Returns:

      the editor value in HTML format

      See Also:

    • getColorOptions

      public List<String> getColorOptions()

      Gets an unmodifiable list of colors in HEX format used by the text color picker and background color picker controls of the text editor.

      Returns null by default, which means the web component shows a default color palette.

      Returns:

      an unmodifiable list of colors options

      Since:

      24.5

    • setColorOptions

      public void setColorOptions(List<String> colorOptions)

      Sets the list of colors in HEX format to use by the text color picker and background color picker controls of the text editor.

      Parameters:

      colorOptions - the list of colors to set, not null

      Since:

      24.5

    • asHtml

      Gets an instance of HasValue for the editor in the HTML format. Can be used for binding the value with Binder.

      Note that since v24, the RichTextEditor uses the HTML value by default. Instead of using this wrapper, getValue() and setValue(String) can be used directly, and RichTextEditor can be used for binding the HTML value using Binder. This method is not intended to be deprecated as it keeps the legacy behavior that allows passing values starting with either [ or {, which is not allowed when using setValue(String).

      Returns:

      an instance of HasValue

    • asDelta

      Gets an instance of HasValue for the editor in the Quill Delta format. Can be used for binding the value with Binder.

      Returns:

      an instance of HasValue