@ckeditor/ckeditor5-engine 36.0.0 → 37.0.0-alpha.0

package/src/view/observer/domeventobserver.js

@@ -18,30 +18,28 @@ import DomEventData from './domeventdata';
  *
  * For instance:
  *
- *		class ClickObserver extends DomEventObserver {
- *			// It can also be defined as a normal property in the constructor.
- *			get domEventType() {
- *				return 'click';
- *			}
+ * ```ts
+ * class ClickObserver extends DomEventObserver<'click'> {
+ * 	// It can also be defined as a normal property in the constructor.
+ * 	get domEventType(): 'click' {
+ * 		return 'click';
+ * 	}
  *
- *			onDomEvent( domEvent ) {
- *				this.fire( 'click', domEvent );
- *			}
- *		}
+ * 	onDomEvent( domEvent: MouseEvent ): void {
+ * 		this.fire( 'click', domEvent );
+ * 	}
+ * }
+ * ```
  *
- * @extends module:engine/view/observer/observer~Observer
+ * @typeParam EventType DOM Event type name or an union of those.
+ * @typeParam AdditionalData Additional data passed along with the event.
  */
 export default class DomEventObserver extends Observer {
-    /**
-     * @inheritDoc
-     */
-    constructor(view) {
-        super(view);
+    constructor() {
+        super(...arguments);
         /**
          * If set to `true` DOM events will be listened on the capturing phase.
          * Default value is `false`.
-         *
-         * @member {Boolean}
          */
         this.useCapture = false;
     }
@@ -61,10 +59,10 @@ export default class DomEventObserver extends Observer {
     /**
      * Calls `Document#fire()` if observer {@link #isEnabled is enabled}.
      *
-     * @see module:utils/emittermixin~EmitterMixin#fire
-     * @param {String} eventType The event type (name).
-     * @param {Event} domEvent The DOM event.
-     * @param {Object} [additionalData] The additional data which should extend the
+     * @see module:utils/emittermixin~Emitter#fire
+     * @param eventType The event type (name).
+     * @param domEvent The DOM event.
+     * @param additionalData The additional data which should extend the
      * {@link module:engine/view/observer/domeventdata~DomEventData event data} object.
      */
     fire(eventType, domEvent, additionalData) {

package/src/view/observer/fakeselectionobserver.d.ts

@@ -0,0 +1,46 @@
+/**
+ * @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
+ */
+/**
+ * @module engine/view/observer/fakeselectionobserver
+ */
+import Observer from './observer';
+import type View from '../view';
+/**
+ * Fake selection observer class. If view selection is fake it is placed in dummy DOM container. This observer listens
+ * on {@link module:engine/view/document~Document#event:keydown keydown} events and handles moving fake view selection to the correct place
+ * if arrow keys are pressed.
+ * Fires {@link module:engine/view/document~Document#event:selectionChange selectionChange event} simulating natural behaviour of
+ * {@link module:engine/view/observer/selectionobserver~SelectionObserver SelectionObserver}.
+ */
+export default class FakeSelectionObserver extends Observer {
+    /**
+     * Fires debounced event `selectionChangeDone`. It uses `lodash#debounce` method to delay function call.
+     */
+    private readonly _fireSelectionChangeDoneDebounced;
+    /**
+     * Creates new FakeSelectionObserver instance.
+     */
+    constructor(view: View);
+    /**
+     * @inheritDoc
+     */
+    observe(): void;
+    /**
+     * @inheritDoc
+     */
+    destroy(): void;
+    /**
+     * Handles collapsing view selection according to given key code. If left or up key is provided - new selection will be
+     * collapsed to left. If right or down key is pressed - new selection will be collapsed to right.
+     *
+     * This method fires {@link module:engine/view/document~Document#event:selectionChange} and
+     * {@link module:engine/view/document~Document#event:selectionChangeDone} events imitating behaviour of
+     * {@link module:engine/view/observer/selectionobserver~SelectionObserver}.
+     *
+     * @fires selectionChange
+     * @fires selectionChangeDone
+     */
+    private _handleSelectionMove;
+}

package/src/view/observer/fakeselectionobserver.js

@@ -15,24 +15,13 @@ import { debounce } from 'lodash-es';
  * if arrow keys are pressed.
  * Fires {@link module:engine/view/document~Document#event:selectionChange selectionChange event} simulating natural behaviour of
  * {@link module:engine/view/observer/selectionobserver~SelectionObserver SelectionObserver}.
- *
- * @extends module:engine/view/observer/observer~Observer
  */
 export default class FakeSelectionObserver extends Observer {
     /**
      * Creates new FakeSelectionObserver instance.
-     *
-     * @param {module:engine/view/view~View} view
      */
     constructor(view) {
         super(view);
-        /**
-         * Fires debounced event `selectionChangeDone`. It uses `lodash#debounce` method to delay function call.
-         *
-         * @private
-         * @param {Object} data Selection change data.
-         * @method #_fireSelectionChangeDoneDebounced
-         */
         this._fireSelectionChangeDoneDebounced = debounce(data => {
             this.document.fire('selectionChangeDone', data);
         }, 200);
@@ -71,10 +60,8 @@ export default class FakeSelectionObserver extends Observer {
      * {@link module:engine/view/document~Document#event:selectionChangeDone} events imitating behaviour of
      * {@link module:engine/view/observer/selectionobserver~SelectionObserver}.
      *
-     * @private
-     * @param {Number} keyCode
-     * @fires module:engine/view/document~Document#event:selectionChange
-     * @fires module:engine/view/document~Document#event:selectionChangeDone
+     * @fires selectionChange
+     * @fires selectionChangeDone
      */
     _handleSelectionMove(keyCode) {
         const selection = this.document.selection;

package/src/view/observer/focusobserver.d.ts

@@ -0,0 +1,82 @@
+/**
+ * @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
+ */
+/**
+ * @module engine/view/observer/focusobserver
+ */
+import DomEventObserver from './domeventobserver';
+import type DomEventData from './domeventdata';
+import type View from '../view';
+/**
+ * {@link module:engine/view/document~Document#event:focus Focus}
+ * and {@link module:engine/view/document~Document#event:blur blur} events observer.
+ * Focus observer handle also {@link module:engine/view/rooteditableelement~RootEditableElement#isFocused isFocused} property of the
+ * {@link module:engine/view/rooteditableelement~RootEditableElement root elements}.
+ *
+ * Note that this observer is attached by the {@link module:engine/view/view~View} and is available by default.
+ */
+export default class FocusObserver extends DomEventObserver<'focus' | 'blur'> {
+    /**
+     * Identifier of the timeout currently used by focus listener to delay rendering execution.
+     */
+    private _renderTimeoutId;
+    /**
+     * Set to `true` if the document is in the process of setting the focus.
+     *
+     * The flag is used to indicate that setting the focus is in progress.
+     */
+    private _isFocusChanging;
+    /**
+     * @inheritDoc
+     */
+    readonly domEventType: readonly ["focus", "blur"];
+    /**
+     * @inheritDoc
+     */
+    constructor(view: View);
+    /**
+     * Finishes setting the document focus state.
+     */
+    flush(): void;
+    /**
+     * @inheritDoc
+     */
+    onDomEvent(domEvent: FocusEvent): void;
+    /**
+     * @inheritDoc
+     */
+    destroy(): void;
+}
+/**
+ * Fired when one of the editables gets focus.
+ *
+ * Introduced by {@link module:engine/view/observer/focusobserver~FocusObserver}.
+ *
+ * Note that because {@link module:engine/view/observer/focusobserver~FocusObserver} is attached by the
+ * {@link module:engine/view/view~View} this event is available by default.
+ *
+ * @see module:engine/view/observer/focusobserver~FocusObserver
+ * @eventName focus
+ * @param data Event data.
+ */
+export type ViewDocumentFocusEvent = {
+    name: 'focus';
+    args: [data: DomEventData<FocusEvent>];
+};
+/**
+ * Fired when one of the editables loses focus.
+ *
+ * Introduced by {@link module:engine/view/observer/focusobserver~FocusObserver}.
+ *
+ * Note that because {@link module:engine/view/observer/focusobserver~FocusObserver} is attached by the
+ * {@link module:engine/view/view~View} this event is available by default.
+ *
+ * @see module:engine/view/observer/focusobserver~FocusObserver
+ * @eventName blur
+ * @param data Event data.
+ */
+export type ViewDocumentBlurEvent = {
+    name: 'blur';
+    args: [data: DomEventData<FocusEvent>];
+};

package/src/view/observer/focusobserver.js

@@ -14,25 +14,26 @@ import DomEventObserver from './domeventobserver';
  * {@link module:engine/view/rooteditableelement~RootEditableElement root elements}.
  *
  * Note that this observer is attached by the {@link module:engine/view/view~View} and is available by default.
- *
- * @extends module:engine/view/observer/domeventobserver~DomEventObserver
  */
 export default class FocusObserver extends DomEventObserver {
+    /**
+     * @inheritDoc
+     */
     constructor(view) {
         super(view);
+        /**
+         * Set to `true` if the document is in the process of setting the focus.
+         *
+         * The flag is used to indicate that setting the focus is in progress.
+         */
         this._isFocusChanging = false;
+        /**
+         * @inheritDoc
+         */
         this.domEventType = ['focus', 'blur'];
         this.useCapture = true;
         const document = this.document;
         document.on('focus', () => {
-            /**
-             * Set to `true` if the document is in the process of setting the focus.
-             *
-             * The flag is used to indicate that setting the focus is in progress.
-             *
-             * @internal
-             * @type {Boolean} module:engine/view/observer/focusobserver#_isFocusChanging
-             */
             this._isFocusChanging = true;
             // Unfortunately native `selectionchange` event is fired asynchronously.
             // We need to wait until `SelectionObserver` handle the event and then render. Otherwise rendering will
@@ -57,12 +58,6 @@ export default class FocusObserver extends DomEventObserver {
                 view.change(() => { });
             }
         });
-        /**
-         * Identifier of the timeout currently used by focus listener to delay rendering execution.
-         *
-         * @private
-         * @member {Number} #_renderTimeoutId
-         */
     }
     /**
      * Finishes setting the document focus state.
@@ -73,6 +68,9 @@ export default class FocusObserver extends DomEventObserver {
             this.document.isFocused = true;
         }
     }
+    /**
+     * @inheritDoc
+     */
     onDomEvent(domEvent) {
         this.fire(domEvent.type, domEvent);
     }
@@ -86,27 +84,3 @@ export default class FocusObserver extends DomEventObserver {
         super.destroy();
     }
 }
-/**
- * Fired when one of the editables gets focus.
- *
- * Introduced by {@link module:engine/view/observer/focusobserver~FocusObserver}.
- *
- * Note that because {@link module:engine/view/observer/focusobserver~FocusObserver} is attached by the
- * {@link module:engine/view/view~View} this event is available by default.
- *
- * @see module:engine/view/observer/focusobserver~FocusObserver
- * @event module:engine/view/document~Document#event:focus
- * @param {module:engine/view/observer/domeventdata~DomEventData} data Event data.
- */
-/**
- * Fired when one of the editables loses focus.
- *
- * Introduced by {@link module:engine/view/observer/focusobserver~FocusObserver}.
- *
- * Note that because {@link module:engine/view/observer/focusobserver~FocusObserver} is attached by the
- * {@link module:engine/view/view~View} this event is available by default.
- *
- * @see module:engine/view/observer/focusobserver~FocusObserver
- * @event module:engine/view/document~Document#event:blur
- * @param {module:engine/view/observer/domeventdata~DomEventData} data Event data.
- */

package/src/view/observer/inputobserver.d.ts

@@ -0,0 +1,86 @@
+/**
+ * @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
+ */
+/**
+ * @module engine/view/observer/inputobserver
+ */
+import DomEventObserver from './domeventobserver';
+import type DomEventData from './domeventdata';
+import type ViewRange from '../range';
+import DataTransfer from '../datatransfer';
+/**
+ * Observer for events connected with data input.
+ *
+ * **Note**: This observer is attached by {@link module:engine/view/view~View} and available by default in all
+ * editor instances.
+ */
+export default class InputObserver extends DomEventObserver<'beforeinput'> {
+    /**
+     * @inheritDoc
+     */
+    readonly domEventType: "beforeinput";
+    /**
+     * @inheritDoc
+     */
+    onDomEvent(domEvent: InputEvent): void;
+}
+/**
+ * Fired before the web browser inputs, deletes, or formats some data.
+ *
+ * This event is introduced by {@link module:engine/view/observer/inputobserver~InputObserver} and available
+ * by default in all editor instances (attached by {@link module:engine/view/view~View}).
+ *
+ * @see module:engine/view/observer/inputobserver~InputObserver
+ * @eventName beforeinput
+ * @param data Event data containing detailed information about the event.
+ */
+export type ViewDocumentInputEvent = {
+    name: 'beforeinput';
+    args: [data: InputEventData];
+};
+/**
+ * The value of the {@link module:engine/view/document~ViewDocumentInputEvent} event.
+ */
+export interface InputEventData extends DomEventData<InputEvent> {
+    /**
+     * The type of the input event (e.g. "insertText" or "deleteWordBackward"). Corresponds to native `InputEvent#inputType`.
+     */
+    readonly inputType: string;
+    /**
+     * A unified text data passed along with the input event. Depending on:
+     *
+     * * the web browser and input events implementation (for instance [Level 1](https://www.w3.org/TR/input-events-1/) or
+     * [Level 2](https://www.w3.org/TR/input-events-2/)),
+     * * {@link module:engine/view/observer/inputobserver~InputEventData#inputType input type}
+     *
+     * text data is sometimes passed in the `data` and sometimes in the `dataTransfer` property.
+     *
+     * * If `InputEvent#data` was set, this property reflects its value.
+     * * If `InputEvent#data` is unavailable, this property contains the `'text/plain'` data from
+     * {@link module:engine/view/observer/inputobserver~InputEventData#dataTransfer}.
+     * * If the event ({@link module:engine/view/observer/inputobserver~InputEventData#inputType input type})
+     * provides no data whatsoever, this property is `null`.
+     */
+    readonly data: string | null;
+    /**
+     * The data transfer instance of the input event. Corresponds to native `InputEvent#dataTransfer`.
+     *
+     * The value is `null` when no `dataTransfer` was passed along with the input event.
+     */
+    readonly dataTransfer: DataTransfer;
+    /**
+     * A flag indicating that the `beforeinput` event was fired during composition.
+     *
+     * Corresponds to the
+     * {@link module:engine/view/document~Document#event:compositionstart},
+     * {@link module:engine/view/document~Document#event:compositionupdate},
+     * and {@link module:engine/view/document~Document#event:compositionend } trio.
+     */
+    readonly isComposing: boolean;
+    /**
+     * Editing {@link module:engine/view/range~Range view ranges} corresponding to DOM ranges provided by the web browser
+     * (as returned by `InputEvent#getTargetRanges()`).
+     */
+    readonly targetRanges: Array<ViewRange>;
+}

package/src/view/observer/inputobserver.js

@@ -13,16 +13,20 @@ import { env } from '@ckeditor/ckeditor5-utils';
  *
  * **Note**: This observer is attached by {@link module:engine/view/view~View} and available by default in all
  * editor instances.
- *
- * @extends module:engine/view/observer/domeventobserver~DomEventObserver
  */
 export default class InputObserver extends DomEventObserver {
-    constructor(view) {
-        super(view);
-        this.domEventType = ['beforeinput'];
+    constructor() {
+        super(...arguments);
+        /**
+         * @inheritDoc
+         */
+        this.domEventType = 'beforeinput';
     }
+    /**
+     * @inheritDoc
+     */
     onDomEvent(domEvent) {
-        // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+        // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
         // @if CK_DEBUG_TYPING // 	console.group( `%c[InputObserver]%c ${ domEvent.type }: ${ domEvent.inputType }`,
         // @if CK_DEBUG_TYPING // 		'color: green', 'color: default'
         // @if CK_DEBUG_TYPING // 	);
@@ -38,7 +42,7 @@ export default class InputObserver extends DomEventObserver {
         }
         if (domEvent.data !== null) {
             data = domEvent.data;
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.info( `%c[InputObserver]%c event data: %c${ JSON.stringify( data ) }`,
             // @if CK_DEBUG_TYPING // 		'color: green;font-weight: bold', 'font-weight:bold', 'color: blue;'
             // @if CK_DEBUG_TYPING // 	);
@@ -46,7 +50,7 @@ export default class InputObserver extends DomEventObserver {
         }
         else if (dataTransfer) {
             data = dataTransfer.getData('text/plain');
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.info( `%c[InputObserver]%c event data transfer: %c${ JSON.stringify( data ) }`,
             // @if CK_DEBUG_TYPING // 		'color: green;font-weight: bold', 'font-weight:bold', 'color: blue;'
             // @if CK_DEBUG_TYPING // 	);
@@ -57,7 +61,7 @@ export default class InputObserver extends DomEventObserver {
         if (viewDocument.selection.isFake) {
             // Future-proof: in case of multi-range fake selections being possible.
             targetRanges = Array.from(viewDocument.selection.getRanges());
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.info( '%c[InputObserver]%c using fake selection:',
             // @if CK_DEBUG_TYPING // 		'color: green;font-weight: bold', 'font-weight:bold', targetRanges,
             // @if CK_DEBUG_TYPING // 		viewDocument.selection.isFake ? 'fake view selection' : 'fake DOM parent'
@@ -68,7 +72,7 @@ export default class InputObserver extends DomEventObserver {
             targetRanges = domTargetRanges.map(domRange => {
                 return view.domConverter.domRangeToView(domRange);
             });
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.info( '%c[InputObserver]%c using target ranges:',
             // @if CK_DEBUG_TYPING // 		'color: green;font-weight: bold', 'font-weight:bold', targetRanges
             // @if CK_DEBUG_TYPING // 	);
@@ -79,7 +83,7 @@ export default class InputObserver extends DomEventObserver {
         else if (env.isAndroid) {
             const domSelection = domEvent.target.ownerDocument.defaultView.getSelection();
             targetRanges = Array.from(view.domConverter.domSelectionToView(domSelection).getRanges());
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.info( '%c[InputObserver]%c using selection ranges:',
             // @if CK_DEBUG_TYPING // 		'color: green;font-weight: bold', 'font-weight:bold', targetRanges
             // @if CK_DEBUG_TYPING // 	);
@@ -95,7 +99,7 @@ export default class InputObserver extends DomEventObserver {
                 inputType: 'insertParagraph',
                 targetRanges: [view.createRange(targetRanges[0].end)]
             });
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.groupEnd();
             // @if CK_DEBUG_TYPING // }
             return;
@@ -129,7 +133,7 @@ export default class InputObserver extends DomEventObserver {
                     partTargetRanges = [viewDocument.selection.getFirstRange()];
                 }
             }
-            // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+            // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
             // @if CK_DEBUG_TYPING // 	console.groupEnd();
             // @if CK_DEBUG_TYPING // }
             return;
@@ -142,58 +146,8 @@ export default class InputObserver extends DomEventObserver {
             inputType: domEvent.inputType,
             isComposing: domEvent.isComposing
         });
-        // @if CK_DEBUG_TYPING // if ( window.logCKETyping ) {
+        // @if CK_DEBUG_TYPING // if ( ( window as any ).logCKETyping ) {
         // @if CK_DEBUG_TYPING // 	console.groupEnd();
         // @if CK_DEBUG_TYPING // }
     }
 }
-/**
- * The data transfer instance of the input event. Corresponds to native `InputEvent#dataTransfer`.
- *
- * The value is `null` when no `dataTransfer` was passed along with the input event.
- *
- * @readonly
- * @member {module:engine/view/datatransfer~DataTransfer|null} module:engine/view/observer/inputobserver~InputEventData#dataTransfer
- */
-/**
- * A flag indicating that the `beforeinput` event was fired during composition.
- *
- * Corresponds to the
- * {@link module:engine/view/document~Document#event:compositionstart},
- * {@link module:engine/view/document~Document#event:compositionupdate},
- * and {@link module:engine/view/document~Document#event:compositionend } trio.
- *
- * @readonly
- * @member {Boolean} module:engine/view/observer/inputobserver~InputEventData#isComposing
- */
-/**
- * The type of the input event (e.g. "insertText" or "deleteWordBackward"). Corresponds to native `InputEvent#inputType`.
- *
- * @readonly
- * @member {String} module:engine/view/observer/inputobserver~InputEventData#inputType
- */
-/**
- * Editing {@link module:engine/view/range~Range view ranges} corresponding to DOM ranges provided by the web browser
- * (as returned by `InputEvent#getTargetRanges()`).
- *
- * @readonly
- * @member {Array.<module:engine/view/range~Range>} module:engine/view/observer/inputobserver~InputEventData#targetRanges
- */
-/**
- * A unified text data passed along with the input event. Depending on:
- *
- * * the web browser and input events implementation (for instance [Level 1](https://www.w3.org/TR/input-events-1/) or
- * [Level 2](https://www.w3.org/TR/input-events-2/)),
- * * {@link module:engine/view/observer/inputobserver~InputEventData#inputType input type}
- *
- * text data is sometimes passed in the `data` and sometimes in the `dataTransfer` property.
- *
- * * If `InputEvent#data` was set, this property reflects its value.
- * * If `InputEvent#data` is unavailable, this property contains the `'text/plain'` data from
- * {@link module:engine/view/observer/inputobserver~InputEventData#dataTransfer}.
- * * If the event ({@link module:engine/view/observer/inputobserver~InputEventData#inputType input type})
- * provides no data whatsoever, this property is `null`.
- *
- * @readonly
- * @member {String|null} module:engine/view/observer/inputobserver~InputEventData#data
- */

package/src/view/observer/keyobserver.d.ts

@@ -0,0 +1,67 @@
+/**
+ * @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
+ */
+/**
+ * @module engine/view/observer/keyobserver
+ */
+import DomEventObserver from './domeventobserver';
+import type DomEventData from './domeventdata';
+import { type KeystrokeInfo } from '@ckeditor/ckeditor5-utils';
+/**
+ * Observer for events connected with pressing keyboard keys.
+ *
+ * Note that this observer is attached by the {@link module:engine/view/view~View} and is available by default.
+ */
+export default class KeyObserver extends DomEventObserver<'keydown' | 'keyup', KeystrokeInfo & {
+    keystroke: number;
+}> {
+    /**
+     * @inheritDoc
+     */
+    readonly domEventType: readonly ["keydown", "keyup"];
+    /**
+     * @inheritDoc
+     */
+    onDomEvent(domEvt: KeyboardEvent): void;
+}
+/**
+ * Fired when a key has been pressed.
+ *
+ * Introduced by {@link module:engine/view/observer/keyobserver~KeyObserver}.
+ *
+ * Note that because {@link module:engine/view/observer/keyobserver~KeyObserver} is attached by the
+ * {@link module:engine/view/view~View} this event is available by default.
+ *
+ * @see module:engine/view/observer/keyobserver~KeyObserver
+ * @eventName keydown
+ */
+export type ViewDocumentKeyDownEvent = {
+    name: 'keydown';
+    args: [data: KeyEventData];
+};
+/**
+ * Fired when a key has been released.
+ *
+ * Introduced by {@link module:engine/view/observer/keyobserver~KeyObserver}.
+ *
+ * Note that because {@link module:engine/view/observer/keyobserver~KeyObserver} is attached by the
+ * {@link module:engine/view/view~View} this event is available by default.
+ *
+ * @see module:engine/view/observer/keyobserver~KeyObserver
+ * @eventName keyup
+ */
+export type ViewDocumentKeyUpEvent = {
+    name: 'keyup';
+    args: [data: KeyEventData];
+};
+/**
+ * The value of both events - {@link module:engine/view/document~ViewDocumentKeyDownEvent} and
+ * {@link module:engine/view/document~ViewDocumentKeyUpEvent}.
+ */
+export interface KeyEventData extends DomEventData<KeyboardEvent>, KeystrokeInfo {
+    /**
+     * Code of the whole keystroke. See {@link module:utils/keyboard~getCode}.
+     */
+    keystroke: number;
+}