@ckeditor/ckeditor5-ui 48.8.1-alpha.4 → 49.0.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (273) hide show
  1. package/LICENSE.md +1 -1
  2. package/dist/arialiveannouncer.d.ts +89 -90
  3. package/dist/augmentation.d.ts +86 -86
  4. package/dist/autocomplete/autocompleteview.d.ts +69 -70
  5. package/dist/badge/badge.d.ts +119 -121
  6. package/dist/bindings/addkeyboardhandlingforgrid.d.ts +22 -22
  7. package/dist/bindings/clickoutsidehandler.d.ts +24 -26
  8. package/dist/bindings/csstransitiondisablermixin.d.ts +47 -36
  9. package/dist/bindings/draggableviewmixin.d.ts +45 -37
  10. package/dist/bindings/preventdefault.d.ts +30 -30
  11. package/dist/bindings/submithandler.d.ts +49 -49
  12. package/dist/button/button.d.ts +167 -167
  13. package/dist/button/buttonlabel.d.ts +28 -28
  14. package/dist/button/buttonlabelview.d.ts +26 -26
  15. package/dist/button/buttonview.d.ts +191 -192
  16. package/dist/button/filedialogbuttonview.d.ts +107 -99
  17. package/dist/button/listitembuttonview.d.ts +72 -73
  18. package/dist/button/switchbuttonview.d.ts +39 -40
  19. package/dist/collapsible/collapsibleview.d.ts +62 -63
  20. package/dist/colorgrid/colorgridview.d.ts +116 -117
  21. package/dist/colorgrid/colors.d.ts +28 -0
  22. package/dist/colorgrid/colortileview.d.ts +21 -21
  23. package/dist/colorgrid/utils.d.ts +47 -35
  24. package/dist/colorpicker/colorpickerview.d.ts +154 -157
  25. package/dist/colorpicker/utils.d.ts +37 -37
  26. package/dist/colorselector/colorgridsfragmentview.d.ts +191 -191
  27. package/dist/colorselector/colorpickerfragmentview.d.ts +129 -129
  28. package/dist/colorselector/colorselectorview.d.ts +226 -229
  29. package/dist/colorselector/documentcolorcollection.d.ts +52 -59
  30. package/dist/componentfactory.d.ts +76 -76
  31. package/dist/dialog/dialog.d.ts +311 -288
  32. package/dist/dialog/dialogactionsview.d.ts +61 -62
  33. package/dist/dialog/dialogcontentview.d.ts +22 -22
  34. package/dist/dialog/dialogview.d.ts +254 -251
  35. package/dist/dropdown/button/dropdownbutton.d.ts +17 -17
  36. package/dist/dropdown/button/dropdownbuttonview.d.ts +41 -41
  37. package/dist/dropdown/button/splitbuttonview.d.ts +154 -155
  38. package/dist/dropdown/dropdownpanelfocusable.d.ts +16 -16
  39. package/dist/dropdown/dropdownpanelview.d.ts +56 -56
  40. package/dist/dropdown/dropdownview.d.ts +337 -326
  41. package/dist/dropdown/menu/dropdownmenubehaviors.d.ts +43 -43
  42. package/dist/dropdown/menu/dropdownmenubuttonview.d.ts +28 -29
  43. package/dist/dropdown/menu/dropdownmenulistitembuttonview.d.ts +11 -12
  44. package/dist/dropdown/menu/dropdownmenulistitemview.d.ts +16 -17
  45. package/dist/dropdown/menu/dropdownmenulistview.d.ts +19 -19
  46. package/dist/dropdown/menu/dropdownmenunestedmenupanelview.d.ts +27 -28
  47. package/dist/dropdown/menu/dropdownmenunestedmenuview.d.ts +125 -126
  48. package/dist/dropdown/menu/dropdownmenurootlistview.d.ts +132 -132
  49. package/dist/dropdown/menu/utils.d.ts +112 -112
  50. package/dist/dropdown/utils.d.ts +270 -272
  51. package/dist/editableui/editableuiview.d.ts +78 -67
  52. package/dist/editableui/inline/inlineeditableuiview.d.ts +38 -36
  53. package/dist/editorui/accessibilityhelp/accessibilityhelp.d.ts +49 -50
  54. package/dist/editorui/accessibilityhelp/accessibilityhelpcontentview.d.ts +30 -30
  55. package/dist/editorui/bodycollection.d.ts +167 -86
  56. package/dist/editorui/boxed/boxededitoruiview.d.ts +35 -35
  57. package/dist/editorui/editorui.d.ts +382 -351
  58. package/dist/editorui/editoruiview.d.ts +48 -53
  59. package/dist/editorui/evaluationbadge.d.ts +28 -28
  60. package/dist/editorui/poweredby.d.ts +25 -25
  61. package/dist/focuscycler.d.ts +265 -270
  62. package/dist/formheader/formheaderview.d.ts +52 -53
  63. package/dist/formrow/formrowview.d.ts +51 -52
  64. package/dist/highlightedtext/buttonlabelwithhighlightview.d.ts +25 -25
  65. package/dist/highlightedtext/highlightedtextview.d.ts +30 -34
  66. package/dist/highlightedtext/labelwithhighlightview.d.ts +21 -21
  67. package/dist/icon/iconview.d.ts +82 -83
  68. package/dist/iframe/iframeview.d.ts +42 -42
  69. package/dist/index-content.css +3 -0
  70. package/dist/index-content.css.map +1 -0
  71. package/dist/index-editor.css +3240 -2329
  72. package/dist/index-editor.css.map +1 -0
  73. package/dist/index.css +2939 -2032
  74. package/dist/index.css.map +1 -1
  75. package/dist/index.d.ts +144 -136
  76. package/dist/index.js +17821 -17732
  77. package/dist/index.js.map +1 -1
  78. package/dist/input/inputbase.d.ts +114 -114
  79. package/dist/input/inputview.d.ts +27 -28
  80. package/dist/inputnumber/inputnumberview.d.ts +44 -44
  81. package/dist/inputtext/inputtextview.d.ts +13 -13
  82. package/dist/label/labelview.d.ts +30 -31
  83. package/dist/labeledfield/labeledfieldview.d.ts +179 -180
  84. package/dist/labeledfield/utils.d.ts +112 -112
  85. package/dist/labeledinput/labeledinputview.d.ts +119 -120
  86. package/dist/legacyerrors.d.ts +0 -4
  87. package/dist/list/listitemgroupview.d.ts +54 -54
  88. package/dist/list/listitemview.d.ts +31 -31
  89. package/dist/list/listseparatorview.d.ts +13 -13
  90. package/dist/list/listview.d.ts +118 -119
  91. package/dist/menubar/menubarmenubuttonview.d.ts +27 -28
  92. package/dist/menubar/menubarmenulistitembuttonview.d.ts +15 -16
  93. package/dist/menubar/menubarmenulistitemfiledialogbuttonview.d.ts +17 -18
  94. package/dist/menubar/menubarmenulistitemview.d.ts +19 -20
  95. package/dist/menubar/menubarmenulistview.d.ts +24 -24
  96. package/dist/menubar/menubarmenupanelview.d.ts +46 -47
  97. package/dist/menubar/menubarmenuview.d.ts +112 -113
  98. package/dist/menubar/menubarview.d.ts +144 -145
  99. package/dist/menubar/utils.d.ts +455 -455
  100. package/dist/model.d.ts +19 -18
  101. package/dist/notification/notification.d.ts +200 -200
  102. package/dist/overlayhost.d.ts +210 -0
  103. package/dist/panel/balloon/balloonpanelview.d.ts +700 -692
  104. package/dist/panel/balloon/contextualballoon.d.ts +296 -298
  105. package/dist/panel/sticky/stickypanelview.d.ts +162 -151
  106. package/dist/search/filteredview.d.ts +23 -23
  107. package/dist/search/filtergroupanditemnames.d.ts +11 -11
  108. package/dist/search/searchinfoview.d.ts +39 -39
  109. package/dist/search/searchresultsview.d.ts +49 -49
  110. package/dist/search/text/searchtextqueryview.d.ts +63 -63
  111. package/dist/search/text/searchtextview.d.ts +202 -203
  112. package/dist/spinner/spinnerview.d.ts +19 -20
  113. package/dist/tabs/tabbuttonview.d.ts +53 -0
  114. package/dist/tabs/tabpanelview.d.ts +45 -0
  115. package/dist/template.d.ts +897 -902
  116. package/dist/textarea/textareaview.d.ts +100 -96
  117. package/dist/toolbar/balloon/balloontoolbar.d.ts +122 -122
  118. package/dist/toolbar/block/blockbuttonview.d.ts +29 -30
  119. package/dist/toolbar/block/blocktoolbar.d.ts +166 -166
  120. package/dist/toolbar/normalizetoolbarconfig.d.ts +35 -35
  121. package/dist/toolbar/toolbarlinebreakview.d.ts +13 -13
  122. package/dist/toolbar/toolbarseparatorview.d.ts +13 -13
  123. package/dist/toolbar/toolbarview.d.ts +270 -271
  124. package/dist/tooltipmanager.d.ts +317 -193
  125. package/dist/translations/af.js +1 -1
  126. package/dist/translations/af.umd.js +5 -3
  127. package/dist/translations/ar.js +1 -1
  128. package/dist/translations/ar.umd.js +5 -3
  129. package/dist/translations/ast.js +1 -1
  130. package/dist/translations/ast.umd.js +5 -3
  131. package/dist/translations/az.js +1 -1
  132. package/dist/translations/az.umd.js +5 -3
  133. package/dist/translations/be.js +1 -1
  134. package/dist/translations/be.umd.js +5 -3
  135. package/dist/translations/bg.js +1 -1
  136. package/dist/translations/bg.umd.js +5 -3
  137. package/dist/translations/bn.js +1 -1
  138. package/dist/translations/bn.umd.js +5 -3
  139. package/dist/translations/bs.js +1 -1
  140. package/dist/translations/bs.umd.js +5 -3
  141. package/dist/translations/ca.js +1 -1
  142. package/dist/translations/ca.umd.js +5 -3
  143. package/dist/translations/cs.js +1 -1
  144. package/dist/translations/cs.umd.js +5 -3
  145. package/dist/translations/da.js +1 -1
  146. package/dist/translations/da.umd.js +5 -3
  147. package/dist/translations/de-ch.js +1 -1
  148. package/dist/translations/de-ch.umd.js +5 -3
  149. package/dist/translations/de.js +1 -1
  150. package/dist/translations/de.umd.js +5 -3
  151. package/dist/translations/el.js +1 -1
  152. package/dist/translations/el.umd.js +5 -3
  153. package/dist/translations/en-au.js +1 -1
  154. package/dist/translations/en-au.umd.js +5 -3
  155. package/dist/translations/en-gb.js +1 -1
  156. package/dist/translations/en-gb.umd.js +5 -3
  157. package/dist/translations/en.js +1 -1
  158. package/dist/translations/en.umd.js +5 -3
  159. package/dist/translations/eo.js +1 -1
  160. package/dist/translations/eo.umd.js +5 -3
  161. package/dist/translations/es-co.js +1 -1
  162. package/dist/translations/es-co.umd.js +5 -3
  163. package/dist/translations/es.js +1 -1
  164. package/dist/translations/es.umd.js +5 -3
  165. package/dist/translations/et.js +1 -1
  166. package/dist/translations/et.umd.js +5 -3
  167. package/dist/translations/eu.js +1 -1
  168. package/dist/translations/eu.umd.js +5 -3
  169. package/dist/translations/fa.js +1 -1
  170. package/dist/translations/fa.umd.js +5 -3
  171. package/dist/translations/fi.js +1 -1
  172. package/dist/translations/fi.umd.js +5 -3
  173. package/dist/translations/fr.js +1 -1
  174. package/dist/translations/fr.umd.js +5 -3
  175. package/dist/translations/gl.js +1 -1
  176. package/dist/translations/gl.umd.js +5 -3
  177. package/dist/translations/gu.js +1 -1
  178. package/dist/translations/gu.umd.js +5 -3
  179. package/dist/translations/he.js +1 -1
  180. package/dist/translations/he.umd.js +5 -3
  181. package/dist/translations/hi.js +1 -1
  182. package/dist/translations/hi.umd.js +5 -3
  183. package/dist/translations/hr.js +1 -1
  184. package/dist/translations/hr.umd.js +5 -3
  185. package/dist/translations/hu.js +1 -1
  186. package/dist/translations/hu.umd.js +5 -3
  187. package/dist/translations/hy.js +1 -1
  188. package/dist/translations/hy.umd.js +5 -3
  189. package/dist/translations/id.js +1 -1
  190. package/dist/translations/id.umd.js +5 -3
  191. package/dist/translations/it.js +1 -1
  192. package/dist/translations/it.umd.js +5 -3
  193. package/dist/translations/ja.js +1 -1
  194. package/dist/translations/ja.umd.js +5 -3
  195. package/dist/translations/jv.js +1 -1
  196. package/dist/translations/jv.umd.js +5 -3
  197. package/dist/translations/kk.js +1 -1
  198. package/dist/translations/kk.umd.js +5 -3
  199. package/dist/translations/km.js +1 -1
  200. package/dist/translations/km.umd.js +5 -3
  201. package/dist/translations/kn.js +1 -1
  202. package/dist/translations/kn.umd.js +5 -3
  203. package/dist/translations/ko.js +1 -1
  204. package/dist/translations/ko.umd.js +5 -3
  205. package/dist/translations/ku.js +1 -1
  206. package/dist/translations/ku.umd.js +5 -3
  207. package/dist/translations/lt.js +1 -1
  208. package/dist/translations/lt.umd.js +5 -3
  209. package/dist/translations/lv.js +1 -1
  210. package/dist/translations/lv.umd.js +5 -3
  211. package/dist/translations/ms.js +1 -1
  212. package/dist/translations/ms.umd.js +5 -3
  213. package/dist/translations/nb.js +1 -1
  214. package/dist/translations/nb.umd.js +5 -3
  215. package/dist/translations/ne.js +1 -1
  216. package/dist/translations/ne.umd.js +5 -3
  217. package/dist/translations/nl.js +1 -1
  218. package/dist/translations/nl.umd.js +5 -3
  219. package/dist/translations/no.js +1 -1
  220. package/dist/translations/no.umd.js +5 -3
  221. package/dist/translations/oc.js +1 -1
  222. package/dist/translations/oc.umd.js +5 -3
  223. package/dist/translations/pl.js +1 -1
  224. package/dist/translations/pl.umd.js +5 -3
  225. package/dist/translations/pt-br.js +1 -1
  226. package/dist/translations/pt-br.umd.js +5 -3
  227. package/dist/translations/pt.js +1 -1
  228. package/dist/translations/pt.umd.js +5 -3
  229. package/dist/translations/ro.js +1 -1
  230. package/dist/translations/ro.umd.js +5 -3
  231. package/dist/translations/ru.js +1 -1
  232. package/dist/translations/ru.umd.js +5 -3
  233. package/dist/translations/si.js +1 -1
  234. package/dist/translations/si.umd.js +5 -3
  235. package/dist/translations/sk.js +1 -1
  236. package/dist/translations/sk.umd.js +5 -3
  237. package/dist/translations/sl.js +1 -1
  238. package/dist/translations/sl.umd.js +5 -3
  239. package/dist/translations/sq.js +1 -1
  240. package/dist/translations/sq.umd.js +5 -3
  241. package/dist/translations/sr-latn.js +1 -1
  242. package/dist/translations/sr-latn.umd.js +5 -3
  243. package/dist/translations/sr.js +1 -1
  244. package/dist/translations/sr.umd.js +5 -3
  245. package/dist/translations/sv.js +1 -1
  246. package/dist/translations/sv.umd.js +5 -3
  247. package/dist/translations/th.js +1 -1
  248. package/dist/translations/th.umd.js +5 -3
  249. package/dist/translations/ti.js +1 -1
  250. package/dist/translations/ti.umd.js +5 -3
  251. package/dist/translations/tk.js +1 -1
  252. package/dist/translations/tk.umd.js +5 -3
  253. package/dist/translations/tr.js +1 -1
  254. package/dist/translations/tr.umd.js +5 -3
  255. package/dist/translations/tt.js +1 -1
  256. package/dist/translations/tt.umd.js +5 -3
  257. package/dist/translations/ug.js +1 -1
  258. package/dist/translations/ug.umd.js +5 -3
  259. package/dist/translations/uk.js +1 -1
  260. package/dist/translations/uk.umd.js +5 -3
  261. package/dist/translations/ur.js +1 -1
  262. package/dist/translations/ur.umd.js +5 -3
  263. package/dist/translations/uz.js +1 -1
  264. package/dist/translations/uz.umd.js +5 -3
  265. package/dist/translations/vi.js +1 -1
  266. package/dist/translations/vi.umd.js +5 -3
  267. package/dist/translations/zh-cn.js +1 -1
  268. package/dist/translations/zh-cn.umd.js +5 -3
  269. package/dist/translations/zh.js +1 -1
  270. package/dist/translations/zh.umd.js +5 -3
  271. package/dist/view.d.ts +384 -388
  272. package/dist/viewcollection.d.ts +134 -134
  273. package/package.json +8 -7
@@ -1,369 +1,400 @@
1
1
  /**
2
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
- */
2
+ * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
+ */
5
5
  /**
6
- * @module ui/editorui/editorui
7
- */
8
- import { ComponentFactory } from '../componentfactory.js';
9
- import { TooltipManager } from '../tooltipmanager.js';
10
- import { PoweredBy } from './poweredby.js';
11
- import { EvaluationBadge } from './evaluationbadge.js';
12
- import { AriaLiveAnnouncer } from '../arialiveannouncer.js';
13
- import { type EditorUIView } from './editoruiview.js';
14
- import { type ToolbarView } from '../toolbar/toolbarview.js';
15
- import { FocusTracker } from '@ckeditor/ckeditor5-utils';
16
- import type { Editor, ViewportOffsetConfig } from '@ckeditor/ckeditor5-core';
17
- import type { MenuBarView, MenuBarConfigAddedGroup, MenuBarConfigAddedItem, MenuBarConfigAddedMenu } from '../menubar/menubarview.js';
18
- declare const EditorUI_base: {
19
- new (): import("@ckeditor/ckeditor5-utils").Observable;
20
- prototype: import("@ckeditor/ckeditor5-utils").Observable;
21
- };
6
+ * @module ui/editorui/editorui
7
+ */
8
+ import { ComponentFactory } from "../componentfactory.js";
9
+ import { TooltipManager } from "../tooltipmanager.js";
10
+ import { PoweredBy } from "./poweredby.js";
11
+ import { EvaluationBadge } from "./evaluationbadge.js";
12
+ import { AriaLiveAnnouncer } from "../arialiveannouncer.js";
13
+ import { type EditorUIView } from "./editoruiview.js";
14
+ import { type ToolbarView } from "../toolbar/toolbarview.js";
15
+ import { FocusTracker, ShadowRootRegistry, type ObservableMixinConstructor } from "@ckeditor/ckeditor5-utils";
16
+ import type { Editor, ViewportOffsetConfig } from "@ckeditor/ckeditor5-core";
17
+ import type { MenuBarView, MenuBarConfigAddedGroup, MenuBarConfigAddedItem, MenuBarConfigAddedMenu } from "../menubar/menubarview.js";
18
+ declare const EditorUIBase: ObservableMixinConstructor;
22
19
  /**
23
- * A class providing the minimal interface that is required to successfully bootstrap any editor UI.
24
- */
25
- export declare abstract class EditorUI extends /* #__PURE__ */ EditorUI_base {
26
- /**
27
- * The editor that the UI belongs to.
28
- */
29
- readonly editor: Editor;
30
- /**
31
- * An instance of the {@link module:ui/componentfactory~ComponentFactory}, a registry used by plugins
32
- * to register factories of specific UI components.
33
- */
34
- readonly componentFactory: ComponentFactory;
35
- /**
36
- * Stores the information about the editor UI focus and propagates it so various plugins and components
37
- * are unified as a focus group.
38
- */
39
- readonly focusTracker: FocusTracker;
40
- /**
41
- * Manages the tooltips displayed on mouseover and focus across the UI.
42
- */
43
- readonly tooltipManager: TooltipManager;
44
- /**
45
- * A helper that enables the "powered by" feature in the editor and renders a link to the project's webpage.
46
- */
47
- readonly poweredBy: PoweredBy;
48
- /**
49
- * A helper that enables the "evaluation badge" feature in the editor.
50
- */
51
- readonly evaluationBadge: EvaluationBadge;
52
- /**
53
- * A helper that manages the content of an `aria-live` regions used by editor features to announce status changes
54
- * to screen readers.
55
- */
56
- readonly ariaLiveAnnouncer: AriaLiveAnnouncer;
57
- /**
58
- * Indicates the UI is ready. Set `true` after {@link #event:ready} event is fired.
59
- *
60
- * @readonly
61
- * @default false
62
- */
63
- isReady: boolean;
64
- abstract get view(): EditorUIView;
65
- /**
66
- * Stores viewport offsets from every direction.
67
- *
68
- * Viewport offset can be used to constrain balloons or other UI elements into an element smaller than the viewport.
69
- * This can be useful if there are any other absolutely positioned elements that may interfere with editor UI.
70
- *
71
- * Example `editor.ui.viewportOffset` returns:
72
- *
73
- * ```js
74
- * {
75
- * top: 50,
76
- * right: 50,
77
- * bottom: 50,
78
- * left: 50,
79
- * visualTop: 50
80
- * }
81
- * ```
82
- *
83
- * This property can be overriden after editor already being initialized:
84
- *
85
- * ```js
86
- * editor.ui.viewportOffset = {
87
- * top: 100,
88
- * right: 0,
89
- * bottom: 0,
90
- * left: 0
91
- * };
92
- * ```
93
- *
94
- * @observable
95
- */
96
- viewportOffset: ViewportOffset;
97
- /**
98
- * Stores all editable elements used by the editor instance.
99
- */
100
- private _editableElementsMap;
101
- /**
102
- * All available & focusable toolbars.
103
- */
104
- private _focusableToolbarDefinitions;
105
- /**
106
- * All additional menu bar items, groups or menus that have their default location defined.
107
- */
108
- private _extraMenuBarElements;
109
- /**
110
- * The last focused element to which focus should return on `Esc` press.
111
- */
112
- private _lastFocusedForeignElement;
113
- /**
114
- * The DOM emitter instance used for visual viewport watching.
115
- */
116
- private _domEmitter?;
117
- /**
118
- * Creates an instance of the editor UI class.
119
- *
120
- * @param editor The editor instance.
121
- */
122
- constructor(editor: Editor);
123
- /**
124
- * The main (outermost) DOM element of the editor UI.
125
- *
126
- * For example, in {@link module:editor-classic/classiceditor~ClassicEditor} it is a `<div>` which
127
- * wraps the editable element and the toolbar. In {@link module:editor-inline/inlineeditor~InlineEditor}
128
- * it is the editable element itself (as there is no other wrapper). However, in
129
- * {@link module:editor-decoupled/decouplededitor~DecoupledEditor} it is set to `null` because this editor does not
130
- * come with a single "main" HTML element (its editable element and toolbar are separate).
131
- *
132
- * This property can be understood as a shorthand for retrieving the element that a specific editor integration
133
- * considers to be its main DOM element.
134
- */
135
- get element(): HTMLElement | null;
136
- /**
137
- * Fires the {@link module:ui/editorui/editorui~EditorUI#event:update `update`} event.
138
- *
139
- * This method should be called when the editor UI (e.g. positions of its balloons) needs to be updated due to
140
- * some environmental change which CKEditor 5 is not aware of (e.g. resize of a container in which it is used).
141
- */
142
- update(): void;
143
- /**
144
- * Destroys the UI.
145
- */
146
- destroy(): void;
147
- /**
148
- * Stores the native DOM editable element used by the editor under a unique name.
149
- *
150
- * Also, registers the element in the editor to maintain the accessibility of the UI. When the user is editing text in a focusable
151
- * editable area, they can use the <kbd>Alt</kbd> + <kbd>F10</kbd> keystroke to navigate over editor toolbars. See {@link #addToolbar}.
152
- *
153
- * @param rootName The unique name of the editable element.
154
- * @param domElement The native DOM editable element.
155
- */
156
- setEditableElement(rootName: string, domElement: HTMLElement): void;
157
- /**
158
- * Removes the editable from the editor UI. Removes all handlers added by {@link #setEditableElement}.
159
- *
160
- * @param rootName The name of the editable element to remove.
161
- */
162
- removeEditableElement(rootName: string): void;
163
- /**
164
- * Returns the editable editor element with the given name or null if editable does not exist.
165
- *
166
- * @param rootName The editable name.
167
- */
168
- getEditableElement(rootName?: string): HTMLElement | undefined;
169
- /**
170
- * Returns array of names of all editor editable elements.
171
- */
172
- getEditableElementsNames(): IterableIterator<string>;
173
- /**
174
- * Adds a toolbar to the editor UI. Used primarily to maintain the accessibility of the UI.
175
- *
176
- * Focusable toolbars can be accessed (focused) by users by pressing the <kbd>Alt</kbd> + <kbd>F10</kbd> keystroke.
177
- * Successive keystroke presses navigate over available toolbars.
178
- *
179
- * @param toolbarView A instance of the toolbar to be registered.
180
- */
181
- addToolbar(toolbarView: ToolbarView, options?: FocusableToolbarOptions): void;
182
- /**
183
- * Registers an extra menu bar element, which could be a single item, a group of items, or a menu containing groups.
184
- *
185
- * ```ts
186
- * // Register a new menu bar item.
187
- * editor.ui.extendMenuBar( {
188
- * item: 'menuBar:customFunctionButton',
189
- * position: 'after:menuBar:bold'
190
- * } );
191
- *
192
- * // Register a new menu bar group.
193
- * editor.ui.extendMenuBar( {
194
- * group: {
195
- * groupId: 'customGroup',
196
- * items: [
197
- * 'menuBar:customFunctionButton'
198
- * ]
199
- * },
200
- * position: 'start:help'
201
- * } );
202
- *
203
- * // Register a new menu bar menu.
204
- * editor.ui.extendMenuBar( {
205
- * menu: {
206
- * menuId: 'customMenu',
207
- * label: 'customMenu',
208
- * groups: [
209
- * {
210
- * groupId: 'customGroup',
211
- * items: [
212
- * 'menuBar:customFunctionButton'
213
- * ]
214
- * }
215
- * ]
216
- * },
217
- * position: 'after:help'
218
- * } );
219
- * ```
220
- */
221
- extendMenuBar(config: MenuBarConfigAddedItem | MenuBarConfigAddedGroup | MenuBarConfigAddedMenu): void;
222
- /**
223
- * Initializes menu bar.
224
- */
225
- initMenuBar(menuBarView: MenuBarView): void;
226
- /**
227
- * Returns viewport offsets object:
228
- *
229
- * ```js
230
- * {
231
- * top: Number,
232
- * right: Number,
233
- * bottom: Number,
234
- * left: Number
235
- * }
236
- * ```
237
- *
238
- * Only top property is currently supported.
239
- */
240
- private _readViewportOffsetFromConfig;
241
- /**
242
- * Starts listening for <kbd>Alt</kbd> + <kbd>F10</kbd> and <kbd>Esc</kbd> keystrokes in the context of focusable
243
- * {@link #setEditableElement editable elements} and {@link #addToolbar toolbars}
244
- * to allow users navigate across the UI.
245
- */
246
- private _initFocusTracking;
247
- /**
248
- * Saves last focused element that doen not belong to editing view to restore focus on `Esc`.
249
- */
250
- private _saveLastFocusedForeignElement;
251
- /**
252
- * Returns definitions of toolbars that could potentially be focused, sorted by their importance for the user.
253
- *
254
- * Focusable toolbars candidates are either:
255
- * * already visible,
256
- * * have `beforeFocus()` set in their {@link module:ui/editorui/editorui~FocusableToolbarDefinition definition} that suggests that
257
- * they might show up when called. Keep in mind that determining whether a toolbar will show up (and become focusable) is impossible
258
- * at this stage because it depends on its implementation, that in turn depends on the editing context (selection).
259
- *
260
- * **Note**: Contextual toolbars take precedence over regular toolbars.
261
- */
262
- private _getFocusableCandidateToolbarDefinitions;
263
- /**
264
- * Returns a definition of the toolbar that is currently visible and focused (one of its children has focus).
265
- *
266
- * `null` is returned when no toolbar is currently focused.
267
- */
268
- private _getCurrentFocusedToolbarDefinition;
269
- /**
270
- * Focuses a focusable toolbar candidate using its definition.
271
- *
272
- * @param candidateToolbarDefinition A definition of the toolbar to focus.
273
- * @returns `true` when the toolbar candidate was focused. `false` otherwise.
274
- */
275
- private _focusFocusableCandidateToolbar;
276
- /**
277
- * Provides an integration between {@link #viewportOffset} and {@link module:utils/dom/scroll~scrollViewportToShowTarget}.
278
- * It allows the UI-agnostic engine method to consider user-configured viewport offsets specific for the integration.
279
- *
280
- * @param evt The `scrollToTheSelection` event info.
281
- * @param data The payload carried by the `scrollToTheSelection` event.
282
- */
283
- private _handleScrollToTheSelection;
284
- /**
285
- * Ensures that the focus tracker is aware of all views' DOM elements in the body collection.
286
- */
287
- private _bindBodyCollectionWithFocusTracker;
288
- /**
289
- * Set initial viewport offset and setup visualTop augmentation.
290
- */
291
- private _initViewportOffset;
292
- /**
293
- * Listen to visual viewport changes and update the viewportOffset with the visualTop property
294
- * according to the visible part of it (visual viewport).
295
- */
296
- private _initVisualViewportSupport;
297
- /**
298
- * Calculate the viewport top offset according to the visible part of it (visual viewport).
299
- */
300
- private _getVisualViewportTopOffset;
20
+ * A class providing the minimal interface that is required to successfully bootstrap any editor UI.
21
+ */
22
+ export declare abstract class EditorUI extends EditorUIBase {
23
+ /**
24
+ * The editor that the UI belongs to.
25
+ */
26
+ readonly editor: Editor;
27
+ /**
28
+ * An instance of the {@link module:ui/componentfactory~ComponentFactory}, a registry used by plugins
29
+ * to register factories of specific UI components.
30
+ */
31
+ readonly componentFactory: ComponentFactory;
32
+ /**
33
+ * Stores the information about the editor UI focus and propagates it so various plugins and components
34
+ * are unified as a focus group.
35
+ */
36
+ readonly focusTracker: FocusTracker;
37
+ /**
38
+ * Manages the tooltips displayed on mouseover and focus across the UI.
39
+ */
40
+ readonly tooltipManager: TooltipManager;
41
+ /**
42
+ * A helper that enables the "powered by" feature in the editor and renders a link to the project's webpage.
43
+ */
44
+ readonly poweredBy: PoweredBy;
45
+ /**
46
+ * A helper that enables the "evaluation badge" feature in the editor.
47
+ */
48
+ readonly evaluationBadge: EvaluationBadge;
49
+ /**
50
+ * A helper that manages the content of an `aria-live` regions used by editor features to announce status changes
51
+ * to screen readers.
52
+ */
53
+ readonly ariaLiveAnnouncer: AriaLiveAnnouncer;
54
+ /**
55
+ * Indicates the UI is ready. Set `true` after {@link #event:ready} event is fired.
56
+ *
57
+ * @readonly
58
+ * @default false
59
+ */
60
+ isReady: boolean;
61
+ abstract get view(): EditorUIView;
62
+ /**
63
+ * Stores viewport offsets from every direction.
64
+ *
65
+ * Viewport offset can be used to constrain balloons or other UI elements into an element smaller than the viewport.
66
+ * This can be useful if there are any other absolutely positioned elements that may interfere with editor UI.
67
+ *
68
+ * Example `editor.ui.viewportOffset` returns:
69
+ *
70
+ * ```js
71
+ * {
72
+ * top: 50,
73
+ * right: 50,
74
+ * bottom: 50,
75
+ * left: 50,
76
+ * visualTop: 50
77
+ * }
78
+ * ```
79
+ *
80
+ * This property can be overriden after editor already being initialized:
81
+ *
82
+ * ```js
83
+ * editor.ui.viewportOffset = {
84
+ * top: 100,
85
+ * right: 0,
86
+ * bottom: 0,
87
+ * left: 0
88
+ * };
89
+ * ```
90
+ *
91
+ * @observable
92
+ */
93
+ viewportOffset: ViewportOffset;
94
+ /**
95
+ * Tracks the shadow roots hosting the DOM elements used by the editor UI (editables, toolbars, menu bar).
96
+ *
97
+ * Features that need the DOM events which do not cross a shadow boundary – `scroll`, `mouseenter`,
98
+ * `mouseleave` – attach them to every tracked root with
99
+ * {@link module:utils/dom/shadowrootregistry~listenToShadowRoots `listenToShadowRoots()`}. A feature that
100
+ * has a node in hand wants a shadow-aware helper instead, such as
101
+ * {@link module:utils/dom/getshadowroots~getShadowRoots `getShadowRoots()`}.
102
+ */
103
+ readonly shadowRootRegistry: ShadowRootRegistry;
104
+ /**
105
+ * Hosts the editor's floating UI: keeps the {@link module:ui/editorui/editoruiview~EditorUIView#body body
106
+ * collection} mounted in the target resolved by {@link #_getBodyCollectionMountTarget} and registers it
107
+ * with the shared tooltip manager. Created once the editor is {@link #isReady ready} – the view does not
108
+ * exist earlier.
109
+ */
110
+ private _overlayHost;
111
+ /**
112
+ * Stores all editable elements used by the editor instance.
113
+ */
114
+ private _editableElementsMap;
115
+ /**
116
+ * All available & focusable toolbars.
117
+ */
118
+ private _focusableToolbarDefinitions;
119
+ /**
120
+ * All additional menu bar items, groups or menus that have their default location defined.
121
+ */
122
+ private _extraMenuBarElements;
123
+ /**
124
+ * The last focused element to which focus should return on `Esc` press.
125
+ */
126
+ private _lastFocusedForeignElement;
127
+ /**
128
+ * The DOM emitter instance used for visual viewport watching.
129
+ */
130
+ private _domEmitter?;
131
+ /**
132
+ * Creates an instance of the editor UI class.
133
+ *
134
+ * @param editor The editor instance.
135
+ */
136
+ constructor(editor: Editor);
137
+ /**
138
+ * The main (outermost) DOM element of the editor UI.
139
+ *
140
+ * For example, in {@link module:editor-classic/classiceditor~ClassicEditor} it is a `<div>` which
141
+ * wraps the editable element and the toolbar. In {@link module:editor-inline/inlineeditor~InlineEditor}
142
+ * it is the editable element itself (as there is no other wrapper). However, in
143
+ * {@link module:editor-decoupled/decouplededitor~DecoupledEditor} it is set to `null` because this editor does not
144
+ * come with a single "main" HTML element (its editable element and toolbar are separate).
145
+ *
146
+ * This property can be understood as a shorthand for retrieving the element that a specific editor integration
147
+ * considers to be its main DOM element.
148
+ */
149
+ get element(): HTMLElement | null;
150
+ /**
151
+ * Fires the {@link module:ui/editorui/editorui~EditorUI#event:update `update`} event.
152
+ *
153
+ * This method should be called when the editor UI (e.g. positions of its balloons) needs to be updated due to
154
+ * some environmental change which CKEditor 5 is not aware of (e.g. resize of a container in which it is used).
155
+ */
156
+ update(): void;
157
+ /**
158
+ * Destroys the UI.
159
+ */
160
+ destroy(): void;
161
+ /**
162
+ * Stores the native DOM editable element used by the editor under a unique name.
163
+ *
164
+ * Also, registers the element in the editor to maintain the accessibility of the UI. When the user is editing text in a focusable
165
+ * editable area, they can use the <kbd>Alt</kbd> + <kbd>F10</kbd> keystroke to navigate over editor toolbars. See {@link #addToolbar}.
166
+ *
167
+ * @param rootName The unique name of the editable element.
168
+ * @param domElement The native DOM editable element.
169
+ */
170
+ setEditableElement(rootName: string, domElement: HTMLElement): void;
171
+ /**
172
+ * Removes the editable from the editor UI. Removes all handlers added by {@link #setEditableElement}.
173
+ *
174
+ * @param rootName The name of the editable element to remove.
175
+ */
176
+ removeEditableElement(rootName: string): void;
177
+ /**
178
+ * Returns the editable editor element with the given name or null if editable does not exist.
179
+ *
180
+ * @param rootName The editable name.
181
+ */
182
+ getEditableElement(rootName?: string): HTMLElement | undefined;
183
+ /**
184
+ * Returns array of names of all editor editable elements.
185
+ */
186
+ getEditableElementsNames(): IterableIterator<string>;
187
+ /**
188
+ * Adds a toolbar to the editor UI. Used primarily to maintain the accessibility of the UI.
189
+ *
190
+ * Focusable toolbars can be accessed (focused) by users by pressing the <kbd>Alt</kbd> + <kbd>F10</kbd> keystroke.
191
+ * Successive keystroke presses navigate over available toolbars.
192
+ *
193
+ * @param toolbarView A instance of the toolbar to be registered.
194
+ */
195
+ addToolbar(toolbarView: ToolbarView, options?: FocusableToolbarOptions): void;
196
+ /**
197
+ * Registers an extra menu bar element, which could be a single item, a group of items, or a menu containing groups.
198
+ *
199
+ * ```ts
200
+ * // Register a new menu bar item.
201
+ * editor.ui.extendMenuBar( {
202
+ * item: 'menuBar:customFunctionButton',
203
+ * position: 'after:menuBar:bold'
204
+ * } );
205
+ *
206
+ * // Register a new menu bar group.
207
+ * editor.ui.extendMenuBar( {
208
+ * group: {
209
+ * groupId: 'customGroup',
210
+ * items: [
211
+ * 'menuBar:customFunctionButton'
212
+ * ]
213
+ * },
214
+ * position: 'start:help'
215
+ * } );
216
+ *
217
+ * // Register a new menu bar menu.
218
+ * editor.ui.extendMenuBar( {
219
+ * menu: {
220
+ * menuId: 'customMenu',
221
+ * label: 'customMenu',
222
+ * groups: [
223
+ * {
224
+ * groupId: 'customGroup',
225
+ * items: [
226
+ * 'menuBar:customFunctionButton'
227
+ * ]
228
+ * }
229
+ * ]
230
+ * },
231
+ * position: 'after:help'
232
+ * } );
233
+ * ```
234
+ */
235
+ extendMenuBar(config: MenuBarConfigAddedItem | MenuBarConfigAddedGroup | MenuBarConfigAddedMenu): void;
236
+ /**
237
+ * Initializes menu bar.
238
+ */
239
+ initMenuBar(menuBarView: MenuBarView): void;
240
+ /**
241
+ * Returns viewport offsets object:
242
+ *
243
+ * ```js
244
+ * {
245
+ * top: Number,
246
+ * right: Number,
247
+ * bottom: Number,
248
+ * left: Number
249
+ * }
250
+ * ```
251
+ *
252
+ * Only top property is currently supported.
253
+ */
254
+ private _readViewportOffsetFromConfig;
255
+ /**
256
+ * Starts listening for <kbd>Alt</kbd> + <kbd>F10</kbd> and <kbd>Esc</kbd> keystrokes in the context of focusable
257
+ * {@link #setEditableElement editable elements} and {@link #addToolbar toolbars}
258
+ * to allow users navigate across the UI.
259
+ */
260
+ private _initFocusTracking;
261
+ /**
262
+ * Saves last focused element that doen not belong to editing view to restore focus on `Esc`.
263
+ */
264
+ private _saveLastFocusedForeignElement;
265
+ /**
266
+ * Returns definitions of toolbars that could potentially be focused, sorted by their importance for the user.
267
+ *
268
+ * Focusable toolbars candidates are either:
269
+ * * already visible,
270
+ * * have `beforeFocus()` set in their {@link module:ui/editorui/editorui~FocusableToolbarDefinition definition} that suggests that
271
+ * they might show up when called. Keep in mind that determining whether a toolbar will show up (and become focusable) is impossible
272
+ * at this stage because it depends on its implementation, that in turn depends on the editing context (selection).
273
+ *
274
+ * **Note**: Contextual toolbars take precedence over regular toolbars.
275
+ */
276
+ private _getFocusableCandidateToolbarDefinitions;
277
+ /**
278
+ * Returns a definition of the toolbar that is currently visible and focused (one of its children has focus).
279
+ *
280
+ * `null` is returned when no toolbar is currently focused.
281
+ */
282
+ private _getCurrentFocusedToolbarDefinition;
283
+ /**
284
+ * Focuses a focusable toolbar candidate using its definition.
285
+ *
286
+ * @param candidateToolbarDefinition A definition of the toolbar to focus.
287
+ * @returns `true` when the toolbar candidate was focused. `false` otherwise.
288
+ */
289
+ private _focusFocusableCandidateToolbar;
290
+ /**
291
+ * Provides an integration between {@link #viewportOffset} and {@link module:utils/dom/scroll~scrollViewportToShowTarget}.
292
+ * It allows the UI-agnostic engine method to consider user-configured viewport offsets specific for the integration.
293
+ *
294
+ * @param evt The `scrollToTheSelection` event info.
295
+ * @param data The payload carried by the `scrollToTheSelection` event.
296
+ */
297
+ private _handleScrollToTheSelection;
298
+ /**
299
+ * Resolves where the {@link module:ui/editorui/editoruiview~EditorUIView#body body collection} should be
300
+ * mounted:
301
+ *
302
+ * * the {@link module:core/editor/editorconfig~UiConfig#overlayContainer `ui.overlayContainer`}
303
+ * configuration, if set;
304
+ * * otherwise, resolved from the first editing root connected to a document (an editor may span several,
305
+ * for example a multi-root editor): the shadow root that root lives in (open or closed) when there is
306
+ * one, otherwise `document.body`;
307
+ * * otherwise `null` – no editing root is connected yet, so the body collection is not attached to the
308
+ * DOM before the editor itself is.
309
+ *
310
+ * Resolving from the connected editing root on every sync also moves the body collection back out
311
+ * of a shadow root if the editing root ever leaves it.
312
+ */
313
+ private _getBodyCollectionMountTarget;
314
+ /**
315
+ * Ensures that the focus tracker and the shadow root registry are aware of all views' DOM elements in the
316
+ * body collection.
317
+ */
318
+ private _bindBodyCollectionWatchers;
319
+ /**
320
+ * Set initial viewport offset and setup visualTop augmentation.
321
+ */
322
+ private _initViewportOffset;
323
+ /**
324
+ * Listen to visual viewport changes and update the viewportOffset with the visualTop property
325
+ * according to the visible part of it (visual viewport).
326
+ */
327
+ private _initVisualViewportSupport;
328
+ /**
329
+ * Calculate the viewport top offset according to the visible part of it (visual viewport).
330
+ */
331
+ private _getVisualViewportTopOffset;
301
332
  }
302
333
  /**
303
- * Fired when the editor UI is ready.
304
- *
305
- * Fired before {@link module:engine/controller/datacontroller~DataController#event:ready}.
306
- *
307
- * @eventName ~EditorUI#ready
308
- */
334
+ * Fired when the editor UI is ready.
335
+ *
336
+ * Fired before {@link module:engine/controller/datacontroller~DataController#event:ready}.
337
+ *
338
+ * @eventName ~EditorUI#ready
339
+ */
309
340
  export type EditorUIReadyEvent = {
310
- name: 'ready';
311
- args: [];
341
+ name: "ready";
342
+ args: [];
312
343
  };
313
344
  /**
314
- * Fired whenever the UI (all related components) should be refreshed.
315
- *
316
- * **Note:**: The event is fired after each {@link module:engine/view/document~ViewDocument#event:layoutChanged}.
317
- * It can also be fired manually via the {@link module:ui/editorui/editorui~EditorUI#update} method.
318
- *
319
- * @eventName ~EditorUI#update
320
- */
345
+ * Fired whenever the UI (all related components) should be refreshed.
346
+ *
347
+ * **Note:**: The event is fired after each {@link module:engine/view/document~ViewDocument#event:layoutChanged}.
348
+ * It can also be fired manually via the {@link module:ui/editorui/editorui~EditorUI#update} method.
349
+ *
350
+ * @eventName ~EditorUI#update
351
+ */
321
352
  export type EditorUIUpdateEvent = {
322
- name: 'update';
323
- args: [];
353
+ name: "update";
354
+ args: [];
324
355
  };
325
356
  /**
326
- * A definition of a focusable toolbar. Used by {@link module:ui/editorui/editorui~EditorUI#addToolbar}.
327
- */
357
+ * A definition of a focusable toolbar. Used by {@link module:ui/editorui/editorui~EditorUI#addToolbar}.
358
+ */
328
359
  export interface FocusableToolbarDefinition {
329
- /**
330
- * An instance of a focusable toolbar view.
331
- */
332
- toolbarView: ToolbarView;
333
- /**
334
- * Options of a focusable toolbar view:
335
- *
336
- * * `isContextual`: Marks the higher priority toolbar. For example when there are 2 visible toolbars,
337
- * it allows to distinguish which toolbar should be focused first after the `alt+f10` keystroke
338
- * * `beforeFocus`: A callback executed before the `ToolbarView` gains focus upon the `Alt+F10` keystroke.
339
- * * `afterBlur`: A callback executed after `ToolbarView` loses focus upon `Esc` keystroke but before
340
- * the focus goes back to the `origin`.
341
- */
342
- options: FocusableToolbarOptions;
360
+ /**
361
+ * An instance of a focusable toolbar view.
362
+ */
363
+ toolbarView: ToolbarView;
364
+ /**
365
+ * Options of a focusable toolbar view:
366
+ *
367
+ * * `isContextual`: Marks the higher priority toolbar. For example when there are 2 visible toolbars,
368
+ * it allows to distinguish which toolbar should be focused first after the `alt+f10` keystroke
369
+ * * `beforeFocus`: A callback executed before the `ToolbarView` gains focus upon the `Alt+F10` keystroke.
370
+ * * `afterBlur`: A callback executed after `ToolbarView` loses focus upon `Esc` keystroke but before
371
+ * the focus goes back to the `origin`.
372
+ */
373
+ options: FocusableToolbarOptions;
343
374
  }
344
375
  export interface FocusableToolbarOptions {
345
- /**
346
- * Set `true` if the toolbar is attached to the content of the editor. Such toolbar takes
347
- * a precedence over other toolbars when a user pressed <kbd>Alt</kbd> + <kbd>F10</kbd>.
348
- */
349
- isContextual?: boolean;
350
- /**
351
- * Specify a callback executed before the toolbar instance DOM element gains focus
352
- * upon the <kbd>Alt</kbd> + <kbd>F10</kbd> keystroke.
353
- */
354
- beforeFocus?: () => void;
355
- /**
356
- * Specify a callback executed after the toolbar instance DOM element loses focus upon
357
- * <kbd>Esc</kbd> keystroke but before the focus goes back to the {@link ~EditorUI#setEditableElement editable element}.
358
- */
359
- afterBlur?: () => void;
376
+ /**
377
+ * Set `true` if the toolbar is attached to the content of the editor. Such toolbar takes
378
+ * a precedence over other toolbars when a user pressed <kbd>Alt</kbd> + <kbd>F10</kbd>.
379
+ */
380
+ isContextual?: boolean;
381
+ /**
382
+ * Specify a callback executed before the toolbar instance DOM element gains focus
383
+ * upon the <kbd>Alt</kbd> + <kbd>F10</kbd> keystroke.
384
+ */
385
+ beforeFocus?: () => void;
386
+ /**
387
+ * Specify a callback executed after the toolbar instance DOM element loses focus upon
388
+ * <kbd>Esc</kbd> keystroke but before the focus goes back to the {@link ~EditorUI#setEditableElement editable element}.
389
+ */
390
+ afterBlur?: () => void;
360
391
  }
361
392
  export interface ViewportOffset extends ViewportOffsetConfig {
362
- /**
363
- * The top offset of the visual viewport.
364
- *
365
- * This value is calculated based on the visual viewport position.
366
- */
367
- visualTop?: number;
393
+ /**
394
+ * The top offset of the visual viewport.
395
+ *
396
+ * This value is calculated based on the visual viewport position.
397
+ */
398
+ visualTop?: number;
368
399
  }
369
400
  export {};