@ckeditor/ckeditor5-engine 38.2.0-alpha.1 → 39.0.0

package/src/model/utils/selection-post-fixer.js

@@ -5,8 +5,8 @@
 /**
  * @module engine/model/utils/selection-post-fixer
  */
-import Position from '../position.js';
-import Range from '../range.js';
+import Position from '../position';
+import Range from '../range';
 /**
  * Injects selection post-fixer to the model.
  *

package/src/model/writer.d.ts

@@ -2,18 +2,18 @@
  * @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 DocumentFragment from './documentfragment.js';
-import Element from './element.js';
-import Position, { type PositionOffset, type PositionStickiness } from './position.js';
-import Range from './range.js';
-import RootElement from './rootelement.js';
-import Text from './text.js';
-import type { Marker } from './markercollection.js';
-import type { default as Selection, PlaceOrOffset, Selectable } from './selection.js';
-import type Batch from './batch.js';
-import type Item from './item.js';
-import type Model from './model.js';
-import type { default as Node, NodeAttributes } from './node.js';
+import DocumentFragment from './documentfragment';
+import Element from './element';
+import Position, { type PositionOffset, type PositionStickiness } from './position';
+import Range from './range';
+import RootElement from './rootelement';
+import Text from './text';
+import type { Marker } from './markercollection';
+import type { default as Selection, PlaceOrOffset, Selectable } from './selection';
+import type Batch from './batch';
+import type Item from './item';
+import type Model from './model';
+import type { default as Node, NodeAttributes } from './node';
 /**
  * The model can only be modified by using the writer. It should be used whenever you want to create a node, modify
  * child nodes, attributes or text, set the selection's position and its attributes.

package/src/model/writer.js

@@ -5,23 +5,23 @@
 /**
  * @module engine/model/writer
  */
-import AttributeOperation from './operation/attributeoperation.js';
-import DetachOperation from './operation/detachoperation.js';
-import InsertOperation from './operation/insertoperation.js';
-import MarkerOperation from './operation/markeroperation.js';
-import MergeOperation from './operation/mergeoperation.js';
-import MoveOperation from './operation/moveoperation.js';
-import RenameOperation from './operation/renameoperation.js';
-import RootAttributeOperation from './operation/rootattributeoperation.js';
-import RootOperation from './operation/rootoperation.js';
-import SplitOperation from './operation/splitoperation.js';
-import DocumentFragment from './documentfragment.js';
-import DocumentSelection from './documentselection.js';
-import Element from './element.js';
-import Position from './position.js';
-import Range from './range.js';
-import RootElement from './rootelement.js';
-import Text from './text.js';
+import AttributeOperation from './operation/attributeoperation';
+import DetachOperation from './operation/detachoperation';
+import InsertOperation from './operation/insertoperation';
+import MarkerOperation from './operation/markeroperation';
+import MergeOperation from './operation/mergeoperation';
+import MoveOperation from './operation/moveoperation';
+import RenameOperation from './operation/renameoperation';
+import RootAttributeOperation from './operation/rootattributeoperation';
+import RootOperation from './operation/rootoperation';
+import SplitOperation from './operation/splitoperation';
+import DocumentFragment from './documentfragment';
+import DocumentSelection from './documentselection';
+import Element from './element';
+import Position from './position';
+import Range from './range';
+import RootElement from './rootelement';
+import Text from './text';
 import { CKEditorError, logWarning, toMap } from '@ckeditor/ckeditor5-utils';
 /**
  * The model can only be modified by using the writer. It should be used whenever you want to create a node, modify

package/src/view/attributeelement.d.ts

@@ -5,9 +5,9 @@
 /**
  * @module engine/view/attributeelement
  */
-import Element, { type ElementAttributes } from './element.js';
-import type Document from './document.js';
-import type Node from './node.js';
+import Element, { type ElementAttributes } from './element';
+import type Document from './document';
+import type Node from './node';
 /**
  * Attribute elements are used to represent formatting elements in the view (think – `<b>`, `<span style="font-size: 2em">`, etc.).
  * Most often they are created when downcasting model text attributes.

package/src/view/attributeelement.js

@@ -5,7 +5,7 @@
 /**
  * @module engine/view/attributeelement
  */
-import Element from './element.js';
+import Element from './element';
 import { CKEditorError } from '@ckeditor/ckeditor5-utils';
 // Default attribute priority.
 const DEFAULT_PRIORITY = 10;

package/src/view/containerelement.d.ts

@@ -5,9 +5,9 @@
 /**
  * @module engine/view/containerelement
  */
-import Element, { type ElementAttributes } from './element.js';
-import type Document from './document.js';
-import type Node from './node.js';
+import Element, { type ElementAttributes } from './element';
+import type Document from './document';
+import type Node from './node';
 /**
  * Containers are elements which define document structure. They define boundaries for
  * {@link module:engine/view/attributeelement~AttributeElement attributes}. They are mostly used for block elements like `<p>` or `<div>`.

package/src/view/containerelement.js

@@ -5,7 +5,7 @@
 /**
  * @module engine/view/containerelement
  */
-import Element from './element.js';
+import Element from './element';
 /**
  * Containers are elements which define document structure. They define boundaries for
  * {@link module:engine/view/attributeelement~AttributeElement attributes}. They are mostly used for block elements like `<p>` or `<div>`.

package/src/view/document.d.ts

@@ -5,11 +5,11 @@
 /**
  * @module engine/view/document
  */
-import DocumentSelection from './documentselection.js';
+import DocumentSelection from './documentselection';
 import { Collection } from '@ckeditor/ckeditor5-utils';
-import type { StylesProcessor } from './stylesmap.js';
-import type RootEditableElement from './rooteditableelement.js';
-import type DowncastWriter from './downcastwriter.js';
+import type { StylesProcessor } from './stylesmap';
+import type RootEditableElement from './rooteditableelement';
+import type DowncastWriter from './downcastwriter';
 declare const Document_base: import("@ckeditor/ckeditor5-utils").Mixed<{
     new (): import("@ckeditor/ckeditor5-utils").Observable;
     prototype: import("@ckeditor/ckeditor5-utils").Observable;

package/src/view/document.js

@@ -5,8 +5,8 @@
 /**
  * @module engine/view/document
  */
-import DocumentSelection from './documentselection.js';
-import BubblingEmitterMixin from './observer/bubblingemittermixin.js';
+import DocumentSelection from './documentselection';
+import BubblingEmitterMixin from './observer/bubblingemittermixin';
 import { Collection, ObservableMixin } from '@ckeditor/ckeditor5-utils';
 // @if CK_DEBUG_ENGINE // const { logDocument } = require( '../dev-utils/utils' );
 /**

package/src/view/documentfragment.d.ts

@@ -5,10 +5,10 @@
 /**
  * @module engine/view/documentfragment
  */
-import TypeCheckable from './typecheckable.js';
-import type { default as Document, ChangeType } from './document.js';
-import type Item from './item.js';
-import type Node from './node.js';
+import TypeCheckable from './typecheckable';
+import type { default as Document, ChangeType } from './document';
+import type Item from './item';
+import type Node from './node';
 declare const DocumentFragment_base: import("@ckeditor/ckeditor5-utils").Mixed<typeof TypeCheckable, import("@ckeditor/ckeditor5-utils").Emitter>;
 /**
  * Document fragment.

package/src/view/documentfragment.js

@@ -5,9 +5,9 @@
 /**
  * @module engine/view/documentfragment
  */
-import TypeCheckable from './typecheckable.js';
-import Text from './text.js';
-import TextProxy from './textproxy.js';
+import TypeCheckable from './typecheckable';
+import Text from './text';
+import TextProxy from './textproxy';
 import { EmitterMixin, isIterable } from '@ckeditor/ckeditor5-utils';
 /**
  * Document fragment.

package/src/view/documentselection.d.ts

@@ -5,14 +5,14 @@
 /**
  * @module engine/view/documentselection
  */
-import TypeCheckable from './typecheckable.js';
-import Selection, { type PlaceOrOffset, type Selectable, type SelectionOptions, type ViewSelectionChangeEvent } from './selection.js';
-import type EditableElement from './editableelement.js';
-import type Element from './element.js';
-import type Node from './node.js';
-import type Item from './item.js';
-import type { default as Position, PositionOffset } from './position.js';
-import type Range from './range.js';
+import TypeCheckable from './typecheckable';
+import Selection, { type PlaceOrOffset, type Selectable, type SelectionOptions, type ViewSelectionChangeEvent } from './selection';
+import type EditableElement from './editableelement';
+import type Element from './element';
+import type Node from './node';
+import type Item from './item';
+import type { default as Position, PositionOffset } from './position';
+import type Range from './range';
 declare const DocumentSelection_base: import("@ckeditor/ckeditor5-utils").Mixed<typeof TypeCheckable, import("@ckeditor/ckeditor5-utils").Emitter>;
 /**
  * Class representing the document selection in the view.

package/src/view/documentselection.js

@@ -5,8 +5,8 @@
 /**
  * @module engine/view/documentselection
  */
-import TypeCheckable from './typecheckable.js';
-import Selection from './selection.js';
+import TypeCheckable from './typecheckable';
+import Selection from './selection';
 import { EmitterMixin } from '@ckeditor/ckeditor5-utils';
 /**
  * Class representing the document selection in the view.

package/src/view/domconverter.d.ts

@@ -5,19 +5,19 @@
 /**
  * @module engine/view/domconverter
  */
-import ViewText from './text.js';
-import ViewElement from './element.js';
-import ViewUIElement from './uielement.js';
-import ViewPosition from './position.js';
-import ViewRange from './range.js';
-import ViewSelection from './selection.js';
-import ViewDocumentFragment from './documentfragment.js';
-import { type MatcherPattern } from './matcher.js';
-import type ViewNode from './node.js';
-import type Document from './document.js';
-import type DocumentSelection from './documentselection.js';
-import type EditableElement from './editableelement.js';
-import type ViewRawElement from './rawelement.js';
+import ViewText from './text';
+import ViewElement from './element';
+import ViewUIElement from './uielement';
+import ViewPosition from './position';
+import ViewRange from './range';
+import ViewSelection from './selection';
+import ViewDocumentFragment from './documentfragment';
+import { type MatcherPattern } from './matcher';
+import type ViewNode from './node';
+import type Document from './document';
+import type DocumentSelection from './documentselection';
+import type EditableElement from './editableelement';
+import type ViewRawElement from './rawelement';
 type DomNode = globalThis.Node;
 type DomElement = globalThis.HTMLElement;
 type DomDocumentFragment = globalThis.DocumentFragment;
@@ -392,6 +392,12 @@ export default class DomConverter {
      * Focuses DOM editable that is corresponding to provided {@link module:engine/view/editableelement~EditableElement}.
      */
     focus(viewEditable: EditableElement): void;
+    /**
+     * Remove DOM selection from blurred editable, so it won't interfere with clicking on dropdowns (especially on iOS).
+     *
+     * @internal
+     */
+    _clearDomSelection(): void;
     /**
      * Returns `true` when `node.nodeType` equals `Node.ELEMENT_NODE`.
      *

package/src/view/domconverter.js

@@ -6,16 +6,16 @@
  * @module engine/view/domconverter
  */
 /* globals Node, NodeFilter, DOMParser, Text */
-import ViewText from './text.js';
-import ViewElement from './element.js';
-import ViewUIElement from './uielement.js';
-import ViewPosition from './position.js';
-import ViewRange from './range.js';
-import ViewSelection from './selection.js';
-import ViewDocumentFragment from './documentfragment.js';
-import ViewTreeWalker from './treewalker.js';
-import { default as Matcher } from './matcher.js';
-import { BR_FILLER, INLINE_FILLER_LENGTH, NBSP_FILLER, MARKED_NBSP_FILLER, getDataWithoutFiller, isInlineFiller, startsWithFiller } from './filler.js';
+import ViewText from './text';
+import ViewElement from './element';
+import ViewUIElement from './uielement';
+import ViewPosition from './position';
+import ViewRange from './range';
+import ViewSelection from './selection';
+import ViewDocumentFragment from './documentfragment';
+import ViewTreeWalker from './treewalker';
+import { default as Matcher } from './matcher';
+import { BR_FILLER, INLINE_FILLER_LENGTH, NBSP_FILLER, MARKED_NBSP_FILLER, getDataWithoutFiller, isInlineFiller, startsWithFiller } from './filler';
 import { global, logWarning, indexOf, getAncestors, isText, isComment, isValidAttributeName, first } from '@ckeditor/ckeditor5-utils';
 const BR_FILLER_REF = BR_FILLER(global.document); // eslint-disable-line new-cap
 const NBSP_FILLER_REF = NBSP_FILLER(global.document); // eslint-disable-line new-cap
@@ -770,6 +770,24 @@ export default class DomConverter {
             global.window.scrollTo(scrollX, scrollY);
         }
     }
+    /**
+     * Remove DOM selection from blurred editable, so it won't interfere with clicking on dropdowns (especially on iOS).
+     *
+     * @internal
+     */
+    _clearDomSelection() {
+        const domEditable = this.mapViewToDom(this.document.selection.editableElement);
+        if (!domEditable) {
+            return;
+        }
+        // Check if DOM selection is inside editor editable element.
+        const domSelection = domEditable.ownerDocument.defaultView.getSelection();
+        const newViewSelection = this.domSelectionToView(domSelection);
+        const selectionInEditable = newViewSelection && newViewSelection.rangeCount > 0;
+        if (selectionInEditable) {
+            domSelection.removeAllRanges();
+        }
+    }
     /**
      * Returns `true` when `node.nodeType` equals `Node.ELEMENT_NODE`.
      *

package/src/view/downcastwriter.d.ts

@@ -5,23 +5,23 @@
 /**
  * @module engine/view/downcastwriter
  */
-import Position, { type PositionOffset } from './position.js';
-import Range from './range.js';
-import Selection, { type PlaceOrOffset, type Selectable, type SelectionOptions } from './selection.js';
-import ContainerElement from './containerelement.js';
-import AttributeElement from './attributeelement.js';
-import EmptyElement from './emptyelement.js';
-import UIElement from './uielement.js';
-import RawElement from './rawelement.js';
-import DocumentFragment from './documentfragment.js';
-import Text from './text.js';
-import EditableElement from './editableelement.js';
-import type Document from './document.js';
-import type Node from './node.js';
-import type { default as Element, ElementAttributes } from './element.js';
-import type DomConverter from './domconverter.js';
-import type Item from './item.js';
-import type { SlotFilter } from '../conversion/downcasthelpers.js';
+import Position, { type PositionOffset } from './position';
+import Range from './range';
+import Selection, { type PlaceOrOffset, type Selectable, type SelectionOptions } from './selection';
+import ContainerElement from './containerelement';
+import AttributeElement from './attributeelement';
+import EmptyElement from './emptyelement';
+import UIElement from './uielement';
+import RawElement from './rawelement';
+import DocumentFragment from './documentfragment';
+import Text from './text';
+import EditableElement from './editableelement';
+import type Document from './document';
+import type Node from './node';
+import type { default as Element, ElementAttributes } from './element';
+import type DomConverter from './domconverter';
+import type Item from './item';
+import type { SlotFilter } from '../conversion/downcasthelpers';
 type DomDocument = globalThis.Document;
 type DomElement = globalThis.HTMLElement;
 /**

package/src/view/downcastwriter.js

@@ -5,18 +5,18 @@
 /**
  * @module engine/view/downcastwriter
  */
-import Position from './position.js';
-import Range from './range.js';
-import Selection from './selection.js';
-import ContainerElement from './containerelement.js';
-import AttributeElement from './attributeelement.js';
-import EmptyElement from './emptyelement.js';
-import UIElement from './uielement.js';
-import RawElement from './rawelement.js';
+import Position from './position';
+import Range from './range';
+import Selection from './selection';
+import ContainerElement from './containerelement';
+import AttributeElement from './attributeelement';
+import EmptyElement from './emptyelement';
+import UIElement from './uielement';
+import RawElement from './rawelement';
 import { CKEditorError, isIterable } from '@ckeditor/ckeditor5-utils';
-import DocumentFragment from './documentfragment.js';
-import Text from './text.js';
-import EditableElement from './editableelement.js';
+import DocumentFragment from './documentfragment';
+import Text from './text';
+import EditableElement from './editableelement';
 import { isPlainObject } from 'lodash-es';
 /**
  * View downcast writer.

package/src/view/editableelement.d.ts

@@ -5,10 +5,10 @@
 /**
  * @module engine/view/editableelement
  */
-import ContainerElement from './containerelement.js';
-import type { ElementAttributes } from './element.js';
-import type Document from './document.js';
-import type Node from './node.js';
+import ContainerElement from './containerelement';
+import type { ElementAttributes } from './element';
+import type Document from './document';
+import type Node from './node';
 declare const EditableElement_base: import("@ckeditor/ckeditor5-utils").Mixed<typeof ContainerElement, import("@ckeditor/ckeditor5-utils").Observable>;
 /**
  * Editable element which can be a {@link module:engine/view/rooteditableelement~RootEditableElement root}
@@ -36,6 +36,16 @@ export default class EditableElement extends EditableElement_base {
      * @observable
      */
     isFocused: boolean;
+    /**
+     * Placeholder of editable element.
+     *
+     * ```ts
+     * editor.editing.view.document.getRoot( 'main' ).placeholder = 'New placeholder';
+     * ```
+     *
+     * @observable
+     */
+    placeholder?: string;
     /**
      * Creates an editable element.
      *

package/src/view/editableelement.js

@@ -5,7 +5,7 @@
 /**
  * @module engine/view/editableelement
  */
-import ContainerElement from './containerelement.js';
+import ContainerElement from './containerelement';
 import { ObservableMixin } from '@ckeditor/ckeditor5-utils';
 /**
  * Editable element which can be a {@link module:engine/view/rooteditableelement~RootEditableElement root}
@@ -31,6 +31,7 @@ export default class EditableElement extends ObservableMixin(ContainerElement) {
         super(document, name, attributes, children);
         this.set('isReadOnly', false);
         this.set('isFocused', false);
+        this.set('placeholder', undefined);
         this.bind('isReadOnly').to(document);
         this.bind('isFocused').to(document, 'isFocused', isFocused => isFocused && document.selection.editableElement == this);
         // Update focus state based on selection changes.

package/src/view/element.d.ts

@@ -5,12 +5,12 @@
 /**
  * @module engine/view/element
  */
-import Node from './node.js';
+import Node from './node';
 import { type ArrayOrItem } from '@ckeditor/ckeditor5-utils';
-import { type MatcherPattern } from './matcher.js';
-import { type StyleValue } from './stylesmap.js';
-import type Document from './document.js';
-import type Item from './item.js';
+import { type MatcherPattern } from './matcher';
+import { type StyleValue } from './stylesmap';
+import type Document from './document';
+import type Item from './item';
 /**
  * View element.
  *

package/src/view/element.js

@@ -5,12 +5,12 @@
 /**
  * @module engine/view/element
  */
-import Node from './node.js';
-import Text from './text.js';
-import TextProxy from './textproxy.js';
+import Node from './node';
+import Text from './text';
+import TextProxy from './textproxy';
 import { isIterable, toArray, toMap } from '@ckeditor/ckeditor5-utils';
-import { default as Matcher } from './matcher.js';
-import { default as StylesMap } from './stylesmap.js';
+import { default as Matcher } from './matcher';
+import { default as StylesMap } from './stylesmap';
 // @if CK_DEBUG_ENGINE // const { convertMapToTags } = require( '../dev-utils/utils' );
 /**
  * View element.

package/src/view/emptyelement.d.ts

@@ -5,10 +5,10 @@
 /**
  * @module engine/view/emptyelement
  */
-import Element, { type ElementAttributes } from './element.js';
-import Node from './node.js';
-import type Document from './document.js';
-import type Item from './item.js';
+import Element, { type ElementAttributes } from './element';
+import Node from './node';
+import type Document from './document';
+import type Item from './item';
 /**
  * Empty element class. It is used to represent elements that cannot contain any child nodes (for example `<img>` elements).
  *

package/src/view/emptyelement.js

@@ -5,8 +5,8 @@
 /**
  * @module engine/view/emptyelement
  */
-import Element from './element.js';
-import Node from './node.js';
+import Element from './element';
+import Node from './node';
 import { CKEditorError } from '@ckeditor/ckeditor5-utils';
 /**
  * Empty element class. It is used to represent elements that cannot contain any child nodes (for example `<img>` elements).

package/src/view/filler.d.ts

@@ -2,7 +2,7 @@
  * @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 View from './view.js';
+import type View from './view';
 /**
  * Set of utilities related to handling block and inline fillers.
  *

package/src/view/item.d.ts

@@ -2,8 +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 Node from './node.js';
-import type TextProxy from './textproxy.js';
+import type Node from './node';
+import type TextProxy from './textproxy';
 /**
  * @module engine/view/item
  */

package/src/view/matcher.d.ts

@@ -5,7 +5,7 @@
 /**
  * @module engine/view/matcher
  */
-import type Element from './element.js';
+import type Element from './element';
 /**
  * View matcher class.
  * Instance of this class can be used to find {@link module:engine/view/element~Element elements} that match given pattern.

package/src/view/node.d.ts

@@ -5,11 +5,11 @@
 /**
  * @module engine/view/node
  */
-import TypeCheckable from './typecheckable.js';
-import '@ckeditor/ckeditor5-utils/src/version.js';
-import type { default as Document, ChangeType } from './document.js';
-import type DocumentFragment from './documentfragment.js';
-import type Element from './element.js';
+import TypeCheckable from './typecheckable';
+import '@ckeditor/ckeditor5-utils/src/version';
+import type { default as Document, ChangeType } from './document';
+import type DocumentFragment from './documentfragment';
+import type Element from './element';
 declare const Node_base: import("@ckeditor/ckeditor5-utils").Mixed<typeof TypeCheckable, import("@ckeditor/ckeditor5-utils").Emitter>;
 /**
  * Abstract view node class.

package/src/view/node.js

@@ -5,11 +5,11 @@
 /**
  * @module engine/view/node
  */
-import TypeCheckable from './typecheckable.js';
+import TypeCheckable from './typecheckable';
 import { CKEditorError, EmitterMixin, compareArrays } from '@ckeditor/ckeditor5-utils';
 import { clone } from 'lodash-es';
 // To check if component is loaded more than once.
-import '@ckeditor/ckeditor5-utils/src/version.js';
+import '@ckeditor/ckeditor5-utils/src/version';
 /**
  * Abstract view node class.
  *

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

@@ -5,10 +5,10 @@
 /**
  * @module engine/view/observer/arrowkeysobserver
  */
-import Observer from './observer.js';
-import type View from '../view.js';
-import type { KeyEventData } from './keyobserver.js';
-import type { BubblingEvent } from './bubblingemittermixin.js';
+import Observer from './observer';
+import type View from '../view';
+import type { KeyEventData } from './keyobserver';
+import type { BubblingEvent } from './bubblingemittermixin';
 /**
  * Arrow keys observer introduces the {@link module:engine/view/document~Document#event:arrowKey `Document#arrowKey`} event.
  *

package/src/view/observer/arrowkeysobserver.js

@@ -5,8 +5,8 @@
 /**
  * @module engine/view/observer/arrowkeysobserver
  */
-import Observer from './observer.js';
-import BubblingEventInfo from './bubblingeventinfo.js';
+import Observer from './observer';
+import BubblingEventInfo from './bubblingeventinfo';
 import { isArrowKeyCode } from '@ckeditor/ckeditor5-utils';
 /**
  * Arrow keys observer introduces the {@link module:engine/view/document~Document#event:arrowKey `Document#arrowKey`} event.

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

@@ -6,8 +6,8 @@
  * @module engine/view/observer/bubblingemittermixin
  */
 import { type ArrayOrItem, type Emitter, type BaseEvent, type CallbackOptions, type Constructor, type Mixed } from '@ckeditor/ckeditor5-utils';
-import BubblingEventInfo from './bubblingeventinfo.js';
-import type Node from '../node.js';
+import BubblingEventInfo from './bubblingeventinfo';
+import type Node from '../node';
 /**
  * Bubbling emitter mixin for the view document as described in the {@link ~BubblingEmitter} interface.
  *