@ckeditor/ckeditor5-ui 37.0.0-alpha.0 → 37.0.0-alpha.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-ui",
-  "version": "37.0.0-alpha.0",
+  "version": "37.0.0-alpha.2",
   "description": "The UI framework and standard UI library of CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -11,29 +11,29 @@
   ],
   "main": "src/index.js",
   "dependencies": {
-    "@ckeditor/ckeditor5-utils": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-core": "^37.0.0-alpha.0",
+    "@ckeditor/ckeditor5-utils": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-core": "^37.0.0-alpha.2",
     "lodash-es": "^4.17.15"
   },
   "devDependencies": {
-    "@ckeditor/ckeditor5-basic-styles": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-block-quote": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-editor-balloon": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-editor-classic": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-engine": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-enter": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-essentials": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-font": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-find-and-replace": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-heading": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-image": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-link": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-list": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-mention": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-paragraph": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-horizontal-line": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-table": "^37.0.0-alpha.0",
-    "@ckeditor/ckeditor5-typing": "^37.0.0-alpha.0",
+    "@ckeditor/ckeditor5-basic-styles": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-block-quote": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-editor-balloon": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-editor-classic": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-engine": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-enter": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-essentials": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-font": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-find-and-replace": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-heading": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-image": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-link": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-list": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-mention": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-paragraph": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-horizontal-line": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-table": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-typing": "^37.0.0-alpha.2",
     "typescript": "^4.8.4",
     "webpack": "^5.58.1",
     "webpack-cli": "^4.9.0"
@@ -60,7 +60,7 @@
     "CHANGELOG.md"
   ],
   "scripts": {
-    "build": "tsc -p ./tsconfig.release.json",
+    "build": "tsc -p ./tsconfig.json",
     "postversion": "npm run build"
   },
   "types": "src/index.d.ts"

package/src/{uiconfig.d.ts → augmentation.d.ts}

@@ -2,10 +2,8 @@
  * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
+import type { BalloonToolbar, BlockToolbar, ContextualBalloon, Notification } from './index';
 import type { ToolbarConfig } from '@ckeditor/ckeditor5-core';
-/**
- * @module ui/uiconfig
- */
 declare module '@ckeditor/ckeditor5-core' {
     interface EditorConfig {
         /**
@@ -79,4 +77,10 @@ declare module '@ckeditor/ckeditor5-core' {
          */
         blockToolbar?: ToolbarConfig;
     }
+    interface PluginsMap {
+        [BalloonToolbar.pluginName]: BalloonToolbar;
+        [BlockToolbar.pluginName]: BlockToolbar;
+        [ContextualBalloon.pluginName]: ContextualBalloon;
+        [Notification.pluginName]: Notification;
+    }
 }

package/src/bindings/submithandler.d.ts

@@ -10,7 +10,7 @@ import type View from '../view';
  * A handler useful for {@link module:ui/view~View views} working as HTML forms. It intercepts a native DOM
  * `submit` event, prevents the default web browser behavior (navigation and page reload) and
  * fires the `submit` event on a view instead. Such a custom event can be then used by any
- * {@link module:utils/dom/emittermixin~Emitter emitter}, e.g. to serialize the form data.
+ * {@link module:utils/dom/emittermixin~DomEmitter emitter}, e.g. to serialize the form data.
  *
  * ```ts
  * import submitHandler from '@ckeditor/ckeditor5-ui/src/bindings/submithandler';
@@ -47,9 +47,9 @@ export default function submitHandler({ view }: {
     view: View;
 }): void;
 /**
- * Fired by {@link ~submitHandler} helper.
+ * Fired by {@link module:ui/bindings/submithandler~submitHandler} helper.
  *
- * @eventName submit
+ * @eventName module:ui/view~View#submit
  */
 export type SubmitHandlerEvent = {
     name: 'submit';

package/src/bindings/submithandler.js

@@ -6,7 +6,7 @@
  * A handler useful for {@link module:ui/view~View views} working as HTML forms. It intercepts a native DOM
  * `submit` event, prevents the default web browser behavior (navigation and page reload) and
  * fires the `submit` event on a view instead. Such a custom event can be then used by any
- * {@link module:utils/dom/emittermixin~Emitter emitter}, e.g. to serialize the form data.
+ * {@link module:utils/dom/emittermixin~DomEmitter emitter}, e.g. to serialize the form data.
  *
  * ```ts
  * import submitHandler from '@ckeditor/ckeditor5-ui/src/bindings/submithandler';

package/src/button/button.d.ts

@@ -143,10 +143,10 @@ export default interface Button {
     labelStyle: string | undefined;
 }
 /**
- * Fired when the button view is clicked. It won't be fired when the button {@link #isEnabled}
+ * Fired when the button view is clicked. It won't be fired when the button {@link module:ui/button/button~Button#isEnabled}
  * is `false`.
  *
- * @eventName execute
+ * @eventName ~Button#execute
  */
 export type ButtonExecuteEvent = {
     name: 'execute';

package/src/colorgrid/colorgridview.d.ts

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 /**
- * @module ui/colorgrid/colorgrid
+ * @module ui/colorgrid/colorgridview
  */
 import View from '../view';
 import ColorTileView from './colortileview';
@@ -12,7 +12,7 @@ import type ViewCollection from '../viewcollection';
 import { FocusTracker, KeystrokeHandler, type Locale } from '@ckeditor/ckeditor5-utils';
 import '../../theme/components/colorgrid/colorgrid.css';
 /**
- * A grid of {@link module:ui/colorgrid/colortile~ColorTileView color tiles}.
+ * A grid of {@link module:ui/colorgrid/colortileview~ColorTileView color tiles}.
  */
 export default class ColorGridView extends View implements DropdownPanelFocusable {
     /**
@@ -38,13 +38,13 @@ export default class ColorGridView extends View implements DropdownPanelFocusabl
      */
     selectedColor: string | undefined | null;
     /**
-     * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortile~ColorTileView tiles}.
+     * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
      *
      * @fires execute
      * @param locale The localization services instance.
      * @param options Component configuration
      * @param options.colorDefinitions Array with definitions
-     * required to create the {@link module:ui/colorgrid/colortile~ColorTileView tiles}.
+     * required to create the {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
      * @param options.columns A number of columns to display the tiles.
      */
     constructor(locale?: Locale, options?: {
@@ -69,7 +69,7 @@ export default class ColorGridView extends View implements DropdownPanelFocusabl
     destroy(): void;
 }
 /**
- * A color definition used to create a {@link module:ui/colorgrid/colortile~ColorTileView}.
+ * A color definition used to create a {@link module:ui/colorgrid/colortileview~ColorTileView}.
  *
  * ```json
  * {
@@ -84,20 +84,20 @@ export default class ColorGridView extends View implements DropdownPanelFocusabl
 export interface ColorDefinition {
     /**
      * String representing a color.
-     * It is used as value of background-color style in {@link module:ui/colorgrid/colortile~ColorTileView}.
+     * It is used as value of background-color style in {@link module:ui/colorgrid/colortileview~ColorTileView}.
      */
     color: string;
     /**
-     * String used as label for {@link module:ui/colorgrid/colortile~ColorTileView}.
+     * String used as label for {@link module:ui/colorgrid/colortileview~ColorTileView}.
      */
     label: string;
     /**
-     * Additional options passed to create a {@link module:ui/colorgrid/colortile~ColorTileView}.
+     * Additional options passed to create a {@link module:ui/colorgrid/colortileview~ColorTileView}.
      */
     options: {
         /**
          * A flag that indicates if special a CSS class should be added
-         * to {@link module:ui/colorgrid/colortile~ColorTileView}, which renders a border around it.
+         * to {@link module:ui/colorgrid/colortileview~ColorTileView}, which renders a border around it.
          */
         hasBorder: boolean;
     };
@@ -105,7 +105,7 @@ export interface ColorDefinition {
 /**
  * Fired when the `ColorTileView` for the picked item is executed.
  *
- * @eventName execute
+ * @eventName ~ColorGridView#execute
  * @param data Additional information about the event.
 */
 export type ColorGridViewExecuteEvent = {
@@ -117,16 +117,16 @@ export type ColorGridViewExecuteEvent = {
  */
 export interface ColorGridViewExecuteEventData {
     /**
-     * The value of the selected color ({@link module:ui/colorgrid/colorgrid~ColorDefinition#color `color.color`}).
+     * The value of the selected color ({@link module:ui/colorgrid/colorgridview~ColorDefinition#color `color.color`}).
      */
     value: string;
     /**
      * The `hasBorder` property of the selected color
-     * ({@link module:ui/colorgrid/colorgrid~ColorDefinition#options `color.options.hasBorder`}).
+     * ({@link module:ui/colorgrid/colorgridview~ColorDefinition#options `color.options.hasBorder`}).
      */
     hasBorder: boolean;
     /**
-     * The label of the selected color ({@link module:ui/colorgrid/colorgrid~ColorDefinition#label `color.label`})
+     * The label of the selected color ({@link module:ui/colorgrid/colorgridview~ColorDefinition#label `color.label`})
      */
     label: string;
 }

package/src/colorgrid/colorgridview.js

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 /**
- * @module ui/colorgrid/colorgrid
+ * @module ui/colorgrid/colorgridview
  */
 import View from '../view';
 import ColorTileView from './colortileview';
@@ -11,23 +11,23 @@ import addKeyboardHandlingForGrid from '../bindings/addkeyboardhandlingforgrid';
 import { FocusTracker, KeystrokeHandler } from '@ckeditor/ckeditor5-utils';
 import '../../theme/components/colorgrid/colorgrid.css';
 /**
- * A grid of {@link module:ui/colorgrid/colortile~ColorTileView color tiles}.
+ * A grid of {@link module:ui/colorgrid/colortileview~ColorTileView color tiles}.
  */
 export default class ColorGridView extends View {
     /**
-     * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortile~ColorTileView tiles}.
+     * Creates an instance of a color grid containing {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
      *
      * @fires execute
      * @param locale The localization services instance.
      * @param options Component configuration
      * @param options.colorDefinitions Array with definitions
-     * required to create the {@link module:ui/colorgrid/colortile~ColorTileView tiles}.
+     * required to create the {@link module:ui/colorgrid/colortileview~ColorTileView tiles}.
      * @param options.columns A number of columns to display the tiles.
      */
     constructor(locale, options) {
         super(locale);
-        const colorDefinitions = options?.colorDefinitions ?? [];
-        this.columns = options?.columns ?? 5;
+        const colorDefinitions = options && options.colorDefinitions ? options.colorDefinitions : [];
+        this.columns = options && options.columns ? options.columns : 5;
         const viewStyleAttribute = {
             gridTemplateColumns: `repeat( ${this.columns}, 1fr)`
         };

package/src/colorgrid/colortileview.d.ts

@@ -3,12 +3,12 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 /**
- * @module ui/colorgrid/colortile
+ * @module ui/colorgrid/colortileview
  */
 import ButtonView from '../button/buttonview';
 import type { Locale } from '@ckeditor/ckeditor5-utils';
 /**
- * This class represents a single color tile in the {@link module:ui/colorgrid/colorgrid~ColorGridView}.
+ * This class represents a single color tile in the {@link module:ui/colorgrid/colorgridview~ColorGridView}.
  */
 export default class ColorTileView extends ButtonView {
     /**

package/src/colorgrid/colortileview.js

@@ -3,12 +3,12 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 /**
- * @module ui/colorgrid/colortile
+ * @module ui/colorgrid/colortileview
  */
 import ButtonView from '../button/buttonview';
 import checkIcon from '../../theme/icons/color-tile-check.svg';
 /**
- * This class represents a single color tile in the {@link module:ui/colorgrid/colorgrid~ColorGridView}.
+ * This class represents a single color tile in the {@link module:ui/colorgrid/colorgridview~ColorGridView}.
  */
 export default class ColorTileView extends ButtonView {
     constructor(locale) {

package/src/colorgrid/utils.d.ts

@@ -41,7 +41,7 @@ export declare function normalizeColorOptions(options: Array<ColorOption>): Arra
 /**
  * Creates a normalized color definition from the user-defined configuration.
  * The "normalization" means it will create full
- * {@link module:ui/colorgrid/colorgrid~ColorDefinition `ColorDefinition-like`}
+ * {@link module:ui/colorgrid/colorgridview~ColorDefinition `ColorDefinition-like`}
  * object for string values, and add a `view` property, for each definition.
  */
 export declare function normalizeSingleColorDefinition(color: ColorOption): NormalizedColorOption;

package/src/colorgrid/utils.js

@@ -51,7 +51,7 @@ export function normalizeColorOptions(options) {
 /**
  * Creates a normalized color definition from the user-defined configuration.
  * The "normalization" means it will create full
- * {@link module:ui/colorgrid/colorgrid~ColorDefinition `ColorDefinition-like`}
+ * {@link module:ui/colorgrid/colorgridview~ColorDefinition `ColorDefinition-like`}
  * object for string values, and add a `view` property, for each definition.
  */
 export function normalizeSingleColorDefinition(color) {

package/src/componentfactory.js

@@ -78,7 +78,7 @@ export default class ComponentFactory {
             /**
              * The required component is not registered in the component factory. Please make sure
              * the provided name is correct and the component has been correctly
-             * {@link #add added} to the factory.
+             * {@link module:ui/componentfactory~ComponentFactory#add added} to the factory.
              *
              * @error componentfactory-item-missing
              * @param name The name of the missing component.

package/src/dropdown/button/dropdownbutton.d.ts

@@ -15,9 +15,9 @@ export default interface DropdownButton extends Button {
 }
 /**
  * Fired when the dropdown should be opened.
- * It will not be fired when the button {@link #isEnabled is disabled}.
+ * It will not be fired when the button {@link module:ui/dropdown/button/dropdownbutton~DropdownButton#isEnabled is disabled}.
  *
- * @eventName open
+ * @eventName ~DropdownButton#open
  */
 export type DropdownButtonOpenEvent = {
     name: 'open';

package/src/dropdown/button/splitbuttonview.d.ts

@@ -129,7 +129,7 @@ export default class SplitButtonView extends View<HTMLDivElement> implements Dro
      */
     destroy(): void;
     /**
-     * Focuses the {@link #actionView#element} of the action part of split button.
+     * Focuses the {@link module:ui/button/buttonview~ButtonView#element} of the action part of split button.
      */
     focus(): void;
     /**

package/src/dropdown/button/splitbuttonview.js

@@ -105,7 +105,7 @@ export default class SplitButtonView extends View {
         this.keystrokes.destroy();
     }
     /**
-     * Focuses the {@link #actionView#element} of the action part of split button.
+     * Focuses the {@link module:ui/button/buttonview~ButtonView#element} of the action part of split button.
      */
     focus() {
         this.actionView.focus();

package/src/dropdown/dropdownview.d.ts

@@ -298,16 +298,16 @@ export default class DropdownView extends View<HTMLDivElement> {
 /**
  * Fired when the toolbar button or list item is executed.
  *
- * For {@link #listView} It fires when a child of some {@link module:ui/list/listitemview~ListItemView}
+ * For {@link ~DropdownView#listView} It fires when a child of some {@link module:ui/list/listitemview~ListItemView}
  * fired `execute`.
  *
- * For {@link #toolbarView} It fires when one of the buttons has been
+ * For {@link ~DropdownView#toolbarView} It fires when one of the buttons has been
  * {@link module:ui/button/buttonview~ButtonView#event:execute executed}.
  *
  * **Note**: Only supported when dropdown has list view added using {@link module:ui/dropdown/utils~addListToDropdown}
  * or {@link module:ui/dropdown/utils~addToolbarToDropdown}.
  *
- * @eventName execute
+ * @eventName ~DropdownView#execute
  */
 export type DropdownViewEvent = {
     name: 'execute';

package/src/editableui/editableuiview.d.ts

@@ -51,7 +51,8 @@ export default class EditableUIView extends View {
     constructor(locale: Locale, editingView: EditingView, editableElement?: HTMLElement);
     /**
      * Renders the view by either applying the {@link #template} to the existing
-     * {@link #_editableElement} or assigning {@link #element} as {@link #_editableElement}.
+     * {@link module:ui/editableui/editableuiview~EditableUIView#_editableElement} or assigning {@link #element}
+     * as {@link module:ui/editableui/editableuiview~EditableUIView#_editableElement}.
      */
     render(): void;
     /**

package/src/editableui/editableuiview.js

@@ -44,7 +44,8 @@ export default class EditableUIView extends View {
     }
     /**
      * Renders the view by either applying the {@link #template} to the existing
-     * {@link #_editableElement} or assigning {@link #element} as {@link #_editableElement}.
+     * {@link module:ui/editableui/editableuiview~EditableUIView#_editableElement} or assigning {@link #element}
+     * as {@link module:ui/editableui/editableuiview~EditableUIView#_editableElement}.
      */
     render() {
         super.render();

package/src/editorui/editorui.d.ts

@@ -3,7 +3,7 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 /**
- * @module core/editor/editorui
+ * @module ui/editorui/editorui
  */
 import ComponentFactory from '../componentfactory';
 import TooltipManager from '../tooltipmanager';
@@ -11,7 +11,6 @@ import type EditorUIView from './editoruiview';
 import type ToolbarView from '../toolbar/toolbarview';
 import { FocusTracker } from '@ckeditor/ckeditor5-utils';
 import type { Editor } from '@ckeditor/ckeditor5-core';
-import '../uiconfig';
 declare const EditorUI_base: {
     new (): import("@ckeditor/ckeditor5-utils").Observable;
     prototype: import("@ckeditor/ckeditor5-utils").Observable;
@@ -110,7 +109,7 @@ export default abstract class EditorUI extends EditorUI_base {
      */
     get element(): HTMLElement | null;
     /**
-     * Fires the {@link module:core/editor/editorui~EditorUI#event:update `update`} event.
+     * Fires the {@link module:ui/editorui/editorui~EditorUI#event:update `update`} event.
      *
      * This method should be called when the editor UI (e.g. positions of its balloons) needs to be updated due to
      * some environmental change which CKEditor 5 is not aware of (e.g. resize of a container in which it is used).
@@ -181,7 +180,7 @@ export default abstract class EditorUI extends EditorUI_base {
      *
      * Focusable toolbars candidates are either:
      * * already visible,
-     * * have `beforeFocus()` set in their {@link module:core/editor/editorui~FocusableToolbarDefinition definition} that suggests that
+     * * have `beforeFocus()` set in their {@link module:ui/editorui/editorui~FocusableToolbarDefinition definition} that suggests that
      * they might show up when called. Keep in mind that determining whether a toolbar will show up (and become focusable) is impossible
      * at this stage because it depends on its implementation, that in turn depends on the editing context (selection).
      *
@@ -207,7 +206,7 @@ export default abstract class EditorUI extends EditorUI_base {
  *
  * Fired before {@link module:engine/controller/datacontroller~DataController#event:ready}.
  *
- * @eventName ready
+ * @eventName ~EditorUI#ready
  */
 export type EditorUIReadyEvent = {
     name: 'ready';
@@ -217,16 +216,16 @@ export type EditorUIReadyEvent = {
  * Fired whenever the UI (all related components) should be refreshed.
  *
  * **Note:**: The event is fired after each {@link module:engine/view/document~Document#event:layoutChanged}.
- * It can also be fired manually via the {@link module:core/editor/editorui~EditorUI#update} method.
+ * It can also be fired manually via the {@link module:ui/editorui/editorui~EditorUI#update} method.
  *
- * @eventName update
+ * @eventName ~EditorUI#update
  */
 export type EditorUIUpdateEvent = {
     name: 'update';
     args: [];
 };
 /**
- * A definition of a focusable toolbar. Used by {@link module:core/editor/editorui~EditorUI#addToolbar}.
+ * A definition of a focusable toolbar. Used by {@link module:ui/editorui/editorui~EditorUI#addToolbar}.
  */
 export interface FocusableToolbarDefinition {
     /**
@@ -257,7 +256,7 @@ export interface FocusableToolbarOptions {
     beforeFocus?: () => void;
     /**
      * Specify a callback executed after the toolbar instance DOM element loses focus upon
-     * <kbd>Esc</kbd> keystroke but before the focus goes back to the {@link #setEditableElement editable element}.
+     * <kbd>Esc</kbd> keystroke but before the focus goes back to the {@link ~EditorUI#setEditableElement editable element}.
      */
     afterBlur?: () => void;
 }

package/src/editorui/editorui.js

@@ -3,13 +3,12 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 /**
- * @module core/editor/editorui
+ * @module ui/editorui/editorui
  */
 /* globals console */
 import ComponentFactory from '../componentfactory';
 import TooltipManager from '../tooltipmanager';
 import { ObservableMixin, isVisible, FocusTracker } from '@ckeditor/ckeditor5-utils';
-import '../uiconfig';
 /**
  * A class providing the minimal interface that is required to successfully bootstrap any editor UI.
  */
@@ -64,7 +63,7 @@ export default class EditorUI extends ObservableMixin() {
         return null;
     }
     /**
-     * Fires the {@link module:core/editor/editorui~EditorUI#event:update `update`} event.
+     * Fires the {@link module:ui/editorui/editorui~EditorUI#event:update `update`} event.
      *
      * This method should be called when the editor UI (e.g. positions of its balloons) needs to be updated due to
      * some environmental change which CKEditor 5 is not aware of (e.g. resize of a container in which it is used).
@@ -165,9 +164,10 @@ export default class EditorUI extends ObservableMixin() {
      */
     get _editableElements() {
         /**
-         * The {@link module:core/editor/editorui~EditorUI#_editableElements `EditorUI#_editableElements`} property has been
-         * deprecated and will be removed in the near future. Please use {@link #setEditableElement `setEditableElement()`} and
-         * {@link #getEditableElement `getEditableElement()`} methods instead.
+         * The {@link module:ui/editorui/editorui~EditorUI#_editableElements `EditorUI#_editableElements`} property has been
+         * deprecated and will be removed in the near future. Please use
+         * {@link module:ui/editorui/editorui~EditorUI#setEditableElement `setEditableElement()`} and
+         * {@link module:ui/editorui/editorui~EditorUI#getEditableElement `getEditableElement()`} methods instead.
          *
          * @error editor-ui-deprecated-editable-elements
          * @param editorUI Editor UI instance the deprecated property belongs to.
@@ -295,7 +295,7 @@ export default class EditorUI extends ObservableMixin() {
      *
      * Focusable toolbars candidates are either:
      * * already visible,
-     * * have `beforeFocus()` set in their {@link module:core/editor/editorui~FocusableToolbarDefinition definition} that suggests that
+     * * have `beforeFocus()` set in their {@link module:ui/editorui/editorui~FocusableToolbarDefinition definition} that suggests that
      * they might show up when called. Keep in mind that determining whether a toolbar will show up (and become focusable) is impossible
      * at this stage because it depends on its implementation, that in turn depends on the editing context (selection).
      *

package/src/iframe/iframeview.d.ts

@@ -42,7 +42,7 @@ export default class IframeView extends View<HTMLIFrameElement> {
 /**
  * Fired when the DOM iframe's `contentDocument` finished loading.
  *
- * @eventName loaded
+ * @eventName ~IframeView#loaded
  */
 export type IframeViewLoadedEvent = {
     name: 'loaded';

package/src/index.d.ts

@@ -48,7 +48,8 @@ export { default as Template, type TemplateDefinition } from './template';
 export { default as ToolbarView } from './toolbar/toolbarview';
 export { default as ToolbarSeparatorView } from './toolbar/toolbarseparatorview';
 export { default as normalizeToolbarConfig } from './toolbar/normalizetoolbarconfig';
-export { default as BalloonToolbar, type BaloonToolbarShowEvent } from './toolbar/balloon/balloontoolbar';
+export { default as BalloonToolbar, type BalloonToolbarShowEvent } from './toolbar/balloon/balloontoolbar';
 export { default as BlockToolbar } from './toolbar/block/blocktoolbar';
 export { default as View, type UIViewRenderEvent } from './view';
 export { default as ViewCollection } from './viewcollection';
+import './augmentation';

package/src/index.js

@@ -51,3 +51,4 @@ export { default as BalloonToolbar } from './toolbar/balloon/balloontoolbar';
 export { default as BlockToolbar } from './toolbar/block/blocktoolbar';
 export { default as View } from './view';
 export { default as ViewCollection } from './viewcollection';
+import './augmentation';

package/src/input/inputview.d.ts

@@ -113,7 +113,7 @@ export default class InputView extends View<HTMLInputElement> {
  * Fired when the user types in the input. Corresponds to the native
  * DOM `input` event.
  *
- * @eventName input
+ * @eventName ~InputView#input
  */
 export type InputViewInputEvent = {
     name: 'input';

package/src/notification/notification.d.ts

@@ -160,7 +160,7 @@ export type NotificationEventType = 'success' | 'info' | 'warning';
 /**
  * Fired when one of the `showSuccess()`, `showInfo()`, `showWarning()` methods is called.
  *
- * @eventName show
+ * @eventName ~Notification#show
  * @param data The notification data.
  */
 export type NotificationShowEvent = {
@@ -170,14 +170,14 @@ export type NotificationShowEvent = {
 /**
  * Fired when the `showSuccess()` method is called.
  *
- * @eventName show:success
+ * @eventName ~Notification#show:success
  * @param data The notification data.
  */
 export type NotificationShowSuccessEvent = NotificationShowTypeEvent<'success'>;
 /**
  * Fired when the `showInfo()` method is called.
  *
- * @eventName show:info
+ * @eventName ~Notification#show:info
  * @param data The notification data.
  */
 export type NotificationShowInfoEvent = NotificationShowTypeEvent<'info'>;
@@ -187,7 +187,7 @@ export type NotificationShowInfoEvent = NotificationShowTypeEvent<'info'>;
  * When this event is not handled or stopped by `event.stop()`, the `data.message` of this event will
  * be automatically displayed as a system alert.
  *
- * @eventName show:warning
+ * @eventName ~Notification#show:warning
  * @param data The notification data.
  */
 export type NotificationShowWarningEvent = NotificationShowTypeEvent<'warning'>;
@@ -209,8 +209,3 @@ export type NotificationShowEventData<NotificationType extends NotificationEvent
      */
     type: NotificationType;
 };
-declare module '@ckeditor/ckeditor5-core' {
-    interface PluginsMap {
-        [Notification.pluginName]: Notification;
-    }
-}

package/src/panel/balloon/contextualballoon.d.ts

@@ -7,8 +7,10 @@
  */
 import BalloonPanelView from './balloonpanelview';
 import View from '../../view';
+import ButtonView from '../../button/buttonview';
+import type ViewCollection from '../../viewcollection';
 import { Plugin, type Editor } from '@ckeditor/ckeditor5-core';
-import { type PositionOptions } from '@ckeditor/ckeditor5-utils';
+import { FocusTracker, type Locale, type PositionOptions } from '@ckeditor/ckeditor5-utils';
 import '../../../theme/components/panel/balloonrotator.css';
 import '../../../theme/components/panel/fakepanel.css';
 /**
@@ -233,8 +235,65 @@ export interface ViewConfiguration {
      */
     singleViewMode?: boolean;
 }
-declare module '@ckeditor/ckeditor5-core' {
-    interface PluginsMap {
-        [ContextualBalloon.pluginName]: ContextualBalloon;
-    }
+/**
+ * Rotator view is a helper class for the {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon ContextualBalloon}.
+ * It is used for displaying the last view from the current stack and providing navigation buttons for switching stacks.
+ * See the {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon ContextualBalloon} documentation to learn more.
+ */
+export declare class RotatorView extends View {
+    /**
+     * Used for checking if a view is focused or not.
+     */
+    readonly focusTracker: FocusTracker;
+    /**
+     * Navigation button for switching the stack to the previous one.
+     */
+    readonly buttonPrevView: ButtonView;
+    /**
+     * Navigation button for switching the stack to the next one.
+     */
+    readonly buttonNextView: ButtonView;
+    /**
+     * A collection of the child views that creates the rotator content.
+     */
+    readonly content: ViewCollection;
+    /**
+     * Defines whether navigation is visible or not.
+     *
+     * @observable
+     */
+    isNavigationVisible: boolean;
+    /**
+     * @observable
+     */
+    counter: string;
+    /**
+     * @inheritDoc
+     */
+    constructor(locale: Locale);
+    /**
+     * @inheritDoc
+     */
+    render(): void;
+    /**
+     * @inheritDoc
+     */
+    destroy(): void;
+    /**
+     * Shows a given view.
+     *
+     * @param view The view to show.
+     */
+    showView(view: View): void;
+    /**
+     * Hides the currently displayed view.
+     */
+    hideView(): void;
+    /**
+     * Creates a navigation button view.
+     *
+     * @param label The button label.
+     * @param icon The button icon.
+     */
+    private _createButtonView;
 }

package/src/panel/balloon/contextualballoon.js

@@ -396,7 +396,7 @@ export default class ContextualBalloon extends Plugin {
  * It is used for displaying the last view from the current stack and providing navigation buttons for switching stacks.
  * See the {@link module:ui/panel/balloon/contextualballoon~ContextualBalloon ContextualBalloon} documentation to learn more.
  */
-class RotatorView extends View {
+export class RotatorView extends View {
     /**
      * @inheritDoc
      */

package/src/panel/sticky/stickypanelview.d.ts

@@ -61,7 +61,7 @@ export default class StickyPanelView extends View {
      * either using `position: fixed` or `position: sticky`, which would cover the
      * sticky panel or vice–versa (depending on the `z-index` hierarchy).
      *
-     * Bound to {@link module:core/editor/editorui~EditorUI#viewportOffset `EditorUI#viewportOffset`}.
+     * Bound to {@link module:ui/editorui/editorui~EditorUI#viewportOffset `EditorUI#viewportOffset`}.
      *
      * If {@link module:core/editor/editorconfig~EditorConfig#ui `EditorConfig#ui.viewportOffset.top`} is defined, then
      * it will override the default value.

package/src/template.d.ts

@@ -726,10 +726,10 @@ export type TemplateListenerSchema = ArrayOrItem<ListenerBinding>;
 declare const AttributeBindingSymbol: unique symbol;
 declare const ListenerBindingSymbol: unique symbol;
 export interface AttributeBinding {
-    [AttributeBindingSymbol]: 'AttributeBinding';
+    _opaqueAttributeBinding: typeof AttributeBindingSymbol;
 }
 export interface ListenerBinding {
-    [ListenerBindingSymbol]: 'ListenerBinding';
+    _opaqueListenerBinding: typeof ListenerBindingSymbol;
 }
 /**
  * The return value of {@link ~Template.bind `Template.bind()`}. It provides `to()` and `if()`
@@ -777,6 +777,7 @@ export interface BindChain<TObservable> {
      * Learn more about using `to()` in the {@link module:ui/template~TemplateValueSchema} and
      * {@link module:ui/template~TemplateListenerSchema}.
      *
+     * @label ATTRIBUTE
      * @param attribute An attribute name of {@link module:utils/observablemixin~Observable}.
      */
     to<TAttribute extends keyof TObservable & string>(attribute: TAttribute): AttributeBinding & ListenerBinding;
@@ -821,6 +822,7 @@ export interface BindChain<TObservable> {
      * Learn more about using `to()` in the {@link module:ui/template~TemplateValueSchema} and
      * {@link module:ui/template~TemplateListenerSchema}.
      *
+     * @label ATTRIBUTE_CALLBACK
      * @param attribute An attribute name of {@link module:utils/observablemixin~Observable}.
      * @param callback Allows for processing of the value. Accepts `Node` and `value` as arguments.
      */
@@ -866,6 +868,7 @@ export interface BindChain<TObservable> {
      * Learn more about using `to()` in the {@link module:ui/template~TemplateValueSchema} and
      * {@link module:ui/template~TemplateListenerSchema}.
      *
+     * @label EVENT
      * @param eventNameOrCallback A DOM event name or an event callback.
      */
     to(eventNameOrCallback: string | ((domEvent: Event) => void)): ListenerBinding;
@@ -908,7 +911,7 @@ export interface BindChain<TObservable> {
 /**
  * The {@link module:ui/template~Template#_renderNode} configuration.
  */
-interface RenderData {
+export interface RenderData {
     /**
      * A node which is being rendered.
      */
@@ -920,14 +923,13 @@ interface RenderData {
      */
     intoFragment: boolean;
     /**
-     * Indicates whether the {@module:ui/template~RenderNodeOptions#node} has
-     * been provided by {@module:ui/template~Template#apply}.
+     * Indicates whether the {@link #node} has been provided by {@link module:ui/template~Template#apply}.
      */
     isApplying: boolean;
     /**
-     * An object storing the data that helps {@module:ui/template~Template#revert}
+     * An object storing the data that helps {@link module:ui/template~Template#revert}
      * bringing back an element to its initial state, i.e. before
-     * {@module:ui/template~Template#apply} was called.
+     * {@link module:ui/template~Template#apply} was called.
      */
     revertData?: RevertData;
 }

package/src/template.js

@@ -309,7 +309,7 @@ export default class Template extends EmitterMixin() {
             /**
              * Extending a template after rendering may not work as expected. To make sure
              * the {@link module:ui/template~Template.extend extending} works for an element,
-             * make sure it happens before {@link #render} is called.
+             * make sure it happens before {@link module:ui/template~Template#render} is called.
              *
              * @error template-extend-render
              */

package/src/toolbar/balloon/balloontoolbar.d.ts

@@ -5,7 +5,6 @@
 import ToolbarView from '../toolbarview';
 import { Plugin, type Editor, type PluginDependencies } from '@ckeditor/ckeditor5-core';
 import { FocusTracker } from '@ckeditor/ckeditor5-utils';
-import '../../uiconfig';
 /**
  * The contextual toolbar.
  *
@@ -17,7 +16,7 @@ export default class BalloonToolbar extends Plugin {
      */
     readonly toolbarView: ToolbarView;
     /**
-     * Tracks the focus of the {@link module:core/editor/editorui~EditorUI#getEditableElement editable element}
+     * Tracks the focus of the {@link module:ui/editorui/editorui~EditorUI#getEditableElement editable element}
      * and the {@link #toolbarView}. When both are blurred then the toolbar should hide.
      */
     readonly focusTracker: FocusTracker;
@@ -111,14 +110,9 @@ export default class BalloonToolbar extends Plugin {
 /**
  * This event is fired just before the toolbar shows up. Stopping this event will prevent this.
  *
- * @eventName show
+ * @eventName ~BalloonToolbar#show
  */
-export type BaloonToolbarShowEvent = {
+export type BalloonToolbarShowEvent = {
     name: 'show';
     args: [];
 };
-declare module '@ckeditor/ckeditor5-core' {
-    interface PluginsMap {
-        [BalloonToolbar.pluginName]: BalloonToolbar;
-    }
-}

package/src/toolbar/balloon/balloontoolbar.js

@@ -12,7 +12,6 @@ import normalizeToolbarConfig from '../normalizetoolbarconfig';
 import { Plugin } from '@ckeditor/ckeditor5-core';
 import { FocusTracker, Rect, ResizeObserver, env, global, toUnit } from '@ckeditor/ckeditor5-utils';
 import { debounce } from 'lodash-es';
-import '../../uiconfig';
 const toPx = toUnit('px');
 /**
  * The contextual toolbar.

package/src/toolbar/block/blocktoolbar.d.ts

@@ -9,7 +9,6 @@ import { Plugin, type Editor } from '@ckeditor/ckeditor5-core';
 import BlockButtonView from './blockbuttonview';
 import BalloonPanelView from '../../panel/balloon/balloonpanelview';
 import ToolbarView from '../toolbarview';
-import '../../uiconfig';
 /**
  * The block toolbar plugin.
  *
@@ -152,8 +151,3 @@ export default class BlockToolbar extends Plugin {
      */
     private _getToolbarMaxWidth;
 }
-declare module '@ckeditor/ckeditor5-core' {
-    interface PluginsMap {
-        [BlockToolbar.pluginName]: BlockToolbar;
-    }
-}

package/src/toolbar/block/blocktoolbar.js

@@ -13,7 +13,6 @@ import BalloonPanelView from '../../panel/balloon/balloonpanelview';
 import ToolbarView from '../toolbarview';
 import clickOutsideHandler from '../../bindings/clickoutsidehandler';
 import normalizeToolbarConfig from '../normalizetoolbarconfig';
-import '../../uiconfig';
 const toPx = toUnit('px');
 const { pilcrow } = icons;
 /**

package/src/toolbar/toolbarview.d.ts

@@ -187,7 +187,7 @@ export default class ToolbarView extends View implements DropdownPanelFocusable
     private _createNestedToolbarDropdown;
 }
 /**
- * Fired when some toolbar {@link #items} were grouped or ungrouped as a result of some change
+ * Fired when some toolbar {@link ~ToolbarView#items} were grouped or ungrouped as a result of some change
  * in the toolbar geometry.
  *
  * **Note**: This event is always fired **once** regardless of the number of items that were be
@@ -196,7 +196,7 @@ export default class ToolbarView extends View implements DropdownPanelFocusable
  * **Note**: This event is fired only if the items grouping functionality was enabled in
  * the first place (see {@link module:ui/toolbar/toolbarview~ToolbarOptions#shouldGroupWhenFull}).
  *
- * @eventName groupedItemsUpdate
+ * @eventName ~ToolbarView#groupedItemsUpdate
  */
 export type ToolbarViewGroupedItemsUpdateEvent = {
     name: 'groupedItemsUpdate';
@@ -238,4 +238,28 @@ export interface ToolbarOptions {
      */
     isFloating?: boolean;
 }
+/**
+ * A class interface defining the behavior of the {@link module:ui/toolbar/toolbarview~ToolbarView}.
+ *
+ * Toolbar behaviors extend its look and functionality and have an impact on the
+ * {@link module:ui/toolbar/toolbarview~ToolbarView#element} template or
+ * {@link module:ui/toolbar/toolbarview~ToolbarView#render rendering}. They can be enabled
+ * conditionally, e.g. depending on the configuration of the toolbar.
+ */
+export interface ToolbarBehavior {
+    /**
+     * A method called after the toolbar has been {@link module:ui/toolbar/toolbarview~ToolbarView#render rendered}.
+     * It can be used to, for example, customize the behavior of the toolbar when its
+     * {@link module:ui/toolbar/toolbarview~ToolbarView#element} is available.
+     *
+     * @param view An instance of the toolbar being rendered.
+     */
+    render(view: ToolbarView): void;
+    /**
+     * A method called after the toolbar has been {@link module:ui/toolbar/toolbarview~ToolbarView#destroy destroyed}.
+     * It allows cleaning up after the toolbar behavior, for instance, this is the right place to detach
+     * event listeners, free up references, etc.
+     */
+    destroy(): void;
+}
 export {};

package/src/tooltipmanager.d.ts

@@ -66,7 +66,7 @@ declare const TooltipManager_base: {
  * ```
  *
  * **Note**: This class is a singleton. All editor instances re-use the same instance loaded by
- * {@link module:core/editor/editorui~EditorUI} of the first editor.
+ * {@link module:ui/editorui/editorui~EditorUI} of the first editor.
  */
 export default class TooltipManager extends TooltipManager_base {
     /**

package/src/tooltipmanager.js

@@ -63,7 +63,7 @@ const BALLOON_CLASS = 'ck-tooltip';
  * ```
  *
  * **Note**: This class is a singleton. All editor instances re-use the same instance loaded by
- * {@link module:core/editor/editorui~EditorUI} of the first editor.
+ * {@link module:ui/editorui/editorui~EditorUI} of the first editor.
  */
 export default class TooltipManager extends DomEmitterMixin() {
     /**

package/src/view.d.ts

@@ -411,12 +411,12 @@ export default class View<TElement extends HTMLElement = HTMLElement> extends Vi
     destroy(): void;
 }
 /**
- * Event fired by the {@link #render} method. Actual rendering is executed as a listener to
+ * Event fired by the {@link module:ui/view~View#render} method. Actual rendering is executed as a listener to
  * this event with the default priority.
  *
- * See {@link module:utils/observablemixin~ObservableMixin#decorate} for more information and samples.
+ * See {@link module:utils/observablemixin~Observable#decorate} for more information and samples.
  *
- * @eventName render
+ * @eventName ~View#render
  */
 export type UIViewRenderEvent = DecoratedMethodEvent<View, 'render'>;
 export {};