@ckeditor/ckeditor5-clipboard 0.0.0-nightly-20240603.0 → 0.0.0-nightly-20240604.0

package/dist/index.js

@@ -3,47 +3,39 @@
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 import { Plugin } from '@ckeditor/ckeditor5-core/dist/index.js';
-import { EventInfo, uid, toUnit, delay, DomEmitterMixin, global, Rect, ResizeObserver, env, createElement } from '@ckeditor/ckeditor5-utils/dist/index.js';
+import { EventInfo, uid, toUnit, global, Rect, ResizeObserver, delay, DomEmitterMixin, env, createElement } from '@ckeditor/ckeditor5-utils/dist/index.js';
 import { DomEventObserver, DataTransfer, Range, MouseObserver, LiveRange } from '@ckeditor/ckeditor5-engine/dist/index.js';
 import { mapValues, throttle } from 'lodash-es';
 import { Widget, isWidget } from '@ckeditor/ckeditor5-widget/dist/index.js';
 import { View } from '@ckeditor/ckeditor5-ui/dist/index.js';
 
-/**
- * Clipboard events observer.
- *
- * Fires the following events:
- *
- * * {@link module:engine/view/document~Document#event:clipboardInput},
- * * {@link module:engine/view/document~Document#event:paste},
- * * {@link module:engine/view/document~Document#event:copy},
- * * {@link module:engine/view/document~Document#event:cut},
- * * {@link module:engine/view/document~Document#event:drop},
- * * {@link module:engine/view/document~Document#event:dragover},
- * * {@link module:engine/view/document~Document#event:dragging},
- * * {@link module:engine/view/document~Document#event:dragstart},
- * * {@link module:engine/view/document~Document#event:dragend},
- * * {@link module:engine/view/document~Document#event:dragenter},
- * * {@link module:engine/view/document~Document#event:dragleave}.
- *
- * **Note**: This observer is not available by default (ckeditor5-engine does not add it on its own).
- * To make it available, it needs to be added to {@link module:engine/view/document~Document} by using
- * the {@link module:engine/view/view~View#addObserver `View#addObserver()`} method. Alternatively, you can load the
- * {@link module:clipboard/clipboard~Clipboard} plugin which adds this observer automatically (because it uses it).
- */ class ClipboardObserver extends DomEventObserver {
-    domEventType = [
-        'paste',
-        'copy',
-        'cut',
-        'drop',
-        'dragover',
-        'dragstart',
-        'dragend',
-        'dragenter',
-        'dragleave'
-    ];
+class ClipboardObserver extends DomEventObserver {
+    onDomEvent(domEvent) {
+        const nativeDataTransfer = 'clipboardData' in domEvent ? domEvent.clipboardData : domEvent.dataTransfer;
+        const cacheFiles = domEvent.type == 'drop' || domEvent.type == 'paste';
+        const evtData = {
+            dataTransfer: new DataTransfer(nativeDataTransfer, {
+                cacheFiles
+            })
+        };
+        if (domEvent.type == 'drop' || domEvent.type == 'dragover') {
+            evtData.dropRange = getDropViewRange(this.view, domEvent);
+        }
+        this.fire(domEvent.type, domEvent, evtData);
+    }
     constructor(view){
         super(view);
+        this.domEventType = [
+            'paste',
+            'copy',
+            'cut',
+            'drop',
+            'dragover',
+            'dragstart',
+            'dragend',
+            'dragenter',
+            'dragleave'
+        ];
         const viewDocument = this.document;
         this.listenTo(viewDocument, 'paste', handleInput('clipboardInput'), {
             priority: 'low'
@@ -77,19 +69,6 @@ import { View } from '@ckeditor/ckeditor5-ui/dist/index.js';
             };
         }
     }
-    onDomEvent(domEvent) {
-        const nativeDataTransfer = 'clipboardData' in domEvent ? domEvent.clipboardData : domEvent.dataTransfer;
-        const cacheFiles = domEvent.type == 'drop' || domEvent.type == 'paste';
-        const evtData = {
-            dataTransfer: new DataTransfer(nativeDataTransfer, {
-                cacheFiles
-            })
-        };
-        if (domEvent.type == 'drop' || domEvent.type == 'dragover') {
-            evtData.dropRange = getDropViewRange(this.view, domEvent);
-        }
-        this.fire(domEvent.type, domEvent, evtData);
-    }
 }
 function getDropViewRange(view, domEvent) {
     const domDoc = domEvent.target.ownerDocument;
@@ -164,8 +143,6 @@ function getDropViewRange(view, domEvent) {
 /**
  * @license Copyright (c) 2003-2024, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */ /**
- * @module clipboard/utils/viewtoplaintext
  */ // Elements which should not have empty-line padding.
 // Most `view.ContainerElement` want to be separate by new-line, but some are creating one structure
 // together (like `<li>`) so it is better to separate them by only one "\n".
@@ -193,9 +170,9 @@ const listElements = [
         return '\n'; // Convert soft breaks to single line break (#8045).
     }
     /**
-	 * Item is a document fragment, attribute element or container element. It doesn't
-	 * have it's own text value, so we need to convert its children elements.
-	 */ let text = '';
+     * Item is a document fragment, attribute element or container element. It doesn't
+     * have it's own text value, so we need to convert its children elements.
+     */ let text = '';
     let prev = null;
     for (const child of viewItem.getChildren()){
         text += newLinePadding(child, prev) + viewToPlainText(child);
@@ -216,9 +193,9 @@ const listElements = [
     }
     if (listElements.includes(element.name) && listElements.includes(previous.name)) {
         /**
-		 * Because `<ul>` and `<ol>` are AttributeElements, two consecutive lists will not have any padding between
-		 * them (see the `if` statement below). To fix this, we need to make an exception for this case.
-		 */ return '\n\n';
+         * Because `<ul>` and `<ol>` are AttributeElements, two consecutive lists will not have any padding between
+         * them (see the `if` statement below). To fix this, we need to make an exception for this case.
+         */ return '\n\n';
     }
     if (!element.is('containerElement') && !previous.is('containerElement')) {
         // Don't add padding between non-container elements.
@@ -232,49 +209,39 @@ const listElements = [
     return '\n\n';
 }
 
-/**
- * Part of the clipboard logic. Responsible for collecting markers from selected fragments
- * and restoring them with proper positions in pasted elements.
- *
- * @internal
- */ class ClipboardMarkersUtils extends Plugin {
-    /**
-	 * Map of marker names that can be copied.
-	 *
-	 * @internal
-	 */ _markersToCopy = new Map();
+class ClipboardMarkersUtils extends Plugin {
     /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'ClipboardMarkersUtils';
     }
     /**
-	 * Registers marker name as copyable in clipboard pipeline.
-	 *
-	 * @param markerName Name of marker that can be copied.
-	 * @param config Configuration that describes what can be performed on specified marker.
-	 * @internal
-	 */ _registerMarkerToCopy(markerName, config) {
+     * Registers marker name as copyable in clipboard pipeline.
+     *
+     * @param markerName Name of marker that can be copied.
+     * @param config Configuration that describes what can be performed on specified marker.
+     * @internal
+     */ _registerMarkerToCopy(markerName, config) {
         this._markersToCopy.set(markerName, config);
     }
     /**
-	 * Performs copy markers on provided selection and paste it to fragment returned from `getCopiedFragment`.
-	 *
-	 * 	1. Picks all markers in provided selection.
-	 * 	2. Inserts fake markers to document.
-	 * 	3. Gets copied selection fragment from document.
-	 * 	4. Removes fake elements from fragment and document.
-	 * 	5. Inserts markers in the place of removed fake markers.
-	 *
-	 * Due to selection modification, when inserting items, `getCopiedFragment` must *always* operate on `writer.model.document.selection'.
-	 * Do not use any other custom selection object within callback, as this will lead to out-of-bounds exceptions in rare scenarios.
-	 *
-	 * @param action Type of clipboard action.
-	 * @param writer An instance of the model writer.
-	 * @param selection Selection to be checked.
-	 * @param getCopiedFragment	Callback that performs copy of selection and returns it as fragment.
-	 * @internal
-	 */ _copySelectedFragmentWithMarkers(action, selection, getCopiedFragment = (writer)=>writer.model.getSelectedContent(writer.model.document.selection)) {
+     * Performs copy markers on provided selection and paste it to fragment returned from `getCopiedFragment`.
+     *
+     * 	1. Picks all markers in provided selection.
+     * 	2. Inserts fake markers to document.
+     * 	3. Gets copied selection fragment from document.
+     * 	4. Removes fake elements from fragment and document.
+     * 	5. Inserts markers in the place of removed fake markers.
+     *
+     * Due to selection modification, when inserting items, `getCopiedFragment` must *always* operate on `writer.model.document.selection'.
+     * Do not use any other custom selection object within callback, as this will lead to out-of-bounds exceptions in rare scenarios.
+     *
+     * @param action Type of clipboard action.
+     * @param writer An instance of the model writer.
+     * @param selection Selection to be checked.
+     * @param getCopiedFragment	Callback that performs copy of selection and returns it as fragment.
+     * @internal
+     */ _copySelectedFragmentWithMarkers(action, selection, getCopiedFragment = (writer)=>writer.model.getSelectedContent(writer.model.document.selection)) {
         return this.editor.model.change((writer)=>{
             const oldSelection = writer.model.document.selection;
             // In some scenarios, such like in drag & drop, passed `selection` parameter is not actually
@@ -297,7 +264,7 @@ const listElements = [
             // This function checks special case of such problem. Markers that are orphaned at the start position
             // and end position in the same time. Basically it means that they overlaps whole element.
             for (const [markerName, elements] of Object.entries(sourceSelectionInsertedMarkers)){
-                fakeMarkersRangesInsideRange[markerName] ||= writer.createRangeIn(fragment);
+                fakeMarkersRangesInsideRange[markerName] || (fakeMarkersRangesInsideRange[markerName] = writer.createRangeIn(fragment));
                 for (const element of elements){
                     writer.remove(element);
                 }
@@ -312,24 +279,24 @@ const listElements = [
         });
     }
     /**
-	 * Performs paste of markers on already pasted element.
-	 *
-	 * 	1. Inserts fake markers that are present in fragment element (such fragment will be processed in `getPastedDocumentElement`).
-	 * 	2. Calls `getPastedDocumentElement` and gets element that is inserted into root model.
-	 * 	3. Removes all fake markers present in transformed element.
-	 * 	4. Inserts new markers with removed fake markers ranges into pasted fragment.
-	 *
-	 * There are multiple edge cases that have to be considered before calling this function:
-	 *
-	 * 	* `markers` are inserted into the same element that must be later transformed inside `getPastedDocumentElement`.
-	 * 	* Fake marker elements inside `getPastedDocumentElement` can be cloned, but their ranges cannot overlap.
-	 * 	* If `duplicateOnPaste` is `true` in marker config then associated marker ID is regenerated before pasting.
-	 *
-	 * @param action Type of clipboard action.
-	 * @param markers Object that maps marker name to corresponding range.
-	 * @param getPastedDocumentElement Getter used to get target markers element.
-	 * @internal
-	 */ _pasteMarkersIntoTransformedElement(markers, getPastedDocumentElement) {
+     * Performs paste of markers on already pasted element.
+     *
+     * 	1. Inserts fake markers that are present in fragment element (such fragment will be processed in `getPastedDocumentElement`).
+     * 	2. Calls `getPastedDocumentElement` and gets element that is inserted into root model.
+     * 	3. Removes all fake markers present in transformed element.
+     * 	4. Inserts new markers with removed fake markers ranges into pasted fragment.
+     *
+     * There are multiple edge cases that have to be considered before calling this function:
+     *
+     * 	* `markers` are inserted into the same element that must be later transformed inside `getPastedDocumentElement`.
+     * 	* Fake marker elements inside `getPastedDocumentElement` can be cloned, but their ranges cannot overlap.
+     * 	* If `duplicateOnPaste` is `true` in marker config then associated marker ID is regenerated before pasting.
+     *
+     * @param action Type of clipboard action.
+     * @param markers Object that maps marker name to corresponding range.
+     * @param getPastedDocumentElement Getter used to get target markers element.
+     * @internal
+     */ _pasteMarkersIntoTransformedElement(markers, getPastedDocumentElement) {
         const pasteMarkers = this._getPasteMarkersFromRangeMap(markers);
         return this.editor.model.change((writer)=>{
             // Inserts fake markers into source fragment / element that is later transformed inside `getPastedDocumentElement`.
@@ -356,13 +323,13 @@ const listElements = [
         });
     }
     /**
-	 * Pastes document fragment with markers to document.
-	 * If `duplicateOnPaste` is `true` in marker config then associated markers IDs
-	 * are regenerated before pasting to avoid markers duplications in content.
-	 *
-	 * @param fragment Document fragment that should contain already processed by pipeline markers.
-	 * @internal
-	 */ _pasteFragmentWithMarkers(fragment) {
+     * Pastes document fragment with markers to document.
+     * If `duplicateOnPaste` is `true` in marker config then associated markers IDs
+     * are regenerated before pasting to avoid markers duplications in content.
+     *
+     * @param fragment Document fragment that should contain already processed by pipeline markers.
+     * @internal
+     */ _pasteFragmentWithMarkers(fragment) {
         const pasteMarkers = this._getPasteMarkersFromRangeMap(fragment.markers);
         fragment.markers.clear();
         for (const copyableMarker of pasteMarkers){
@@ -371,17 +338,17 @@ const listElements = [
         return this.editor.model.insertContent(fragment);
     }
     /**
-	 * In some situations we have to perform copy on selected fragment with certain markers. This function allows to temporarily bypass
-	 * restrictions on markers that we want to copy.
-	 *
-	 * This function executes `executor()` callback. For the duration of the callback, if the clipboard pipeline is used to copy
-	 * content, markers with the specified name will be copied to the clipboard as well.
-	 *
-	 * @param markerName Which markers should be copied.
-	 * @param executor Callback executed.
-	 * @param config Optional configuration flags used to copy (such like partial copy flag).
-	 * @internal
-	 */ _forceMarkersCopy(markerName, executor, config = {
+     * In some situations we have to perform copy on selected fragment with certain markers. This function allows to temporarily bypass
+     * restrictions on markers that we want to copy.
+     *
+     * This function executes `executor()` callback. For the duration of the callback, if the clipboard pipeline is used to copy
+     * content, markers with the specified name will be copied to the clipboard as well.
+     *
+     * @param markerName Which markers should be copied.
+     * @param executor Callback executed.
+     * @param config Optional configuration flags used to copy (such like partial copy flag).
+     * @internal
+     */ _forceMarkersCopy(markerName, executor, config = {
         allowedActions: 'all',
         copyPartiallySelected: true,
         duplicateOnPaste: true
@@ -396,12 +363,12 @@ const listElements = [
         }
     }
     /**
-	 * Checks if marker can be copied.
-	 *
-	 * @param markerName Name of checked marker.
-	 * @param action Type of clipboard action. If null then checks only if marker is registered as copyable.
-	 * @internal
-	 */ _isMarkerCopyable(markerName, action) {
+     * Checks if marker can be copied.
+     *
+     * @param markerName Name of checked marker.
+     * @param action Type of clipboard action. If null then checks only if marker is registered as copyable.
+     * @internal
+     */ _isMarkerCopyable(markerName, action) {
         const config = this._getMarkerClipboardConfig(markerName);
         if (!config) {
             return false;
@@ -414,43 +381,43 @@ const listElements = [
         return allowedActions === 'all' || allowedActions.includes(action);
     }
     /**
-	 * Checks if marker has any clipboard copy behavior configuration.
-	 *
-	 * @param markerName Name of checked marker.
-	 */ _hasMarkerConfiguration(markerName) {
+     * Checks if marker has any clipboard copy behavior configuration.
+     *
+     * @param markerName Name of checked marker.
+     */ _hasMarkerConfiguration(markerName) {
         return !!this._getMarkerClipboardConfig(markerName);
     }
     /**
-	 * Returns marker's configuration flags passed during registration.
-	 *
-	 * @param markerName Name of marker that should be returned.
-	 * @internal
-	 */ _getMarkerClipboardConfig(markerName) {
+     * Returns marker's configuration flags passed during registration.
+     *
+     * @param markerName Name of marker that should be returned.
+     * @internal
+     */ _getMarkerClipboardConfig(markerName) {
         const [markerNamePrefix] = markerName.split(':');
         return this._markersToCopy.get(markerNamePrefix) || null;
     }
     /**
-	 * First step of copying markers. It looks for markers intersecting with given selection and inserts `$marker` elements
-	 * at positions where document markers start or end. This way `$marker` elements can be easily copied together with
-	 * the rest of the content of the selection.
-	 *
-	 * @param writer An instance of the model writer.
-	 * @param selection Selection to be checked.
-	 * @param action Type of clipboard action.
-	 */ _insertFakeMarkersIntoSelection(writer, selection, action) {
+     * First step of copying markers. It looks for markers intersecting with given selection and inserts `$marker` elements
+     * at positions where document markers start or end. This way `$marker` elements can be easily copied together with
+     * the rest of the content of the selection.
+     *
+     * @param writer An instance of the model writer.
+     * @param selection Selection to be checked.
+     * @param action Type of clipboard action.
+     */ _insertFakeMarkersIntoSelection(writer, selection, action) {
         const copyableMarkers = this._getCopyableMarkersFromSelection(writer, selection, action);
         return this._insertFakeMarkersElements(writer, copyableMarkers);
     }
     /**
-	 * Returns array of markers that can be copied in specified selection.
-	 *
-	 * If marker cannot be copied partially (according to `copyPartiallySelected` configuration flag) and
-	 * is not present entirely in any selection range then it will be skipped.
-	 *
-	 * @param writer An instance of the model writer.
-	 * @param selection  Selection which will be checked.
-	 * @param action Type of clipboard action. If null then checks only if marker is registered as copyable.
-	 */ _getCopyableMarkersFromSelection(writer, selection, action) {
+     * Returns array of markers that can be copied in specified selection.
+     *
+     * If marker cannot be copied partially (according to `copyPartiallySelected` configuration flag) and
+     * is not present entirely in any selection range then it will be skipped.
+     *
+     * @param writer An instance of the model writer.
+     * @param selection  Selection which will be checked.
+     * @param action Type of clipboard action. If null then checks only if marker is registered as copyable.
+     */ _getCopyableMarkersFromSelection(writer, selection, action) {
         const selectionRanges = Array.from(selection.getRanges());
         // Picks all markers in provided ranges. Ensures that there are no duplications if
         // there are multiple ranges that intersects with the same marker.
@@ -488,13 +455,13 @@ const listElements = [
         });
     }
     /**
-	 * Picks all markers from markers map that can be pasted.
-	 * If `duplicateOnPaste` is `true`, it regenerates their IDs to ensure uniqueness.
-	 * If marker is not registered, it will be kept in the array anyway.
-	 *
-	 * @param markers Object that maps marker name to corresponding range.
-	 * @param action Type of clipboard action. If null then checks only if marker is registered as copyable.
-	 */ _getPasteMarkersFromRangeMap(markers, action = null) {
+     * Picks all markers from markers map that can be pasted.
+     * If `duplicateOnPaste` is `true`, it regenerates their IDs to ensure uniqueness.
+     * If marker is not registered, it will be kept in the array anyway.
+     *
+     * @param markers Object that maps marker name to corresponding range.
+     * @param action Type of clipboard action. If null then checks only if marker is registered as copyable.
+     */ _getPasteMarkersFromRangeMap(markers, action = null) {
         const { model } = this.editor;
         const entries = markers instanceof Map ? Array.from(markers.entries()) : Object.entries(markers);
         return entries.flatMap(([markerName, range])=>{
@@ -523,13 +490,13 @@ const listElements = [
         });
     }
     /**
-	 * Inserts specified array of fake markers elements to document and assigns them `type` and `name` attributes.
-	 * Fake markers elements are used to calculate position of markers on pasted fragment that were transformed during
-	 * steps between copy and paste.
-	 *
-	 * @param writer An instance of the model writer.
-	 * @param markers Array of markers that will be inserted.
-	 */ _insertFakeMarkersElements(writer, markers) {
+     * Inserts specified array of fake markers elements to document and assigns them `type` and `name` attributes.
+     * Fake markers elements are used to calculate position of markers on pasted fragment that were transformed during
+     * steps between copy and paste.
+     *
+     * @param writer An instance of the model writer.
+     * @param markers Array of markers that will be inserted.
+     */ _insertFakeMarkersElements(writer, markers) {
         const mappedMarkers = {};
         const sortedMarkers = markers.flatMap((marker)=>{
             const { start, end } = marker.range;
@@ -562,17 +529,17 @@ const listElements = [
         return mappedMarkers;
     }
     /**
-	 * Removes all `$marker` elements from the given document fragment.
-	 *
-	 * Returns an object where keys are marker names, and values are ranges corresponding to positions
-	 * where `$marker` elements were inserted.
-	 *
-	 * If the document fragment had only one `$marker` element for given marker (start or end) the other boundary is set automatically
-	 * (to the end or start of the document fragment, respectively).
-	 *
-	 * @param writer An instance of the model writer.
-	 * @param rootElement The element to be checked.
-	 */ _removeFakeMarkersInsideElement(writer, rootElement) {
+     * Removes all `$marker` elements from the given document fragment.
+     *
+     * Returns an object where keys are marker names, and values are ranges corresponding to positions
+     * where `$marker` elements were inserted.
+     *
+     * If the document fragment had only one `$marker` element for given marker (start or end) the other boundary is set automatically
+     * (to the end or start of the document fragment, respectively).
+     *
+     * @param writer An instance of the model writer.
+     * @param rootElement The element to be checked.
+     */ _removeFakeMarkersInsideElement(writer, rootElement) {
         const fakeMarkersElements = this._getAllFakeMarkersFromElement(writer, rootElement);
         const fakeMarkersRanges = fakeMarkersElements.reduce((acc, fakeMarker)=>{
             const position = fakeMarker.markerElement && writer.createPositionBefore(fakeMarker.markerElement);
@@ -617,14 +584,14 @@ const listElements = [
             ]), range.end || writer.createPositionAt(rootElement, 'end')));
     }
     /**
-	 * Returns array that contains list of fake markers with corresponding `$marker` elements.
-	 *
-	 * For each marker, there can be two `$marker` elements or only one (if the document fragment contained
-	 * only the beginning or only the end of a marker).
-	 *
-	 * @param writer An instance of the model writer.
-	 * @param rootElement The element to be checked.
-	 */ _getAllFakeMarkersFromElement(writer, rootElement) {
+     * Returns array that contains list of fake markers with corresponding `$marker` elements.
+     *
+     * For each marker, there can be two `$marker` elements or only one (if the document fragment contained
+     * only the beginning or only the end of a marker).
+     *
+     * @param writer An instance of the model writer.
+     * @param rootElement The element to be checked.
+     */ _getAllFakeMarkersFromElement(writer, rootElement) {
         const foundFakeMarkers = Array.from(writer.createRangeIn(rootElement)).flatMap(({ item })=>{
             if (!item.is('element', '$marker')) {
                 return [];
@@ -678,12 +645,12 @@ const listElements = [
         ];
     }
     /**
-	 * When copy of markers occurs we have to make sure that pasted markers have different names
-	 * than source markers. This functions helps with assigning unique part to marker name to
-	 * prevent duplicated markers error.
-	 *
-	 * @param name Name of marker
-	 */ _getUniqueMarkerName(name) {
+     * When copy of markers occurs we have to make sure that pasted markers have different names
+     * than source markers. This functions helps with assigning unique part to marker name to
+     * prevent duplicated markers error.
+     *
+     * @param name Name of marker
+     */ _getUniqueMarkerName(name) {
         const parts = name.split(':');
         const newId = uid().substring(1, 6);
         // It looks like the marker already is UID marker so in this scenario just swap
@@ -698,128 +665,32 @@ const listElements = [
         // example: comment => comment:{ newId }
         return `${parts.join(':')}:${newId}`;
     }
+    constructor(){
+        super(...arguments);
+        /**
+         * Map of marker names that can be copied.
+         *
+         * @internal
+         */ this._markersToCopy = new Map();
+    }
 }
 
-// Input pipeline events overview:
-//
-//              ┌──────────────────────┐          ┌──────────────────────┐
-//              │     view.Document    │          │     view.Document    │
-//              │         paste        │          │         drop         │
-//              └───────────┬──────────┘          └───────────┬──────────┘
-//                          │                                 │
-//                          └────────────────┌────────────────┘
-//                                           │
-//                                 ┌─────────V────────┐
-//                                 │   view.Document  │   Retrieves text/html or text/plain from data.dataTransfer
-//                                 │  clipboardInput  │   and processes it to view.DocumentFragment.
-//                                 └─────────┬────────┘
-//                                           │
-//                               ┌───────────V───────────┐
-//                               │   ClipboardPipeline   │   Converts view.DocumentFragment to model.DocumentFragment.
-//                               │  inputTransformation  │
-//                               └───────────┬───────────┘
-//                                           │
-//                                ┌──────────V──────────┐
-//                                │  ClipboardPipeline  │   Calls model.insertContent().
-//                                │   contentInsertion  │
-//                                └─────────────────────┘
-//
-//
-// Output pipeline events overview:
-//
-//              ┌──────────────────────┐          ┌──────────────────────┐
-//              │     view.Document    │          │     view.Document    │   Retrieves the selected model.DocumentFragment
-//              │         copy         │          │          cut         │   and fires the `outputTransformation` event.
-//              └───────────┬──────────┘          └───────────┬──────────┘
-//                          │                                 │
-//                          └────────────────┌────────────────┘
-//                                           │
-//                               ┌───────────V───────────┐
-//                               │   ClipboardPipeline   │   Processes model.DocumentFragment and converts it to
-//                               │  outputTransformation │   view.DocumentFragment.
-//                               └───────────┬───────────┘
-//                                           │
-//                                 ┌─────────V────────┐
-//                                 │   view.Document  │   Processes view.DocumentFragment to text/html and text/plain
-//                                 │  clipboardOutput │   and stores the results in data.dataTransfer.
-//                                 └──────────────────┘
-//
-/**
- * The clipboard pipeline feature. It is responsible for intercepting the `paste` and `drop` events and
- * passing the pasted content through a series of events in order to insert it into the editor's content.
- * It also handles the `cut` and `copy` events to fill the native clipboard with the serialized editor's data.
- *
- * # Input pipeline
- *
- * The behavior of the default handlers (all at a `low` priority):
- *
- * ## Event: `paste` or `drop`
- *
- * 1. Translates the event data.
- * 2. Fires the {@link module:engine/view/document~Document#event:clipboardInput `view.Document#clipboardInput`} event.
- *
- * ## Event: `view.Document#clipboardInput`
- *
- * 1. If the `data.content` event field is already set (by some listener on a higher priority), it takes this content and fires the event
- *    from the last point.
- * 2. Otherwise, it retrieves `text/html` or `text/plain` from `data.dataTransfer`.
- * 3. Normalizes the raw data by applying simple filters on string data.
- * 4. Processes the raw data to {@link module:engine/view/documentfragment~DocumentFragment `view.DocumentFragment`} with the
- *    {@link module:engine/controller/datacontroller~DataController#htmlProcessor `DataController#htmlProcessor`}.
- * 5. Fires the {@link module:clipboard/clipboardpipeline~ClipboardPipeline#event:inputTransformation
- *   `ClipboardPipeline#inputTransformation`} event with the view document fragment in the `data.content` event field.
- *
- * ## Event: `ClipboardPipeline#inputTransformation`
- *
- * 1. Converts {@link module:engine/view/documentfragment~DocumentFragment `view.DocumentFragment`} from the `data.content` field to
- *    {@link module:engine/model/documentfragment~DocumentFragment `model.DocumentFragment`}.
- * 2. Fires the {@link module:clipboard/clipboardpipeline~ClipboardPipeline#event:contentInsertion `ClipboardPipeline#contentInsertion`}
- *    event with the model document fragment in the `data.content` event field.
- *    **Note**: The `ClipboardPipeline#contentInsertion` event is fired within a model change block to allow other handlers
- *    to run in the same block without post-fixers called in between (i.e., the selection post-fixer).
- *
- * ## Event: `ClipboardPipeline#contentInsertion`
- *
- * 1. Calls {@link module:engine/model/model~Model#insertContent `model.insertContent()`} to insert `data.content`
- *    at the current selection position.
- *
- * # Output pipeline
- *
- * The behavior of the default handlers (all at a `low` priority):
- *
- * ## Event: `copy`, `cut` or `dragstart`
- *
- * 1. Retrieves the selected {@link module:engine/model/documentfragment~DocumentFragment `model.DocumentFragment`} by calling
- *    {@link module:engine/model/model~Model#getSelectedContent `model#getSelectedContent()`}.
- * 2. Converts the model document fragment to {@link module:engine/view/documentfragment~DocumentFragment `view.DocumentFragment`}.
- * 3. Fires the {@link module:engine/view/document~Document#event:clipboardOutput `view.Document#clipboardOutput`} event
- *    with the view document fragment in the `data.content` event field.
- *
- * ## Event: `view.Document#clipboardOutput`
- *
- * 1. Processes `data.content` to HTML and plain text with the
- *    {@link module:engine/controller/datacontroller~DataController#htmlProcessor `DataController#htmlProcessor`}.
- * 2. Updates the `data.dataTransfer` data for `text/html` and `text/plain` with the processed data.
- * 3. For the `cut` method, calls {@link module:engine/model/model~Model#deleteContent `model.deleteContent()`}
- *    on the current selection.
- *
- * Read more about the clipboard integration in the {@glink framework/deep-dive/clipboard clipboard deep-dive} guide.
- */ class ClipboardPipeline extends Plugin {
+class ClipboardPipeline extends Plugin {
     /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'ClipboardPipeline';
     }
     /**
-	 * @inheritDoc
-	 */ static get requires() {
+     * @inheritDoc
+     */ static get requires() {
         return [
             ClipboardMarkersUtils
         ];
     }
     /**
-	 * @inheritDoc
-	 */ init() {
+     * @inheritDoc
+     */ init() {
         const editor = this.editor;
         const view = editor.editing.view;
         view.addObserver(ClipboardObserver);
@@ -827,10 +698,10 @@ const listElements = [
         this._setupCopyCut();
     }
     /**
-	 * Fires Clipboard `'outputTransformation'` event for given parameters.
-	 *
-	 * @internal
-	 */ _fireOutputTransformationEvent(dataTransfer, selection, method) {
+     * Fires Clipboard `'outputTransformation'` event for given parameters.
+     *
+     * @internal
+     */ _fireOutputTransformationEvent(dataTransfer, selection, method) {
         const clipboardMarkersUtils = this.editor.plugins.get('ClipboardMarkersUtils');
         this.editor.model.enqueueChange({
             isUndoable: method === 'cut'
@@ -844,8 +715,8 @@ const listElements = [
         });
     }
     /**
-	 * The clipboard paste pipeline.
-	 */ _setupPasteDrop() {
+     * The clipboard paste pipeline.
+     */ _setupPasteDrop() {
         const editor = this.editor;
         const model = editor.model;
         const view = editor.editing.view;
@@ -925,8 +796,8 @@ const listElements = [
         });
     }
     /**
-	 * The clipboard copy/cut pipeline.
-	 */ _setupCopyCut() {
+     * The clipboard copy/cut pipeline.
+     */ _setupCopyCut() {
         const editor = this.editor;
         const modelDocument = editor.model.document;
         const view = editor.editing.view;
@@ -974,13 +845,11 @@ const listElements = [
     }
 }
 
-const toPx = /* #__PURE__ */ toUnit('px');
-/**
- * The horizontal drop target line view.
- */ class LineView extends View {
+const toPx = toUnit('px');
+class LineView extends View {
     /**
-	 * @inheritDoc
-	 */ constructor(){
+     * @inheritDoc
+     */ constructor(){
         super();
         const bind = this.bindTemplate;
         this.set({
@@ -1007,48 +876,20 @@ const toPx = /* #__PURE__ */ toUnit('px');
     }
 }
 
-/**
- * Part of the Drag and Drop handling. Responsible for finding and displaying the drop target.
- *
- * @internal
- */ class DragDropTarget extends Plugin {
-    /**
-	 * A delayed callback removing the drop marker.
-	 *
-	 * @internal
-	 */ removeDropMarkerDelayed = delay(()=>this.removeDropMarker(), 40);
-    /**
-	 * A throttled callback updating the drop marker.
-	 */ _updateDropMarkerThrottled = throttle((targetRange)=>this._updateDropMarker(targetRange), 40);
-    /**
-	 * A throttled callback reconverting the drop parker.
-	 */ _reconvertMarkerThrottled = throttle(()=>{
-        if (this.editor.model.markers.has('drop-target')) {
-            this.editor.editing.reconvertMarker('drop-target');
-        }
-    }, 0);
-    /**
-	 * The horizontal drop target line view.
-	 */ _dropTargetLineView = new LineView();
+class DragDropTarget extends Plugin {
     /**
-	 * DOM Emitter.
-	 */ _domEmitter = new (DomEmitterMixin())();
-    /**
-	 * Map of document scrollable elements.
-	 */ _scrollables = new Map();
-    /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'DragDropTarget';
     }
     /**
-	 * @inheritDoc
-	 */ init() {
+     * @inheritDoc
+     */ init() {
         this._setupDropMarker();
     }
     /**
-	 * @inheritDoc
-	 */ destroy() {
+     * @inheritDoc
+     */ destroy() {
         this._domEmitter.stopListening();
         for (const { resizeObserver } of this._scrollables.values()){
             resizeObserver.destroy();
@@ -1059,10 +900,10 @@ const toPx = /* #__PURE__ */ toUnit('px');
         return super.destroy();
     }
     /**
-	 * Finds the drop target range and updates the drop marker.
-	 *
-	 * @internal
-	 */ updateDropMarker(targetViewElement, targetViewRanges, clientX, clientY, blockMode, draggedRange) {
+     * Finds the drop target range and updates the drop marker.
+     *
+     * @internal
+     */ updateDropMarker(targetViewElement, targetViewRanges, clientX, clientY, blockMode, draggedRange) {
         this.removeDropMarkerDelayed.cancel();
         const targetRange = findDropTargetRange(this.editor, targetViewElement, targetViewRanges, clientX, clientY, blockMode, draggedRange);
         /* istanbul ignore next -- @preserve */ if (!targetRange) {
@@ -1075,10 +916,10 @@ const toPx = /* #__PURE__ */ toUnit('px');
         this._updateDropMarkerThrottled(targetRange);
     }
     /**
-	 * Finds the final drop target range.
-	 *
-	 * @internal
-	 */ getFinalDropRange(targetViewElement, targetViewRanges, clientX, clientY, blockMode, draggedRange) {
+     * Finds the final drop target range.
+     *
+     * @internal
+     */ getFinalDropRange(targetViewElement, targetViewRanges, clientX, clientY, blockMode, draggedRange) {
         const targetRange = findDropTargetRange(this.editor, targetViewElement, targetViewRanges, clientX, clientY, blockMode, draggedRange);
         // The dragging markers must be removed after searching for the target range because sometimes
         // the target lands on the marker itself.
@@ -1086,10 +927,10 @@ const toPx = /* #__PURE__ */ toUnit('px');
         return targetRange;
     }
     /**
-	 * Removes the drop target marker.
-	 *
-	 * @internal
-	 */ removeDropMarker() {
+     * Removes the drop target marker.
+     *
+     * @internal
+     */ removeDropMarker() {
         const model = this.editor.model;
         this.removeDropMarkerDelayed.cancel();
         this._updateDropMarkerThrottled.cancel();
@@ -1101,8 +942,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         }
     }
     /**
-	 * Creates downcast conversion for the drop target marker.
-	 */ _setupDropMarker() {
+     * Creates downcast conversion for the drop target marker.
+     */ _setupDropMarker() {
         const editor = this.editor;
         editor.ui.view.body.add(this._dropTargetLineView);
         // Drop marker conversion for hovering over widgets.
@@ -1133,10 +974,10 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Updates the drop target marker to the provided range.
-	 *
-	 * @param targetRange The range to set the marker to.
-	 */ _updateDropMarker(targetRange) {
+     * Updates the drop target marker to the provided range.
+     *
+     * @param targetRange The range to set the marker to.
+     */ _updateDropMarker(targetRange) {
         const editor = this.editor;
         const markers = editor.model.markers;
         editor.model.change((writer)=>{
@@ -1156,8 +997,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Creates the UI element for vertical (in-line) drop target.
-	 */ _createDropTargetPosition(writer) {
+     * Creates the UI element for vertical (in-line) drop target.
+     */ _createDropTargetPosition(writer) {
         return writer.createUIElement('span', {
             class: 'ck ck-clipboard-drop-target-position'
         }, function(domDocument) {
@@ -1168,8 +1009,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Updates the horizontal drop target line.
-	 */ _updateDropTargetLine(range) {
+     * Updates the horizontal drop target line.
+     */ _updateDropTargetLine(range) {
         const editing = this.editor.editing;
         const nodeBefore = range.start.nodeBefore;
         const nodeAfter = range.start.nodeAfter;
@@ -1208,8 +1049,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         }
     }
     /**
-	 * Finds the closest scrollable element rect for the given view element.
-	 */ _getScrollableRect(viewElement) {
+     * Finds the closest scrollable element rect for the given view element.
+     */ _getScrollableRect(viewElement) {
         const rootName = viewElement.root.rootName;
         let domScrollable;
         if (this._scrollables.has(rootName)) {
@@ -1228,6 +1069,33 @@ const toPx = /* #__PURE__ */ toUnit('px');
         }
         return new Rect(domScrollable).excludeScrollbarsAndBorders();
     }
+    constructor(){
+        super(...arguments);
+        /**
+         * A delayed callback removing the drop marker.
+         *
+         * @internal
+         */ this.removeDropMarkerDelayed = delay(()=>this.removeDropMarker(), 40);
+        /**
+         * A throttled callback updating the drop marker.
+         */ this._updateDropMarkerThrottled = throttle((targetRange)=>this._updateDropMarker(targetRange), 40);
+        /**
+         * A throttled callback reconverting the drop parker.
+         */ this._reconvertMarkerThrottled = throttle(()=>{
+            if (this.editor.model.markers.has('drop-target')) {
+                this.editor.editing.reconvertMarker('drop-target');
+            }
+        }, 0);
+        /**
+         * The horizontal drop target line view.
+         */ this._dropTargetLineView = new LineView();
+        /**
+         * DOM Emitter.
+         */ this._domEmitter = new (DomEmitterMixin())();
+        /**
+         * Map of document scrollable elements.
+         */ this._scrollables = new Map();
+    }
 }
 /**
  * Returns fixed selection range for given position and target element.
@@ -1342,25 +1210,15 @@ const toPx = /* #__PURE__ */ toUnit('px');
     return domElement;
 }
 
-/**
- * Integration of a block Drag and Drop support with the block toolbar.
- *
- * @internal
- */ class DragDropBlockToolbar extends Plugin {
+class DragDropBlockToolbar extends Plugin {
     /**
-	 * Whether current dragging is started by block toolbar button dragging.
-	 */ _isBlockDragging = false;
-    /**
-	 * DOM Emitter.
-	 */ _domEmitter = new (DomEmitterMixin())();
-    /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'DragDropBlockToolbar';
     }
     /**
-	 * @inheritDoc
-	 */ init() {
+     * @inheritDoc
+     */ init() {
         const editor = this.editor;
         this.listenTo(editor, 'change:isReadOnly', (evt, name, isReadOnly)=>{
             if (isReadOnly) {
@@ -1391,14 +1249,14 @@ const toPx = /* #__PURE__ */ toUnit('px');
         }
     }
     /**
-	 * @inheritDoc
-	 */ destroy() {
+     * @inheritDoc
+     */ destroy() {
         this._domEmitter.stopListening();
         return super.destroy();
     }
     /**
-	 * The `dragstart` event handler.
-	 */ _handleBlockDragStart(domEvent) {
+     * The `dragstart` event handler.
+     */ _handleBlockDragStart(domEvent) {
         if (!this.isEnabled) {
             return;
         }
@@ -1413,8 +1271,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         view.getObserver(ClipboardObserver).onDomEvent(domEvent);
     }
     /**
-	 * The `dragover` and `drop` event handler.
-	 */ _handleBlockDragging(domEvent) {
+     * The `dragover` and `drop` event handler.
+     */ _handleBlockDragging(domEvent) {
         if (!this.isEnabled || !this._isBlockDragging) {
             return;
         }
@@ -1437,129 +1295,30 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * The `dragend` event handler.
-	 */ _handleBlockDragEnd() {
+     * The `dragend` event handler.
+     */ _handleBlockDragEnd() {
         this._isBlockDragging = false;
     }
+    constructor(){
+        super(...arguments);
+        /**
+         * Whether current dragging is started by block toolbar button dragging.
+         */ this._isBlockDragging = false;
+        /**
+         * DOM Emitter.
+         */ this._domEmitter = new (DomEmitterMixin())();
+    }
 }
 
-// Drag and drop events overview:
-//
-//                ┌──────────────────┐
-//                │     mousedown    │   Sets the draggable attribute.
-//                └─────────┬────────┘
-//                          │
-//                          └─────────────────────┐
-//                          │                     │
-//                          │           ┌─────────V────────┐
-//                          │           │      mouseup     │   Dragging did not start, removes the draggable attribute.
-//                          │           └──────────────────┘
-//                          │
-//                ┌─────────V────────┐   Retrieves the selected model.DocumentFragment
-//                │     dragstart    │   and converts it to view.DocumentFragment.
-//                └─────────┬────────┘
-//                          │
-//                ┌─────────V────────┐   Processes view.DocumentFragment to text/html and text/plain
-//                │  clipboardOutput │   and stores the results in data.dataTransfer.
-//                └─────────┬────────┘
-//                          │
-//                          │   DOM dragover
-//                          ┌────────────┐
-//                          │            │
-//                ┌─────────V────────┐   │
-//                │     dragging     │   │   Updates the drop target marker.
-//                └─────────┬────────┘   │
-//                          │            │
-//            ┌─────────────└────────────┘
-//            │             │            │
-//            │   ┌─────────V────────┐   │
-//            │   │     dragleave    │   │   Removes the drop target marker.
-//            │   └─────────┬────────┘   │
-//            │             │            │
-//        ┌───│─────────────┘            │
-//        │   │             │            │
-//        │   │   ┌─────────V────────┐   │
-//        │   │   │     dragenter    │   │   Focuses the editor view.
-//        │   │   └─────────┬────────┘   │
-//        │   │             │            │
-//        │   │             └────────────┘
-//        │   │
-//        │   └─────────────┐
-//        │   │             │
-//        │   │   ┌─────────V────────┐
-//        └───┐   │       drop       │   (The default handler of the clipboard pipeline).
-//            │   └─────────┬────────┘
-//            │             │
-//            │   ┌─────────V────────┐   Resolves the final data.targetRanges.
-//            │   │  clipboardInput  │   Aborts if dropping on dragged content.
-//            │   └─────────┬────────┘
-//            │             │
-//            │   ┌─────────V────────┐
-//            │   │  clipboardInput  │   (The default handler of the clipboard pipeline).
-//            │   └─────────┬────────┘
-//            │             │
-//            │ ┌───────────V───────────┐
-//            │ │  inputTransformation  │   (The default handler of the clipboard pipeline).
-//            │ └───────────┬───────────┘
-//            │             │
-//            │  ┌──────────V──────────┐
-//            │  │   contentInsertion  │   Updates the document selection to drop range.
-//            │  └──────────┬──────────┘
-//            │             │
-//            │  ┌──────────V──────────┐
-//            │  │   contentInsertion  │   (The default handler of the clipboard pipeline).
-//            │  └──────────┬──────────┘
-//            │             │
-//            │  ┌──────────V──────────┐
-//            │  │   contentInsertion  │   Removes the content from the original range if the insertion was successful.
-//            │  └──────────┬──────────┘
-//            │             │
-//            └─────────────┐
-//                          │
-//                ┌─────────V────────┐
-//                │      dragend     │   Removes the drop marker and cleans the state.
-//                └──────────────────┘
-//
-/**
- * The drag and drop feature. It works on top of the {@link module:clipboard/clipboardpipeline~ClipboardPipeline}.
- *
- * Read more about the clipboard integration in the {@glink framework/deep-dive/clipboard clipboard deep-dive} guide.
- *
- * @internal
- */ class DragDrop extends Plugin {
-    /**
-	 * The live range over the original content that is being dragged.
-	 */ _draggedRange;
-    /**
-	 * The UID of current dragging that is used to verify if the drop started in the same editor as the drag start.
-	 *
-	 * **Note**: This is a workaround for broken 'dragend' events (they are not fired if the source text node got removed).
-	 */ _draggingUid;
-    /**
-	 * The reference to the model element that currently has a `draggable` attribute set (it is set while dragging).
-	 */ _draggableElement;
-    /**
-	 * A delayed callback removing draggable attributes.
-	 */ _clearDraggableAttributesDelayed = delay(()=>this._clearDraggableAttributes(), 40);
+class DragDrop extends Plugin {
     /**
-	 * Whether the dragged content can be dropped only in block context.
-	 */ // TODO handle drag from other editor instance
-    // TODO configure to use block, inline or both
-    _blockMode = false;
-    /**
-	 * DOM Emitter.
-	 */ _domEmitter = new (DomEmitterMixin())();
-    /**
-	 * The DOM element used to generate dragged preview image.
-	 */ _previewContainer;
-    /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'DragDrop';
     }
     /**
-	 * @inheritDoc
-	 */ static get requires() {
+     * @inheritDoc
+     */ static get requires() {
         return [
             ClipboardPipeline,
             Widget,
@@ -1568,8 +1327,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         ];
     }
     /**
-	 * @inheritDoc
-	 */ init() {
+     * @inheritDoc
+     */ init() {
         const editor = this.editor;
         const view = editor.editing.view;
         this._draggedRange = null;
@@ -1598,8 +1357,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         }
     }
     /**
-	 * @inheritDoc
-	 */ destroy() {
+     * @inheritDoc
+     */ destroy() {
         if (this._draggedRange) {
             this._draggedRange.detach();
             this._draggedRange = null;
@@ -1612,8 +1371,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         return super.destroy();
     }
     /**
-	 * Drag and drop events handling.
-	 */ _setupDragging() {
+     * Drag and drop events handling.
+     */ _setupDragging() {
         const editor = this.editor;
         const model = editor.model;
         const view = editor.editing.view;
@@ -1710,8 +1469,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Integration with the `clipboardInput` event.
-	 */ _setupClipboardInputIntegration() {
+     * Integration with the `clipboardInput` event.
+     */ _setupClipboardInputIntegration() {
         const editor = this.editor;
         const view = editor.editing.view;
         const viewDocument = view.document;
@@ -1751,8 +1510,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Integration with the `contentInsertion` event of the clipboard pipeline.
-	 */ _setupContentInsertionIntegration() {
+     * Integration with the `contentInsertion` event of the clipboard pipeline.
+     */ _setupContentInsertionIntegration() {
         const clipboardPipeline = this.editor.plugins.get(ClipboardPipeline);
         clipboardPipeline.on('contentInsertion', (evt, data)=>{
             if (!this.isEnabled || data.method !== 'drop') {
@@ -1781,8 +1540,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Adds listeners that add the `draggable` attribute to the elements while the mouse button is down so the dragging could start.
-	 */ _setupDraggableAttributeHandling() {
+     * Adds listeners that add the `draggable` attribute to the elements while the mouse button is down so the dragging could start.
+     */ _setupDraggableAttributeHandling() {
         const editor = this.editor;
         const view = editor.editing.view;
         const viewDocument = view.document;
@@ -1826,8 +1585,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Removes the `draggable` attribute from the element that was used for dragging.
-	 */ _clearDraggableAttributes() {
+     * Removes the `draggable` attribute from the element that was used for dragging.
+     */ _clearDraggableAttributes() {
         const editing = this.editor.editing;
         editing.view.change((writer)=>{
             // Remove 'draggable' attribute.
@@ -1838,10 +1597,10 @@ const toPx = /* #__PURE__ */ toUnit('px');
         });
     }
     /**
-	 * Deletes the dragged content from its original range and clears the dragging state.
-	 *
-	 * @param moved Whether the move succeeded.
-	 */ _finalizeDragging(moved) {
+     * Deletes the dragged content from its original range and clears the dragging state.
+     *
+     * @param moved Whether the move succeeded.
+     */ _finalizeDragging(moved) {
         const editor = this.editor;
         const model = editor.model;
         const dragDropTarget = editor.plugins.get(DragDropTarget);
@@ -1877,8 +1636,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         this._draggedRange = null;
     }
     /**
-	 * Sets the dragged source range based on event target and document selection.
-	 */ _prepareDraggedRange(target) {
+     * Sets the dragged source range based on event target and document selection.
+     */ _prepareDraggedRange(target) {
         const editor = this.editor;
         const model = editor.model;
         const selection = model.document.selection;
@@ -1918,8 +1677,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         model.change((writer)=>writer.setSelection(this._draggedRange.toRange()));
     }
     /**
-	 * Updates the dragged preview image.
-	 */ _updatePreview({ dataTransfer, domTarget, clientX }) {
+     * Updates the dragged preview image.
+     */ _updatePreview({ dataTransfer, domTarget, clientX }) {
         const view = this.editor.editing.view;
         const editable = view.document.selection.editableElement;
         const domEditable = view.domConverter.mapViewToDom(editable);
@@ -1943,15 +1702,29 @@ const toPx = /* #__PURE__ */ toUnit('px');
         preview.style.width = computedStyle.width;
         preview.style.paddingLeft = `${domRect.left - clientX + domEditablePaddingLeft}px`;
         /**
-		 * Set white background in drag and drop preview if iOS.
-		 * Check: https://github.com/ckeditor/ckeditor5/issues/15085
-		 */ if (env.isiOS) {
+         * Set white background in drag and drop preview if iOS.
+         * Check: https://github.com/ckeditor/ckeditor5/issues/15085
+         */ if (env.isiOS) {
             preview.style.backgroundColor = 'white';
         }
         preview.innerHTML = dataTransfer.getData('text/html');
         dataTransfer.setDragImage(preview, 0, 0);
         this._previewContainer.appendChild(preview);
     }
+    constructor(){
+        super(...arguments);
+        /**
+         * A delayed callback removing draggable attributes.
+         */ this._clearDraggableAttributesDelayed = delay(()=>this._clearDraggableAttributes(), 40);
+        /**
+         * Whether the dragged content can be dropped only in block context.
+         */ // TODO handle drag from other editor instance
+        // TODO configure to use block, inline or both
+        this._blockMode = false;
+        /**
+         * DOM Emitter.
+         */ this._domEmitter = new (DomEmitterMixin())();
+    }
 }
 /**
  * Returns the drop effect that should be a result of dragging the content.
@@ -2022,26 +1795,22 @@ const toPx = /* #__PURE__ */ toUnit('px');
     return model.createRange(startPosition, endPosition);
 }
 
-/**
- * The plugin detects the user's intention to paste plain text.
- *
- * For example, it detects the <kbd>Ctrl/Cmd</kbd> + <kbd>Shift</kbd> + <kbd>V</kbd> keystroke.
- */ class PastePlainText extends Plugin {
+class PastePlainText extends Plugin {
     /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'PastePlainText';
     }
     /**
-	 * @inheritDoc
-	 */ static get requires() {
+     * @inheritDoc
+     */ static get requires() {
         return [
             ClipboardPipeline
         ];
     }
     /**
-	 * @inheritDoc
-	 */ init() {
+     * @inheritDoc
+     */ init() {
         const editor = this.editor;
         const model = editor.model;
         const view = editor.editing.view;
@@ -2093,24 +1862,15 @@ const toPx = /* #__PURE__ */ toUnit('px');
     return Array.from(child.getAttributeKeys()).length == 0;
 }
 
-/**
- * The clipboard feature.
- *
- * Read more about the clipboard integration in the {@glink framework/deep-dive/clipboard clipboard deep-dive} guide.
- *
- * This is a "glue" plugin which loads the following plugins:
- * * {@link module:clipboard/clipboardpipeline~ClipboardPipeline}
- * * {@link module:clipboard/dragdrop~DragDrop}
- * * {@link module:clipboard/pasteplaintext~PastePlainText}
- */ class Clipboard extends Plugin {
+class Clipboard extends Plugin {
     /**
-	 * @inheritDoc
-	 */ static get pluginName() {
+     * @inheritDoc
+     */ static get pluginName() {
         return 'Clipboard';
     }
     /**
-	 * @inheritDoc
-	 */ static get requires() {
+     * @inheritDoc
+     */ static get requires() {
         return [
             ClipboardMarkersUtils,
             ClipboardPipeline,
@@ -2119,8 +1879,8 @@ const toPx = /* #__PURE__ */ toUnit('px');
         ];
     }
     /**
-	 * @inheritDoc
-	 */ init() {
+     * @inheritDoc
+     */ init() {
         const editor = this.editor;
         const t = this.editor.t;
         // Add the information about the keystrokes to the accessibility database.