@ckeditor/ckeditor5-clipboard 41.4.2 → 42.0.0-alpha.0

package/dist/index.js

@@ -3,39 +3,47 @@
  * 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, global, Rect, ResizeObserver, delay, DomEmitterMixin, env, createElement } from '@ckeditor/ckeditor5-utils/dist/index.js';
+import { EventInfo, uid, toUnit, delay, DomEmitterMixin, global, Rect, ResizeObserver, 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';
 
-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);
-    }
+/**
+ * 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'
+    ];
     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'
@@ -69,6 +77,19 @@ 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);
+    }
 }
 function getDropViewRange(view, domEvent) {
     const domDoc = domEvent.target.ownerDocument;
@@ -143,6 +164,8 @@ 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".
@@ -170,9 +193,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);
@@ -193,9 +216,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.
@@ -209,39 +232,49 @@ const listElements = [
     return '\n\n';
 }
 
-class ClipboardMarkersUtils extends Plugin {
+/**
+ * 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();
     /**
-     * @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
@@ -264,7 +297,7 @@ class ClipboardMarkersUtils extends Plugin {
             // 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] || (fakeMarkersRangesInsideRange[markerName] = writer.createRangeIn(fragment));
+                fakeMarkersRangesInsideRange[markerName] ||= writer.createRangeIn(fragment);
                 for (const element of elements){
                     writer.remove(element);
                 }
@@ -279,24 +312,24 @@ class ClipboardMarkersUtils extends Plugin {
         });
     }
     /**
-     * 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`.
@@ -323,13 +356,13 @@ class ClipboardMarkersUtils extends Plugin {
         });
     }
     /**
-     * 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){
@@ -338,17 +371,17 @@ class ClipboardMarkersUtils extends Plugin {
         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
@@ -363,12 +396,12 @@ class ClipboardMarkersUtils extends Plugin {
         }
     }
     /**
-     * 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;
@@ -381,43 +414,43 @@ class ClipboardMarkersUtils extends Plugin {
         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.
@@ -455,13 +488,13 @@ class ClipboardMarkersUtils extends Plugin {
         });
     }
     /**
-     * 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])=>{
@@ -490,13 +523,13 @@ class ClipboardMarkersUtils extends Plugin {
         });
     }
     /**
-     * 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;
@@ -529,17 +562,17 @@ class ClipboardMarkersUtils extends Plugin {
         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);
@@ -584,14 +617,14 @@ class ClipboardMarkersUtils extends Plugin {
             ]), 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 [];
@@ -645,12 +678,12 @@ class ClipboardMarkersUtils extends Plugin {
         ];
     }
     /**
-     * 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
@@ -665,32 +698,128 @@ class ClipboardMarkersUtils extends Plugin {
         // example: comment => comment:{ newId }
         return `${parts.join(':')}:${newId}`;
     }
-    constructor(){
-        super(...arguments);
-        /**
-         * Map of marker names that can be copied.
-         *
-         * @internal
-         */ this._markersToCopy = new Map();
-    }
 }
 
-class ClipboardPipeline extends Plugin {
+// 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 {
     /**
-     * @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);
@@ -698,10 +827,10 @@ class ClipboardPipeline extends Plugin {
         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'
@@ -715,8 +844,8 @@ class ClipboardPipeline extends Plugin {
         });
     }
     /**
-     * The clipboard paste pipeline.
-     */ _setupPasteDrop() {
+	 * The clipboard paste pipeline.
+	 */ _setupPasteDrop() {
         const editor = this.editor;
         const model = editor.model;
         const view = editor.editing.view;
@@ -796,8 +925,8 @@ class ClipboardPipeline extends Plugin {
         });
     }
     /**
-     * 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;
@@ -845,11 +974,13 @@ class ClipboardPipeline extends Plugin {
     }
 }
 
-const toPx = toUnit('px');
-class LineView extends View {
+const toPx = /* #__PURE__ */ toUnit('px');
+/**
+ * The horizontal drop target line view.
+ */ class LineView extends View {
     /**
-     * @inheritDoc
-     */ constructor(){
+	 * @inheritDoc
+	 */ constructor(){
         super();
         const bind = this.bindTemplate;
         this.set({
@@ -876,20 +1007,48 @@ class LineView extends View {
     }
 }
 
-class DragDropTarget extends Plugin {
+/**
+ * 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();
     /**
-     * @inheritDoc
-     */ static get pluginName() {
+	 * DOM Emitter.
+	 */ _domEmitter = new (DomEmitterMixin())();
+    /**
+	 * Map of document scrollable elements.
+	 */ _scrollables = new Map();
+    /**
+	 * @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();
@@ -900,10 +1059,10 @@ class DragDropTarget extends Plugin {
         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) {
@@ -916,10 +1075,10 @@ class DragDropTarget extends Plugin {
         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.
@@ -927,10 +1086,10 @@ class DragDropTarget extends Plugin {
         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();
@@ -942,8 +1101,8 @@ class DragDropTarget extends Plugin {
         }
     }
     /**
-     * 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.
@@ -974,10 +1133,10 @@ class DragDropTarget extends Plugin {
         });
     }
     /**
-     * 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)=>{
@@ -997,8 +1156,8 @@ class DragDropTarget extends Plugin {
         });
     }
     /**
-     * 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) {
@@ -1009,8 +1168,8 @@ class DragDropTarget extends Plugin {
         });
     }
     /**
-     * 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;
@@ -1049,8 +1208,8 @@ class DragDropTarget extends Plugin {
         }
     }
     /**
-     * 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)) {
@@ -1069,33 +1228,6 @@ class DragDropTarget extends Plugin {
         }
         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.
@@ -1210,15 +1342,25 @@ class DragDropTarget extends Plugin {
     return domElement;
 }
 
-class DragDropBlockToolbar extends Plugin {
+/**
+ * Integration of a block Drag and Drop support with the block toolbar.
+ *
+ * @internal
+ */ class DragDropBlockToolbar extends Plugin {
     /**
-     * @inheritDoc
-     */ static get pluginName() {
+	 * Whether current dragging is started by block toolbar button dragging.
+	 */ _isBlockDragging = false;
+    /**
+	 * DOM Emitter.
+	 */ _domEmitter = new (DomEmitterMixin())();
+    /**
+	 * @inheritDoc
+	 */ static get pluginName() {
         return 'DragDropBlockToolbar';
     }
     /**
-     * @inheritDoc
-     */ init() {
+	 * @inheritDoc
+	 */ init() {
         const editor = this.editor;
         this.listenTo(editor, 'change:isReadOnly', (evt, name, isReadOnly)=>{
             if (isReadOnly) {
@@ -1249,14 +1391,14 @@ class DragDropBlockToolbar extends Plugin {
         }
     }
     /**
-     * @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;
         }
@@ -1271,8 +1413,8 @@ class DragDropBlockToolbar extends Plugin {
         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;
         }
@@ -1295,30 +1437,129 @@ class DragDropBlockToolbar extends Plugin {
         });
     }
     /**
-     * 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())();
-    }
 }
 
-class DragDrop extends Plugin {
+// 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);
     /**
-     * @inheritDoc
-     */ static get pluginName() {
+	 * 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() {
         return 'DragDrop';
     }
     /**
-     * @inheritDoc
-     */ static get requires() {
+	 * @inheritDoc
+	 */ static get requires() {
         return [
             ClipboardPipeline,
             Widget,
@@ -1327,8 +1568,8 @@ class DragDrop extends Plugin {
         ];
     }
     /**
-     * @inheritDoc
-     */ init() {
+	 * @inheritDoc
+	 */ init() {
         const editor = this.editor;
         const view = editor.editing.view;
         this._draggedRange = null;
@@ -1357,8 +1598,8 @@ class DragDrop extends Plugin {
         }
     }
     /**
-     * @inheritDoc
-     */ destroy() {
+	 * @inheritDoc
+	 */ destroy() {
         if (this._draggedRange) {
             this._draggedRange.detach();
             this._draggedRange = null;
@@ -1371,8 +1612,8 @@ class DragDrop extends Plugin {
         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;
@@ -1469,8 +1710,8 @@ class DragDrop extends Plugin {
         });
     }
     /**
-     * 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;
@@ -1510,8 +1751,8 @@ class DragDrop extends Plugin {
         });
     }
     /**
-     * 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') {
@@ -1540,8 +1781,8 @@ class DragDrop extends Plugin {
         });
     }
     /**
-     * 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;
@@ -1585,8 +1826,8 @@ class DragDrop extends Plugin {
         });
     }
     /**
-     * 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.
@@ -1597,10 +1838,10 @@ class DragDrop extends Plugin {
         });
     }
     /**
-     * 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);
@@ -1636,8 +1877,8 @@ class DragDrop extends Plugin {
         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;
@@ -1677,8 +1918,8 @@ class DragDrop extends Plugin {
         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);
@@ -1702,29 +1943,15 @@ class DragDrop extends Plugin {
         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.
@@ -1795,22 +2022,26 @@ class DragDrop extends Plugin {
     return model.createRange(startPosition, endPosition);
 }
 
-class PastePlainText extends Plugin {
+/**
+ * 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 {
     /**
-     * @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;
@@ -1862,15 +2093,24 @@ class PastePlainText extends Plugin {
     return Array.from(child.getAttributeKeys()).length == 0;
 }
 
-class Clipboard extends Plugin {
+/**
+ * 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 {
     /**
-     * @inheritDoc
-     */ static get pluginName() {
+	 * @inheritDoc
+	 */ static get pluginName() {
         return 'Clipboard';
     }
     /**
-     * @inheritDoc
-     */ static get requires() {
+	 * @inheritDoc
+	 */ static get requires() {
         return [
             ClipboardMarkersUtils,
             ClipboardPipeline,
@@ -1879,8 +2119,8 @@ class Clipboard extends Plugin {
         ];
     }
     /**
-     * @inheritDoc
-     */ init() {
+	 * @inheritDoc
+	 */ init() {
         const editor = this.editor;
         const t = this.editor.t;
         // Add the information about the keystrokes to the accessibility database.