v11.2.0

Features

• It is now possible to customize the editable element tag name, classes, styles, and attributes via config.root.element or config.roots.main.element. The value can be a plain string (tag name) or an object:

  import { BalloonEditor } from 'ckeditor5';
  
  // In your component:
  public BalloonEditor = BalloonEditor;
  public config = {
  	root: {
  		element: {
  			name: 'article',
  			classes: [ 'my-editor', 'custom-class' ],
  			styles: { color: 'red' },
  			attributes: { role: 'textbox' }
  		}
  	}
  };

  <ckeditor [editor]="BalloonEditor" [config]="config"></ckeditor>

  To configure the root as a paragraph-like (inline-content only) editor, also pass modelElement: '$inlineRoot':

  public config = {
  	root: {
  		element: 'h1',
  		modelElement: '$inlineRoot',
  		initialData: 'Document title',
  		placeholder: 'Enter title...'
  	}
  };

  For editors that use the Angular-rendered element as their editable (such as InlineEditor or BalloonEditor), the editable falls back to the tagName input (div by default) when no element definition is provided in the config. For ClassicEditor, which creates its own editable internally, config.root.element (or config.roots.main.element) should always be provided explicitly.

  The tagName input has been deprecated in favor of this new configuration.

Other changes

• Readme simplification.