1 | import ComponentFactory from '@ckeditor/ckeditor5-ui/src/componentfactory';
|
2 | import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
|
3 | import { Observable } from '@ckeditor/ckeditor5-utils/src/observablemixin';
|
4 | import Editor from './editor';
|
5 |
|
6 |
|
7 | export default interface EditorUI extends Observable {}
|
8 |
|
9 |
|
10 |
|
11 |
|
12 | export default class EditorUI implements Observable {
|
13 | |
14 |
|
15 |
|
16 | constructor(editor: Editor);
|
17 |
|
18 | /**
|
19 | * The editor that the UI belongs to.
|
20 | */
|
21 | readonly editor: Editor;
|
22 |
|
23 | /**
|
24 | * An instance of the {@link module:ui/componentfactory~ComponentFactory}, a registry used by plugins
|
25 | * to register factories of specific UI components.
|
26 | */
|
27 | readonly componentFactory: ComponentFactory;
|
28 |
|
29 | /**
|
30 | * Stores the information about the editor UI focus and propagates it so various plugins and components
|
31 | * are unified as a focus group.
|
32 | */
|
33 | readonly focusTracker: FocusTracker;
|
34 |
|
35 | /**
|
36 | * Stores viewport offsets from every direction.
|
37 | *
|
38 | * Viewport offset can be used to constrain balloons or other UI elements into an element smaller than the viewport.
|
39 | * This can be useful if there are any other absolutely positioned elements that may interfere with editor UI.
|
40 | *
|
41 | * Example `editor.ui.viewportOffset` returns:
|
42 | *
|
43 | * ```js
|
44 | * {
|
45 | * top: 50,
|
46 | * right: 50,
|
47 | * bottom: 50,
|
48 | * left: 50
|
49 | * }
|
50 | * ```
|
51 | *
|
52 | * This property can be overriden after editor already being initialized:
|
53 | *
|
54 | * ```js
|
55 | * editor.ui.viewportOffset = {
|
56 | * top: 100,
|
57 | * right: 0,
|
58 | * bottom: 0,
|
59 | * left: 0
|
60 | * };
|
61 | * ```
|
62 | */
|
63 | get viewportOffset(): { top: number; right: number; bottom: number; left: number };
|
64 | protected set viewportOffset(value: { top: number; right: number; bottom: number; left: number });
|
65 |
|
66 | /**
|
67 | * The main (outermost) DOM element of the editor UI.
|
68 | *
|
69 | * For example, in {@link module:editor-classic/classiceditor~ClassicEditor} it is a `<div>` which
|
70 | * wraps the editable element and the toolbar. In {@link module:editor-inline/inlineeditor~InlineEditor}
|
71 | * it is the editable element itself (as there is no other wrapper). However, in
|
72 | * {@link module:editor-decoupled/decouplededitor~DecoupledEditor} it is set to `null` because this editor does not
|
73 | * come with a single "main" HTML element (its editable element and toolbar are separate).
|
74 | *
|
75 | * This property can be understood as a shorthand for retrieving the element that a specific editor integration
|
76 | * considers to be its main DOM element.
|
77 | */
|
78 | readonly element: HTMLElement | null;
|
79 |
|
80 | /**
|
81 | * Fires the {@link module:core/editor/editorui~EditorUI#event:update `update`} event.
|
82 | *
|
83 | * This method should be called when the editor UI (e.g. positions of its balloons) needs to be updated due to
|
84 | * some environmental change which CKEditor 5 is not aware of (e.g. resize of a container in which it is used).
|
85 | */
|
86 | update(): void;
|
87 |
|
88 | /**
|
89 | * Destroys the UI.
|
90 | */
|
91 | destroy(): void;
|
92 |
|
93 | /**
|
94 | * Store the native DOM editable element used by the editor under
|
95 | * a unique name.
|
96 | */
|
97 | setEditableElement(rootName: string, domElement: HTMLElement): void;
|
98 |
|
99 | /**
|
100 | * Returns the editable editor element with the given name or null if editable does not exist.
|
101 | */
|
102 | getEditableElement(rootName?: string): HTMLElement | undefined;
|
103 |
|
104 | /**
|
105 | * Returns array of names of all editor editable elements.
|
106 | */
|
107 | getEditableElementsNames(): Iterable<string>;
|
108 | }
|
109 |
|
\ | No newline at end of file |