Report an issue

EditorWithUI (core/editor)



Interface defining a type of editor which has a UI.

Most editors (like ClassicEditor or InlineEditor) implement this interface, however, it is not required to do so.

Editors with an external UI (i.e. Bootstrap-based) or a headless editor may not implement this interface. When developing editor features you can consider this by splitting them into two parts: the "editing" part, which bases on Editor itself, and the UI part which bases on this interface. This will make your features compatible with more types of editors.



  • element : HTMLElement | null


    The main (outermost) DOM element of the editor UI.

    For example, in ClassicEditor it is a <div> which wraps the editable element and the toolbar. In InlineEditor it is the editable element itself (as there is no other wrapper). However, in DecoupledEditor it is set to null because this editor does not come with a single "main" HTML element (its editable element and toolbar are separate).

    This property can be understood as a shorthand for retrieving the element that a specific editor integration considers to be its main DOM element. There are always other ways to access these elements, too (e.g. via editor.ui).

  • ui : EditorUI


    The editor UI instance.


  • uiReady( eventInfo )

    Fired when the editor UI is ready.

    Fired after event-pluginsReady and before event-dataReady.


    eventInfo : EventInfo

    An object containing information about the fired event.